@ds-mo/ui 8.3.1 → 9.1.0

package/dist/types/utils/choice-popup-alignment.d.ts

@@ -0,0 +1,21 @@
+import type { AnchoredPopupAlign } from './anchored-popup';
+/**
+ * `choice-cell` aligns the first/last interactive row edge with the anchor,
+ * allowing the popup frame to extend by the section inset. `popup-frame`
+ * aligns the popup frame itself and is reserved for deliberate custom geometry.
+ */
+export type ChoicePopupAnchorAlignment = 'choice-cell' | 'popup-frame';
+export interface ChoicePopupAlignOffsetInput {
+    align: AnchoredPopupAlign;
+    alignOffsetPx: number;
+    sectionInsetPx: number;
+    anchorAlignment?: ChoicePopupAnchorAlignment;
+}
+/**
+ * Resolve the cross-axis offset for a choice popup. Authored `alignOffsetPx`
+ * remains an additive nudge after the shared inner-cell alignment is applied.
+ */
+export declare function resolveChoicePopupAlignOffset({ align, alignOffsetPx, sectionInsetPx, anchorAlignment, }: ChoicePopupAlignOffsetInput): number;
+/** Minimum popup width that keeps both choice-cell edges aligned to a trigger. */
+export declare function choicePopupMinWidth(anchorWidth: number, sectionInsetPx: number): number;
+//# sourceMappingURL=choice-popup-alignment.d.ts.map

package/dist/types/utils/index.d.ts

@@ -13,4 +13,6 @@ export { controlWidthClass } from './control-width';
 export type { ControlWidth } from './control-width';
 export { CONTROL_TEXT_VARIANT } from './control-text';
 export type { ControlSize } from './control-text';
+export { choicePopupMinWidth, resolveChoicePopupAlignOffset, } from './choice-popup-alignment';
+export type { ChoicePopupAnchorAlignment } from './choice-popup-alignment';
 //# sourceMappingURL=index.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ds-mo/ui",
-  "version": "8.3.1",
+  "version": "9.1.0",
   "description": "CompoMo — composable web components styled with TokoMo design tokens",
   "keywords": [
     "web-components",
@@ -24,6 +24,9 @@
   "main": "./dist/components/index.js",
   "module": "./dist/components/index.js",
   "types": "./dist/types/components.d.ts",
+  "bin": {
+    "compomo-mcp": "./dist/mcp/cli.js"
+  },
   "exports": {
     ".": {
       "types": "./dist/types/components.d.ts",
@@ -58,6 +61,7 @@
       "import": "./dist/lib/utils/index.js"
     },
     "./agent": "./dist/agent.json",
+    "./agent/patterns": "./dist/agent-patterns.json",
     "./dist/components/*": "./dist/components/*",
     "./components/*": "./dist/components/*"
   },
@@ -68,7 +72,7 @@
     "prebuild": "npm run clean && npm run clean:framework-proxies && node scripts/generate-icon-catalog.mjs",
     "pretypecheck": "node scripts/generate-icon-catalog.mjs",
     "pretest": "node scripts/generate-icon-catalog.mjs",
-    "build": "stencil build && node scripts/verify-framework-proxies.mjs && node scripts/patch-index-types.mjs && node scripts/verify-icons-externalized.mjs && node scripts/write-build-stamp.mjs && node scripts/build-lib-exports.mjs && node scripts/build-framework-exports.mjs && node scripts/build-registry.mjs && node scripts/build-agent-manifest.mjs && node scripts/verify-framework-proxies.mjs",
+    "build": "stencil build && node scripts/verify-framework-proxies.mjs && node scripts/patch-index-types.mjs && node scripts/verify-icons-externalized.mjs && node scripts/write-build-stamp.mjs && node scripts/build-lib-exports.mjs && node scripts/build-framework-exports.mjs && node scripts/build-registry.mjs && node scripts/build-agent-manifest.mjs && node scripts/build-mcp.mjs && node scripts/verify-framework-proxies.mjs",
     "verify:pack": "node scripts/verify-framework-proxies.mjs && node scripts/verify-npm-pack.mjs && node scripts/verify-package-imports.mjs",
     "test": "node --import tsx/esm --test tests/*.test.ts",
     "test:e2e": "npm run build && playwright test",

package/dist/angular/ds-pagination.d.ts

@@ -1,15 +0,0 @@
-import { ChangeDetectorRef, ElementRef, NgZone, EventEmitter } from '@angular/core';
-import type { Components } from '@ds-mo/ui/components';
-import type { DsPaginationCustomEvent } from '@ds-mo/ui/components';
-import * as i0 from "@angular/core";
-export declare class DsPagination {
-    protected z: NgZone;
-    protected el: HTMLDsPaginationElement;
-    dsPageChange: EventEmitter<DsPaginationCustomEvent<number>>;
-    constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
-    static ɵfac: i0.ɵɵFactoryDeclaration<DsPagination, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DsPagination, "ds-pagination", never, { "isInactive": { "alias": "isInactive"; "required": false; }; "nextPageLabel": { "alias": "nextPageLabel"; "required": false; }; "page": { "alias": "page"; "required": false; }; "paginationLabel": { "alias": "paginationLabel"; "required": false; }; "previousPageLabel": { "alias": "previousPageLabel"; "required": false; }; "siblingCount": { "alias": "siblingCount"; "required": false; }; "totalPages": { "alias": "totalPages"; "required": false; }; }, { "dsPageChange": "dsPageChange"; }, never, ["*"], true, never>;
-}
-export declare interface DsPagination extends Components.DsPagination {
-    dsPageChange: EventEmitter<DsPaginationCustomEvent<number>>;
-}

package/dist/angular/ds-table.d.ts

@@ -1,33 +0,0 @@
-import { ChangeDetectorRef, ElementRef, NgZone, EventEmitter } from '@angular/core';
-import type { Components } from '@ds-mo/ui/components';
-import type { DsTableCustomEvent } from '@ds-mo/ui/components';
-import * as i0 from "@angular/core";
-export declare class DsTable {
-    protected z: NgZone;
-    protected el: HTMLDsTableElement;
-    dsSort: EventEmitter<DsTableCustomEvent<{
-        columnId: string;
-    }>>;
-    dsRowClick: EventEmitter<DsTableCustomEvent<{
-        row: unknown;
-        rowIndex: number;
-    }>>;
-    dsPageChange: EventEmitter<DsTableCustomEvent<{
-        pageIndex: number;
-    }>>;
-    constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
-    static ɵfac: i0.ɵɵFactoryDeclaration<DsTable, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DsTable, "ds-table", never, { "columns": { "alias": "columns"; "required": false; }; "data": { "alias": "data"; "required": false; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "loadingLabel": { "alias": "loadingLabel"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "nextPageLabel": { "alias": "nextPageLabel"; "required": false; }; "pageIndex": { "alias": "pageIndex"; "required": false; }; "pageSize": { "alias": "pageSize"; "required": false; }; "pageStatusLabel": { "alias": "pageStatusLabel"; "required": false; }; "previousPageLabel": { "alias": "previousPageLabel"; "required": false; }; "selectedRows": { "alias": "selectedRows"; "required": false; }; "sortState": { "alias": "sortState"; "required": false; }; }, { "dsSort": "dsSort"; "dsRowClick": "dsRowClick"; "dsPageChange": "dsPageChange"; }, never, ["*"], true, never>;
-}
-export declare interface DsTable extends Components.DsTable {
-    dsSort: EventEmitter<DsTableCustomEvent<{
-        columnId: string;
-    }>>;
-    dsRowClick: EventEmitter<DsTableCustomEvent<{
-        row: unknown;
-        rowIndex: number;
-    }>>;
-    dsPageChange: EventEmitter<DsTableCustomEvent<{
-        pageIndex: number;
-    }>>;
-}

package/dist/angular/ds-table.js

@@ -1,48 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-/* tslint:disable */
-/* auto-generated angular directive proxies */
-import { ChangeDetectionStrategy, Component, EventEmitter, Output } from '@angular/core';
-import { ProxyCmp } from './angular-component-lib/utils.js';
-import { defineCustomElement as defineDsTable } from '@ds-mo/ui/components/ds-table.js';
-import * as i0 from "@angular/core";
-let DsTable = class DsTable {
-    constructor(c, r, z) {
-        this.z = z;
-        this.dsSort = new EventEmitter();
-        this.dsRowClick = new EventEmitter();
-        this.dsPageChange = new EventEmitter();
-        c.detach();
-        this.el = r.nativeElement;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: DsTable, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.6", type: DsTable, isStandalone: true, selector: "ds-table", inputs: { columns: "columns", data: "data", emptyMessage: "emptyMessage", loading: "loading", loadingLabel: "loadingLabel", locale: "locale", nextPageLabel: "nextPageLabel", pageIndex: "pageIndex", pageSize: "pageSize", pageStatusLabel: "pageStatusLabel", previousPageLabel: "previousPageLabel", selectedRows: "selectedRows", sortState: "sortState" }, outputs: { dsSort: "dsSort", dsRowClick: "dsRowClick", dsPageChange: "dsPageChange" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-};
-DsTable = __decorate([
-    ProxyCmp({
-        defineCustomElementFn: defineDsTable,
-        inputs: ['columns', 'data', 'emptyMessage', 'loading', 'loadingLabel', 'locale', 'nextPageLabel', 'pageIndex', 'pageSize', 'pageStatusLabel', 'previousPageLabel', 'selectedRows', 'sortState']
-    })
-], DsTable);
-export { DsTable };
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: DsTable, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ds-table',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    template: '<ng-content></ng-content>',
-                    // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['columns', 'data', 'emptyMessage', 'loading', 'loadingLabel', 'locale', 'nextPageLabel', 'pageIndex', 'pageSize', 'pageStatusLabel', 'previousPageLabel', 'selectedRows', 'sortState'],
-                    outputs: ['dsSort', 'dsRowClick', 'dsPageChange'],
-                }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { dsSort: [{
-                type: Output
-            }], dsRowClick: [{
-                type: Output
-            }], dsPageChange: [{
-                type: Output
-            }] } });

package/dist/components/ds-pagination.js

@@ -1,2 +0,0 @@
-import{p as t,H as i,c as n,h as s,a as e,t as o}from"./index.js";import{d as a}from"./p-BKA6houZ.js";const r=()=>`.ds-control-inactive.sc-ds-pagination-h,.ds-control-inactive.sc-ds-pagination{opacity:0.25;pointer-events:none;cursor:not-allowed}.sc-ds-pagination-h{display:inline-block}.pagination.sc-ds-pagination{display:flex;align-items:center;gap:var(--dimension-space-025);-webkit-user-select:none;user-select:none}.button.sc-ds-pagination{display:flex;align-items:center;justify-content:center;min-width:var(--dimension-size-300);height:var(--dimension-size-300);padding:0 var(--dimension-space-050);background:none;border:none;border-radius:var(--dimension-radius-075);cursor:pointer;color:var(--color-foreground-secondary);transition:background-color var(--effect-motion-short-2), color var(--effect-motion-short-2)}.button.sc-ds-pagination:hover:not(:disabled){background-color:var(--color-interaction-hover);color:var(--color-foreground-primary)}.button.sc-ds-pagination:active:not(:disabled){background-color:var(--color-interaction-pressed)}.button.sc-ds-pagination:disabled{cursor:not-allowed;opacity:0.35}.button.sc-ds-pagination:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-stroke-width-015)}.button--active.sc-ds-pagination{background-color:var(--color-interaction-hover);color:var(--color-foreground-primary)}.button--nav.sc-ds-pagination{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ellipsis.sc-ds-pagination{display:flex;align-items:center;justify-content:center;min-width:var(--dimension-size-300);height:var(--dimension-size-300)}`;function c(t,i){const n=[];for(let s=t;s<=i;s++)n.push(s);return n}function l(t,i,n){const s=n*2+5;if(i<=s)return c(1,i);const e=Math.max(t-n,2);const o=Math.min(t+n,i-1);const a=e>2;const r=o<i-1;if(!a&&r)return[...c(1,n*2+3),"ellipsis",i];if(a&&!r)return[1,"ellipsis",...c(i-(n*2+2),i)];return[1,"ellipsis",...c(e,o),"ellipsis",i]}const d=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.dsPageChange=n(this,"dsPageChange");this.page=1;this.totalPages=1;this.siblingCount=1;this.isInactive=false;this.paginationLabel="Pagination";this.previousPageLabel="Previous page";this.nextPageLabel="Next page"}go(t){if(this.isInactive)return;this.page=t;this.dsPageChange.emit(t)}render(){if(this.totalPages<=1)return s(e,{style:{display:"none"}});const t=l(this.page,this.totalPages,this.siblingCount);return s(e,null,s("nav",{class:{pagination:true,"ds-control-inactive":this.isInactive},"aria-label":this.paginationLabel},s("button",{type:"button",class:"button button--nav",disabled:this.page<=1||this.isInactive,onClick:()=>this.go(this.page-1),"aria-label":this.previousPageLabel},"‹"),t.map(((t,i)=>t==="ellipsis"?s("ds-text",{key:`e${i}`,class:"ellipsis",as:"span",variant:"text-body-small",color:"tertiary"},"…"):s("button",{key:t,type:"button",class:{button:true,"button--active":t===this.page},onClick:()=>this.go(t),"aria-current":t===this.page?"page":undefined,disabled:this.isInactive},s("ds-text",{as:"span",variant:"text-body-small",emphasis:t===this.page},t)))),s("button",{type:"button",class:"button button--nav",disabled:this.page>=this.totalPages||this.isInactive,onClick:()=>this.go(this.page+1),"aria-label":this.nextPageLabel},"›")))}static get style(){return r()}},[2,"ds-pagination",{page:[1026],totalPages:[2,"total-pages"],siblingCount:[2,"sibling-count"],isInactive:[4,"is-inactive"],paginationLabel:[1,"pagination-label"],previousPageLabel:[1,"previous-page-label"],nextPageLabel:[1,"next-page-label"]}]);function u(){if(typeof customElements==="undefined"){return}const t=["ds-pagination","ds-text"];t.forEach((t=>{switch(t){case"ds-pagination":if(!customElements.get(o(t))){customElements.define(o(t),d)}break;case"ds-text":if(!customElements.get(o(t))){a()}break}}))}u();const p=d;const h=u;export{p as DsPagination,h as defineCustomElement};
-//# sourceMappingURL=ds-pagination.js.map

package/dist/components/ds-pagination.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["paginationCss","buildRange","start","end","items","i","push","buildPages","page","totalPages","siblings","totalSlots","leftSibling","Math","max","rightSibling","min","showLeft","showRight","Pagination","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","siblingCount","isInactive","paginationLabel","previousPageLabel","nextPageLabel","go","p","dsPageChange","emit","render","h","Host","style","display","pages","class","pagination","type","disabled","onClick","map","item","key","as","variant","color","button","undefined","emphasis"],"sources":["src/wc/components/Pagination/Pagination.css?tag=ds-pagination&encapsulation=scoped","src/wc/components/Pagination/Pagination.tsx"],"sourcesContent":["@import '../../utils/control-inactive.css';\n\n:host {\n  display: inline-block;\n}\n\n.pagination {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-025);\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n/* Inactive: `.ds-control-inactive` (25% opacity). */\n\n.button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: var(--dimension-size-300);\n  height: var(--dimension-size-300);\n  padding: 0 var(--dimension-space-050);\n  background: none;\n  border: none;\n  border-radius: var(--dimension-radius-075);\n  cursor: pointer;\n  color: var(--color-foreground-secondary);\n  transition: background-color var(--effect-motion-short-2), color var(--effect-motion-short-2);\n}\n\n.button:hover:not(:disabled) {\n  background-color: var(--color-interaction-hover);\n  color: var(--color-foreground-primary);\n}\n\n.button:active:not(:disabled) {\n  background-color: var(--color-interaction-pressed);\n}\n\n.button:disabled {\n  cursor: not-allowed;\n  opacity: 0.35;\n}\n\n.button:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: var(--dimension-stroke-width-015);\n}\n\n.button--active {\n  background-color: var(--color-interaction-hover);\n  color: var(--color-foreground-primary);\n}\n\n.button--nav {\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n}\n\n.ellipsis {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: var(--dimension-size-300);\n  height: var(--dimension-size-300);\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\n\nfunction buildRange(start: number, end: number): (number | 'ellipsis')[] {\n  const items: (number | 'ellipsis')[] = [];\n  for (let i = start; i <= end; i++) items.push(i);\n  return items;\n}\n\nfunction buildPages(page: number, totalPages: number, siblings: number): (number | 'ellipsis')[] {\n  const totalSlots = siblings * 2 + 5;\n  if (totalPages <= totalSlots) return buildRange(1, totalPages);\n\n  const leftSibling = Math.max(page - siblings, 2);\n  const rightSibling = Math.min(page + siblings, totalPages - 1);\n  const showLeft = leftSibling > 2;\n  const showRight = rightSibling < totalPages - 1;\n\n  if (!showLeft && showRight) return [...buildRange(1, siblings * 2 + 3), 'ellipsis', totalPages];\n  if (showLeft && !showRight) return [1, 'ellipsis', ...buildRange(totalPages - (siblings * 2 + 2), totalPages)];\n  return [1, 'ellipsis', ...buildRange(leftSibling, rightSibling), 'ellipsis', totalPages];\n}\n\n@Component({\n  tag: 'ds-pagination',\n  styleUrl: 'Pagination.css',\n  scoped: true,\n})\nexport class Pagination {\n  @Prop({ mutable: true }) page: number = 1;\n  @Prop() totalPages: number = 1;\n  @Prop() siblingCount: number = 1;\n  @Prop() isInactive: boolean = false;\n  @Prop() paginationLabel: string = 'Pagination';\n  @Prop() previousPageLabel: string = 'Previous page';\n  @Prop() nextPageLabel: string = 'Next page';\n\n  @Event() dsPageChange!: EventEmitter<number>;\n\n  private go(p: number) {\n    if (this.isInactive) return;\n    this.page = p;\n    this.dsPageChange.emit(p);\n  }\n\n  render() {\n    if (this.totalPages <= 1) return <Host style={{ display: 'none' }} />;\n\n    const pages = buildPages(this.page, this.totalPages, this.siblingCount);\n\n    return (\n      <Host>\n        <nav\n          class={{ pagination: true, 'ds-control-inactive': this.isInactive }}\n          aria-label={this.paginationLabel}\n        >\n          <button\n            type=\"button\"\n            class=\"button button--nav\"\n            disabled={this.page <= 1 || this.isInactive}\n            onClick={() => this.go(this.page - 1)}\n            aria-label={this.previousPageLabel}\n          >\n            &#x2039;\n          </button>\n\n          {pages.map((item, i) =>\n            item === 'ellipsis' ? (\n              <ds-text key={`e${i}`} class=\"ellipsis\" as=\"span\" variant=\"text-body-small\" color=\"tertiary\">\n                …\n              </ds-text>\n            ) : (\n              <button\n                key={item}\n                type=\"button\"\n                class={{ button: true, 'button--active': item === this.page }}\n                onClick={() => this.go(item)}\n                aria-current={item === this.page ? 'page' : undefined}\n                disabled={this.isInactive}\n              >\n                <ds-text as=\"span\" variant=\"text-body-small\" emphasis={item === this.page}>\n                  {item}\n                </ds-text>\n              </button>\n            )\n          )}\n\n          <button\n            type=\"button\"\n            class=\"button button--nav\"\n            disabled={this.page >= this.totalPages || this.isInactive}\n            onClick={() => this.go(this.page + 1)}\n            aria-label={this.nextPageLabel}\n          >\n            &#x203A;\n          </button>\n        </nav>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sGAAA,MAAMA,EAAgB,IAAM,shDCE5B,SAASC,EAAWC,EAAeC,GACjC,MAAMC,EAAiC,GACvC,IAAK,IAAIC,EAAIH,EAAOG,GAAKF,EAAKE,IAAKD,EAAME,KAAKD,GAC9C,OAAOD,CACT,CAEA,SAASG,EAAWC,EAAcC,EAAoBC,GACpD,MAAMC,EAAaD,EAAW,EAAI,EAClC,GAAID,GAAcE,EAAY,OAAOV,EAAW,EAAGQ,GAEnD,MAAMG,EAAcC,KAAKC,IAAIN,EAAOE,EAAU,GAC9C,MAAMK,EAAeF,KAAKG,IAAIR,EAAOE,EAAUD,EAAa,GAC5D,MAAMQ,EAAWL,EAAc,EAC/B,MAAMM,EAAYH,EAAeN,EAAa,EAE9C,IAAKQ,GAAYC,EAAW,MAAO,IAAIjB,EAAW,EAAGS,EAAW,EAAI,GAAI,WAAYD,GACpF,GAAIQ,IAAaC,EAAW,MAAO,CAAC,EAAG,cAAejB,EAAWQ,GAAcC,EAAW,EAAI,GAAID,IAClG,MAAO,CAAC,EAAG,cAAeR,EAAWW,EAAaG,GAAe,WAAYN,EAC/E,C,MAOaU,EAAUC,EAAA,MAAAD,UAAAE,EALvB,WAAAC,CAAAC,G,qFAM2BC,KAAAhB,KAAe,EAChCgB,KAAAf,WAAqB,EACrBe,KAAAC,aAAuB,EACvBD,KAAAE,WAAsB,MACtBF,KAAAG,gBAA0B,aAC1BH,KAAAI,kBAA4B,gBAC5BJ,KAAAK,cAAwB,WAiEjC,CA7DS,EAAAC,CAAGC,GACT,GAAIP,KAAKE,WAAY,OACrBF,KAAKhB,KAAOuB,EACZP,KAAKQ,aAAaC,KAAKF,E,CAGzB,MAAAG,GACE,GAAIV,KAAKf,YAAc,EAAG,OAAO0B,EAACC,EAAI,CAACC,MAAO,CAAEC,QAAS,UAEzD,MAAMC,EAAQhC,EAAWiB,KAAKhB,KAAMgB,KAAKf,WAAYe,KAAKC,cAE1D,OACEU,EAACC,EAAI,KACHD,EAAA,OACEK,MAAO,CAAEC,WAAY,KAAM,sBAAuBjB,KAAKE,YAAY,aACvDF,KAAKG,iBAEjBQ,EAAA,UACEO,KAAK,SACLF,MAAM,qBACNG,SAAUnB,KAAKhB,MAAQ,GAAKgB,KAAKE,WACjCkB,QAAS,IAAMpB,KAAKM,GAAGN,KAAKhB,KAAO,GAAE,aACzBgB,KAAKI,mBAAiB,KAKnCW,EAAMM,KAAI,CAACC,EAAMzC,IAChByC,IAAS,WACPX,EAAA,WAASY,IAAK,IAAI1C,IAAKmC,MAAM,WAAWQ,GAAG,OAAOC,QAAQ,kBAAkBC,MAAM,YAAU,KAI5Ff,EAAA,UACEY,IAAKD,EACLJ,KAAK,SACLF,MAAO,CAAEW,OAAQ,KAAM,iBAAkBL,IAAStB,KAAKhB,MACvDoC,QAAS,IAAMpB,KAAKM,GAAGgB,GAAK,eACdA,IAAStB,KAAKhB,KAAO,OAAS4C,UAC5CT,SAAUnB,KAAKE,YAEfS,EAAA,WAASa,GAAG,OAAOC,QAAQ,kBAAkBI,SAAUP,IAAStB,KAAKhB,MAClEsC,MAMTX,EAAA,UACEO,KAAK,SACLF,MAAM,qBACNG,SAAUnB,KAAKhB,MAAQgB,KAAKf,YAAce,KAAKE,WAC/CkB,QAAS,IAAMpB,KAAKM,GAAGN,KAAKhB,KAAO,GAAE,aACzBgB,KAAKK,eAAa,M","ignoreList":[]}

package/dist/components/ds-table.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DsTable extends Components.DsTable, HTMLElement {}
-export const DsTable: {
-    prototype: DsTable;
-    new (): DsTable;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ds-table.js

@@ -1,2 +0,0 @@
-import{p as e,H as t,c as s,h as a,a as r,t as i}from"./index.js";import{d as o}from"./p-DhxWfdX0.js";import{d as n}from"./p-BKA6houZ.js";const d=()=>`.sc-ds-table-h{display:block;width:100%}.table-wrapper.sc-ds-table{display:flex;flex-direction:column;width:100%;overflow:hidden;border-radius:var(--dimension-radius-075)}.table-scroll.sc-ds-table{overflow-x:auto;width:100%}.table.sc-ds-table{display:grid;width:100%;min-width:max-content}.header-row.sc-ds-table{display:contents}.header-cell.sc-ds-table{display:flex;align-items:center;gap:var(--dimension-space-050);padding:var(--dimension-space-075) var(--dimension-space-100);background-color:var(--color-background-secondary);border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-primary);-webkit-user-select:none;user-select:none;position:sticky;top:0;z-index:2}.header-cell--sortable.sc-ds-table{cursor:pointer}.header-cell--sortable.sc-ds-table:hover{background-color:var(--color-translucent-translucent)}.header-cell--sortable.sc-ds-table:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:calc(var(--dimension-space-025) * -1)}.sort-indicator.sc-ds-table{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);color:var(--color-foreground-secondary)}.row.sc-ds-table{display:contents}.row--clickable.sc-ds-table{cursor:pointer}.row.sc-ds-table:hover .cell.sc-ds-table{background-color:var(--color-interaction-hover)}.row--selected.sc-ds-table .cell.sc-ds-table{background-color:var(--color-background-faint-brand)}.row--clickable.sc-ds-table:focus-visible .cell.sc-ds-table{background-color:var(--color-interaction-hover);box-shadow:inset 0 0 0 var(--dimension-stroke-width-025) var(--color-interaction-focus)}.cell.sc-ds-table{display:flex;align-items:center;padding:var(--dimension-space-075) var(--dimension-space-100);border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-primary);min-height:var(--dimension-size-500);background-color:var(--color-background-primary);transition:background-color var(--effect-motion-short-2)}.align-right.sc-ds-table{justify-content:flex-end;text-align:right}.align-center.sc-ds-table{justify-content:center;text-align:center}.empty-row.sc-ds-table{display:flex;align-items:center;justify-content:center;padding:var(--dimension-space-400);background-color:var(--color-background-primary)}.table-pagination.sc-ds-table{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-100);padding:var(--dimension-space-100);border-top:var(--dimension-stroke-width-015) solid var(--color-border-primary);background-color:var(--color-background-primary)}.page-button.sc-ds-table{display:flex;align-items:center;padding:var(--dimension-space-050) var(--dimension-space-100);background-color:transparent;border:none;border-radius:var(--dimension-radius-075);cursor:pointer;transition:background-color var(--effect-motion-short-2)}.page-button.sc-ds-table:hover:not(:disabled){background-color:var(--color-interaction-hover)}.page-button.sc-ds-table:disabled{opacity:0.4;cursor:not-allowed}.page-button.sc-ds-table:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-stroke-width-015)}`;function c(e,t){if(e.accessorKey)return t[e.accessorKey];if(e.accessor)return e.accessor(t);return undefined}function l(e,t,s,a){const r=s==="asc"?1:-1;if(e==null&&t==null)return 0;if(e==null)return r;if(t==null)return-r;if(typeof e==="number"&&typeof t==="number")return(e-t)*r;return a.compare(String(e),String(t))*r}const b=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsSort=s(this,"dsSort");this.dsRowClick=s(this,"dsRowClick");this.dsPageChange=s(this,"dsPageChange");this.columns=[];this.data=[];this.loading=false;this.emptyMessage="No results found.";this.loadingLabel="Loading";this.previousPageLabel="Previous";this.nextPageLabel="Next";this.pageStatusLabel="Page {page} of {total}";this.selectedRows="";this.pageSize=20}get activeSort(){return this.sortState??this.internalSort}get visibleCols(){return this.columns.filter((e=>!e.hide))}get gridTemplate(){return this.visibleCols.map((e=>{if(e.width)return typeof e.width==="number"?`${e.width}px`:e.width;return"minmax(120px, 1fr)"})).join(" ")}get sortedData(){const e=this.activeSort;if(!e)return this.data;const t=this.columns.find((t=>t.id===e.columnId));if(!t)return this.data;return[...this.data].sort(((s,a)=>l(c(t,s),c(t,a),e.direction,new Intl.Collator(this.locale))))}get pagedData(){if(this.pageIndex===undefined)return this.sortedData;const e=this.pageIndex*this.pageSize;return this.sortedData.slice(e,e+this.pageSize)}get totalPages(){if(this.pageIndex===undefined)return 1;return Math.ceil(this.sortedData.length/this.pageSize)}get selectedSet(){if(!this.selectedRows)return new Set;return new Set(this.selectedRows.split(",").map(Number).filter((e=>!isNaN(e))))}handleSort(e){this.dsSort.emit({columnId:e});if(!this.sortState){const t=this.internalSort;this.internalSort=t?.columnId===e?{columnId:e,direction:t.direction==="asc"?"desc":"asc"}:{columnId:e,direction:"asc"}}}render(){const{visibleCols:e,pagedData:t,totalPages:s,loading:i}=this;const o=!i&&t.length===0;const n=this.selectedSet;const d=this.activeSort;const l=this.pageIndex!==undefined&&s>1;return a(r,{key:"2e0b9bf82b5c1991187235e244366cf1cf8d2c35"},a("div",{key:"388204eb94d96d402231c2f66c3e7ca533259c59",class:"table-wrapper","aria-busy":i||undefined},a("div",{key:"20574089efc617d33912837454ba284f012beb71",class:"table-scroll"},a("div",{key:"c20d34ee5fd40ab3da757df0f3a120cc569a0c5f",class:"table",style:{gridTemplateColumns:this.gridTemplate},role:"table"},a("div",{key:"4051b3ea2825aabea903938358775b21aa574cb1",class:"header-row",role:"row"},e.map((e=>{const t=d?.columnId===e.id;const s=e.sortable?t?d.direction==="asc"?"ascending":"descending":"none":undefined;return a("div",{key:e.id,class:{"header-cell":true,"header-cell--sortable":!!e.sortable,"align-right":e.align==="right","align-center":e.align==="center"},role:"columnheader","aria-sort":s,tabIndex:e.sortable?0:undefined,onClick:()=>e.sortable&&this.handleSort(e.id),onKeyDown:t=>{if(e.sortable&&(t.key==="Enter"||t.key===" ")){t.preventDefault();this.handleSort(e.id)}},style:e.minWidth?{minWidth:typeof e.minWidth==="number"?`${e.minWidth}px`:e.minWidth}:undefined},a("ds-text",{as:"span",variant:"text-body-small",emphasis:true,color:"secondary"},e.header),t&&a("span",{class:"sort-indicator","aria-hidden":"true"},d.direction==="asc"?"↑":"↓"))}))),i&&Array.from({length:5}).map(((t,s)=>a("div",{key:`sk-${s}`,class:"row",role:s===0?"status":"row","aria-label":s===0?this.loadingLabel:undefined},e.map((e=>a("div",{key:e.id,class:"cell",role:"cell"},a("ds-skeleton",{variant:"text",width:"60%"}))))))),o&&a("ds-text",{key:"072db1d261691e1a7997980930c1c40b415deb7b",class:"empty-row",as:"p",variant:"text-body-medium",color:"secondary",style:{gridColumn:"1 / -1"}},this.emptyMessage),!i&&t.map(((t,s)=>{const r=n.has(s);return a("div",{key:s,class:{row:true,"row--selected":r,"row--clickable":true},role:"row",tabIndex:0,"aria-selected":this.selectedRows?r:undefined,onClick:()=>this.dsRowClick.emit({row:t,rowIndex:s}),onKeyDown:e=>{if(e.key==="Enter"||e.key===" "){e.preventDefault();this.dsRowClick.emit({row:t,rowIndex:s})}}},e.map((e=>a("ds-text",{key:e.id,class:{cell:true,"align-right":e.align==="right","align-center":e.align==="center"},as:"span",variant:"text-body-medium",lineTruncation:1,role:"cell"},String(c(e,t)??"")))))})))),l&&a("div",{key:"d8ddf6559e43a75f61b5dd53df04420af2797769",class:"table-pagination"},a("button",{key:"08131fc616c35d7259f689895a90c64864dd01c7",type:"button",class:"page-button",disabled:this.pageIndex===0,onClick:()=>{this.pageIndex=this.pageIndex-1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},a("ds-text",{key:"2d7302e4619cd52b41d818c1122fa1cd2b8ceebf",as:"span",variant:"text-body-small"},this.previousPageLabel)),a("ds-text",{key:"fdb89c9b3e67adc7a3fca996aef716bdc01a863d",as:"span",variant:"text-body-small",color:"secondary"},this.pageStatusLabel.replace("{page}",String(this.pageIndex+1)).replace("{total}",String(s))),a("button",{key:"d33c7ab0ddb5dbb09a54f07ae5c2cb492f788c15",type:"button",class:"page-button",disabled:this.pageIndex>=s-1,onClick:()=>{this.pageIndex=this.pageIndex+1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},a("ds-text",{key:"284036c8b51c7570ae1783dd86712304e7962e7b",as:"span",variant:"text-body-small"},this.nextPageLabel)))))}static get style(){return d()}},[2,"ds-table",{columns:[16],data:[16],sortState:[16],loading:[4],emptyMessage:[1,"empty-message"],loadingLabel:[1,"loading-label"],previousPageLabel:[1,"previous-page-label"],nextPageLabel:[1,"next-page-label"],pageStatusLabel:[1,"page-status-label"],locale:[1],selectedRows:[1,"selected-rows"],pageIndex:[1026,"page-index"],pageSize:[2,"page-size"],internalSort:[32]}]);function u(){if(typeof customElements==="undefined"){return}const e=["ds-table","ds-skeleton","ds-text"];e.forEach((e=>{switch(e){case"ds-table":if(!customElements.get(i(e))){customElements.define(i(e),b)}break;case"ds-skeleton":if(!customElements.get(i(e))){o()}break;case"ds-text":if(!customElements.get(i(e))){n()}break}}))}u();const h=b;const p=u;export{h as DsTable,p as defineCustomElement};
-//# sourceMappingURL=ds-table.js.map

package/dist/components/ds-table.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["tableCss","getCellValue","col","row","accessorKey","accessor","undefined","compareValues","a","b","dir","collator","m","compare","String","Table","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","columns","data","loading","emptyMessage","loadingLabel","previousPageLabel","nextPageLabel","pageStatusLabel","selectedRows","pageSize","activeSort","sortState","internalSort","visibleCols","filter","c","hide","gridTemplate","map","width","join","sortedData","sort","find","id","columnId","direction","Intl","Collator","locale","pagedData","pageIndex","start","slice","totalPages","Math","ceil","length","selectedSet","Set","split","Number","n","isNaN","handleSort","dsSort","emit","cur","render","isEmpty","hasPagination","h","Host","key","class","style","gridTemplateColumns","role","isSorted","ariaSort","sortable","align","tabIndex","onClick","onKeyDown","e","preventDefault","minWidth","as","variant","emphasis","color","header","Array","from","_","i","gridColumn","rowIndex","isSelected","has","dsRowClick","cell","lineTruncation","type","disabled","dsPageChange","replace"],"sources":["src/wc/components/Table/Table.css?tag=ds-table&encapsulation=scoped","src/wc/components/Table/Table.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n.table-wrapper {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  overflow: hidden;\n  border-radius: var(--dimension-radius-075);\n}\n\n.table-scroll {\n  overflow-x: auto;\n  width: 100%;\n}\n\n.table {\n  display: grid;\n  width: 100%;\n  min-width: max-content;\n}\n\n/* ─── Header ────────────────────────────────────────────────────────────────── */\n\n.header-row {\n  display: contents;\n}\n\n.header-cell {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  background-color: var(--color-background-secondary);\n  border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  -webkit-user-select: none;\n  user-select: none;\n  position: sticky;\n  top: 0;\n  z-index: 2;\n}\n\n.header-cell--sortable {\n  cursor: pointer;\n}\n\n.header-cell--sortable:hover {\n  background-color: var(--color-translucent-translucent);\n}\n\n.header-cell--sortable:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: calc(var(--dimension-space-025) * -1);\n}\n\n.sort-indicator {\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  color: var(--color-foreground-secondary);\n}\n\n/* ─── Rows ──────────────────────────────────────────────────────────────────── */\n\n.row {\n  display: contents;\n}\n\n.row--clickable {\n  cursor: pointer;\n}\n\n.row:hover .cell {\n  background-color: var(--color-interaction-hover);\n}\n\n.row--selected .cell {\n  background-color: var(--color-background-faint-brand);\n}\n\n.row--clickable:focus-visible .cell {\n  background-color: var(--color-interaction-hover);\n  box-shadow: inset 0 0 0 var(--dimension-stroke-width-025) var(--color-interaction-focus);\n}\n\n/* ─── Cells ─────────────────────────────────────────────────────────────────── */\n\n.cell {\n  display: flex;\n  align-items: center;\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  min-height: var(--dimension-size-500);\n  background-color: var(--color-background-primary);\n  transition: background-color var(--effect-motion-short-2);\n}\n\n.align-right {\n  justify-content: flex-end;\n  text-align: right;\n}\n\n.align-center {\n  justify-content: center;\n  text-align: center;\n}\n\n/* ─── Empty state ───────────────────────────────────────────────────────────── */\n\n.empty-row {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--dimension-space-400);\n  background-color: var(--color-background-primary);\n}\n\n/* ─── Pagination ────────────────────────────────────────────────────────────── */\n\n.table-pagination {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--dimension-space-100);\n  padding: var(--dimension-space-100);\n  border-top: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  background-color: var(--color-background-primary);\n}\n\n.page-button {\n  display: flex;\n  align-items: center;\n  padding: var(--dimension-space-050) var(--dimension-space-100);\n  background-color: transparent;\n  border: none;\n  border-radius: var(--dimension-radius-075);\n  cursor: pointer;\n  transition: background-color var(--effect-motion-short-2);\n}\n\n.page-button:hover:not(:disabled) {\n  background-color: var(--color-interaction-hover);\n}\n\n.page-button:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n}\n\n.page-button:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: var(--dimension-stroke-width-015);\n}\n","import { Component, Prop, State, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type SortDirection = 'asc' | 'desc';\n\nexport interface SortState {\n  columnId: string;\n  direction: SortDirection;\n}\n\nexport interface TableColumn<T = unknown> {\n  id: string;\n  header: string;\n  accessorKey?: string;\n  accessor?: (row: T) => unknown;\n  sortable?: boolean;\n  align?: 'left' | 'right' | 'center';\n  width?: string | number;\n  minWidth?: string | number;\n  hide?: boolean;\n}\n\nfunction getCellValue<T>(col: TableColumn<T>, row: T): unknown {\n  if (col.accessorKey) return (row as Record<string, unknown>)[col.accessorKey];\n  if (col.accessor) return col.accessor(row);\n  return undefined;\n}\n\nfunction compareValues(a: unknown, b: unknown, dir: SortDirection, collator: Intl.Collator): number {\n  const m = dir === 'asc' ? 1 : -1;\n  if (a == null && b == null) return 0;\n  if (a == null) return m;\n  if (b == null) return -m;\n  if (typeof a === 'number' && typeof b === 'number') return (a - b) * m;\n  return collator.compare(String(a), String(b)) * m;\n}\n\n@Component({\n  tag: 'ds-table',\n  styleUrl: 'Table.css',\n  scoped: true,\n})\nexport class Table {\n  @Prop() columns: TableColumn[] = [];\n  @Prop() data: unknown[] = [];\n  @Prop() sortState: SortState | undefined;\n  @Prop() loading: boolean = false;\n  @Prop() emptyMessage: string = 'No results found.';\n  @Prop() loadingLabel: string = 'Loading';\n  @Prop() previousPageLabel: string = 'Previous';\n  @Prop() nextPageLabel: string = 'Next';\n  /** Use `{page}` and `{total}` placeholders. */\n  @Prop() pageStatusLabel: string = 'Page {page} of {total}';\n  @Prop() locale: string | undefined;\n  /** Comma-separated zero-based row indices that are selected. */\n  @Prop() selectedRows: string = '';\n  /** Page index (0-based). Enables built-in pagination when set alongside pageSize. */\n  @Prop({ mutable: true }) pageIndex: number | undefined;\n  @Prop() pageSize: number = 20;\n\n  @State() private internalSort: SortState | undefined;\n\n  @Event() dsSort!: EventEmitter<{ columnId: string }>;\n  @Event() dsRowClick!: EventEmitter<{ row: unknown; rowIndex: number }>;\n  @Event() dsPageChange!: EventEmitter<{ pageIndex: number }>;\n\n  private get activeSort(): SortState | undefined {\n    return this.sortState ?? this.internalSort;\n  }\n\n  private get visibleCols(): TableColumn[] {\n    return this.columns.filter(c => !c.hide);\n  }\n\n  private get gridTemplate(): string {\n    return this.visibleCols.map(col => {\n      if (col.width) return typeof col.width === 'number' ? `${col.width}px` : col.width;\n      return 'minmax(120px, 1fr)';\n    }).join(' ');\n  }\n\n  private get sortedData(): unknown[] {\n    const sort = this.activeSort;\n    if (!sort) return this.data;\n    const col = this.columns.find(c => c.id === sort.columnId);\n    if (!col) return this.data;\n    return [...this.data].sort((a, b) =>\n      compareValues(getCellValue(col, a), getCellValue(col, b), sort.direction, new Intl.Collator(this.locale))\n    );\n  }\n\n  private get pagedData(): unknown[] {\n    if (this.pageIndex === undefined) return this.sortedData;\n    const start = this.pageIndex * this.pageSize;\n    return this.sortedData.slice(start, start + this.pageSize);\n  }\n\n  private get totalPages(): number {\n    if (this.pageIndex === undefined) return 1;\n    return Math.ceil(this.sortedData.length / this.pageSize);\n  }\n\n  private get selectedSet(): Set<number> {\n    if (!this.selectedRows) return new Set();\n    return new Set(this.selectedRows.split(',').map(Number).filter(n => !isNaN(n)));\n  }\n\n  private handleSort(columnId: string) {\n    this.dsSort.emit({ columnId });\n    // Toggle internal sort if consumer hasn't provided sortState\n    if (!this.sortState) {\n      const cur = this.internalSort;\n      this.internalSort = cur?.columnId === columnId\n        ? { columnId, direction: cur.direction === 'asc' ? 'desc' : 'asc' }\n        : { columnId, direction: 'asc' };\n    }\n  }\n\n  render() {\n    const { visibleCols, pagedData, totalPages, loading } = this;\n    const isEmpty = !loading && pagedData.length === 0;\n    const selectedSet = this.selectedSet;\n    const sort = this.activeSort;\n    const hasPagination = this.pageIndex !== undefined && totalPages > 1;\n\n    return (\n      <Host>\n        <div class=\"table-wrapper\" aria-busy={loading || undefined}>\n          <div class=\"table-scroll\">\n            <div class=\"table\" style={{ gridTemplateColumns: this.gridTemplate }} role=\"table\">\n\n              {/* Header row */}\n              <div class=\"header-row\" role=\"row\">\n                {visibleCols.map(col => {\n                  const isSorted = sort?.columnId === col.id;\n                  const ariaSort = col.sortable\n                    ? (isSorted ? (sort.direction === 'asc' ? 'ascending' : 'descending') : 'none')\n                    : undefined;\n                  return (\n                    <div\n                      key={col.id}\n                      class={{\n                        'header-cell': true,\n                        'header-cell--sortable': !!col.sortable,\n                        'align-right': col.align === 'right',\n                        'align-center': col.align === 'center',\n                      }}\n                      role=\"columnheader\"\n                      aria-sort={ariaSort}\n                      tabIndex={col.sortable ? 0 : undefined}\n                      onClick={() => col.sortable && this.handleSort(col.id)}\n                      onKeyDown={(e: KeyboardEvent) => {\n                        if (col.sortable && (e.key === 'Enter' || e.key === ' ')) {\n                          e.preventDefault();\n                          this.handleSort(col.id);\n                        }\n                      }}\n                      style={col.minWidth ? { minWidth: typeof col.minWidth === 'number' ? `${col.minWidth}px` : col.minWidth as string } : undefined}\n                    >\n                      <ds-text as=\"span\" variant=\"text-body-small\" emphasis color=\"secondary\">\n                        {col.header}\n                      </ds-text>\n                      {isSorted && (\n                        <span class=\"sort-indicator\" aria-hidden=\"true\">\n                          {sort.direction === 'asc' ? '↑' : '↓'}\n                        </span>\n                      )}\n                    </div>\n                  );\n                })}\n              </div>\n\n              {/* Loading skeleton */}\n              {loading && Array.from({ length: 5 }).map((_, i) => (\n                <div\n                  key={`sk-${i}`}\n                  class=\"row\"\n                  role={i === 0 ? 'status' : 'row'}\n                  aria-label={i === 0 ? this.loadingLabel : undefined}\n                >\n                  {visibleCols.map(col => (\n                    <div key={col.id} class=\"cell\" role=\"cell\">\n                      <ds-skeleton variant=\"text\" width=\"60%\" />\n                    </div>\n                  ))}\n                </div>\n              ))}\n\n              {/* Empty state */}\n              {isEmpty && (\n                <ds-text\n                  class=\"empty-row\"\n                  as=\"p\"\n                  variant=\"text-body-medium\"\n                  color=\"secondary\"\n                  style={{ gridColumn: '1 / -1' }}\n                >\n                  {this.emptyMessage}\n                </ds-text>\n              )}\n\n              {/* Data rows */}\n              {!loading && pagedData.map((row, rowIndex) => {\n                const isSelected = selectedSet.has(rowIndex);\n                return (\n                  <div\n                    key={rowIndex}\n                    class={{\n                      'row': true,\n                      'row--selected': isSelected,\n                      'row--clickable': true,\n                    }}\n                    role=\"row\"\n                    tabIndex={0}\n                    aria-selected={this.selectedRows ? isSelected : undefined}\n                    onClick={() => this.dsRowClick.emit({ row, rowIndex })}\n                    onKeyDown={(e: KeyboardEvent) => {\n                      if (e.key === 'Enter' || e.key === ' ') {\n                        e.preventDefault();\n                        this.dsRowClick.emit({ row, rowIndex });\n                      }\n                    }}\n                  >\n                    {visibleCols.map(col => (\n                      <ds-text\n                        key={col.id}\n                        class={{\n                          'cell': true,\n                          'align-right': col.align === 'right',\n                          'align-center': col.align === 'center',\n                        }}\n                        as=\"span\"\n                        variant=\"text-body-medium\"\n                        lineTruncation={1}\n                        role=\"cell\"\n                      >\n                        {String(getCellValue(col, row) ?? '')}\n                      </ds-text>\n                    ))}\n                  </div>\n                );\n              })}\n            </div>\n          </div>\n\n          {/* Built-in pagination */}\n          {hasPagination && (\n            <div class=\"table-pagination\">\n              <button\n                type=\"button\"\n                class=\"page-button\"\n                disabled={this.pageIndex === 0}\n                onClick={() => {\n                  this.pageIndex = this.pageIndex! - 1;\n                  this.dsPageChange.emit({ pageIndex: this.pageIndex });\n                }}\n              >\n                <ds-text as=\"span\" variant=\"text-body-small\">{this.previousPageLabel}</ds-text>\n              </button>\n              <ds-text as=\"span\" variant=\"text-body-small\" color=\"secondary\">\n                {this.pageStatusLabel\n                  .replace('{page}', String(this.pageIndex! + 1))\n                  .replace('{total}', String(totalPages))}\n              </ds-text>\n              <button\n                type=\"button\"\n                class=\"page-button\"\n                disabled={this.pageIndex! >= totalPages - 1}\n                onClick={() => {\n                  this.pageIndex = this.pageIndex! + 1;\n                  this.dsPageChange.emit({ pageIndex: this.pageIndex });\n                }}\n              >\n                <ds-text as=\"span\" variant=\"text-body-small\">{this.nextPageLabel}</ds-text>\n              </button>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/p-CKV6rOGa.js

@@ -1,2 +0,0 @@
-import{p as e,H as s,c as t,h as i,a as r,t as a}from"./index.js";import{d as n}from"./p-Pip-LNhl.js";import{D as d,n as l,S as c,a as o}from"./p-D0B9uDTP.js";const h=()=>`.sc-ds-shell-gradient-picker-h{display:block;width:100%}.shell-gradient-picker.sc-ds-shell-gradient-picker{box-sizing:border-box;display:flex;align-items:center;width:100%;min-height:var(--dimension-size-400);gap:var(--dimension-space-100);padding:var(--dimension-space-100)}.shell-gradient-picker__divider.sc-ds-shell-gradient-picker{flex:0 0 auto;align-self:center;width:var(--dimension-stroke-width-012);height:var(--dimension-size-300);background-color:var(--color-border-tertiary)}`;const p=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.value=d;this.groupLabel="Shell gradient theme";this.handleSwatchSelect=e=>{const s=l(e);if(s===l(this.value))return;this.value=s;this.dsChange.emit(s)};this.handleSwatchKeyDown=(e,s)=>{const t=c.indexOf(s);let i=null;if(e.key==="ArrowRight"||e.key==="ArrowDown"){i=(t+1)%c.length}else if(e.key==="ArrowLeft"||e.key==="ArrowUp"){i=(t-1+c.length)%c.length}else if(e.key==="Home"){i=0}else if(e.key==="End"){i=c.length-1}if(i===null)return;e.preventDefault();const r=c[i];this.handleSwatchSelect(r);this.focusSwatch(r)}}focusSwatch(e){requestAnimationFrame((()=>{const s=this.el.querySelector(`ds-shell-gradient-swatch[preset="${e}"]`);s?.querySelector("button")?.focus()}))}renderSwatch(e){const s=l(this.value)===e;return i("ds-shell-gradient-swatch",{key:e,preset:e,selected:s,onKeyDown:s=>this.handleSwatchKeyDown(s,e),onDsSelect:e=>{e.stopPropagation();this.handleSwatchSelect(e.detail)}})}render(){return i(r,{key:"29ad43dff95b396ae5bef9e299fc4298d23d00e4"},i("div",{key:"28b3bf7dda7b9c17568dfc0304951691d8fdf5c3",class:"shell-gradient-picker",role:"radiogroup","aria-label":this.groupLabel},this.renderSwatch("none"),i("div",{key:"1b115dc13c6ae06d47248d528e3c54eab6435245",class:"shell-gradient-picker__divider","aria-hidden":"true"}),o.map((e=>this.renderSwatch(e)))))}get el(){return this}static get style(){return h()}},[2,"ds-shell-gradient-picker",{value:[1537],groupLabel:[1,"group-label"]}]);function f(){if(typeof customElements==="undefined"){return}const e=["ds-shell-gradient-picker","ds-shell-gradient-swatch"];e.forEach((e=>{switch(e){case"ds-shell-gradient-picker":if(!customElements.get(a(e))){customElements.define(a(e),p)}break;case"ds-shell-gradient-swatch":if(!customElements.get(a(e))){n()}break}}))}f();export{p as S,f as d};
-//# sourceMappingURL=p-CKV6rOGa.js.map

package/dist/components/p-CKV6rOGa.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["shellGradientPickerCss","ShellGradientPicker","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","DEFAULT_SHELL_GRADIENT_PRESET","groupLabel","handleSwatchSelect","preset","normalized","normalizeShellGradientPreset","dsChange","emit","handleSwatchKeyDown","event","currentIndex","SHELL_GRADIENT_PRESETS","indexOf","nextIndex","key","length","preventDefault","nextPreset","focusSwatch","requestAnimationFrame","swatch","el","querySelector","focus","renderSwatch","selected","h","onKeyDown","onDsSelect","e","stopPropagation","detail","render","Host","class","role","SHELL_GRADIENT_WASH_PRESETS","map"],"sources":["src/wc/components/ShellGradientPicker/ShellGradientPicker.css?tag=ds-shell-gradient-picker&encapsulation=scoped","src/wc/components/ShellGradientPicker/ShellGradientPicker.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n/* One row — same width footprint as menu items; 24px orbs + divider inside. */\n.shell-gradient-picker {\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  min-height: var(--dimension-size-400);\n  gap: var(--dimension-space-100);\n  padding: var(--dimension-space-100);\n}\n\n.shell-gradient-picker__divider {\n  flex: 0 0 auto;\n  align-self: center;\n  width: var(--dimension-stroke-width-012);\n  height: var(--dimension-size-300);\n  background-color: var(--color-border-tertiary);\n}\n","import { Component, Prop, Event, EventEmitter, Element, h, Host } from '@stencil/core';\nimport {\n  SHELL_GRADIENT_PRESETS,\n  SHELL_GRADIENT_WASH_PRESETS,\n  DEFAULT_SHELL_GRADIENT_PRESET,\n  normalizeShellGradientPreset,\n  type ShellGradientPreset,\n} from '../ShellGradientSwatch/shell-gradient-swatch-types';\n\n@Component({\n  tag: 'ds-shell-gradient-picker',\n  styleUrl: 'ShellGradientPicker.css',\n  scoped: true,\n})\nexport class ShellGradientPicker {\n  /** Active shell wash preset. */\n  @Prop({ mutable: true, reflect: true }) value: ShellGradientPreset =\n    DEFAULT_SHELL_GRADIENT_PRESET;\n  @Prop() groupLabel: string = 'Shell gradient theme';\n\n  @Event() dsChange!: EventEmitter<ShellGradientPreset>;\n\n  @Element() el!: HTMLElement;\n\n  private handleSwatchSelect = (preset: ShellGradientPreset) => {\n    const normalized = normalizeShellGradientPreset(preset);\n    if (normalized === normalizeShellGradientPreset(this.value)) return;\n    this.value = normalized;\n    this.dsChange.emit(normalized);\n  };\n\n  private focusSwatch(preset: ShellGradientPreset) {\n    requestAnimationFrame(() => {\n      const swatch = this.el.querySelector<HTMLElement>(\n        `ds-shell-gradient-swatch[preset=\"${preset}\"]`,\n      );\n      swatch?.querySelector<HTMLButtonElement>('button')?.focus();\n    });\n  }\n\n  private handleSwatchKeyDown = (event: KeyboardEvent, preset: ShellGradientPreset) => {\n    const currentIndex = SHELL_GRADIENT_PRESETS.indexOf(preset);\n    let nextIndex: number | null = null;\n\n    if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {\n      nextIndex = (currentIndex + 1) % SHELL_GRADIENT_PRESETS.length;\n    } else if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {\n      nextIndex = (currentIndex - 1 + SHELL_GRADIENT_PRESETS.length) % SHELL_GRADIENT_PRESETS.length;\n    } else if (event.key === 'Home') {\n      nextIndex = 0;\n    } else if (event.key === 'End') {\n      nextIndex = SHELL_GRADIENT_PRESETS.length - 1;\n    }\n\n    if (nextIndex === null) return;\n    event.preventDefault();\n    const nextPreset = SHELL_GRADIENT_PRESETS[nextIndex];\n    this.handleSwatchSelect(nextPreset);\n    this.focusSwatch(nextPreset);\n  };\n\n  private renderSwatch(preset: ShellGradientPreset) {\n    const selected = normalizeShellGradientPreset(this.value) === preset;\n    return (\n      <ds-shell-gradient-swatch\n        key={preset}\n        preset={preset}\n        selected={selected}\n        onKeyDown={(event: KeyboardEvent) => this.handleSwatchKeyDown(event, preset)}\n        onDsSelect={(e: CustomEvent<ShellGradientPreset>) => {\n          e.stopPropagation();\n          this.handleSwatchSelect(e.detail);\n        }}\n      />\n    );\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class=\"shell-gradient-picker\"\n          role=\"radiogroup\"\n          aria-label={this.groupLabel}\n        >\n          {this.renderSwatch('none')}\n          <div class=\"shell-gradient-picker__divider\" aria-hidden=\"true\" />\n          {SHELL_GRADIENT_WASH_PRESETS.map(preset => this.renderSwatch(preset))}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+JAAA,MAAMA,EAAyB,IAAM,ye,MCcxBC,EAAmBC,EAAA,MAAAD,UAAAE,EALhC,WAAAC,CAAAC,G,6EAO0CC,KAAAC,MACtCC,EACMF,KAAAG,WAAqB,uBAMrBH,KAAAI,mBAAsBC,IAC5B,MAAMC,EAAaC,EAA6BF,GAChD,GAAIC,IAAeC,EAA6BP,KAAKC,OAAQ,OAC7DD,KAAKC,MAAQK,EACbN,KAAKQ,SAASC,KAAKH,EAAW,EAYxBN,KAAAU,oBAAsB,CAACC,EAAsBN,KACnD,MAAMO,EAAeC,EAAuBC,QAAQT,GACpD,IAAIU,EAA2B,KAE/B,GAAIJ,EAAMK,MAAQ,cAAgBL,EAAMK,MAAQ,YAAa,CAC3DD,GAAaH,EAAe,GAAKC,EAAuBI,M,MACnD,GAAIN,EAAMK,MAAQ,aAAeL,EAAMK,MAAQ,UAAW,CAC/DD,GAAaH,EAAe,EAAIC,EAAuBI,QAAUJ,EAAuBI,M,MACnF,GAAIN,EAAMK,MAAQ,OAAQ,CAC/BD,EAAY,C,MACP,GAAIJ,EAAMK,MAAQ,MAAO,CAC9BD,EAAYF,EAAuBI,OAAS,C,CAG9C,GAAIF,IAAc,KAAM,OACxBJ,EAAMO,iBACN,MAAMC,EAAaN,EAAuBE,GAC1Cf,KAAKI,mBAAmBe,GACxBnB,KAAKoB,YAAYD,EAAW,CAkC/B,CA7DS,WAAAC,CAAYf,GAClBgB,uBAAsB,KACpB,MAAMC,EAAStB,KAAKuB,GAAGC,cACrB,oCAAoCnB,OAEtCiB,GAAQE,cAAiC,WAAWC,OAAO,G,CAyBvD,YAAAC,CAAarB,GACnB,MAAMsB,EAAWpB,EAA6BP,KAAKC,SAAWI,EAC9D,OACEuB,EAAA,4BACEZ,IAAKX,EACLA,OAAQA,EACRsB,SAAUA,EACVE,UAAYlB,GAAyBX,KAAKU,oBAAoBC,EAAON,GACrEyB,WAAaC,IACXA,EAAEC,kBACFhC,KAAKI,mBAAmB2B,EAAEE,OAAO,G,CAMzC,MAAAC,GACE,OACEN,EAACO,EAAI,CAAAnB,IAAA,4CACHY,EAAA,OAAAZ,IAAA,2CACEoB,MAAM,wBACNC,KAAK,aAAY,aACLrC,KAAKG,YAEhBH,KAAK0B,aAAa,QACnBE,EAAA,OAAAZ,IAAA,2CAAKoB,MAAM,iCAAgC,cAAa,SACvDE,EAA4BC,KAAIlC,GAAUL,KAAK0B,aAAarB,M","ignoreList":[]}

package/dist/components/p-CSTr2132.js

@@ -1,2 +0,0 @@
-import{p as i,H as e,c as s,h as n,a as t,t as o}from"./index.js";import{c as r}from"./p-C_cu-HIT.js";import{d as c}from"./p-DAuadHYu.js";import{d as a}from"./p-CKV6rOGa.js";import{d}from"./p-Pip-LNhl.js";import{d as l}from"./p-C7UFYvsO.js";import{d as u}from"./p-BKA6houZ.js";import{a as h,T as m}from"./p-drBA73M_.js";import{r as f}from"./p-BWUTr_XN.js";import{r as p}from"./p-BHtg1fh3.js";const v=r;function g(i){return"variant"in i&&i.variant==="gradient-picker"}const b=()=>`.sc-ds-menu-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-menu-h:focus-visible,.ds-focus-ring.sc-ds-menu: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-menu-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-menu{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-menu-h:focus-visible,.ds-focus-ring-inset.sc-ds-menu:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-menu-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-menu: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-menu-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-menu-h,.ds-interaction-fill.sc-ds-menu{position:relative;z-index:0;--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-fill.sc-ds-menu-h::before,.ds-interaction-fill.sc-ds-menu::before,.ds-interaction-fill.sc-ds-menu-h::after,.ds-interaction-fill.sc-ds-menu::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-menu-h::before,.ds-interaction-fill.sc-ds-menu::before{z-index:1}.ds-interaction-fill.sc-ds-menu-h::after,.ds-interaction-fill.sc-ds-menu::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-menu-h,.ds-interaction-fill--bordered.sc-ds-menu{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-menu-h::before,.ds-interaction-fill--selected.sc-ds-menu::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-menu-h,.ds-interaction-fill--selected.sc-ds-menu{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-menu-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-menu:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-menu-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-menu:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-menu-h>.ds-interaction-fill__content.sc-ds-menu,.ds-interaction-fill.sc-ds-menu>.ds-interaction-fill__content.sc-ds-menu,.ds-interaction-fill__content.sc-ds-menu{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-menu-h,.ds-interaction-fill--on-faint.sc-ds-menu{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-menu-h,.ds-interaction-fill--on-medium.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-bold.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-strong.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-translucent.sc-ds-menu{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-menu-h,.ds-interaction-fill--on-inverted.sc-ds-menu{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-menu-h,.ds-interaction-fill--on-media.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-always-dark.sc-ds-menu{--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);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-menu-h,.ds-interaction-fill--on-navigation.sc-ds-menu{--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)}.ds-control-inactive.sc-ds-menu-h,.ds-control-inactive.sc-ds-menu{opacity:0.25;pointer-events:none;cursor:not-allowed}.ds-control--md.sc-ds-menu-h,.ds-control--md.sc-ds-menu{--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-radius:var(--dimension-radius-025)}.ds-control--sm.sc-ds-menu-h,.ds-control--sm.sc-ds-menu{--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-radius:var(--dimension-radius-025)}.ds-control--xs.sc-ds-menu-h,.ds-control--xs.sc-ds-menu{--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-radius:var(--dimension-radius-025)}.ds-choice-popup.sc-ds-menu{box-sizing:border-box;display:flex;flex-direction:column;min-width: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;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-menu::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-menu{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-menu{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-menu{opacity:0}}.ds-choice-list.sc-ds-menu{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section.sc-ds-menu{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-050)}.ds-choice-section--divided.sc-ds-menu{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-menu{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding:0 calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   );text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-item.sc-ds-menu{display:flex;align-items:center;gap:var(--ds-control-gap, var(--dimension-space-050));width:100%;height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));box-sizing:border-box;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:pointer;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-menu: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-menu{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-menu,.ds-choice-item__subtext.sc-ds-menu,ds-text.ds-choice-item__subtext.sc-ds-menu{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}ds-text.ds-choice-item__label.sc-ds-menu{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-menu{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-menu,.ds-choice-item__suffix.sc-ds-menu{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-empty.sc-ds-menu,.ds-choice-loading.sc-ds-menu{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-menu{position:relative;box-sizing:border-box;padding:var(--dimension-space-050)}.ds-choice-footer.sc-ds-menu::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-menu{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:var(--dimension-size-400);padding:0 var(--ds-control-padding-inline, var(--dimension-space-075))}.ds-choice-footer__summary.sc-ds-menu,.ds-choice-footer__clear.sc-ds-menu ds-text.sc-ds-menu{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}.ds-choice-footer__clear.sc-ds-menu{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;color:var(--color-foreground-bold-brand);cursor:pointer}.ds-choice-footer__clear.sc-ds-menu:hover{text-decoration:underline}.menu-item--destructive.sc-ds-menu .menu-item__label.sc-ds-menu{color:var(--color-foreground-bold-negative) !important}.menu-item__dot-box.sc-ds-menu{display: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}.menu-item__switch.sc-ds-menu{flex-shrink:0}`;const x=8;const w=["a[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(",");const y=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.dsClose=s(this,"dsClose");this.dsSelect=s(this,"dsSelect");this.dsGradientSelect=s(this,"dsGradientSelect");this.open=false;this.items=[];this.sections=[];this.side="bottom";this.align="start";this.sideOffset=h.space050;this.alignOffset=0;this.initialFocusVisible=false;this.menuLabel="Menu";this.shouldRender=false;this.closing=false;this.pos={x:0,y:0};this.focusedIndex=0;this.positionReady=false;this.focusRingVisible=false;this.clickOutsideHandler=null;this.scrollResizeHandler=null;this.closeTimer=null;this.itemEls=[];this.positionRetryRaf=null;this.listenersReady=false}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.cancelPositionRetry();this.teardownListeners()}onOpenChange(i){if(i){this.teardownListeners();this.shouldRender=true;this.closing=false;this.positionReady=false;this.listenersReady=false;this.focusRingVisible=this.initialFocusVisible;this.listenersReady=true;this.setupListeners();this.schedulePositionUpdate((()=>{this.focusInitialItem()}))}else if(this.shouldRender){this.cancelPositionRetry();this.closing=true;this.teardownListeners();this.listenersReady=false;const i=this.closeAnimationMs;if(i<=0){this.finishClose();return}this.closeTimer=setTimeout((()=>{this.closeTimer=null;this.finishClose()}),i)}}onAnchorChange(){if(this.open)this.schedulePositionUpdate()}onPositionPropsChange(){if(this.open)this.schedulePositionUpdate()}get viewportPadPx(){return f(m.space050,m.space050)}get sideOffsetPx(){return f(this.sideOffset,m.space050)}get alignOffsetPx(){return f(this.alignOffset,0)}get popupFallbackWidthPx(){return f(m.menuWidthXs,m.menuWidthXs)}get popupFallbackHeightPx(){return f(m.menuFallbackHeight,m.menuFallbackHeight)}get closeAnimationMs(){return p(m.motionShort2,m.animationDurationShort3)}finishClose(){this.shouldRender=false;this.closing=false}get resolvedAnchor(){if(this.anchor)return this.anchor;if(this.anchorId)return document.getElementById(this.anchorId);return null}get anchorFocusTarget(){const i=this.resolvedAnchor;if(!i)return null;if(i.matches(w))return i;return i.querySelector(w)??i}focusAnchor(){const i=this.resolvedAnchor;if(i?.setFocus){i.setFocus();return}this.anchorFocusTarget?.focus()}moveFocusAfterTab(i){const e=this.anchorFocusTarget;if(!e)return;if(i){e.focus();return}const s=Array.from(document.querySelectorAll(w)).filter((i=>!i.closest(".menu-popup")&&!i.closest("[inert]")&&i.getClientRects().length>0));const n=s.indexOf(e);(s[n+1]??e).focus()}compositeTabLeavesPopup(i){const e=this.el.querySelector(".menu-popup");if(!e)return true;const s=Array.from(e.querySelectorAll(w)).filter((i=>i.getClientRects().length>0));const n=s.indexOf(i.target);if(n<0)return true;return i.shiftKey?n===0:n===s.length-1}get activeSections(){if(this.sections.length>0)return this.sections;if(this.items.length>0)return[{items:this.items}];return[]}get flatItems(){return this.activeSections.flatMap((i=>g(i)?[]:i.items))}get hasCompositeSections(){return this.activeSections.some(g)}cancelPositionRetry(){if(this.positionRetryRaf!==null){cancelAnimationFrame(this.positionRetryRaf);this.positionRetryRaf=null}}schedulePositionUpdate(i){if(!this.open)return;this.cancelPositionRetry();this.positionReady=false;let e=x;const s=()=>{this.positionRetryRaf=null;if(!this.open)return;if(this.calculatePosition()){this.positionReady=true;i?.();return}if(e>0){e-=1;this.positionRetryRaf=requestAnimationFrame(s)}};this.positionRetryRaf=requestAnimationFrame(s)}calculatePosition(){const i=this.resolvedAnchor;if(!i)return false;const e=this.el.querySelector(".menu-popup");if(!e)return false;this.pos=v({anchorRect:i.getBoundingClientRect(),popupWidth:e.offsetWidth||this.popupFallbackWidthPx,popupHeight:e.offsetHeight||this.popupFallbackHeightPx,side:this.side,align:this.align,sideOffsetPx:this.sideOffsetPx,alignOffsetPx:this.alignOffsetPx,viewportPadPx:this.viewportPadPx,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});return true}focusInitialItem(){if(this.hasCompositeSections){requestAnimationFrame((()=>{this.el.querySelector('.menu-popup [tabindex="0"]')?.focus()}));return}const i=this.flatItems;const e=i.findIndex((i=>i.isSelected&&!i.isInactive));const s=i.findIndex((i=>!i.isInactive));this.focusedIndex=e>=0?e:s>=0?s:0;requestAnimationFrame((()=>{const i=this.el.querySelectorAll(".menu-item");i[this.focusedIndex]?.focus()}))}setupListeners(){this.clickOutsideHandler=i=>{const e=i.target;const s=this.el.querySelector(".menu-popup");const n=this.resolvedAnchor;if(s?.contains(e)||n?.contains(e))return;this.close()};this.scrollResizeHandler=()=>{if(this.shouldRender&&!this.closing)this.calculatePosition()};document.addEventListener("mousedown",this.clickOutsideHandler,true);window.addEventListener("scroll",this.scrollResizeHandler,true);window.addEventListener("resize",this.scrollResizeHandler)}teardownListeners(){if(this.clickOutsideHandler){document.removeEventListener("mousedown",this.clickOutsideHandler,true);this.clickOutsideHandler=null}if(this.scrollResizeHandler){window.removeEventListener("scroll",this.scrollResizeHandler,true);window.removeEventListener("resize",this.scrollResizeHandler);this.scrollResizeHandler=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}close(i=true){if(i)this.focusAnchor();this.dsClose.emit();this.open=false;this.onOpenChange(false)}handleKeyDown(i){if(!this.shouldRender||this.closing)return;if(i.key==="Escape"){i.preventDefault();this.close();return}if(i.key==="Tab"){if(this.hasCompositeSections&&!this.compositeTabLeavesPopup(i))return;i.preventDefault();this.close(false);this.moveFocusAfterTab(i.shiftKey);return}if(this.hasCompositeSections)return;const e=this.flatItems;const s=e.map(((i,e)=>({it:i,i:e}))).filter((({it:i})=>!i.isInactive)).map((({i})=>i));if(!s.length)return;const n=s.indexOf(this.focusedIndex);const t=n<0?0:n;switch(i.key){case"ArrowDown":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[(t+1)%s.length];this.focusItem(this.focusedIndex);break;case"ArrowUp":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[(t-1+s.length)%s.length];this.focusItem(this.focusedIndex);break;case"Home":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[0];this.focusItem(this.focusedIndex);break;case"End":i.preventDefault();i.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[s.length-1];this.focusItem(this.focusedIndex);break}}focusItem(i){const e=this.el.querySelectorAll(".menu-item");e[i]?.focus()}handleItemClick(i){if(i.isInactive)return;this.dsSelect.emit(i)}handleGradientSelect(i){this.dsGradientSelect.emit(i)}render(){if(!this.shouldRender)return n(t,{style:{display:"contents"}});const i=this.activeSections;let e=0;const s={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"};if(this.menuWidth)s["width"]=this.menuWidth;if(this.minWidth)s["min-width"]=this.minWidth;return n(t,{style:{display:"contents"}},n("div",{class:{"menu-popup":true,"menu-popup--closing":this.closing,"ds-choice-popup":true,"ds-choice-popup--closing":this.closing},style:s,role:this.hasCompositeSections?"dialog":"menu","aria-label":this.menuLabel,"aria-orientation":this.hasCompositeSections?undefined:"vertical"},n("div",{class:"ds-choice-list"},i.map(((s,t)=>n("div",{key:t,class:{"menu-section":true,"menu-section--divided":t<i.length-1,"menu-section--gradient-picker":g(s),"ds-choice-section":true,"ds-choice-section--divided":t<i.length-1},role:s.header?"group":undefined,"aria-label":s.header},s.header&&n("ds-text",{class:"section-header ds-choice-section__header ds-control--md",as:"span",variant:"text-body-small",emphasis:true,color:"primary","aria-hidden":"true"},s.header),g(s)?n("ds-shell-gradient-picker",{value:s.value,onDsChange:i=>{i.stopPropagation();this.handleGradientSelect(i.detail)}}):s.items.map((i=>{const s=e++;const t=this.focusedIndex===s;return n("button",{key:s,type:"button",class:{"menu-item":true,"ds-choice-item":true,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-focus-ring--visible":t&&this.focusRingVisible,"ds-interaction-fill":!i.isInactive,"ds-interaction-fill--selected":!!i.isSelected&&!i.isInactive,"menu-item--selected":!!i.isSelected,"ds-control-inactive":!!i.isInactive,"menu-item--destructive":!!i.isDestructive,"menu-item--focused":t},role:this.hasCompositeSections?undefined:i.showSwitch?"menuitemcheckbox":"menuitem","aria-checked":!this.hasCompositeSections&&i.showSwitch?String(!!i.switchValue):undefined,"aria-pressed":this.hasCompositeSections?String(i.showSwitch?!!i.switchValue:!!i.isSelected):undefined,"aria-current":!this.hasCompositeSections&&!i.showSwitch&&i.isSelected?"true":undefined,disabled:i.isInactive,tabIndex:this.hasCompositeSections?0:t?0:-1,onMouseDown:()=>{this.focusRingVisible=false},onClick:()=>this.handleItemClick(i),onFocus:()=>{this.focusedIndex=s}},n("div",{class:"menu-item__content ds-choice-item__content ds-interaction-fill__content"},n("ds-text",{class:"menu-item__label ds-choice-item__label",as:"span",variant:"text-body-medium",color:i.isSelected?"primary":"secondary"},i.label),i.subtext&&n("ds-text",{class:"menu-item__subtext ds-choice-item__subtext",as:"span",variant:"text-body-small",color:"secondary"},i.subtext)),i.dot&&n("span",{class:"menu-item__dot-box ds-interaction-fill__content","aria-hidden":"true"},n("ds-badge",{class:"menu-item__dot",variant:"dot",hasRing:false,label:""})),i.showSwitch&&n("ds-switch",{class:"menu-item__switch ds-interaction-fill__content",size:"md",checked:!!i.switchValue,presentation:true}))}))))))))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}],anchor:[{onAnchorChange:0}],anchorId:[{onAnchorChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}}static get style(){return b()}},[2,"ds-menu",{open:[1028],items:[16],sections:[16],side:[1],align:[1],sideOffset:[8,"side-offset"],alignOffset:[8,"align-offset"],menuWidth:[1,"menu-width"],minWidth:[1,"min-width"],anchor:[16],anchorId:[1,"anchor-id"],initialFocusVisible:[4,"initial-focus-visible"],menuLabel:[1,"menu-label"],shouldRender:[32],closing:[32],pos:[32],focusedIndex:[32],positionReady:[32],focusRingVisible:[32]},[[0,"keydown","handleKeyDown"]],{open:[{onOpenChange:0}],anchor:[{onAnchorChange:0}],anchorId:[{onAnchorChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}]);function _(){if(typeof customElements==="undefined"){return}const i=["ds-menu","ds-badge","ds-shell-gradient-picker","ds-shell-gradient-swatch","ds-switch","ds-text"];i.forEach((i=>{switch(i){case"ds-menu":if(!customElements.get(o(i))){customElements.define(o(i),y)}break;case"ds-badge":if(!customElements.get(o(i))){c()}break;case"ds-shell-gradient-picker":if(!customElements.get(o(i))){a()}break;case"ds-shell-gradient-swatch":if(!customElements.get(o(i))){d()}break;case"ds-switch":if(!customElements.get(o(i))){l()}break;case"ds-text":if(!customElements.get(o(i))){u()}break}}))}_();export{y as M,_ as d};
-//# sourceMappingURL=p-CSTr2132.js.map

package/dist/components/p-CSTr2132.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["computeMenuPosition","computeAnchoredPopupPosition","isMenuGradientPickerSection","section","variant","menuCss","POSITION_RETRY_BUDGET","MENU_FOCUSABLE_SELECTOR","join","Menu","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","items","sections","side","align","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","initialFocusVisible","menuLabel","shouldRender","closing","pos","x","y","focusedIndex","positionReady","focusRingVisible","clickOutsideHandler","scrollResizeHandler","closeTimer","itemEls","positionRetryRaf","listenersReady","componentDidLoad","onOpenChange","disconnectedCallback","cancelPositionRetry","teardownListeners","isOpen","setupListeners","schedulePositionUpdate","focusInitialItem","closeAnimationMs","finishClose","setTimeout","onAnchorChange","onPositionPropsChange","viewportPadPx","resolveCssLengthPx","TOKEN_DEFAULTS","sideOffsetPx","alignOffsetPx","popupFallbackWidthPx","menuWidthXs","popupFallbackHeightPx","menuFallbackHeight","resolveMotionTimeMs","motionShort2","animationDurationShort3","resolvedAnchor","anchor","anchorId","document","getElementById","anchorFocusTarget","matches","querySelector","focusAnchor","setFocus","focus","moveFocusAfterTab","backwards","candidates","Array","from","querySelectorAll","filter","element","closest","getClientRects","length","index","indexOf","compositeTabLeavesPopup","event","popup","el","focusables","currentIndex","target","shiftKey","activeSections","flatItems","flatMap","hasCompositeSections","some","cancelAnimationFrame","onReady","remaining","attempt","calculatePosition","requestAnimationFrame","anchorEl","anchorRect","getBoundingClientRect","popupWidth","offsetWidth","popupHeight","offsetHeight","viewportWidth","window","innerWidth","viewportHeight","innerHeight","flat","selectedIdx","findIndex","it","isSelected","isInactive","firstEnabledIdx","btns","e","t","contains","close","addEventListener","removeEventListener","clearTimeout","restoreFocus","dsClose","emit","handleKeyDown","key","preventDefault","enabled","map","i","cur","safe","stopPropagation","focusItem","idx","handleItemClick","item","dsSelect","handleGradientSelect","preset","dsGradientSelect","render","h","Host","style","display","flatIdx","popupStyle","position","left","top","transform","Math","round","zIndex","visibility","menuWidth","minWidth","class","role","undefined","si","header","as","emphasis","color","value","onDsChange","detail","isFocused","type","isDestructive","showSwitch","String","switchValue","disabled","tabIndex","onMouseDown","onClick","onFocus","label","subtext","dot","hasRing","size","checked","presentation"],"sources":["src/wc/components/Menu/menu-position.ts","src/wc/components/Menu/menu-types.ts","src/wc/components/Menu/Menu.css?tag=ds-menu&encapsulation=scoped","src/wc/components/Menu/Menu.tsx"],"sourcesContent":["import {\n  computeAnchoredPopupPosition,\n  type AnchoredPopupAlign,\n  type AnchoredPopupPositionInput,\n  type AnchoredPopupSide,\n} from '../../utils/anchored-popup';\n\nexport type MenuSide = AnchoredPopupSide;\nexport type MenuAlign = AnchoredPopupAlign;\nexport type MenuPositionInput = AnchoredPopupPositionInput;\n\n/** Backward-compatible menu alias for the shared anchored-popup layout math. */\nexport const computeMenuPosition = computeAnchoredPopupPosition;\n","import type { ShellGradientPreset } from '../../shell/shell-gradient-presets';\n\nexport type { MenuAlign, MenuSide } from './menu-position';\nexport {\n  PANEL_NAV_USER_MENU_PLACEMENT,\n  type MenuPlacement,\n} from './menu-placement';\n\nexport interface MenuItemData {\n  label: string;\n  value?: string;\n  subtext?: string;\n  /** Show a supplemental brand notification dot. */\n  dot?: boolean;\n  isSelected?: boolean;\n  isInactive?: boolean;\n  isDestructive?: boolean;\n  /** Render a compact switch indicator; the menu row owns interaction. */\n  showSwitch?: boolean;\n  switchValue?: boolean;\n}\n\nexport interface MenuItemsSection {\n  header?: string;\n  items: MenuItemData[];\n}\n\nexport interface MenuGradientPickerSection {\n  header?: string;\n  variant: 'gradient-picker';\n  value: ShellGradientPreset;\n}\n\nexport type MenuSection = MenuItemsSection | MenuGradientPickerSection;\n\nexport function isMenuGradientPickerSection(\n  section: MenuSection,\n): section is MenuGradientPickerSection {\n  return 'variant' in section && section.variant === 'gradient-picker';\n}\n\nexport type { ShellGradientPreset };\n","@import '../../utils/choice-list.css';\n\n/* Inactive: `.ds-control-inactive` (25% opacity). */\n\n.menu-item--destructive .menu-item__label {\n  /* Beat ds-text color-* host classes for destructive rows. */\n  color: var(--color-foreground-bold-negative) !important;\n}\n\n/* Standard md icon zone keeps the dot aligned with other control suffixes. */\n.menu-item__dot-box {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--ds-control-icon, var(--dimension-iconography-md));\n  height: var(--ds-control-icon, var(--dimension-iconography-md));\n  pointer-events: none;\n}\n\n/* ── Switch suffix ───────────────────────────────────────────────────────── */\n\n.menu-item__switch {\n  flex-shrink: 0;\n}\n","import { Component, Prop, State, Event, EventEmitter, Element, Watch, Listen, h, Host } from '@stencil/core';\nimport { resolveCssLengthPx, resolveMotionTimeMs, TOKEN_CSS_LENGTHS, TOKEN_DEFAULTS } from '../../utils';\nimport { computeMenuPosition, type MenuAlign, type MenuSide } from './menu-position';\nimport type { MenuItemData, MenuSection } from './menu-types';\nimport { isMenuGradientPickerSection } from './menu-types';\nimport type { ShellGradientPreset } from '../../shell/shell-gradient-presets';\n\n/** rAF retries while the popup mounts or the anchor resolves. */\nconst POSITION_RETRY_BUDGET = 8;\nconst MENU_FOCUSABLE_SELECTOR = [\n  'a[href]',\n  'button:not([disabled])',\n  'input:not([disabled]):not([type=\"hidden\"])',\n  'select:not([disabled])',\n  'textarea:not([disabled])',\n  '[tabindex]:not([tabindex=\"-1\"])',\n].join(',');\n\n@Component({\n  tag: 'ds-menu',\n  styleUrl: 'Menu.css',\n  scoped: true,\n})\nexport class Menu {\n  @Element() el!: HTMLElement;\n\n  @Prop({ mutable: true }) open: boolean = false;\n  @Prop() items: MenuItemData[] = [];\n  @Prop() sections: MenuSection[] = [];\n  @Prop() side: MenuSide = 'bottom';\n  @Prop() align: MenuAlign = 'start';\n  /** Gap between anchor and menu — number (px) or TokoMo length (`var(--dimension-space-050)`, etc.). */\n  @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n  /** Cross-axis offset — number (px) or TokoMo length. */\n  @Prop() alignOffset: number | string = 0;\n  @Prop() menuWidth: string | undefined;\n  @Prop() minWidth: string | undefined;\n  /** External trigger element to position against. Set via JS: menuEl.anchor = buttonEl */\n  @Prop() anchor: HTMLElement | undefined;\n  /** ID of the external trigger element for positioning */\n  @Prop() anchorId: string | undefined;\n  /** Show a visible ring on the initially focused menu item. Use only when the opener was keyboard-driven. */\n  @Prop() initialFocusVisible: boolean = false;\n  /** Accessible name for the popup menu. */\n  @Prop() menuLabel: string = 'Menu';\n\n  @State() private shouldRender: boolean = false;\n  @State() private closing: boolean = false;\n  @State() private pos: { x: number; y: number } = { x: 0, y: 0 };\n  @State() private focusedIndex: number = 0;\n  @State() private positionReady: boolean = false;\n  @State() private focusRingVisible: boolean = false;\n\n  @Event() dsClose!: EventEmitter<void>;\n  @Event() dsSelect!: EventEmitter<MenuItemData>;\n  /** Emitted when a `gradient-picker` section swatch is chosen. */\n  @Event() dsGradientSelect!: EventEmitter<ShellGradientPreset>;\n\n  private clickOutsideHandler: ((e: MouseEvent) => void) | null = null;\n  private scrollResizeHandler: (() => void) | null = null;\n  private closeTimer: ReturnType<typeof setTimeout> | null = null;\n  private itemEls: HTMLElement[] = [];\n  private positionRetryRaf: number | null = null;\n  private listenersReady = false;\n\n  componentDidLoad() {\n    if (this.open) this.onOpenChange(true);\n  }\n\n  disconnectedCallback() {\n    this.cancelPositionRetry();\n    this.teardownListeners();\n  }\n\n  @Watch('open')\n  onOpenChange(isOpen: boolean) {\n    if (isOpen) {\n      this.teardownListeners();\n      this.shouldRender = true;\n      this.closing = false;\n      this.positionReady = false;\n      this.listenersReady = false;\n      this.focusRingVisible = this.initialFocusVisible;\n      this.listenersReady = true;\n      this.setupListeners();\n      this.schedulePositionUpdate(() => {\n        this.focusInitialItem();\n      });\n    } else if (this.shouldRender) {\n      this.cancelPositionRetry();\n      this.closing = true;\n      this.teardownListeners();\n      this.listenersReady = false;\n      const closeAnimationMs = this.closeAnimationMs;\n      if (closeAnimationMs <= 0) {\n        this.finishClose();\n        return;\n      }\n      this.closeTimer = setTimeout(() => {\n        this.closeTimer = null;\n        this.finishClose();\n      }, closeAnimationMs);\n    }\n  }\n\n  @Watch('anchor')\n  @Watch('anchorId')\n  onAnchorChange() {\n    if (this.open) this.schedulePositionUpdate();\n  }\n\n  @Watch('side')\n  @Watch('align')\n  @Watch('sideOffset')\n  @Watch('alignOffset')\n  onPositionPropsChange() {\n    if (this.open) this.schedulePositionUpdate();\n  }\n\n  private get viewportPadPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n  }\n\n  private get sideOffsetPx(): number {\n    return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n  }\n\n  private get alignOffsetPx(): number {\n    return resolveCssLengthPx(this.alignOffset, 0);\n  }\n\n  private get popupFallbackWidthPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuWidthXs, TOKEN_DEFAULTS.menuWidthXs);\n  }\n\n  private get popupFallbackHeightPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuFallbackHeight, TOKEN_DEFAULTS.menuFallbackHeight);\n  }\n\n  private get closeAnimationMs(): number {\n    return resolveMotionTimeMs(TOKEN_DEFAULTS.motionShort2, TOKEN_DEFAULTS.animationDurationShort3);\n  }\n\n  private finishClose() {\n    this.shouldRender = false;\n    this.closing = false;\n  }\n\n  private get resolvedAnchor(): HTMLElement | null {\n    if (this.anchor) return this.anchor;\n    if (this.anchorId) return document.getElementById(this.anchorId);\n    return null;\n  }\n\n  private get anchorFocusTarget(): HTMLElement | null {\n    const anchor = this.resolvedAnchor;\n    if (!anchor) return null;\n    if (anchor.matches(MENU_FOCUSABLE_SELECTOR)) return anchor;\n    return anchor.querySelector<HTMLElement>(MENU_FOCUSABLE_SELECTOR) ?? anchor;\n  }\n\n  private focusAnchor() {\n    const anchor = this.resolvedAnchor as (HTMLElement & { setFocus?: () => Promise<void> | void }) | null;\n    if (anchor?.setFocus) {\n      anchor.setFocus();\n      return;\n    }\n    this.anchorFocusTarget?.focus();\n  }\n\n  private moveFocusAfterTab(backwards: boolean) {\n    const anchor = this.anchorFocusTarget;\n    if (!anchor) return;\n    if (backwards) {\n      anchor.focus();\n      return;\n    }\n\n    const candidates = Array.from(document.querySelectorAll<HTMLElement>(MENU_FOCUSABLE_SELECTOR))\n      .filter(element => (\n        !element.closest('.menu-popup') &&\n        !element.closest('[inert]') &&\n        element.getClientRects().length > 0\n      ));\n    const index = candidates.indexOf(anchor);\n    (candidates[index + 1] ?? anchor).focus();\n  }\n\n  private compositeTabLeavesPopup(event: KeyboardEvent): boolean {\n    const popup = this.el.querySelector<HTMLElement>('.menu-popup');\n    if (!popup) return true;\n    const focusables = Array.from(popup.querySelectorAll<HTMLElement>(MENU_FOCUSABLE_SELECTOR))\n      .filter(element => element.getClientRects().length > 0);\n    const currentIndex = focusables.indexOf(event.target as HTMLElement);\n    if (currentIndex < 0) return true;\n    return event.shiftKey ? currentIndex === 0 : currentIndex === focusables.length - 1;\n  }\n\n  private get activeSections(): MenuSection[] {\n    if (this.sections.length > 0) return this.sections;\n    if (this.items.length > 0) return [{ items: this.items }];\n    return [];\n  }\n\n  private get flatItems(): MenuItemData[] {\n    return this.activeSections.flatMap(section =>\n      isMenuGradientPickerSection(section) ? [] : section.items,\n    );\n  }\n\n  /** Rich preference content is a non-modal dialog, not an ARIA action menu. */\n  private get hasCompositeSections(): boolean {\n    return this.activeSections.some(isMenuGradientPickerSection);\n  }\n\n  private cancelPositionRetry() {\n    if (this.positionRetryRaf !== null) {\n      cancelAnimationFrame(this.positionRetryRaf);\n      this.positionRetryRaf = null;\n    }\n  }\n\n  /** Retry until anchor + popup exist — do not reveal at 0,0 on a failed first pass. */\n  private schedulePositionUpdate(onReady?: () => void) {\n    if (!this.open) return;\n\n    this.cancelPositionRetry();\n    this.positionReady = false;\n\n    let remaining = POSITION_RETRY_BUDGET;\n\n    const attempt = () => {\n      this.positionRetryRaf = null;\n      if (!this.open) return;\n\n      if (this.calculatePosition()) {\n        this.positionReady = true;\n        onReady?.();\n        return;\n      }\n\n      if (remaining > 0) {\n        remaining -= 1;\n        this.positionRetryRaf = requestAnimationFrame(attempt);\n      }\n    };\n\n    this.positionRetryRaf = requestAnimationFrame(attempt);\n  }\n\n  /** @returns `true` when anchor and popup were found and `pos` was updated. */\n  private calculatePosition(): boolean {\n    const anchorEl = this.resolvedAnchor;\n    if (!anchorEl) return false;\n    const popup = this.el.querySelector('.menu-popup') as HTMLElement | null;\n    if (!popup) return false;\n\n    this.pos = computeMenuPosition({\n      anchorRect: anchorEl.getBoundingClientRect(),\n      popupWidth: popup.offsetWidth || this.popupFallbackWidthPx,\n      popupHeight: popup.offsetHeight || this.popupFallbackHeightPx,\n      side: this.side,\n      align: this.align,\n      sideOffsetPx: this.sideOffsetPx,\n      alignOffsetPx: this.alignOffsetPx,\n      viewportPadPx: this.viewportPadPx,\n      viewportWidth: window.innerWidth,\n      viewportHeight: window.innerHeight,\n    });\n    return true;\n  }\n\n  /** Focus the selected item when present, otherwise the first enabled item. */\n  private focusInitialItem() {\n    if (this.hasCompositeSections) {\n      requestAnimationFrame(() => {\n        this.el.querySelector<HTMLElement>('.menu-popup [tabindex=\"0\"]')?.focus();\n      });\n      return;\n    }\n\n    const flat = this.flatItems;\n    const selectedIdx = flat.findIndex(it => it.isSelected && !it.isInactive);\n    const firstEnabledIdx = flat.findIndex(it => !it.isInactive);\n    this.focusedIndex = selectedIdx >= 0\n      ? selectedIdx\n      : (firstEnabledIdx >= 0 ? firstEnabledIdx : 0);\n\n    requestAnimationFrame(() => {\n      const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n      btns[this.focusedIndex]?.focus();\n    });\n  }\n\n  private setupListeners() {\n    this.clickOutsideHandler = (e: MouseEvent) => {\n      const t = e.target as Node;\n      const popup = this.el.querySelector('.menu-popup');\n      const anchorEl = this.resolvedAnchor;\n      if (popup?.contains(t) || anchorEl?.contains(t)) return;\n      this.close();\n    };\n\n    this.scrollResizeHandler = () => {\n      if (this.shouldRender && !this.closing) this.calculatePosition();\n    };\n\n    document.addEventListener('mousedown', this.clickOutsideHandler, true);\n    window.addEventListener('scroll', this.scrollResizeHandler, true);\n    window.addEventListener('resize', this.scrollResizeHandler);\n  }\n\n  private teardownListeners() {\n    if (this.clickOutsideHandler) {\n      document.removeEventListener('mousedown', this.clickOutsideHandler, true);\n      this.clickOutsideHandler = null;\n    }\n    if (this.scrollResizeHandler) {\n      window.removeEventListener('scroll', this.scrollResizeHandler, true);\n      window.removeEventListener('resize', this.scrollResizeHandler);\n      this.scrollResizeHandler = null;\n    }\n    if (this.closeTimer) {\n      clearTimeout(this.closeTimer);\n      this.closeTimer = null;\n    }\n  }\n\n  private close(restoreFocus = true) {\n    if (restoreFocus) this.focusAnchor();\n    this.dsClose.emit();\n    this.open = false;\n    this.onOpenChange(false);\n  }\n\n  @Listen('keydown')\n  handleKeyDown(e: KeyboardEvent) {\n    if (!this.shouldRender || this.closing) return;\n\n    if (e.key === 'Escape') {\n      e.preventDefault();\n      this.close();\n      return;\n    }\n\n    if (e.key === 'Tab') {\n      if (this.hasCompositeSections && !this.compositeTabLeavesPopup(e)) return;\n      e.preventDefault();\n      this.close(false);\n      this.moveFocusAfterTab(e.shiftKey);\n      return;\n    }\n\n    if (this.hasCompositeSections) return;\n\n    const flat = this.flatItems;\n    const enabled = flat.map((it, i) => ({ it, i })).filter(({ it }) => !it.isInactive).map(({ i }) => i);\n    if (!enabled.length) return;\n\n    const cur = enabled.indexOf(this.focusedIndex);\n    const safe = cur < 0 ? 0 : cur;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault(); e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[(safe + 1) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'ArrowUp':\n        e.preventDefault(); e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[(safe - 1 + enabled.length) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'Home':\n        e.preventDefault(); e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[0];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'End':\n        e.preventDefault(); e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[enabled.length - 1];\n        this.focusItem(this.focusedIndex);\n        break;\n    }\n  }\n\n  private focusItem(idx: number) {\n    const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n    btns[idx]?.focus();\n  }\n\n  private handleItemClick(item: MenuItemData) {\n    if (item.isInactive) return;\n    this.dsSelect.emit(item);\n  }\n\n  private handleGradientSelect(preset: ShellGradientPreset) {\n    this.dsGradientSelect.emit(preset);\n  }\n\n  render() {\n    if (!this.shouldRender) return <Host style={{ display: 'contents' }} />;\n\n    const sections = this.activeSections;\n    let flatIdx = 0;\n\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    if (this.menuWidth) popupStyle['width'] = this.menuWidth;\n    if (this.minWidth) popupStyle['min-width'] = this.minWidth;\n\n    return (\n      <Host style={{ display: 'contents' }}>\n        <div\n          class={{\n            'menu-popup': true,\n            'menu-popup--closing': this.closing,\n            'ds-choice-popup': true,\n            'ds-choice-popup--closing': this.closing,\n          }}\n          style={popupStyle}\n          role={this.hasCompositeSections ? 'dialog' : 'menu'}\n          aria-label={this.menuLabel}\n          aria-orientation={this.hasCompositeSections ? undefined : 'vertical'}\n        >\n          <div class=\"ds-choice-list\">\n          {sections.map((section, si) => (\n            <div\n              key={si}\n              class={{\n                'menu-section': true,\n                'menu-section--divided': si < sections.length - 1,\n                'menu-section--gradient-picker': isMenuGradientPickerSection(section),\n                'ds-choice-section': true,\n                'ds-choice-section--divided': si < sections.length - 1,\n              }}\n              role={section.header ? 'group' : undefined}\n              aria-label={section.header}\n            >\n              {section.header && (\n                <ds-text\n                  class=\"section-header ds-choice-section__header ds-control--md\"\n                  as=\"span\"\n                  variant=\"text-body-small\"\n                  emphasis\n                  color=\"primary\"\n                  aria-hidden=\"true\"\n                >\n                  {section.header}\n                </ds-text>\n              )}\n              {isMenuGradientPickerSection(section) ? (\n                <ds-shell-gradient-picker\n                  value={section.value}\n                  onDsChange={(e: CustomEvent<ShellGradientPreset>) => {\n                    e.stopPropagation();\n                    this.handleGradientSelect(e.detail);\n                  }}\n                />\n              ) : (\n                section.items.map(item => {\n                const idx = flatIdx++;\n                const isFocused = this.focusedIndex === idx;\n                return (\n                  <button\n                    key={idx}\n                    type=\"button\"\n                    class={{\n                      'menu-item': true,\n                      'ds-choice-item': true,\n                      'ds-control--md': true,\n                      'ds-focus-ring-inset': true,\n                      'ds-focus-ring--visible': isFocused && this.focusRingVisible,\n                      'ds-interaction-fill': !item.isInactive,\n                      'ds-interaction-fill--selected': !!item.isSelected && !item.isInactive,\n                      'menu-item--selected': !!item.isSelected,\n                      'ds-control-inactive': !!item.isInactive,\n                      'menu-item--destructive': !!item.isDestructive,\n                      'menu-item--focused': isFocused,\n                    }}\n                    role={this.hasCompositeSections ? undefined : item.showSwitch ? 'menuitemcheckbox' : 'menuitem'}\n                    aria-checked={!this.hasCompositeSections && item.showSwitch ? String(!!item.switchValue) : undefined}\n                    aria-pressed={this.hasCompositeSections\n                      ? String(item.showSwitch ? !!item.switchValue : !!item.isSelected)\n                      : undefined}\n                    aria-current={!this.hasCompositeSections && !item.showSwitch && item.isSelected ? 'true' : undefined}\n                    disabled={item.isInactive}\n                    tabIndex={this.hasCompositeSections ? 0 : isFocused ? 0 : -1}\n                    onMouseDown={() => { this.focusRingVisible = false; }}\n                    onClick={() => this.handleItemClick(item)}\n                    onFocus={() => { this.focusedIndex = idx; }}\n                  >\n                    <div class=\"menu-item__content ds-choice-item__content ds-interaction-fill__content\">\n                      <ds-text\n                        class=\"menu-item__label ds-choice-item__label\"\n                        as=\"span\"\n                        variant=\"text-body-medium\"\n                        color={item.isSelected ? 'primary' : 'secondary'}\n                      >\n                        {item.label}\n                      </ds-text>\n                      {item.subtext && (\n                        <ds-text class=\"menu-item__subtext ds-choice-item__subtext\" as=\"span\" variant=\"text-body-small\" color=\"secondary\">\n                          {item.subtext}\n                        </ds-text>\n                      )}\n                    </div>\n                    {item.dot && (\n                      <span class=\"menu-item__dot-box ds-interaction-fill__content\" aria-hidden=\"true\">\n                        <ds-badge\n                          class=\"menu-item__dot\"\n                          variant=\"dot\"\n                          hasRing={false}\n                          label=\"\"\n                        />\n                      </span>\n                    )}\n                    {item.showSwitch && (\n                      <ds-switch\n                        class=\"menu-item__switch ds-interaction-fill__content\"\n                        size=\"md\"\n                        checked={!!item.switchValue}\n                        presentation\n                      />\n                    )}\n                  </button>\n                );\n              }))}\n            </div>\n          ))}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/p-C_cu-HIT.js

@@ -1,2 +0,0 @@
-function t(t){const{anchorRect:e,popupWidth:a,popupHeight:r,side:s,align:i,sideOffsetPx:o,alignOffsetPx:h,viewportPadPx:n,viewportWidth:p,viewportHeight:c}=t;let d=0;let f=0;switch(s){case"top":f=e.top-r-o;d=i==="start"?e.left+h:i==="end"?e.right-a+h:e.left+e.width/2-a/2+h;break;case"bottom":f=e.bottom+o;d=i==="start"?e.left+h:i==="end"?e.right-a+h:e.left+e.width/2-a/2+h;break;case"left":d=e.left-a-o;f=i==="start"?e.top+h:i==="end"?e.bottom-r+h:e.top+e.height/2-r/2+h;break;case"right":d=e.right+o;f=i==="start"?e.top+h:i==="end"?e.bottom-r+h:e.top+e.height/2-r/2+h;break}return{x:Math.min(Math.max(d,n),p-a-n),y:Math.min(Math.max(f,n),c-r-n)}}export{t as c};
-//# sourceMappingURL=p-C_cu-HIT.js.map

package/dist/components/p-C_cu-HIT.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["computeAnchoredPopupPosition","input","anchorRect","anchor","popupWidth","popupHeight","side","align","sideOffsetPx","alignOffsetPx","viewportPadPx","viewportWidth","viewportHeight","x","y","top","left","right","width","bottom","height","Math","min","max"],"sources":["src/wc/utils/anchored-popup.ts"],"sourcesContent":["export type AnchoredPopupSide = 'top' | 'right' | 'bottom' | 'left';\nexport type AnchoredPopupAlign = 'start' | 'center' | 'end';\n\nexport interface AnchoredPopupPositionInput {\n  anchorRect: Pick<DOMRectReadOnly, 'top' | 'left' | 'right' | 'bottom' | 'width' | 'height'>;\n  popupWidth: number;\n  popupHeight: number;\n  side: AnchoredPopupSide;\n  align: AnchoredPopupAlign;\n  sideOffsetPx: number;\n  alignOffsetPx: number;\n  viewportPadPx: number;\n  viewportWidth: number;\n  viewportHeight: number;\n}\n\n/** Pure viewport-fixed anchored-popup layout math shared by menus and selects. */\nexport function computeAnchoredPopupPosition(\n  input: AnchoredPopupPositionInput,\n): { x: number; y: number } {\n  const {\n    anchorRect: anchor,\n    popupWidth,\n    popupHeight,\n    side,\n    align,\n    sideOffsetPx,\n    alignOffsetPx,\n    viewportPadPx,\n    viewportWidth,\n    viewportHeight,\n  } = input;\n\n  let x = 0;\n  let y = 0;\n\n  switch (side) {\n    case 'top':\n      y = anchor.top - popupHeight - sideOffsetPx;\n      x =\n        align === 'start'\n          ? anchor.left + alignOffsetPx\n          : align === 'end'\n            ? anchor.right - popupWidth + alignOffsetPx\n            : anchor.left + anchor.width / 2 - popupWidth / 2 + alignOffsetPx;\n      break;\n    case 'bottom':\n      y = anchor.bottom + sideOffsetPx;\n      x =\n        align === 'start'\n          ? anchor.left + alignOffsetPx\n          : align === 'end'\n            ? anchor.right - popupWidth + alignOffsetPx\n            : anchor.left + anchor.width / 2 - popupWidth / 2 + alignOffsetPx;\n      break;\n    case 'left':\n      x = anchor.left - popupWidth - sideOffsetPx;\n      y =\n        align === 'start'\n          ? anchor.top + alignOffsetPx\n          : align === 'end'\n            ? anchor.bottom - popupHeight + alignOffsetPx\n            : anchor.top + anchor.height / 2 - popupHeight / 2 + alignOffsetPx;\n      break;\n    case 'right':\n      x = anchor.right + sideOffsetPx;\n      y =\n        align === 'start'\n          ? anchor.top + alignOffsetPx\n          : align === 'end'\n            ? anchor.bottom - popupHeight + alignOffsetPx\n            : anchor.top + anchor.height / 2 - popupHeight / 2 + alignOffsetPx;\n      break;\n  }\n\n  return {\n    x: Math.min(Math.max(x, viewportPadPx), viewportWidth - popupWidth - viewportPadPx),\n    y: Math.min(Math.max(y, viewportPadPx), viewportHeight - popupHeight - viewportPadPx),\n  };\n}\n"],"mappings":"AAiBM,SAAUA,EACdC,GAEA,MACEC,WAAYC,EAAMC,WAClBA,EAAUC,YACVA,EAAWC,KACXA,EAAIC,MACJA,EAAKC,aACLA,EAAYC,cACZA,EAAaC,cACbA,EAAaC,cACbA,EAAaC,eACbA,GACEX,EAEJ,IAAIY,EAAI,EACR,IAAIC,EAAI,EAER,OAAQR,GACN,IAAK,MACHQ,EAAIX,EAAOY,IAAMV,EAAcG,EAC/BK,EACEN,IAAU,QACNJ,EAAOa,KAAOP,EACdF,IAAU,MACRJ,EAAOc,MAAQb,EAAaK,EAC5BN,EAAOa,KAAOb,EAAOe,MAAQ,EAAId,EAAa,EAAIK,EAC1D,MACF,IAAK,SACHK,EAAIX,EAAOgB,OAASX,EACpBK,EACEN,IAAU,QACNJ,EAAOa,KAAOP,EACdF,IAAU,MACRJ,EAAOc,MAAQb,EAAaK,EAC5BN,EAAOa,KAAOb,EAAOe,MAAQ,EAAId,EAAa,EAAIK,EAC1D,MACF,IAAK,OACHI,EAAIV,EAAOa,KAAOZ,EAAaI,EAC/BM,EACEP,IAAU,QACNJ,EAAOY,IAAMN,EACbF,IAAU,MACRJ,EAAOgB,OAASd,EAAcI,EAC9BN,EAAOY,IAAMZ,EAAOiB,OAAS,EAAIf,EAAc,EAAII,EAC3D,MACF,IAAK,QACHI,EAAIV,EAAOc,MAAQT,EACnBM,EACEP,IAAU,QACNJ,EAAOY,IAAMN,EACbF,IAAU,MACRJ,EAAOgB,OAASd,EAAcI,EAC9BN,EAAOY,IAAMZ,EAAOiB,OAAS,EAAIf,EAAc,EAAII,EAC3D,MAGJ,MAAO,CACLI,EAAGQ,KAAKC,IAAID,KAAKE,IAAIV,EAAGH,GAAgBC,EAAgBP,EAAaM,GACrEI,EAAGO,KAAKC,IAAID,KAAKE,IAAIT,EAAGJ,GAAgBE,EAAiBP,EAAcK,GAE3E,Q","ignoreList":[]}

package/dist/components/p-D0B9uDTP.js

@@ -1,2 +0,0 @@
-const o=["none","cool","neutral","warm","fresh"];const n=["cool","neutral","warm","fresh"];const r="neutral";const t={none:"None",cool:"Cool",neutral:"Neutral",warm:"Warm",fresh:"Fresh"};const c={cool:{opacity:.1,stops:[{color:"var(--color-background-transparent)",position:0},{color:"var(--color-color-intent-blue-strong-background)",position:100}]},neutral:{opacity:.1,stops:[{color:"var(--color-background-transparent)",position:0},{color:"var(--color-color-intent-grey-strong-background)",position:100}]},warm:{opacity:.1,stops:[{color:"var(--color-background-transparent)",position:0},{color:"var(--color-color-intent-yellow-strong-background)",position:100}]},fresh:{opacity:.4,stops:[{color:"var(--color-color-intent-cyan-faint-background)",position:0},{color:"var(--color-background-transparent)",position:47},{color:"var(--color-background-transparent)",position:58},{color:"var(--color-color-intent-red-faint-background)",position:83},{color:"var(--color-color-intent-pink-faint-background)",position:100}]}};const a="100% 100% at 0% 0%";function s(o){const n=e(o);return n==="none"?null:c[n]}function l(o){return String(s(o)?.opacity??0)}function i(n){return o.includes(n)}function e(o){return o!=null&&i(o)?o:r}function u(o){const n=e(o);if(n==="none")return"none";return p(c[n].stops)}function p(o){const n=o.map((o=>`${o.color} ${o.position}%`)).join(", ");return`radial-gradient(${a}, ${n})`}export{r as D,o as S,n as a,t as b,u as c,e as n,l as s};
-//# sourceMappingURL=p-D0B9uDTP.js.map

package/dist/components/p-D0B9uDTP.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["SHELL_GRADIENT_PRESETS","SHELL_GRADIENT_WASH_PRESETS","DEFAULT_SHELL_GRADIENT_PRESET","SHELL_GRADIENT_PRESET_LABELS","none","cool","neutral","warm","fresh","SHELL_GRADIENT_RECIPES","opacity","stops","color","position","GRADIENT_GEOMETRY","shellGradientPresetRecipe","preset","normalized","normalizeShellGradientPreset","shellGradientPresetOpacity","String","isShellGradientPreset","value","includes","buildShellRadialGradientForPreset","buildShellRadialGradientFromStops","serialized","map","stop","join"],"sources":["src/wc/shell/shell-gradient-presets.ts"],"sourcesContent":["/** Built-in shell chrome wash presets. */\nexport type ShellGradientPreset = 'none' | 'cool' | 'neutral' | 'warm' | 'fresh';\n\nexport const SHELL_GRADIENT_PRESETS: ShellGradientPreset[] = [\n  'none',\n  'cool',\n  'neutral',\n  'warm',\n  'fresh',\n];\n\n/** Wash presets shown after the `none` option in pickers. */\nexport const SHELL_GRADIENT_WASH_PRESETS: Exclude<ShellGradientPreset, 'none'>[] = [\n  'cool',\n  'neutral',\n  'warm',\n  'fresh',\n];\n\n/** Default wash when `gradient-preset` is omitted. */\nexport const DEFAULT_SHELL_GRADIENT_PRESET: ShellGradientPreset = 'neutral';\n\nexport const SHELL_GRADIENT_PRESET_LABELS: Record<ShellGradientPreset, string> = {\n  none: 'None',\n  cool: 'Cool',\n  neutral: 'Neutral',\n  warm: 'Warm',\n  fresh: 'Fresh',\n};\n\nexport interface ShellGradientStop {\n  color: string;\n  position: number;\n}\n\nexport interface ShellGradientRecipe {\n  opacity: number;\n  stops: readonly ShellGradientStop[];\n}\n\nconst SHELL_GRADIENT_RECIPES: Record<Exclude<ShellGradientPreset, 'none'>, ShellGradientRecipe> = {\n  cool: {\n    opacity: 0.1,\n    stops: [\n      { color: 'var(--color-background-transparent)', position: 0 },\n      { color: 'var(--color-color-intent-blue-strong-background)', position: 100 },\n    ],\n  },\n  neutral: {\n    opacity: 0.1,\n    stops: [\n      { color: 'var(--color-background-transparent)', position: 0 },\n      { color: 'var(--color-color-intent-grey-strong-background)', position: 100 },\n    ],\n  },\n  warm: {\n    opacity: 0.1,\n    stops: [\n      { color: 'var(--color-background-transparent)', position: 0 },\n      { color: 'var(--color-color-intent-yellow-strong-background)', position: 100 },\n    ],\n  },\n  fresh: {\n    opacity: 0.4,\n    stops: [\n      { color: 'var(--color-color-intent-cyan-faint-background)', position: 0 },\n      { color: 'var(--color-background-transparent)', position: 47 },\n      { color: 'var(--color-background-transparent)', position: 58 },\n      { color: 'var(--color-color-intent-red-faint-background)', position: 83 },\n      { color: 'var(--color-color-intent-pink-faint-background)', position: 100 },\n    ],\n  },\n};\n\nconst GRADIENT_GEOMETRY = '100% 100% at 0% 0%';\n\nexport function shellGradientPresetStopToken(preset: ShellGradientPreset): string | null {\n  if (preset === 'none') return null;\n  const stops = SHELL_GRADIENT_RECIPES[preset].stops;\n  return stops[stops.length - 1]?.color ?? null;\n}\n\nexport function shellGradientPresetRecipe(preset: ShellGradientPreset): ShellGradientRecipe | null {\n  const normalized = normalizeShellGradientPreset(preset);\n  return normalized === 'none' ? null : SHELL_GRADIENT_RECIPES[normalized];\n}\n\nexport function shellGradientPresetOpacity(preset: ShellGradientPreset): string {\n  return String(shellGradientPresetRecipe(preset)?.opacity ?? 0);\n}\n\nexport function isShellGradientPreset(value: string): value is ShellGradientPreset {\n  return (SHELL_GRADIENT_PRESETS as string[]).includes(value);\n}\n\n/**\n * Coerce unknown/absent presets to the default. Runtime values escape the\n * type: removing the reflected `gradient-preset` attribute (e.g. an Angular\n * `[attr.gradient-preset]=\"null\"` binding) drives the prop to null past its\n * field default — without normalization the stop lookup interpolates the\n * literal string \"undefined\" into CSS and the wash silently disappears.\n */\nexport function normalizeShellGradientPreset(\n  value: string | null | undefined,\n): ShellGradientPreset {\n  return value != null && isShellGradientPreset(value) ? value : DEFAULT_SHELL_GRADIENT_PRESET;\n}\n\n/** Radial wash for a preset — transparent at top-left into the intent stop. `none` returns no image. */\nexport function buildShellRadialGradientForPreset(preset: ShellGradientPreset): string {\n  const normalized = normalizeShellGradientPreset(preset);\n  if (normalized === 'none') return 'none';\n\n  return buildShellRadialGradientFromStops(SHELL_GRADIENT_RECIPES[normalized].stops);\n}\n\n/** Build the production shell geometry from an ordered set of design-time stops. */\nexport function buildShellRadialGradientFromStops(stops: readonly ShellGradientStop[]): string {\n  const serialized = stops.map(stop => `${stop.color} ${stop.position}%`).join(', ');\n  return `radial-gradient(${GRADIENT_GEOMETRY}, ${serialized})`;\n}\n"],"mappings":"AAGO,MAAMA,EAAgD,CAC3D,OACA,OACA,UACA,OACA,SAIK,MAAMC,EAAsE,CACjF,OACA,UACA,OACA,SAIK,MAAMC,EAAqD,UAE3D,MAAMC,EAAoE,CAC/EC,KAAM,OACNC,KAAM,OACNC,QAAS,UACTC,KAAM,OACNC,MAAO,SAaT,MAAMC,EAA4F,CAChGJ,KAAM,CACJK,QAAS,GACTC,MAAO,CACL,CAAEC,MAAO,sCAAuCC,SAAU,GAC1D,CAAED,MAAO,mDAAoDC,SAAU,OAG3EP,QAAS,CACPI,QAAS,GACTC,MAAO,CACL,CAAEC,MAAO,sCAAuCC,SAAU,GAC1D,CAAED,MAAO,mDAAoDC,SAAU,OAG3EN,KAAM,CACJG,QAAS,GACTC,MAAO,CACL,CAAEC,MAAO,sCAAuCC,SAAU,GAC1D,CAAED,MAAO,qDAAsDC,SAAU,OAG7EL,MAAO,CACLE,QAAS,GACTC,MAAO,CACL,CAAEC,MAAO,kDAAmDC,SAAU,GACtE,CAAED,MAAO,sCAAuCC,SAAU,IAC1D,CAAED,MAAO,sCAAuCC,SAAU,IAC1D,CAAED,MAAO,iDAAkDC,SAAU,IACrE,CAAED,MAAO,kDAAmDC,SAAU,QAK5E,MAAMC,EAAoB,qBAQpB,SAAUC,EAA0BC,GACxC,MAAMC,EAAaC,EAA6BF,GAChD,OAAOC,IAAe,OAAS,KAAOR,EAAuBQ,EAC/D,CAEM,SAAUE,EAA2BH,GACzC,OAAOI,OAAOL,EAA0BC,IAASN,SAAW,EAC9D,CAEM,SAAUW,EAAsBC,GACpC,OAAQtB,EAAoCuB,SAASD,EACvD,CASM,SAAUJ,EACdI,GAEA,OAAOA,GAAS,MAAQD,EAAsBC,GAASA,EAAQpB,CACjE,CAGM,SAAUsB,EAAkCR,GAChD,MAAMC,EAAaC,EAA6BF,GAChD,GAAIC,IAAe,OAAQ,MAAO,OAElC,OAAOQ,EAAkChB,EAAuBQ,GAAYN,MAC9E,CAGM,SAAUc,EAAkCd,GAChD,MAAMe,EAAaf,EAAMgB,KAAIC,GAAQ,GAAGA,EAAKhB,SAASgB,EAAKf,cAAagB,KAAK,MAC7E,MAAO,mBAAmBf,MAAsBY,IAClD,Q","ignoreList":[]}

package/dist/components/p-DhxWfdX0.js

@@ -1,2 +0,0 @@
-import{p as e,H as s,h as o,a as n,t as r}from"./index.js";const a=()=>`:host(.ds-control--md),.ds-control--md{--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-radius:var(--dimension-radius-025)}:host(.ds-control--sm),.ds-control--sm{--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-radius:var(--dimension-radius-025)}:host(.ds-control--xs),.ds-control--xs{--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-radius:var(--dimension-radius-025)}@keyframes ds-shimmer-text-motion{0%{background-position:100% 0}76.923%{background-position:0 0}100%{background-position:0 0}}@keyframes ds-shimmer-surface-motion{0%{background-position:100% 0}76.923%{background-position:0 0}100%{background-position:0 0}}.ds-shimmer-text{--ds-shimmer-base:currentColor;--ds-shimmer-duration:var(--effect-animation-duration-long-2);--ds-shimmer-repeat-delay:var(--effect-animation-delay-short-3);--ds-shimmer-cycle-duration:calc(     var(--ds-shimmer-duration) + var(--ds-shimmer-repeat-delay)   );--ds-shimmer-easing:var(--effect-animation-easing-linear);--ds-shimmer-spread:var(--dimension-size-500);--ds-shimmer-travel:calc(     var(--dimension-size-800) + var(--dimension-size-500) + var(--dimension-size-200)   );background-color:var(--ds-shimmer-base);background-image:linear-gradient(     330deg,     transparent calc(50% - var(--ds-shimmer-spread)),     var(--ds-shimmer, var(--color-shimmer-shimmer)) 50%,     transparent calc(50% + var(--ds-shimmer-spread))   );background-repeat:no-repeat;background-position:100% 0;background-size:calc(     200% + var(--ds-shimmer-spread) * 2 + var(--ds-shimmer-travel) * 2   ) 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:ds-shimmer-text-motion var(--ds-shimmer-cycle-duration) var(--ds-shimmer-easing) infinite}.ds-shimmer-surface{--ds-shimmer-surface-base:var(--color-foreground-quaternary);--ds-shimmer-duration:var(--effect-animation-duration-long-2);--ds-shimmer-repeat-delay:var(--effect-animation-delay-short-3);--ds-shimmer-cycle-duration:calc(     var(--ds-shimmer-duration) + var(--ds-shimmer-repeat-delay)   );--ds-shimmer-easing:var(--effect-animation-easing-linear);--ds-shimmer-spread:var(--dimension-size-500);--ds-shimmer-travel:calc(     var(--dimension-size-800) + var(--dimension-size-500) + var(--dimension-size-200)   );position:relative;overflow:hidden;background-color:var(--ds-shimmer-surface-base)}.ds-shimmer-surface::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(     330deg,     transparent calc(50% - var(--ds-shimmer-spread)),     var(--ds-shimmer, var(--color-shimmer-shimmer)) 50%,     transparent calc(50% + var(--ds-shimmer-spread))   );background-repeat:no-repeat;background-position:100% 0;background-size:calc(     200% + var(--ds-shimmer-spread) * 2 + var(--ds-shimmer-travel) * 2   ) 100%;animation:ds-shimmer-surface-motion var(--ds-shimmer-cycle-duration) var(--ds-shimmer-easing) infinite}@media (prefers-reduced-motion: reduce){.ds-shimmer-text{animation:none;background-image:none;-webkit-text-fill-color:currentColor}.ds-shimmer-surface::after{display:none;animation:none}}:host{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;vertical-align:middle;--ds-skeleton-base:var(--color-foreground-quaternary);--ds-shimmer:var(--color-shimmer-shimmer)}.skeleton__shape{--ds-shimmer-surface-base:var(--ds-skeleton-base);display:block;width:100%;height:100%;flex:0 0 auto;background-color:var(--ds-skeleton-base);border-radius:var(--dimension-radius-025)}:host(.skeleton--background-medium){--ds-skeleton-base:var(--color-foreground-on-medium-background-quaternary);--ds-shimmer:var(--color-shimmer-shimmer-on-medium-background)}:host(.skeleton--background-bold){--ds-skeleton-base:var(--color-foreground-on-bold-background-quaternary);--ds-shimmer:var(--color-shimmer-shimmer-on-bold-background)}:host(.skeleton--background-strong){--ds-skeleton-base:var(--color-foreground-on-strong-background-quaternary);--ds-shimmer:var(--color-shimmer-shimmer-on-strong-background)}:host(.skeleton--background-translucent){--ds-skeleton-base:var(--color-translucent-foreground-quaternary);--ds-shimmer:var(--color-translucent-shimmer)}:host(.skeleton--background-inverted){--ds-skeleton-base:var(--color-inverted-foreground-quaternary);--ds-shimmer:var(--color-inverted-shimmer)}:host(.skeleton--background-media){--ds-skeleton-base:var(--color-media-foreground-quaternary);--ds-shimmer:var(--color-media-shimmer)}:host(.skeleton--background-always-dark){--ds-skeleton-base:var(--color-always-dark-foreground-quaternary);--ds-shimmer:var(--color-always-dark-shimmer)}:host(.skeleton--background-navigation){--ds-skeleton-base:var(--color-navigation-foreground-quaternary);--ds-shimmer:var(--color-navigation-shimmer)}:host(.skeleton--text){width:100%;height:var(--ds-skeleton-canvas-size);padding-block:var(--dimension-space-025)}:host(.skeleton--text) .skeleton__shape{height:calc(var(--ds-skeleton-canvas-size) - var(--dimension-space-050))}:host(.skeleton--text-text-display-medium){--ds-skeleton-canvas-size:var(--typography-lineheight-3xl)}:host(.skeleton--text-text-display-small){--ds-skeleton-canvas-size:var(--typography-lineheight-2xl)}:host(.skeleton--text-text-title-large){--ds-skeleton-canvas-size:var(--typography-lineheight-xl)}:host(.skeleton--text-text-title-medium),:host(.skeleton--text-text-body-large){--ds-skeleton-canvas-size:var(--typography-lineheight-lg)}:host(.skeleton--text-text-title-small),:host(.skeleton--text-text-body-medium){--ds-skeleton-canvas-size:var(--typography-lineheight-md)}:host(.skeleton--text-text-body-small){--ds-skeleton-canvas-size:var(--typography-lineheight-sm)}:host(.skeleton--text-text-caption){--ds-skeleton-canvas-size:var(--typography-lineheight-xs)}:host(.skeleton--icon){width:var(--ds-skeleton-canvas-size);height:var(--ds-skeleton-canvas-size);padding:var(--dimension-space-025)}:host(.skeleton--icon) .skeleton__shape{width:calc(var(--ds-skeleton-canvas-size) - var(--dimension-space-050));height:calc(var(--ds-skeleton-canvas-size) - var(--dimension-space-050))}:host(.skeleton--icon.skeleton--rounded) .skeleton__shape{border-radius:var(--dimension-radius-half)}:host(.skeleton--icon-xs){--ds-skeleton-canvas-size:var(--dimension-iconography-xs)}:host(.skeleton--icon-sm){--ds-skeleton-canvas-size:var(--dimension-iconography-sm)}:host(.skeleton--icon-md){--ds-skeleton-canvas-size:var(--dimension-iconography-md)}:host(.skeleton--icon-lg){--ds-skeleton-canvas-size:var(--dimension-iconography-lg)}:host(.skeleton--icon-xl){--ds-skeleton-canvas-size:var(--dimension-iconography-xl)}:host(.skeleton--icon-2xl){--ds-skeleton-canvas-size:var(--dimension-iconography-2xl)}:host(.skeleton--icon-3xl){--ds-skeleton-canvas-size:var(--dimension-iconography-3xl)}:host(.skeleton--control){width:100%;height:var(--ds-control-height)}:host(.skeleton--control.skeleton--rounded) .skeleton__shape{border-radius:var(--dimension-radius-half)}`;const i=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.variant="text";this.textVariant="text-body-medium";this.iconSize="md";this.controlSize="md";this.rounded=false;this.shimmer=true}get widthCss(){const e=this.width;if(e==null)return undefined;return typeof e==="number"?`${e}px`:e}render(){return o(n,{key:"751a09271caa7986c0bcca15f7693f82ccc33355","aria-hidden":"true",class:{skeleton:true,[`skeleton--${this.variant}`]:true,[`skeleton--text-${this.textVariant}`]:this.variant==="text",[`skeleton--icon-${this.iconSize}`]:this.variant==="icon",[`ds-control--${this.controlSize}`]:this.variant==="control",[`skeleton--background-${this.background}`]:!!this.background,"skeleton--rounded":this.variant!=="text"&&this.rounded},style:this.variant==="icon"?undefined:{width:this.widthCss}},o("span",{key:"a2ae2eedc2a64c45506f67a261259505693fde7e",class:{skeleton__shape:true,"ds-shimmer-surface":this.shimmer}}))}static get style(){return a()}},[1,"ds-skeleton",{variant:[1],textVariant:[1,"text-variant"],iconSize:[1,"icon-size"],controlSize:[1,"control-size"],width:[8],rounded:[4],shimmer:[4],background:[1]}]);function t(){if(typeof customElements==="undefined"){return}const e=["ds-skeleton"];e.forEach((e=>{switch(e){case"ds-skeleton":if(!customElements.get(r(e))){customElements.define(r(e),i)}break}}))}t();export{i as S,t as d};
-//# sourceMappingURL=p-DhxWfdX0.js.map

package/dist/components/p-DhxWfdX0.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["skeletonCss","Skeleton","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","variant","textVariant","iconSize","controlSize","rounded","shimmer","widthCss","v","width","undefined","render","h","Host","key","class","skeleton","background","style","skeleton__shape"],"sources":["src/wc/components/Skeleton/Skeleton.css?tag=ds-skeleton&encapsulation=shadow","src/wc/components/Skeleton/Skeleton.tsx"],"sourcesContent":["@import '../../utils/control-density.css';\n@import '../../utils/shimmer.css';\n\n:host {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  min-width: 0;\n  vertical-align: middle;\n  --ds-skeleton-base: var(--color-foreground-quaternary);\n  --ds-shimmer: var(--color-shimmer-shimmer);\n}\n\n.skeleton__shape {\n  --ds-shimmer-surface-base: var(--ds-skeleton-base);\n\n  display: block;\n  width: 100%;\n  height: 100%;\n  flex: 0 0 auto;\n  background-color: var(--ds-skeleton-base);\n  border-radius: var(--dimension-radius-025);\n}\n\n/* ── Background context ────────────────────────────────────────────────── */\n\n:host(.skeleton--background-medium) {\n  --ds-skeleton-base: var(--color-foreground-on-medium-background-quaternary);\n  --ds-shimmer: var(--color-shimmer-shimmer-on-medium-background);\n}\n\n:host(.skeleton--background-bold) {\n  --ds-skeleton-base: var(--color-foreground-on-bold-background-quaternary);\n  --ds-shimmer: var(--color-shimmer-shimmer-on-bold-background);\n}\n\n:host(.skeleton--background-strong) {\n  --ds-skeleton-base: var(--color-foreground-on-strong-background-quaternary);\n  --ds-shimmer: var(--color-shimmer-shimmer-on-strong-background);\n}\n\n:host(.skeleton--background-translucent) {\n  --ds-skeleton-base: var(--color-translucent-foreground-quaternary);\n  --ds-shimmer: var(--color-translucent-shimmer);\n}\n\n:host(.skeleton--background-inverted) {\n  --ds-skeleton-base: var(--color-inverted-foreground-quaternary);\n  --ds-shimmer: var(--color-inverted-shimmer);\n}\n\n:host(.skeleton--background-media) {\n  --ds-skeleton-base: var(--color-media-foreground-quaternary);\n  --ds-shimmer: var(--color-media-shimmer);\n}\n\n:host(.skeleton--background-always-dark) {\n  --ds-skeleton-base: var(--color-always-dark-foreground-quaternary);\n  --ds-shimmer: var(--color-always-dark-shimmer);\n}\n\n:host(.skeleton--background-navigation) {\n  --ds-skeleton-base: var(--color-navigation-foreground-quaternary);\n  --ds-shimmer: var(--color-navigation-shimmer);\n}\n\n/* ── Text ──────────────────────────────────────────────────────────────── */\n\n:host(.skeleton--text) {\n  width: 100%;\n  height: var(--ds-skeleton-canvas-size);\n  padding-block: var(--dimension-space-025);\n}\n\n:host(.skeleton--text) .skeleton__shape {\n  height: calc(var(--ds-skeleton-canvas-size) - var(--dimension-space-050));\n}\n\n:host(.skeleton--text-text-display-medium) { --ds-skeleton-canvas-size: var(--typography-lineheight-3xl); }\n:host(.skeleton--text-text-display-small)  { --ds-skeleton-canvas-size: var(--typography-lineheight-2xl); }\n:host(.skeleton--text-text-title-large)    { --ds-skeleton-canvas-size: var(--typography-lineheight-xl); }\n:host(.skeleton--text-text-title-medium),\n:host(.skeleton--text-text-body-large)     { --ds-skeleton-canvas-size: var(--typography-lineheight-lg); }\n:host(.skeleton--text-text-title-small),\n:host(.skeleton--text-text-body-medium)    { --ds-skeleton-canvas-size: var(--typography-lineheight-md); }\n:host(.skeleton--text-text-body-small)     { --ds-skeleton-canvas-size: var(--typography-lineheight-sm); }\n:host(.skeleton--text-text-caption)        { --ds-skeleton-canvas-size: var(--typography-lineheight-xs); }\n\n/* ── Icon ──────────────────────────────────────────────────────────────── */\n\n:host(.skeleton--icon) {\n  width: var(--ds-skeleton-canvas-size);\n  height: var(--ds-skeleton-canvas-size);\n  padding: var(--dimension-space-025);\n}\n\n:host(.skeleton--icon) .skeleton__shape {\n  width: calc(var(--ds-skeleton-canvas-size) - var(--dimension-space-050));\n  height: calc(var(--ds-skeleton-canvas-size) - var(--dimension-space-050));\n}\n\n:host(.skeleton--icon.skeleton--rounded) .skeleton__shape {\n  border-radius: var(--dimension-radius-half);\n}\n\n:host(.skeleton--icon-xs)  { --ds-skeleton-canvas-size: var(--dimension-iconography-xs); }\n:host(.skeleton--icon-sm)  { --ds-skeleton-canvas-size: var(--dimension-iconography-sm); }\n:host(.skeleton--icon-md)  { --ds-skeleton-canvas-size: var(--dimension-iconography-md); }\n:host(.skeleton--icon-lg)  { --ds-skeleton-canvas-size: var(--dimension-iconography-lg); }\n:host(.skeleton--icon-xl)  { --ds-skeleton-canvas-size: var(--dimension-iconography-xl); }\n:host(.skeleton--icon-2xl) { --ds-skeleton-canvas-size: var(--dimension-iconography-2xl); }\n:host(.skeleton--icon-3xl) { --ds-skeleton-canvas-size: var(--dimension-iconography-3xl); }\n\n/* ── Control ───────────────────────────────────────────────────────────── */\n\n:host(.skeleton--control) {\n  width: 100%;\n  height: var(--ds-control-height);\n}\n\n:host(.skeleton--control.skeleton--rounded) .skeleton__shape {\n  border-radius: var(--dimension-radius-half);\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport type { IconSize } from '../Icon/Icon';\nimport type { TextVariant } from '../Text/text-types';\nimport type { ControlSize } from '../../utils/control-text';\n\nexport type SkeletonVariant = 'text' | 'icon' | 'control';\nexport type SkeletonBackground =\n  | 'faint'\n  | 'medium'\n  | 'bold'\n  | 'strong'\n  | 'translucent'\n  | 'inverted'\n  | 'media'\n  | 'navigation'\n  | 'always-dark';\n\n@Component({\n  tag: 'ds-skeleton',\n  styleUrl: 'Skeleton.css',\n  shadow: true,\n})\nexport class Skeleton {\n  @Prop() variant: SkeletonVariant = 'text';\n  /** Text metric recipe whose line-height defines the text canvas. */\n  @Prop() textVariant: TextVariant = 'text-body-medium';\n  /** Iconography token whose square canvas defines the icon canvas. */\n  @Prop() iconSize: IconSize = 'md';\n  /** Shared control-density size whose height defines the control canvas. */\n  @Prop() controlSize: ControlSize = 'md';\n  /** Width of text and control skeleton canvases. Numbers resolve to px. Ignored for icons. */\n  @Prop() width: string | number | undefined;\n  /** Round icon skeletons into circles and control skeletons into pills. Ignored for text. */\n  @Prop() rounded: boolean = false;\n  /** Whether to show the shimmer animation. */\n  @Prop() shimmer: boolean = true;\n  /** Actual parent surface context. Omit on primary and secondary surfaces. */\n  @Prop() background: SkeletonBackground | undefined;\n\n  private get widthCss() {\n    const v = this.width;\n    if (v == null) return undefined;\n    return typeof v === 'number' ? `${v}px` : v;\n  }\n\n  render() {\n    return (\n      <Host\n        aria-hidden=\"true\"\n        class={{\n          'skeleton': true,\n          [`skeleton--${this.variant}`]: true,\n          [`skeleton--text-${this.textVariant}`]: this.variant === 'text',\n          [`skeleton--icon-${this.iconSize}`]: this.variant === 'icon',\n          [`ds-control--${this.controlSize}`]: this.variant === 'control',\n          [`skeleton--background-${this.background}`]: !!this.background,\n          'skeleton--rounded': this.variant !== 'text' && this.rounded,\n        }}\n        style={this.variant === 'icon' ? undefined : { width: this.widthCss }}\n      >\n        <span\n          class={{\n            'skeleton__shape': true,\n            'ds-shimmer-surface': this.shimmer,\n          }}\n        />\n      </Host>\n    );\n  }\n}\n"],"mappings":"2DAAA,MAAMA,EAAc,IAAM,w2O,MCsBbC,EAAQC,EAAA,MAAAD,UAAAE,EALrB,WAAAC,CAAAC,G,kEAMUC,KAAAC,QAA2B,OAE3BD,KAAAE,YAA2B,mBAE3BF,KAAAG,SAAqB,KAErBH,KAAAI,YAA2B,KAI3BJ,KAAAK,QAAmB,MAEnBL,KAAAM,QAAmB,IAkC5B,CA9BC,YAAYC,GACV,MAAMC,EAAIR,KAAKS,MACf,GAAID,GAAK,KAAM,OAAOE,UACtB,cAAcF,IAAM,SAAW,GAAGA,MAAQA,C,CAG5C,MAAAG,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,yDACS,OACZC,MAAO,CACLC,SAAY,KACZ,CAAC,aAAahB,KAAKC,WAAY,KAC/B,CAAC,kBAAkBD,KAAKE,eAAgBF,KAAKC,UAAY,OACzD,CAAC,kBAAkBD,KAAKG,YAAaH,KAAKC,UAAY,OACtD,CAAC,eAAeD,KAAKI,eAAgBJ,KAAKC,UAAY,UACtD,CAAC,wBAAwBD,KAAKiB,gBAAiBjB,KAAKiB,WACpD,oBAAqBjB,KAAKC,UAAY,QAAUD,KAAKK,SAEvDa,MAAOlB,KAAKC,UAAY,OAASS,UAAY,CAAED,MAAOT,KAAKO,WAE3DK,EAAA,QAAAE,IAAA,2CACEC,MAAO,CACLI,gBAAmB,KACnB,qBAAsBnB,KAAKM,W","ignoreList":[]}