@cds/core 5.6.4 → 6.0.0-beta.1

package/internal/controllers/draggable-list.controller.js

@@ -0,0 +1,2 @@
+import{querySelectorRoots as e}from"../utils/dom.js";import{onFirstInteraction as t,onChildListMutation as r}from"../utils/events.js";import{createId as a}from"../utils/identity.js";import{KeyNavigationListController as s}from"./key-navigation-list.controller.js";let i=null;function d(e){return t=>t.addInitializer((t=>new n(t,e)))}class n{constructor(e,t){this.host=e,this.id="__"+a(),this.host.addController(this),this.config={layout:"both",item:"",dropZone:"",manageFocus:!0,manageTabindex:!1,...t}}get items(){return e(this.host,this.config.item+'[draggable="true"]')}get dropZones(){return e(this.host,this.config.dropZone+'[draggable="false"]')}async hostConnected(){await this.host.updateComplete,t(this.host).then((()=>{this.addDragEventListeners(this.items),this.initializeKeyListController(),this.host.addEventListener("click",(async e=>this.clickItem(e))),this.host.addEventListener("cdsKeyChange",(e=>this.focusItem(e))),this.host.shadowRoot?.addEventListener("click",(async e=>this.clickItem(e))),this.host.shadowRoot?.addEventListener("cdsKeyChange",(e=>this.focusItem(e))),this.observer=r(this.host,(e=>{if(e){const t=Array.from(e.addedNodes).filter((e=>e.draggable));t.length&&this.addDragEventListeners(t)}}))}))}hostDisconnected(){this.observer?.disconnect()}initializeKeyListController(){Object.defineProperty(this.host,this.id,{get:()=>this.items.map((e=>e.querySelector("[cds-draggable]")))}),new s(this.host,{layout:this.config.layout,keyListItems:this.id,manageFocus:this.config.manageFocus,manageTabindex:this.config.manageTabindex})}clickItem(e){const t=Array.from(e.composedPath()).find((e=>e.getAttribute&&"handle"===e.getAttribute("cds-draggable"))),r=e.composedPath()[0].closest("[draggable]");t&&r&&("true"===t.ariaPressed?(r.setAttribute("cds-draggable","active"),o(e.currentTarget,r,null,"grabbed","touch")):"false"===t.ariaPressed&&(r.removeAttribute("cds-draggable"),o(e.currentTarget,r,null,"dropped","touch")))}focusItem(e){if(e.detail.keyListItems===this.id&&"active"===e.detail.previousItem?.closest("[draggable]").getAttribute("cds-draggable")){const t=e.detail.previousItem?.closest("[draggable]"),r=e.detail.activeItem.closest("[draggable]");"handle"===e.detail.activeItem.getAttribute("cds-draggable")&&t!==r&&(e.detail.previousItem.ariaPressed="false",e.detail.activeItem.ariaPressed="true",e.detail.previousItem.pressed=!1,e.detail.activeItem.pressed=!0,t.removeAttribute("cds-draggable"),r.setAttribute("cds-draggable","active"),o(e.detail.activeItem,t,r,"reordered","key"))}}addDragEventListeners(e){e.filter((e=>!e.cdsDraggableItem)).forEach((e=>{return(t=e).cdsDraggableItem="item",t.addEventListener("dragstart",g,!1),t.addEventListener("dragover",c,!1),t.addEventListener("drop",l,!1),t.addEventListener("dragleave",u,!1),void t.addEventListener("dragend",(e=>e.currentTarget.removeAttribute("cds-draggable")),!1);var t})),this.dropZones.filter((e=>!e.cdsDraggableItem)).forEach((e=>{e.addEventListener("dragover",c,!1),e.addEventListener("dragleave",u,!1),e.addEventListener("drop",l,!1),e.cdsDraggableItem="dropzone"}))}}async function o(e,t,r,a,s){e?.updateComplete&&await e.updateComplete,e.dispatchEvent(new CustomEvent("cdsDraggableChange",{detail:{from:t,target:r,type:a,interaction:s},bubbles:!0}))}function g(e){i=e.currentTarget,e.dataTransfer.effectAllowed="move",e.dataTransfer.setDragImage(e.currentTarget,0,0),e.currentTarget.setAttribute("cds-draggable","active"),o(e.currentTarget,e.currentTarget,null,"grabbed","touch")}function c(e){return e.preventDefault&&e.preventDefault(),e.dataTransfer.dropEffect="move",i!==e.currentTarget&&e.currentTarget.setAttribute("cds-draggable","target"),!1}function l(e){const t=i,r=e.currentTarget;return t?.removeAttribute("cds-draggable"),r?.removeAttribute("cds-draggable"),o(e.currentTarget,t,r,"reordered","touch"),!1}function u(e){"target"===e.currentTarget.getAttribute("cds-draggable")&&e.currentTarget.removeAttribute("cds-draggable")}export{n as DraggableListController,d as draggableList};
+//# sourceMappingURL=draggable-list.controller.js.map

package/internal/controllers/draggable-list.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"draggable-list.controller.js","sources":["../../../../src/internal/controllers/draggable-list.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { querySelectorRoots } from '../utils/dom.js';\nimport { onChildListMutation, onFirstInteraction } from '../utils/events.js';\nimport { createId } from '../utils/identity.js';\nimport { KeyNavigationListController } from './key-navigation-list.controller.js';\nlet dragSrcEl = null;\n/**\n * Provides support for HTML5 native drag and drop to a component\n */\nexport function draggableList(config) {\n    return (target) => target.addInitializer((instance) => new DraggableListController(instance, config));\n}\nexport class DraggableListController {\n    constructor(host, config) {\n        this.host = host;\n        this.id = `__${createId()}`;\n        this.host.addController(this);\n        this.config = {\n            layout: 'both',\n            item: '',\n            dropZone: '',\n            manageFocus: true,\n            manageTabindex: false,\n            ...config,\n        };\n    }\n    get items() {\n        return querySelectorRoots(this.host, `${this.config.item}[draggable=\"true\"]`);\n    }\n    get dropZones() {\n        return querySelectorRoots(this.host, `${this.config.dropZone}[draggable=\"false\"]`);\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        onFirstInteraction(this.host).then(() => {\n            this.addDragEventListeners(this.items);\n            this.initializeKeyListController();\n            this.host.addEventListener('click', async (e) => this.clickItem(e));\n            this.host.addEventListener('cdsKeyChange', (e) => this.focusItem(e));\n            this.host.shadowRoot?.addEventListener('click', async (e) => this.clickItem(e));\n            this.host.shadowRoot?.addEventListener('cdsKeyChange', (e) => this.focusItem(e));\n            this.observer = onChildListMutation(this.host, mutation => {\n                if (mutation) {\n                    const items = Array.from(mutation.addedNodes).filter(i => i.draggable);\n                    if (items.length) {\n                        this.addDragEventListeners(items);\n                    }\n                }\n            });\n        });\n    }\n    hostDisconnected() {\n        this.observer?.disconnect();\n    }\n    initializeKeyListController() {\n        Object.defineProperty(this.host, this.id, { get: () => this.items.map(i => i.querySelector('[cds-draggable]')) });\n        new KeyNavigationListController(this.host, {\n            layout: this.config.layout,\n            keyListItems: this.id,\n            manageFocus: this.config.manageFocus,\n            manageTabindex: this.config.manageTabindex,\n        });\n    }\n    clickItem(e) {\n        const handle = Array.from(e.composedPath()).find((e) => e.getAttribute && e.getAttribute('cds-draggable') === 'handle');\n        const from = e.composedPath()[0].closest('[draggable]');\n        if (handle && from) {\n            if (handle.ariaPressed === 'true') {\n                from.setAttribute('cds-draggable', 'active');\n                dispatchDraggableChange(e.currentTarget, from, null, 'grabbed', 'touch');\n            }\n            else if (handle.ariaPressed === 'false') {\n                from.removeAttribute('cds-draggable');\n                dispatchDraggableChange(e.currentTarget, from, null, 'dropped', 'touch');\n            }\n        }\n    }\n    focusItem(e) {\n        if (e.detail.keyListItems === this.id &&\n            e.detail.previousItem?.closest('[draggable]').getAttribute('cds-draggable') === 'active') {\n            const from = e.detail.previousItem?.closest('[draggable]');\n            const target = e.detail.activeItem.closest('[draggable]');\n            if (e.detail.activeItem.getAttribute('cds-draggable') === 'handle' && from !== target) {\n                e.detail.previousItem.ariaPressed = 'false';\n                e.detail.activeItem.ariaPressed = 'true';\n                e.detail.previousItem.pressed = false;\n                e.detail.activeItem.pressed = true;\n                from.removeAttribute('cds-draggable');\n                target.setAttribute('cds-draggable', 'active');\n                dispatchDraggableChange(e.detail.activeItem, from, target, 'reordered', 'key');\n            }\n        }\n    }\n    addDragEventListeners(items) {\n        items.filter(i => !i.cdsDraggableItem).forEach(item => addHandlers(item));\n        this.dropZones\n            .filter(i => !i.cdsDraggableItem)\n            .forEach(elem => {\n            elem.addEventListener('dragover', handleDragOver, false);\n            elem.addEventListener('dragleave', handleDragLeave, false);\n            elem.addEventListener('drop', handleDrop, false);\n            elem.cdsDraggableItem = 'dropzone';\n        });\n    }\n}\nasync function dispatchDraggableChange(host, from, target, type, interaction) {\n    if (host?.updateComplete) {\n        await host.updateComplete;\n    }\n    host.dispatchEvent(new CustomEvent('cdsDraggableChange', { detail: { from, target, type, interaction }, bubbles: true }));\n}\nfunction handleDragStart(e) {\n    dragSrcEl = e.currentTarget;\n    e.dataTransfer.effectAllowed = 'move';\n    e.dataTransfer.setDragImage(e.currentTarget, 0, 0);\n    e.currentTarget.setAttribute('cds-draggable', 'active');\n    dispatchDraggableChange(e.currentTarget, e.currentTarget, null, 'grabbed', 'touch');\n}\nfunction handleDragOver(e) {\n    if (e.preventDefault) {\n        e.preventDefault();\n    }\n    e.dataTransfer.dropEffect = 'move';\n    if (dragSrcEl !== e.currentTarget) {\n        e.currentTarget.setAttribute('cds-draggable', 'target');\n    }\n    return false;\n}\nfunction handleDrop(e) {\n    const from = dragSrcEl;\n    const target = e.currentTarget;\n    from?.removeAttribute('cds-draggable');\n    target?.removeAttribute('cds-draggable');\n    dispatchDraggableChange(e.currentTarget, from, target, 'reordered', 'touch');\n    return false;\n}\nfunction handleDragLeave(e) {\n    if (e.currentTarget.getAttribute('cds-draggable') === 'target') {\n        e.currentTarget.removeAttribute('cds-draggable');\n    }\n}\nfunction addHandlers(elem) {\n    elem.cdsDraggableItem = 'item';\n    elem.addEventListener('dragstart', handleDragStart, false);\n    elem.addEventListener('dragover', handleDragOver, false);\n    elem.addEventListener('drop', handleDrop, false);\n    elem.addEventListener('dragleave', handleDragLeave, false);\n    elem.addEventListener('dragend', (e) => e.currentTarget.removeAttribute('cds-draggable'), false);\n}\n"],"names":["dragSrcEl","draggableList","config","target","addInitializer","instance","DraggableListController","constructor","host","this","id","createId","addController","layout","item","dropZone","manageFocus","manageTabindex","items","querySelectorRoots","dropZones","async","updateComplete","onFirstInteraction","then","addDragEventListeners","initializeKeyListController","addEventListener","e","clickItem","focusItem","shadowRoot","observer","onChildListMutation","mutation","Array","from","addedNodes","filter","i","draggable","length","hostDisconnected","disconnect","Object","defineProperty","get","map","querySelector","KeyNavigationListController","keyListItems","handle","composedPath","find","getAttribute","closest","ariaPressed","setAttribute","dispatchDraggableChange","currentTarget","removeAttribute","detail","previousItem","activeItem","pressed","cdsDraggableItem","forEach","addHandlers","elem","handleDragStart","handleDragOver","handleDrop","handleDragLeave","type","interaction","dispatchEvent","CustomEvent","bubbles","dataTransfer","effectAllowed","setDragImage","preventDefault","dropEffect"],"mappings":"wQASA,IAAIA,EAAY,KAIT,SAASC,EAAcC,GAC1B,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAAwBD,EAAUH,KAE1F,MAAMI,EACTC,YAAYC,EAAMN,GACdO,KAAKD,KAAOA,EACZC,KAAKC,GAAK,KAAKC,IACfF,KAAKD,KAAKI,cAAcH,MACxBA,KAAKP,OAAS,CACVW,OAAQ,OACRC,KAAM,GACNC,SAAU,GACVC,aAAa,EACbC,gBAAgB,KACbf,GAGPgB,YACA,OAAOC,EAAmBV,KAAKD,KAASC,KAAKP,OAAOY,KAAf,sBAErCM,gBACA,OAAOD,EAAmBV,KAAKD,KAASC,KAAKP,OAAOa,SAAf,uBAEzCM,4BACUZ,KAAKD,KAAKc,eAChBC,EAAmBd,KAAKD,MAAMgB,MAAK,KAC/Bf,KAAKgB,sBAAsBhB,KAAKS,OAChCT,KAAKiB,8BACLjB,KAAKD,KAAKmB,iBAAiB,SAASN,MAAOO,GAAMnB,KAAKoB,UAAUD,KAChEnB,KAAKD,KAAKmB,iBAAiB,gBAAiBC,GAAMnB,KAAKqB,UAAUF,KACjEnB,KAAKD,KAAKuB,YAAYJ,iBAAiB,SAASN,MAAOO,GAAMnB,KAAKoB,UAAUD,KAC5EnB,KAAKD,KAAKuB,YAAYJ,iBAAiB,gBAAiBC,GAAMnB,KAAKqB,UAAUF,KAC7EnB,KAAKuB,SAAWC,EAAoBxB,KAAKD,MAAM0B,IAC3C,GAAIA,EAAU,CACV,MAAMhB,EAAQiB,MAAMC,KAAKF,EAASG,YAAYC,QAAOC,GAAKA,EAAEC,YACxDtB,EAAMuB,QACNhC,KAAKgB,sBAAsBP,UAM/CwB,mBACIjC,KAAKuB,UAAUW,aAEnBjB,8BACIkB,OAAOC,eAAepC,KAAKD,KAAMC,KAAKC,GAAI,CAAEoC,IAAK,IAAMrC,KAAKS,MAAM6B,KAAIR,GAAKA,EAAES,cAAc,uBAC3F,IAAIC,EAA4BxC,KAAKD,KAAM,CACvCK,OAAQJ,KAAKP,OAAOW,OACpBqC,aAAczC,KAAKC,GACnBM,YAAaP,KAAKP,OAAOc,YACzBC,eAAgBR,KAAKP,OAAOe,iBAGpCY,UAAUD,GACN,MAAMuB,EAAShB,MAAMC,KAAKR,EAAEwB,gBAAgBC,MAAMzB,GAAMA,EAAE0B,cAAoD,WAApC1B,EAAE0B,aAAa,mBACnFlB,EAAOR,EAAEwB,eAAe,GAAGG,QAAQ,eACrCJ,GAAUf,IACiB,SAAvBe,EAAOK,aACPpB,EAAKqB,aAAa,gBAAiB,UACnCC,EAAwB9B,EAAE+B,cAAevB,EAAM,KAAM,UAAW,UAEpC,UAAvBe,EAAOK,cACZpB,EAAKwB,gBAAgB,iBACrBF,EAAwB9B,EAAE+B,cAAevB,EAAM,KAAM,UAAW,WAI5EN,UAAUF,GACN,GAAIA,EAAEiC,OAAOX,eAAiBzC,KAAKC,IACiD,WAAhFkB,EAAEiC,OAAOC,cAAcP,QAAQ,eAAeD,aAAa,iBAA+B,CAC1F,MAAMlB,EAAOR,EAAEiC,OAAOC,cAAcP,QAAQ,eACtCpD,EAASyB,EAAEiC,OAAOE,WAAWR,QAAQ,eACe,WAAtD3B,EAAEiC,OAAOE,WAAWT,aAAa,kBAAiClB,IAASjC,IAC3EyB,EAAEiC,OAAOC,aAAaN,YAAc,QACpC5B,EAAEiC,OAAOE,WAAWP,YAAc,OAClC5B,EAAEiC,OAAOC,aAAaE,SAAU,EAChCpC,EAAEiC,OAAOE,WAAWC,SAAU,EAC9B5B,EAAKwB,gBAAgB,iBACrBzD,EAAOsD,aAAa,gBAAiB,UACrCC,EAAwB9B,EAAEiC,OAAOE,WAAY3B,EAAMjC,EAAQ,YAAa,SAIpFsB,sBAAsBP,GAClBA,EAAMoB,QAAOC,IAAMA,EAAE0B,mBAAkBC,SAAQpD,IAAQqD,OA+C1CC,EA/CsDtD,GAgDlEmD,iBAAmB,OACxBG,EAAKzC,iBAAiB,YAAa0C,GAAiB,GACpDD,EAAKzC,iBAAiB,WAAY2C,GAAgB,GAClDF,EAAKzC,iBAAiB,OAAQ4C,GAAY,GAC1CH,EAAKzC,iBAAiB,YAAa6C,GAAiB,QACpDJ,EAAKzC,iBAAiB,WAAYC,GAAMA,EAAE+B,cAAcC,gBAAgB,mBAAkB,GAN9F,IAAqBQ,KA9Cb3D,KAAKW,UACAkB,QAAOC,IAAMA,EAAE0B,mBACfC,SAAQE,IACTA,EAAKzC,iBAAiB,WAAY2C,GAAgB,GAClDF,EAAKzC,iBAAiB,YAAa6C,GAAiB,GACpDJ,EAAKzC,iBAAiB,OAAQ4C,GAAY,GAC1CH,EAAKH,iBAAmB,eAIpC5C,eAAeqC,EAAwBlD,EAAM4B,EAAMjC,EAAQsE,EAAMC,GACzDlE,GAAMc,sBACAd,EAAKc,eAEfd,EAAKmE,cAAc,IAAIC,YAAY,qBAAsB,CAAEf,OAAQ,CAAEzB,KAAAA,EAAMjC,OAAAA,EAAQsE,KAAAA,EAAMC,YAAAA,GAAeG,SAAS,KAErH,SAASR,EAAgBzC,GACrB5B,EAAY4B,EAAE+B,cACd/B,EAAEkD,aAAaC,cAAgB,OAC/BnD,EAAEkD,aAAaE,aAAapD,EAAE+B,cAAe,EAAG,GAChD/B,EAAE+B,cAAcF,aAAa,gBAAiB,UAC9CC,EAAwB9B,EAAE+B,cAAe/B,EAAE+B,cAAe,KAAM,UAAW,SAE/E,SAASW,EAAe1C,GAQpB,OAPIA,EAAEqD,gBACFrD,EAAEqD,iBAENrD,EAAEkD,aAAaI,WAAa,OACxBlF,IAAc4B,EAAE+B,eAChB/B,EAAE+B,cAAcF,aAAa,gBAAiB,WAE3C,EAEX,SAASc,EAAW3C,GAChB,MAAMQ,EAAOpC,EACPG,EAASyB,EAAE+B,cAIjB,OAHAvB,GAAMwB,gBAAgB,iBACtBzD,GAAQyD,gBAAgB,iBACxBF,EAAwB9B,EAAE+B,cAAevB,EAAMjC,EAAQ,YAAa,UAC7D,EAEX,SAASqE,EAAgB5C,GACiC,WAAlDA,EAAE+B,cAAcL,aAAa,kBAC7B1B,EAAE+B,cAAcC,gBAAgB"}

package/internal/controllers/first-focus.controller.d.ts

@@ -0,0 +1,17 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+export interface FirstFocusConfig {
+    fallback: 'none' | 'host' | 'focusable';
+}
+/**
+ * Provides a focus first behavior to any component via the cds-first-focus attribute
+ */
+export declare function firstFocus<T extends ReactiveElement>(config?: FirstFocusConfig): ClassDecorator;
+export declare class FirstFocusController<T extends ReactiveElement> implements ReactiveController {
+    private host;
+    private config;
+    private observer;
+    constructor(host: T, config?: FirstFocusConfig);
+    hostConnected(): Promise<void>;
+    hostDisconnected(): void;
+    private cdsFocusFirst;
+}

package/internal/controllers/first-focus.controller.js

@@ -0,0 +1,2 @@
+import{ignoreFocus as s,focusable as t,focusElement as o}from"../utils/focus.js";import{listenForAttributeChange as i}from"../utils/events.js";import{getFlattenedDOMTree as c}from"../utils/traversal.js";function h(s={fallback:"focusable"}){return t=>t.addInitializer((t=>new e(t,s)))}class e{constructor(s,t={fallback:"focusable"}){this.host=s,this.config=t,this.host.addController(this)}async hostConnected(){await this.host.updateComplete,this.observer=i(this.host,"hidden",(()=>this.cdsFocusFirst())),this.cdsFocusFirst()}hostDisconnected(){this.observer?.disconnect()}cdsFocusFirst(){if(!s(this.host)){const s=this.host.shadowRoot?this.host.shadowRoot:this.host,i=s.querySelector(".private-host")??this.host,h=c(s).filter((s=>!s.hasAttribute("cds-focus-boundary"))),e=h.find((s=>s.hasAttribute("cds-first-focus"))),r="focusable"===this.config.fallback?h.find((s=>t(s)&&!s.classList.contains("private-host"))):null,a="none"===this.config.fallback?null:i,n=e??r??a;n&&o(n)}}}export{e as FirstFocusController,h as firstFocus};
+//# sourceMappingURL=first-focus.controller.js.map

package/internal/controllers/first-focus.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"first-focus.controller.js","sources":["../../../../src/internal/controllers/first-focus.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { focusable, focusElement, ignoreFocus } from '../utils/focus.js';\nimport { listenForAttributeChange } from '../utils/events.js';\nimport { getFlattenedDOMTree } from '../utils/traversal.js';\n/**\n * Provides a focus first behavior to any component via the cds-first-focus attribute\n */\nexport function firstFocus(config = { fallback: 'focusable' }) {\n    return (target) => target.addInitializer((instance) => new FirstFocusController(instance, config));\n}\nexport class FirstFocusController {\n    constructor(host, config = { fallback: 'focusable' }) {\n        this.host = host;\n        this.config = config;\n        this.host.addController(this);\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        this.observer = listenForAttributeChange(this.host, 'hidden', () => this.cdsFocusFirst());\n        this.cdsFocusFirst();\n    }\n    hostDisconnected() {\n        this.observer?.disconnect();\n    }\n    cdsFocusFirst() {\n        if (!ignoreFocus(this.host)) {\n            const root = this.host.shadowRoot ? this.host.shadowRoot : this.host;\n            const rootHost = root.querySelector('.private-host') ?? this.host;\n            const elements = getFlattenedDOMTree(root).filter(i => !i.hasAttribute('cds-focus-boundary'));\n            const firstFocus = elements.find(i => i.hasAttribute('cds-first-focus'));\n            const focusableElement = this.config.fallback === 'focusable'\n                ? elements.find(i => focusable(i) && !i.classList.contains('private-host'))\n                : null;\n            const host = this.config.fallback === 'none' ? null : rootHost;\n            const focus = firstFocus ?? focusableElement ?? host;\n            if (focus) {\n                focusElement(focus);\n            }\n        }\n    }\n}\n"],"names":["firstFocus","config","fallback","target","addInitializer","instance","FirstFocusController","constructor","host","this","addController","async","updateComplete","observer","listenForAttributeChange","cdsFocusFirst","hostDisconnected","disconnect","ignoreFocus","root","shadowRoot","rootHost","querySelector","elements","getFlattenedDOMTree","filter","i","hasAttribute","find","focusableElement","focusable","classList","contains","focus","focusElement"],"mappings":"2MAWO,SAASA,EAAWC,EAAS,CAAEC,SAAU,cAC5C,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAAqBD,EAAUJ,KAEvF,MAAMK,EACTC,YAAYC,EAAMP,EAAS,CAAEC,SAAU,cACnCO,KAAKD,KAAOA,EACZC,KAAKR,OAASA,EACdQ,KAAKD,KAAKE,cAAcD,MAE5BE,4BACUF,KAAKD,KAAKI,eAChBH,KAAKI,SAAWC,EAAyBL,KAAKD,KAAM,UAAU,IAAMC,KAAKM,kBACzEN,KAAKM,gBAETC,mBACIP,KAAKI,UAAUI,aAEnBF,gBACI,IAAKG,EAAYT,KAAKD,MAAO,CACzB,MAAMW,EAAOV,KAAKD,KAAKY,WAAaX,KAAKD,KAAKY,WAAaX,KAAKD,KAC1Da,EAAWF,EAAKG,cAAc,kBAAoBb,KAAKD,KACvDe,EAAWC,EAAoBL,GAAMM,QAAOC,IAAMA,EAAEC,aAAa,wBACjE3B,EAAauB,EAASK,MAAKF,GAAKA,EAAEC,aAAa,qBAC/CE,EAA4C,cAAzBpB,KAAKR,OAAOC,SAC/BqB,EAASK,MAAKF,GAAKI,EAAUJ,KAAOA,EAAEK,UAAUC,SAAS,kBACzD,KACAxB,EAAgC,SAAzBC,KAAKR,OAAOC,SAAsB,KAAOmB,EAChDY,EAAQjC,GAAc6B,GAAoBrB,EAC5CyB,GACAC,EAAaD"}

package/internal/controllers/grid-range-selection.controller.d.ts

@@ -0,0 +1,28 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+declare type GridRange = {
+    grid: HTMLElement;
+    cells: NodeListOf<HTMLElement>;
+    rows: NodeListOf<HTMLElement>;
+    rangeSelection?: boolean;
+};
+/**
+ * Given a 2d array grid structure provide a highlight/range selection of given cells
+ */
+export declare function gridRangeSelection<T extends ReactiveElement & GridRange>(): ClassDecorator;
+export declare class GridRangeSelectionController<T extends ReactiveElement & GridRange> implements ReactiveController {
+    private host;
+    private selectionActive;
+    private firstCell;
+    private activeCell;
+    private get enabled();
+    constructor(host: T);
+    hostConnected(): Promise<void>;
+    private setupMouseEvents;
+    private setupKeyboardListeners;
+    private setFirstCell;
+    private setActiveCell;
+    private stopSelection;
+    private resetAllActiveCells;
+    private calculateSelection;
+}
+export {};

package/internal/controllers/grid-range-selection.controller.js

@@ -0,0 +1,2 @@
+function t(){return t=>t.addInitializer((t=>new e(t)))}class e{constructor(t){this.host=t,this.selectionActive=!1,t.addController(this)}get enabled(){return!1!==this.host.rangeSelection&&!Array.from(this.host.rows).find((t=>t.draggable))}async hostConnected(){await this.host.updateComplete,this.setupKeyboardListeners(),this.setupMouseEvents()}setupMouseEvents(){const t=this.host.grid.shadowRoot?this.host.grid.shadowRoot:this.host.grid;t.addEventListener("mousedown",(t=>{this.enabled&&1===t.buttons&&!t.ctrlKey&&this.setFirstCell(t)})),t.addEventListener("mouseover",(t=>{this.enabled&&this.setActiveCell(t.composedPath().find((t=>Array.from(this.host.cells).includes(t))))})),t.addEventListener("mouseup",(()=>{this.enabled&&this.stopSelection()}))}setupKeyboardListeners(){this.host.addEventListener("cdsKeyChange",(t=>{this.enabled&&t.detail.code&&(this.setActiveCell(t.detail.activeItem),t.detail.shiftKey||(this.stopSelection(),this.resetAllActiveCells(),this.host.dispatchEvent(new CustomEvent("rangeSelectionChange",{detail:[]}))))})),this.host.addEventListener("keydown",(t=>{this.enabled&&"ShiftLeft"===t.code&&t.shiftKey&&!this.selectionActive&&this.setFirstCell(t)}))}setFirstCell(t){const e=t.composedPath().find((t=>Array.from(this.host.cells).includes(t)));e&&(this.firstCell=e,this.selectionActive=!0,this.resetAllActiveCells())}setActiveCell(t){t&&this.selectionActive&&(this.activeCell=t,this.calculateSelection())}stopSelection(){this.selectionActive=!1}resetAllActiveCells(){this.host.cells.forEach((t=>t.removeAttribute("highlight")))}calculateSelection(){const t=parseInt(this.firstCell.ariaColIndex),e=parseInt(this.activeCell.ariaColIndex),s=parseInt(this.firstCell.parentElement?.ariaRowIndex),i=parseInt(this.activeCell.parentElement?.ariaRowIndex);this.resetAllActiveCells(),this.host.cells.forEach((l=>{const h=parseInt(l.ariaColIndex),n=parseInt(l.parentElement?.ariaRowIndex);(t<=e&&h>=t&&h<=e||t>=e&&h<=t&&h>=e)&&(s<=i&&n>=s&&n<=i||s>=i&&n<=s&&n>=i)&&l.setAttribute("highlight","")})),this.host.dispatchEvent(new CustomEvent("rangeSelectionChange",{detail:Array.from(this.host.cells).filter((t=>t.hasAttribute("highlight")))}))}}export{e as GridRangeSelectionController,t as gridRangeSelection};
+//# sourceMappingURL=grid-range-selection.controller.js.map

package/internal/controllers/grid-range-selection.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-range-selection.controller.js","sources":["../../../../src/internal/controllers/grid-range-selection.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\n/**\n * Given a 2d array grid structure provide a highlight/range selection of given cells\n */\nexport function gridRangeSelection() {\n    return (target) => target.addInitializer((instance) => new GridRangeSelectionController(instance));\n}\nexport class GridRangeSelectionController {\n    constructor(host) {\n        this.host = host;\n        this.selectionActive = false;\n        host.addController(this);\n    }\n    get enabled() {\n        return this.host.rangeSelection !== false && !Array.from(this.host.rows).find(r => r.draggable);\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        this.setupKeyboardListeners();\n        this.setupMouseEvents();\n    }\n    setupMouseEvents() {\n        const root = this.host.grid.shadowRoot ? this.host.grid.shadowRoot : this.host.grid;\n        root.addEventListener('mousedown', (e) => {\n            // preserve right click for context menus & keyboard mouse control https://apple.stackexchange.com/questions/32715/how-do-i-open-the-context-menu-from-a-mac-keyboard\n            if (this.enabled && e.buttons === 1 && !e.ctrlKey) {\n                this.setFirstCell(e);\n            }\n        });\n        root.addEventListener('mouseover', (e) => {\n            if (this.enabled) {\n                this.setActiveCell(e.composedPath().find((i) => Array.from(this.host.cells).includes(i)));\n            }\n        });\n        root.addEventListener('mouseup', () => {\n            if (this.enabled) {\n                this.stopSelection();\n            }\n        });\n    }\n    setupKeyboardListeners() {\n        this.host.addEventListener('cdsKeyChange', (e) => {\n            if (this.enabled && e.detail.code) {\n                this.setActiveCell(e.detail.activeItem);\n                if (!e.detail.shiftKey) {\n                    this.stopSelection();\n                    this.resetAllActiveCells();\n                    this.host.dispatchEvent(new CustomEvent('rangeSelectionChange', { detail: [] }));\n                }\n            }\n        });\n        this.host.addEventListener('keydown', (e) => {\n            if (this.enabled && e.code === 'ShiftLeft' && e.shiftKey && !this.selectionActive) {\n                this.setFirstCell(e);\n            }\n        });\n    }\n    setFirstCell(e) {\n        const firstCell = e.composedPath().find((i) => Array.from(this.host.cells).includes(i));\n        if (firstCell) {\n            this.firstCell = firstCell;\n            this.selectionActive = true;\n            this.resetAllActiveCells();\n        }\n    }\n    setActiveCell(activeCell) {\n        if (activeCell && this.selectionActive) {\n            this.activeCell = activeCell;\n            this.calculateSelection();\n        }\n    }\n    stopSelection() {\n        this.selectionActive = false;\n    }\n    resetAllActiveCells() {\n        this.host.cells.forEach(cell => cell.removeAttribute('highlight'));\n    }\n    calculateSelection() {\n        const x1 = parseInt(this.firstCell.ariaColIndex);\n        const x2 = parseInt(this.activeCell.ariaColIndex);\n        const y1 = parseInt(this.firstCell.parentElement?.ariaRowIndex);\n        const y2 = parseInt(this.activeCell.parentElement?.ariaRowIndex);\n        this.resetAllActiveCells();\n        this.host.cells.forEach((cell) => {\n            const colIndex = parseInt(cell.ariaColIndex);\n            const rowIndex = parseInt(cell.parentElement?.ariaRowIndex);\n            if ((x1 <= x2 && colIndex >= x1 && colIndex <= x2) || (x1 >= x2 && colIndex <= x1 && colIndex >= x2)) {\n                if ((y1 <= y2 && rowIndex >= y1 && rowIndex <= y2) || (y1 >= y2 && rowIndex <= y1 && rowIndex >= y2)) {\n                    cell.setAttribute('highlight', '');\n                }\n            }\n        });\n        this.host.dispatchEvent(new CustomEvent('rangeSelectionChange', {\n            detail: Array.from(this.host.cells).filter(c => c.hasAttribute('highlight')),\n        }));\n    }\n}\n"],"names":["gridRangeSelection","target","addInitializer","instance","GridRangeSelectionController","constructor","host","this","selectionActive","addController","enabled","rangeSelection","Array","from","rows","find","r","draggable","async","updateComplete","setupKeyboardListeners","setupMouseEvents","root","grid","shadowRoot","addEventListener","e","buttons","ctrlKey","setFirstCell","setActiveCell","composedPath","i","cells","includes","stopSelection","detail","code","activeItem","shiftKey","resetAllActiveCells","dispatchEvent","CustomEvent","firstCell","activeCell","calculateSelection","forEach","cell","removeAttribute","x1","parseInt","ariaColIndex","x2","y1","parentElement","ariaRowIndex","y2","colIndex","rowIndex","setAttribute","filter","c","hasAttribute"],"mappings":"AAQO,SAASA,IACZ,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAA6BD,KAErF,MAAMC,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKC,iBAAkB,EACvBF,EAAKG,cAAcF,MAEnBG,cACA,OAAoC,IAA7BH,KAAKD,KAAKK,iBAA6BC,MAAMC,KAAKN,KAAKD,KAAKQ,MAAMC,MAAKC,GAAKA,EAAEC,YAEzFC,4BACUX,KAAKD,KAAKa,eAChBZ,KAAKa,yBACLb,KAAKc,mBAETA,mBACI,MAAMC,EAAOf,KAAKD,KAAKiB,KAAKC,WAAajB,KAAKD,KAAKiB,KAAKC,WAAajB,KAAKD,KAAKiB,KAC/ED,EAAKG,iBAAiB,aAAcC,IAE5BnB,KAAKG,SAAyB,IAAdgB,EAAEC,UAAkBD,EAAEE,SACtCrB,KAAKsB,aAAaH,MAG1BJ,EAAKG,iBAAiB,aAAcC,IAC5BnB,KAAKG,SACLH,KAAKuB,cAAcJ,EAAEK,eAAehB,MAAMiB,GAAMpB,MAAMC,KAAKN,KAAKD,KAAK2B,OAAOC,SAASF,SAG7FV,EAAKG,iBAAiB,WAAW,KACzBlB,KAAKG,SACLH,KAAK4B,mBAIjBf,yBACIb,KAAKD,KAAKmB,iBAAiB,gBAAiBC,IACpCnB,KAAKG,SAAWgB,EAAEU,OAAOC,OACzB9B,KAAKuB,cAAcJ,EAAEU,OAAOE,YACvBZ,EAAEU,OAAOG,WACVhC,KAAK4B,gBACL5B,KAAKiC,sBACLjC,KAAKD,KAAKmC,cAAc,IAAIC,YAAY,uBAAwB,CAAEN,OAAQ,WAItF7B,KAAKD,KAAKmB,iBAAiB,WAAYC,IAC/BnB,KAAKG,SAAsB,cAAXgB,EAAEW,MAAwBX,EAAEa,WAAahC,KAAKC,iBAC9DD,KAAKsB,aAAaH,MAI9BG,aAAaH,GACT,MAAMiB,EAAYjB,EAAEK,eAAehB,MAAMiB,GAAMpB,MAAMC,KAAKN,KAAKD,KAAK2B,OAAOC,SAASF,KAChFW,IACApC,KAAKoC,UAAYA,EACjBpC,KAAKC,iBAAkB,EACvBD,KAAKiC,uBAGbV,cAAcc,GACNA,GAAcrC,KAAKC,kBACnBD,KAAKqC,WAAaA,EAClBrC,KAAKsC,sBAGbV,gBACI5B,KAAKC,iBAAkB,EAE3BgC,sBACIjC,KAAKD,KAAK2B,MAAMa,SAAQC,GAAQA,EAAKC,gBAAgB,eAEzDH,qBACI,MAAMI,EAAKC,SAAS3C,KAAKoC,UAAUQ,cAC7BC,EAAKF,SAAS3C,KAAKqC,WAAWO,cAC9BE,EAAKH,SAAS3C,KAAKoC,UAAUW,eAAeC,cAC5CC,EAAKN,SAAS3C,KAAKqC,WAAWU,eAAeC,cACnDhD,KAAKiC,sBACLjC,KAAKD,KAAK2B,MAAMa,SAASC,IACrB,MAAMU,EAAWP,SAASH,EAAKI,cACzBO,EAAWR,SAASH,EAAKO,eAAeC,eACzCN,GAAMG,GAAMK,GAAYR,GAAMQ,GAAYL,GAAQH,GAAMG,GAAMK,GAAYR,GAAMQ,GAAYL,KACxFC,GAAMG,GAAME,GAAYL,GAAMK,GAAYF,GAAQH,GAAMG,GAAME,GAAYL,GAAMK,GAAYF,IAC7FT,EAAKY,aAAa,YAAa,OAI3CpD,KAAKD,KAAKmC,cAAc,IAAIC,YAAY,uBAAwB,CAC5DN,OAAQxB,MAAMC,KAAKN,KAAKD,KAAK2B,OAAO2B,QAAOC,GAAKA,EAAEC,aAAa"}

package/internal/controllers/inline-focus-trap.controller.d.ts

@@ -0,0 +1,17 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+/**
+ * Focus Trap that given a DOM element creates a flattened tree traversal
+ * between both Shadow DOM and Light DOM
+ *
+ * safari https://bugs.webkit.org/show_bug.cgi?id=174667
+ */
+export declare function focusTrap<T extends ReactiveElement>(): ClassDecorator;
+export declare class InlineFocusTrapController<T extends ReactiveElement> implements ReactiveController {
+    private host;
+    constructor(host: T);
+    private get focusableItems();
+    private get root();
+    private get styles();
+    private boundary;
+    hostConnected(): Promise<void>;
+}

package/internal/controllers/inline-focus-trap.controller.js

@@ -0,0 +1,2 @@
+import{html as t}from"lit";import{getFlattenedFocusableItems as s}from"../utils/traversal.js";import{renderBefore as o,renderAfter as i}from"../utils/lit.js";import{ignoreFocus as r}from"../utils/focus.js";function h(){return t=>t.addInitializer((t=>new e(t)))}class e{constructor(t){this.host=t,this.host.addController(this)}get focusableItems(){return s(this.root).filter((t=>!t.hasAttribute("cds-focus-boundary")&&(this.root.contains(t)||t.closest("[cds-focus-trap]")===this.host)))}get root(){return this.host.shadowRoot?this.host.shadowRoot:this.host}get styles(){return t`<style cds-focus-style>:host(:focus-within) [cds-focus-boundary],:host(:host:focus-within) [cds-focus-boundary]{display:block!important}</style>`}boundary(s){return t`<div @focusin="${()=>this.focusableItems.at(s)?.focus()}" test="${s}" cds-focus-boundary tabindex="0" style="display:none;position:absolute;width:1px;height:1px;clip:rect(0,0,0,0)">boundary</div>`}async hostConnected(){await this.host.updateComplete,r(this.host)||(o(this.styles,this.root),o(this.boundary(-1),this.root),i(this.boundary(0),this.root),this.host.setAttribute("cds-focus-trap",""))}}export{e as InlineFocusTrapController,h as focusTrap};
+//# sourceMappingURL=inline-focus-trap.controller.js.map

package/internal/controllers/inline-focus-trap.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inline-focus-trap.controller.js","sources":["../../../../src/internal/controllers/inline-focus-trap.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { html } from 'lit';\nimport { getFlattenedFocusableItems } from '../utils/traversal.js';\nimport { renderAfter, renderBefore } from '../utils/lit.js';\nimport { ignoreFocus } from '../utils/focus.js';\n/**\n * Focus Trap that given a DOM element creates a flattened tree traversal\n * between both Shadow DOM and Light DOM\n *\n * safari https://bugs.webkit.org/show_bug.cgi?id=174667\n */\nexport function focusTrap() {\n    return (target) => target.addInitializer((instance) => new InlineFocusTrapController(instance));\n}\nexport class InlineFocusTrapController {\n    constructor(host) {\n        this.host = host;\n        this.host.addController(this);\n    }\n    get focusableItems() {\n        return getFlattenedFocusableItems(this.root).filter(e => !e.hasAttribute('cds-focus-boundary') && (this.root.contains(e) || e.closest('[cds-focus-trap]') === this.host));\n    }\n    get root() {\n        return (this.host.shadowRoot ? this.host.shadowRoot : this.host);\n    }\n    get styles() {\n        return html `<style cds-focus-style>\n      :host(:host:focus-within) [cds-focus-boundary],\n      :host(:focus-within) [cds-focus-boundary] {\n        display: block !important;\n      }\n    </style>`;\n    }\n    boundary(index) {\n        return html `<div\n      @focusin=${() => this.focusableItems.at(index)?.focus()}\n      test=${index}\n      cds-focus-boundary\n      tabindex=\"0\"\n      style=\"display:none;position:absolute;width:1px;height:1px;clip:rect(0,0,0,0)\"\n    >\n      boundary\n    </div>`;\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        if (!ignoreFocus(this.host)) {\n            renderBefore(this.styles, this.root);\n            renderBefore(this.boundary(-1), this.root);\n            renderAfter(this.boundary(0), this.root);\n            this.host.setAttribute('cds-focus-trap', '');\n        }\n    }\n}\n"],"names":["focusTrap","target","addInitializer","instance","InlineFocusTrapController","constructor","host","this","addController","focusableItems","getFlattenedFocusableItems","root","filter","e","hasAttribute","contains","closest","shadowRoot","styles","html","boundary","index","at","focus","async","updateComplete","ignoreFocus","renderBefore","renderAfter","setAttribute"],"mappings":"8MAeO,SAASA,IACZ,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAA0BD,KAElF,MAAMC,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKD,KAAKE,cAAcD,MAExBE,qBACA,OAAOC,EAA2BH,KAAKI,MAAMC,QAAOC,IAAMA,EAAEC,aAAa,wBAA0BP,KAAKI,KAAKI,SAASF,IAAMA,EAAEG,QAAQ,sBAAwBT,KAAKD,QAEnKK,WACA,OAAQJ,KAAKD,KAAKW,WAAaV,KAAKD,KAAKW,WAAaV,KAAKD,KAE3DY,aACA,OAAOC,CAAK,mJAOhBC,SAASC,GACL,OAAOF,CAAK,kBACH,IAAMZ,KAAKE,eAAea,GAAGD,IAAQE,kBACzCF,mIAQTG,4BACUjB,KAAKD,KAAKmB,eACXC,EAAYnB,KAAKD,QAClBqB,EAAapB,KAAKW,OAAQX,KAAKI,MAC/BgB,EAAapB,KAAKa,UAAU,GAAIb,KAAKI,MACrCiB,EAAYrB,KAAKa,SAAS,GAAIb,KAAKI,MACnCJ,KAAKD,KAAKuB,aAAa,iBAAkB"}

package/internal/controllers/key-navigation-grid.controller.d.ts

@@ -0,0 +1,28 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+export interface KeyNavigationGridConfig {
+    keyNavGrid?: HTMLElement;
+    columnRow?: HTMLElement;
+    columns?: NodeListOf<HTMLElement> | HTMLElement[];
+    rows: NodeListOf<HTMLElement> | HTMLElement[];
+    cells: NodeListOf<HTMLElement> | HTMLElement[];
+}
+/**
+ * Given a 2d array grid structure provide keyboard navigation following aria grid spec
+ * https://w3c.github.io/aria-practices/#gridNav_focus
+ */
+export declare function keyNavigationGrid<T extends ReactiveElement & KeyNavigationGridConfig>(): ClassDecorator;
+export declare class KeyNavigationGridController<T extends ReactiveElement & KeyNavigationGridConfig> implements ReactiveController {
+    private host;
+    private observers;
+    private get hostGrid();
+    private get hostRows();
+    private get hostCells();
+    private get activeCell();
+    constructor(host: T);
+    hostConnected(): Promise<void>;
+    hostDisconnected(): void;
+    private clickCell;
+    private keynavCell;
+    private setActiveCell;
+    private updateCellActivation;
+}

package/internal/controllers/key-navigation-grid.controller.js

@@ -0,0 +1,2 @@
+import{onFirstInteraction as t,onChildListMutation as s}from"../utils/events.js";import{getFlattenedDOMTree as e,getFlattenedFocusableItems as i}from"../utils/traversal.js";import{contextMenuClick as o}from"../utils/dom.js";import{validKeyNavigationCode as h}from"../utils/keycodes.js";import{initializeKeyListItems as l,simpleFocusable as r,getActiveElement as n,setActiveKeyListItem as c,focusElement as d}from"../utils/focus.js";import{getNextKeyGridItem as a}from"./key-navigation.utils.js";function u(){return t=>t.addInitializer((t=>new f(t)))}class f{constructor(t){this.host=t,this.observers=[],this.host.addController(this)}get hostGrid(){return this.host.keyNavGrid?this.host.keyNavGrid:this.host}get hostRows(){const t=Array.from(this.host.rows);return this.host.columnRow&&t.unshift(this.host.columnRow),t}get hostCells(){const t=Array.from(this.host.cells);return this.host.columns&&t.unshift(...Array.from(this.host.columns)),t}get activeCell(){return Array.from(this.hostCells).find((t=>0===t.tabIndex))}async hostConnected(){await this.host.updateComplete,t(this.host).then((()=>{l(this.hostCells),this.hostGrid.addEventListener("mouseup",(t=>this.clickCell(t))),this.hostGrid.addEventListener("keydown",(t=>this.keynavCell(t))),this.hostGrid.addEventListener("keyup",(t=>this.updateCellActivation(t)))})),this.observers.push(s(this.host,(()=>l(this.hostCells))))}hostDisconnected(){this.observers.forEach((t=>t?.disconnect()))}clickCell(t){if(!o(t)){const s=t.composedPath().find((t=>this.hostCells.find((s=>s===t))));s&&this.setActiveCell(t,s)}}keynavCell(t){if(h(t)&&r(n())){const{x:s,y:i}=a(this.hostCells,this.hostRows,{code:t.code,ctrlKey:t.ctrlKey,dir:this.host.dir}),o=Array.from(e(this.hostRows[i])).filter((t=>!!this.hostCells.find((s=>s===t))))[s];this.setActiveCell(t,o),t.preventDefault()}}setActiveCell(t,s){c(this.hostCells,s);const e=i(s),o=e.filter((t=>r(t)));1===o.length&&1===e.length?d(o[0]):d(s),s.dispatchEvent(new CustomEvent("cdsKeyChange",{bubbles:!0,detail:{code:t.code,shiftKey:t.shiftKey,activeItem:s}}))}updateCellActivation(t){"Escape"===t.code&&this.activeCell?.focus(),"Enter"===t.code&&this.activeCell===t.composedPath()[0]&&i(this.activeCell)[0]?.focus()}}export{f as KeyNavigationGridController,u as keyNavigationGrid};
+//# sourceMappingURL=key-navigation-grid.controller.js.map

package/internal/controllers/key-navigation-grid.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"key-navigation-grid.controller.js","sources":["../../../../src/internal/controllers/key-navigation-grid.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { onChildListMutation, onFirstInteraction } from '../utils/events.js';\nimport { getFlattenedDOMTree, getFlattenedFocusableItems } from '../utils/traversal.js';\nimport { contextMenuClick } from '../utils/dom.js';\nimport { validKeyNavigationCode } from '../utils/keycodes.js';\nimport { focusElement, getActiveElement, initializeKeyListItems, setActiveKeyListItem, simpleFocusable, } from '../utils/focus.js';\nimport { getNextKeyGridItem } from './key-navigation.utils.js';\n/**\n * Given a 2d array grid structure provide keyboard navigation following aria grid spec\n * https://w3c.github.io/aria-practices/#gridNav_focus\n */\nexport function keyNavigationGrid() {\n    return (target) => target.addInitializer((instance) => new KeyNavigationGridController(instance));\n}\nexport class KeyNavigationGridController {\n    constructor(host) {\n        this.host = host;\n        this.observers = [];\n        this.host.addController(this);\n    }\n    get hostGrid() {\n        return this.host.keyNavGrid ? this.host.keyNavGrid : this.host;\n    }\n    get hostRows() {\n        const rows = Array.from(this.host.rows);\n        if (this.host.columnRow) {\n            rows.unshift(this.host.columnRow);\n        }\n        return rows;\n    }\n    get hostCells() {\n        const cells = Array.from(this.host.cells);\n        if (this.host.columns) {\n            cells.unshift(...Array.from(this.host.columns));\n        }\n        return cells;\n    }\n    get activeCell() {\n        return Array.from(this.hostCells).find(i => i.tabIndex === 0);\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        onFirstInteraction(this.host).then(() => {\n            initializeKeyListItems(this.hostCells);\n            this.hostGrid.addEventListener('mouseup', (e) => this.clickCell(e));\n            this.hostGrid.addEventListener('keydown', (e) => this.keynavCell(e));\n            this.hostGrid.addEventListener('keyup', (e) => this.updateCellActivation(e));\n        });\n        this.observers.push(onChildListMutation(this.host, () => initializeKeyListItems(this.hostCells)));\n    }\n    hostDisconnected() {\n        this.observers.forEach(o => o?.disconnect());\n    }\n    clickCell(e) {\n        if (!contextMenuClick(e)) {\n            const activeCell = e.composedPath().find(i => this.hostCells.find(c => c === i));\n            if (activeCell) {\n                this.setActiveCell(e, activeCell);\n            }\n        }\n    }\n    keynavCell(e) {\n        if (validKeyNavigationCode(e) && simpleFocusable(getActiveElement())) {\n            const { x, y } = getNextKeyGridItem(this.hostCells, this.hostRows, {\n                code: e.code,\n                ctrlKey: e.ctrlKey,\n                dir: this.host.dir,\n            });\n            const nextCell = Array.from(getFlattenedDOMTree(this.hostRows[y])).filter(c => !!this.hostCells.find(i => i === c))[x];\n            this.setActiveCell(e, nextCell);\n            e.preventDefault();\n        }\n    }\n    setActiveCell(e, activeCell) {\n        setActiveKeyListItem(this.hostCells, activeCell);\n        // https://w3c.github.io/aria-practices/#gridNav_focus\n        const items = getFlattenedFocusableItems(activeCell);\n        const simpleItems = items.filter(i => simpleFocusable(i));\n        if (simpleItems.length === 1 && items.length === 1) {\n            focusElement(simpleItems[0]);\n        }\n        else {\n            focusElement(activeCell);\n        }\n        activeCell.dispatchEvent(new CustomEvent('cdsKeyChange', {\n            bubbles: true,\n            detail: { code: e.code, shiftKey: e.shiftKey, activeItem: activeCell },\n        }));\n    }\n    updateCellActivation(e) {\n        if (e.code === 'Escape') {\n            this.activeCell?.focus();\n        }\n        if (e.code === 'Enter' && this.activeCell === e.composedPath()[0]) {\n            getFlattenedFocusableItems(this.activeCell)[0]?.focus();\n        }\n    }\n}\n"],"names":["keyNavigationGrid","target","addInitializer","instance","KeyNavigationGridController","constructor","host","this","observers","addController","hostGrid","keyNavGrid","hostRows","rows","Array","from","columnRow","unshift","hostCells","cells","columns","activeCell","find","i","tabIndex","async","updateComplete","onFirstInteraction","then","initializeKeyListItems","addEventListener","e","clickCell","keynavCell","updateCellActivation","push","onChildListMutation","hostDisconnected","forEach","o","disconnect","contextMenuClick","composedPath","c","setActiveCell","validKeyNavigationCode","simpleFocusable","getActiveElement","x","y","getNextKeyGridItem","code","ctrlKey","dir","nextCell","getFlattenedDOMTree","filter","preventDefault","setActiveKeyListItem","items","getFlattenedFocusableItems","simpleItems","length","focusElement","dispatchEvent","CustomEvent","bubbles","detail","shiftKey","activeItem","focus"],"mappings":"+eAeO,SAASA,IACZ,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAA4BD,KAEpF,MAAMC,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKC,UAAY,GACjBD,KAAKD,KAAKG,cAAcF,MAExBG,eACA,OAAOH,KAAKD,KAAKK,WAAaJ,KAAKD,KAAKK,WAAaJ,KAAKD,KAE1DM,eACA,MAAMC,EAAOC,MAAMC,KAAKR,KAAKD,KAAKO,MAIlC,OAHIN,KAAKD,KAAKU,WACVH,EAAKI,QAAQV,KAAKD,KAAKU,WAEpBH,EAEPK,gBACA,MAAMC,EAAQL,MAAMC,KAAKR,KAAKD,KAAKa,OAInC,OAHIZ,KAAKD,KAAKc,SACVD,EAAMF,WAAWH,MAAMC,KAAKR,KAAKD,KAAKc,UAEnCD,EAEPE,iBACA,OAAOP,MAAMC,KAAKR,KAAKW,WAAWI,MAAKC,GAAoB,IAAfA,EAAEC,WAElDC,4BACUlB,KAAKD,KAAKoB,eAChBC,EAAmBpB,KAAKD,MAAMsB,MAAK,KAC/BC,EAAuBtB,KAAKW,WAC5BX,KAAKG,SAASoB,iBAAiB,WAAYC,GAAMxB,KAAKyB,UAAUD,KAChExB,KAAKG,SAASoB,iBAAiB,WAAYC,GAAMxB,KAAK0B,WAAWF,KACjExB,KAAKG,SAASoB,iBAAiB,SAAUC,GAAMxB,KAAK2B,qBAAqBH,QAE7ExB,KAAKC,UAAU2B,KAAKC,EAAoB7B,KAAKD,MAAM,IAAMuB,EAAuBtB,KAAKW,cAEzFmB,mBACI9B,KAAKC,UAAU8B,SAAQC,GAAKA,GAAGC,eAEnCR,UAAUD,GACN,IAAKU,EAAiBV,GAAI,CACtB,MAAMV,EAAaU,EAAEW,eAAepB,MAAKC,GAAKhB,KAAKW,UAAUI,MAAKqB,GAAKA,IAAMpB,MACzEF,GACAd,KAAKqC,cAAcb,EAAGV,IAIlCY,WAAWF,GACP,GAAIc,EAAuBd,IAAMe,EAAgBC,KAAqB,CAClE,MAAMC,EAAEA,EAACC,EAAEA,GAAMC,EAAmB3C,KAAKW,UAAWX,KAAKK,SAAU,CAC/DuC,KAAMpB,EAAEoB,KACRC,QAASrB,EAAEqB,QACXC,IAAK9C,KAAKD,KAAK+C,MAEbC,EAAWxC,MAAMC,KAAKwC,EAAoBhD,KAAKK,SAASqC,KAAKO,QAAOb,KAAOpC,KAAKW,UAAUI,MAAKC,GAAKA,IAAMoB,MAAIK,GACpHzC,KAAKqC,cAAcb,EAAGuB,GACtBvB,EAAE0B,kBAGVb,cAAcb,EAAGV,GACbqC,EAAqBnD,KAAKW,UAAWG,GAErC,MAAMsC,EAAQC,EAA2BvC,GACnCwC,EAAcF,EAAMH,QAAOjC,GAAKuB,EAAgBvB,KAC3B,IAAvBsC,EAAYC,QAAiC,IAAjBH,EAAMG,OAClCC,EAAaF,EAAY,IAGzBE,EAAa1C,GAEjBA,EAAW2C,cAAc,IAAIC,YAAY,eAAgB,CACrDC,SAAS,EACTC,OAAQ,CAAEhB,KAAMpB,EAAEoB,KAAMiB,SAAUrC,EAAEqC,SAAUC,WAAYhD,MAGlEa,qBAAqBH,GACF,WAAXA,EAAEoB,MACF5C,KAAKc,YAAYiD,QAEN,UAAXvC,EAAEoB,MAAoB5C,KAAKc,aAAeU,EAAEW,eAAe,IAC3DkB,EAA2BrD,KAAKc,YAAY,IAAIiD"}

package/internal/controllers/key-navigation-list.controller.d.ts

@@ -0,0 +1,26 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+export interface KeyNavigationListConfig {
+    keyListItems: string;
+    layout: 'both' | 'horizontal' | 'vertical';
+    manageFocus: boolean;
+    manageTabindex: boolean;
+    loop: boolean;
+    dir: string | null;
+}
+/**
+ * Provides key list naviation behavior
+ * https://webaim.org/techniques/keyboard/
+ */
+export declare function keyNavigationList<T extends ReactiveElement>(config?: Partial<KeyNavigationListConfig>): ClassDecorator;
+export declare class KeyNavigationListController<T extends ReactiveElement> implements ReactiveController {
+    private host;
+    private get listItems();
+    private config;
+    constructor(host: T, config?: Partial<KeyNavigationListConfig>);
+    hostConnected(): Promise<void>;
+    private initializeTabIndex;
+    private clickItem;
+    private focusItem;
+    private getActiveItem;
+    private setActiveItem;
+}

package/internal/controllers/key-navigation-list.controller.js

@@ -0,0 +1,2 @@
+import{initializeKeyListItems as t,setActiveKeyListItem as e,focusElement as s}from"../utils/focus.js";import{validKeyNavigationCode as i}from"../utils/keycodes.js";import{getFlattenedFocusableItems as o}from"../utils/traversal.js";import{getNextKeyListItem as n}from"./key-navigation.utils.js";function a(t={}){return e=>{e.addInitializer((e=>{e.keyNavigationListController||(e.keyNavigationListController=new c(e,t))}))}}class c{constructor(t,e={}){this.host=t,this.host.addController(this),this.config={keyListItems:"keyListItems",layout:"horizontal",manageFocus:!0,manageTabindex:!0,loop:!1,dir:this.host.getAttribute("rtl"),...e}}get listItems(){return this.host[this.config.keyListItems]}async hostConnected(){await this.host.updateComplete,this.initializeTabIndex(),this.host.addEventListener("click",(t=>this.clickItem(t))),this.host.addEventListener("keydown",(t=>this.focusItem(t))),this.host.shadowRoot?.addEventListener("click",(t=>this.clickItem(t))),this.host.shadowRoot?.addEventListener("keydown",(t=>this.focusItem(t)))}initializeTabIndex(){this.config.manageFocus&&this.config.manageTabindex&&t(this.listItems)}clickItem(t){const e=this.getActiveItem(t);e&&this.setActiveItem(t,e)}focusItem(t){if(i(t)){const e=this.getActiveItem(t);if(e){const{next:s,previous:i}=n(e,Array.from(this.listItems),{...this.config,code:t.code});s!==i&&this.setActiveItem(t,this.listItems[s],this.listItems[i])}}}getActiveItem(t){return Array.from(this.listItems).find((e=>e===t.target.closest(this.listItems[0].tagName.toLocaleLowerCase())??e===t.target))}setActiveItem(t,i,n){if(this.config.manageFocus){this.config.manageTabindex&&e(this.listItems,i);const n=o(i)[0]??i;s(n),t.preventDefault()}i.dispatchEvent(new CustomEvent("cdsKeyChange",{bubbles:!0,detail:{activeItem:i,previousItem:n,code:t.code,metaKey:t.ctrlKey||t.metaKey,keyListItems:this.config.keyListItems}}))}}export{c as KeyNavigationListController,a as keyNavigationList};
+//# sourceMappingURL=key-navigation-list.controller.js.map

package/internal/controllers/key-navigation-list.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"key-navigation-list.controller.js","sources":["../../../../src/internal/controllers/key-navigation-list.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { focusElement, initializeKeyListItems, setActiveKeyListItem } from '../utils/focus.js';\nimport { validKeyNavigationCode } from '../utils/keycodes.js';\nimport { getFlattenedFocusableItems } from '../utils/traversal.js';\nimport { getNextKeyListItem } from './key-navigation.utils.js';\n/**\n * Provides key list naviation behavior\n * https://webaim.org/techniques/keyboard/\n */\nexport function keyNavigationList(config = {}) {\n    return (target) => {\n        target.addInitializer((instance) => {\n            if (!instance.keyNavigationListController) {\n                instance.keyNavigationListController = new KeyNavigationListController(instance, config);\n            }\n        });\n    };\n}\nexport class KeyNavigationListController {\n    constructor(host, config = {}) {\n        this.host = host;\n        this.host.addController(this);\n        this.config = {\n            keyListItems: 'keyListItems',\n            layout: 'horizontal',\n            manageFocus: true,\n            manageTabindex: true,\n            loop: false,\n            dir: this.host.getAttribute('rtl'),\n            ...config,\n        };\n    }\n    get listItems() {\n        return this.host[this.config.keyListItems];\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        this.initializeTabIndex();\n        this.host.addEventListener('click', (e) => this.clickItem(e));\n        this.host.addEventListener('keydown', (e) => this.focusItem(e));\n        this.host.shadowRoot?.addEventListener('click', (e) => this.clickItem(e));\n        this.host.shadowRoot?.addEventListener('keydown', (e) => this.focusItem(e));\n    }\n    initializeTabIndex() {\n        if (this.config.manageFocus && this.config.manageTabindex) {\n            initializeKeyListItems(this.listItems);\n        }\n    }\n    clickItem(e) {\n        const activeItem = this.getActiveItem(e);\n        if (activeItem) {\n            this.setActiveItem(e, activeItem);\n        }\n    }\n    focusItem(e) {\n        if (validKeyNavigationCode(e)) {\n            const activeItem = this.getActiveItem(e);\n            if (activeItem) {\n                const { next, previous } = getNextKeyListItem(activeItem, Array.from(this.listItems), {\n                    ...this.config,\n                    code: e.code,\n                });\n                if (next !== previous) {\n                    // todo: test for only emiting when position has changed\n                    this.setActiveItem(e, this.listItems[next], this.listItems[previous]);\n                }\n            }\n        }\n    }\n    getActiveItem(e) {\n        return Array.from(this.listItems).find(c => c === e.target.closest(this.listItems[0].tagName.toLocaleLowerCase()) ?? c === e.target);\n    }\n    setActiveItem(e, activeItem, previousItem) {\n        if (this.config.manageFocus) {\n            if (this.config.manageTabindex) {\n                setActiveKeyListItem(this.listItems, activeItem);\n            }\n            const items = getFlattenedFocusableItems(activeItem);\n            const item = items[0] ?? activeItem;\n            focusElement(item);\n            e.preventDefault();\n        }\n        activeItem.dispatchEvent(new CustomEvent('cdsKeyChange', {\n            bubbles: true,\n            detail: {\n                activeItem,\n                previousItem,\n                code: e.code,\n                metaKey: e.ctrlKey || e.metaKey,\n                keyListItems: this.config.keyListItems,\n            },\n        }));\n    }\n}\n"],"names":["keyNavigationList","config","target","addInitializer","instance","keyNavigationListController","KeyNavigationListController","constructor","host","this","addController","keyListItems","layout","manageFocus","manageTabindex","loop","dir","getAttribute","listItems","async","updateComplete","initializeTabIndex","addEventListener","e","clickItem","focusItem","shadowRoot","initializeKeyListItems","activeItem","getActiveItem","setActiveItem","validKeyNavigationCode","next","previous","getNextKeyListItem","Array","from","code","find","c","closest","tagName","toLocaleLowerCase","previousItem","setActiveKeyListItem","item","getFlattenedFocusableItems","focusElement","preventDefault","dispatchEvent","CustomEvent","bubbles","detail","metaKey","ctrlKey"],"mappings":"uSAaO,SAASA,EAAkBC,EAAS,IACvC,OAAQC,IACJA,EAAOC,gBAAgBC,IACdA,EAASC,8BACVD,EAASC,4BAA8B,IAAIC,EAA4BF,EAAUH,QAK1F,MAAMK,EACTC,YAAYC,EAAMP,EAAS,IACvBQ,KAAKD,KAAOA,EACZC,KAAKD,KAAKE,cAAcD,MACxBA,KAAKR,OAAS,CACVU,aAAc,eACdC,OAAQ,aACRC,aAAa,EACbC,gBAAgB,EAChBC,MAAM,EACNC,IAAKP,KAAKD,KAAKS,aAAa,UACzBhB,GAGPiB,gBACA,OAAOT,KAAKD,KAAKC,KAAKR,OAAOU,cAEjCQ,4BACUV,KAAKD,KAAKY,eAChBX,KAAKY,qBACLZ,KAAKD,KAAKc,iBAAiB,SAAUC,GAAMd,KAAKe,UAAUD,KAC1Dd,KAAKD,KAAKc,iBAAiB,WAAYC,GAAMd,KAAKgB,UAAUF,KAC5Dd,KAAKD,KAAKkB,YAAYJ,iBAAiB,SAAUC,GAAMd,KAAKe,UAAUD,KACtEd,KAAKD,KAAKkB,YAAYJ,iBAAiB,WAAYC,GAAMd,KAAKgB,UAAUF,KAE5EF,qBACQZ,KAAKR,OAAOY,aAAeJ,KAAKR,OAAOa,gBACvCa,EAAuBlB,KAAKS,WAGpCM,UAAUD,GACN,MAAMK,EAAanB,KAAKoB,cAAcN,GAClCK,GACAnB,KAAKqB,cAAcP,EAAGK,GAG9BH,UAAUF,GACN,GAAIQ,EAAuBR,GAAI,CAC3B,MAAMK,EAAanB,KAAKoB,cAAcN,GACtC,GAAIK,EAAY,CACZ,MAAMI,KAAEA,EAAIC,SAAEA,GAAaC,EAAmBN,EAAYO,MAAMC,KAAK3B,KAAKS,WAAY,IAC/ET,KAAKR,OACRoC,KAAMd,EAAEc,OAERL,IAASC,GAETxB,KAAKqB,cAAcP,EAAGd,KAAKS,UAAUc,GAAOvB,KAAKS,UAAUe,MAK3EJ,cAAcN,GACV,OAAOY,MAAMC,KAAK3B,KAAKS,WAAWoB,MAAKC,GAAKA,IAAMhB,EAAErB,OAAOsC,QAAQ/B,KAAKS,UAAU,GAAGuB,QAAQC,sBAAwBH,IAAMhB,EAAErB,SAEjI4B,cAAcP,EAAGK,EAAYe,GACzB,GAAIlC,KAAKR,OAAOY,YAAa,CACrBJ,KAAKR,OAAOa,gBACZ8B,EAAqBnC,KAAKS,UAAWU,GAEzC,MACMiB,EADQC,EAA2BlB,GACtB,IAAMA,EACzBmB,EAAaF,GACbtB,EAAEyB,iBAENpB,EAAWqB,cAAc,IAAIC,YAAY,eAAgB,CACrDC,SAAS,EACTC,OAAQ,CACJxB,WAAAA,EACAe,aAAAA,EACAN,KAAMd,EAAEc,KACRgB,QAAS9B,EAAE+B,SAAW/B,EAAE8B,QACxB1C,aAAcF,KAAKR,OAAOU"}

package/internal/controllers/key-navigation.utils.d.ts

@@ -0,0 +1,19 @@
+import { KeyNavigationCode } from '../utils/keycodes.js';
+export declare function getNextKeyGridItem(cells: HTMLElement[], rows: HTMLElement[], config: {
+    code: KeyNavigationCode | string;
+    ctrlKey: boolean;
+    dir: string;
+}): {
+    x: number;
+    y: number;
+};
+export interface KeyListConfig {
+    code: KeyNavigationCode;
+    loop?: boolean;
+    layout?: 'horizontal' | 'vertical' | 'both';
+    dir: string | null | undefined;
+}
+export declare function getNextKeyListItem(item: HTMLElement, items: HTMLElement[], config: KeyListConfig): {
+    next: number;
+    previous: number;
+};

package/internal/controllers/key-navigation.utils.js

@@ -0,0 +1,2 @@
+import{KeyNavigationCode as r}from"../utils/keycodes.js";import{getFlattenedDOMTree as o}from"../utils/traversal.js";function t(t,e,n){const i=t.find((r=>0===r.tabIndex)),l=e.find((r=>o(r).find((r=>r===i)))),w=Array.from(o(l)).filter((r=>!!t.find((o=>o===r)))),f=e.length-1,a=w.length-1,{code:d,ctrlKey:A,dir:c}=n;let g=w.indexOf(i),h=e.indexOf(l);const s="rtl"===c?r.ArrowRight:r.ArrowLeft,p="rtl"===c?r.ArrowLeft:r.ArrowRight;return d===r.ArrowUp&&0!==h?h-=1:d===r.ArrowDown&&h<f?h+=1:d===s&&0!==g?g-=1:d===p&&g<a?g+=1:d===r.End?(g=a,A&&(h=f)):d===r.Home?(g=0,A&&(h=0)):d===r.PageUp?h=h-4>0?h-4:0:d===r.PageDown&&(h=h+4<f?h+4:f),{x:g,y:h}}function e(o,t,e){const{code:n,layout:i,loop:l,dir:w}=e;let f=t.indexOf(o);const a=f,d="rtl"===w?r.ArrowRight:r.ArrowLeft,A="rtl"===w?r.ArrowLeft:r.ArrowRight,c=t.length-1;return"horizontal"!==i&&n===r.ArrowUp&&0!==f?f-=1:"horizontal"!==i&&n===r.ArrowUp&&0===f&&l?f=c:"horizontal"!==i&&n===r.ArrowDown&&f<c?f+=1:"horizontal"!==i&&n===r.ArrowDown&&f===c&&l?f=0:"vertical"!==i&&n===d&&0!==f?f-=1:"vertical"!==i&&n===A&&f<c?f+=1:n===r.End?f=c:n===r.Home?f=0:n===r.PageUp?f=f-4>0?f-4:0:n===r.PageDown&&(f=f+4<c?f+4:c),{next:f,previous:a}}export{t as getNextKeyGridItem,e as getNextKeyListItem};
+//# sourceMappingURL=key-navigation.utils.js.map

package/internal/controllers/key-navigation.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"key-navigation.utils.js","sources":["../../../../src/internal/controllers/key-navigation.utils.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { KeyNavigationCode } from '../utils/keycodes.js';\nimport { getFlattenedDOMTree } from '../utils/traversal.js';\n// todo cory: unit test\nexport function getNextKeyGridItem(cells, rows, config) {\n    const currentCell = cells.find(i => i.tabIndex === 0);\n    const currentRow = rows.find(r => getFlattenedDOMTree(r).find(c => c === currentCell));\n    const currentRowCells = Array.from(getFlattenedDOMTree(currentRow)).filter(c => !!cells.find(i => i === c));\n    const numOfRows = rows.length - 1;\n    const numOfColumns = currentRowCells.length - 1;\n    const { code, ctrlKey, dir } = config;\n    let x = currentRowCells.indexOf(currentCell);\n    let y = rows.indexOf(currentRow);\n    const inlineStart = dir === 'rtl' ? KeyNavigationCode.ArrowRight : KeyNavigationCode.ArrowLeft;\n    const inlineEnd = dir === 'rtl' ? KeyNavigationCode.ArrowLeft : KeyNavigationCode.ArrowRight;\n    if (code === KeyNavigationCode.ArrowUp && y !== 0) {\n        y = y - 1;\n    }\n    else if (code === KeyNavigationCode.ArrowDown && y < numOfRows) {\n        y = y + 1;\n    }\n    else if (code === inlineStart && x !== 0) {\n        x = x - 1;\n    }\n    else if (code === inlineEnd && x < numOfColumns) {\n        x = x + 1;\n    }\n    else if (code === KeyNavigationCode.End) {\n        x = numOfColumns;\n        if (ctrlKey) {\n            y = numOfRows;\n        }\n    }\n    else if (code === KeyNavigationCode.Home) {\n        x = 0;\n        if (ctrlKey) {\n            y = 0;\n        }\n    }\n    else if (code === KeyNavigationCode.PageUp) {\n        y = y - 4 > 0 ? y - 4 : 0;\n    }\n    else if (code === KeyNavigationCode.PageDown) {\n        y = y + 4 < numOfRows ? y + 4 : numOfRows;\n    }\n    return { x, y };\n}\nexport function getNextKeyListItem(item, items, config) {\n    // todo: cory test\n    const { code, layout, loop, dir } = config;\n    let i = items.indexOf(item);\n    const previous = i;\n    const inlineStart = dir === 'rtl' ? KeyNavigationCode.ArrowRight : KeyNavigationCode.ArrowLeft;\n    const inlineEnd = dir === 'rtl' ? KeyNavigationCode.ArrowLeft : KeyNavigationCode.ArrowRight;\n    const numOfItems = items.length - 1;\n    if (layout !== 'horizontal' && code === KeyNavigationCode.ArrowUp && i !== 0) {\n        i = i - 1;\n    }\n    else if (layout !== 'horizontal' && code === KeyNavigationCode.ArrowUp && i === 0 && loop) {\n        i = numOfItems;\n    }\n    else if (layout !== 'horizontal' && code === KeyNavigationCode.ArrowDown && i < numOfItems) {\n        i = i + 1;\n    }\n    else if (layout !== 'horizontal' && code === KeyNavigationCode.ArrowDown && i === numOfItems && loop) {\n        i = 0;\n    }\n    else if (layout !== 'vertical' && code === inlineStart && i !== 0) {\n        i = i - 1;\n    }\n    else if (layout !== 'vertical' && code === inlineEnd && i < numOfItems) {\n        i = i + 1;\n    }\n    else if (code === KeyNavigationCode.End) {\n        i = numOfItems;\n    }\n    else if (code === KeyNavigationCode.Home) {\n        i = 0;\n    }\n    else if (code === KeyNavigationCode.PageUp) {\n        i = i - 4 > 0 ? i - 4 : 0;\n    }\n    else if (code === KeyNavigationCode.PageDown) {\n        i = i + 4 < numOfItems ? i + 4 : numOfItems;\n    }\n    return { next: i, previous };\n}\n"],"names":["getNextKeyGridItem","cells","rows","config","currentCell","find","i","tabIndex","currentRow","r","getFlattenedDOMTree","c","currentRowCells","Array","from","filter","numOfRows","length","numOfColumns","code","ctrlKey","dir","x","indexOf","y","inlineStart","KeyNavigationCode","ArrowRight","ArrowLeft","inlineEnd","ArrowUp","ArrowDown","End","Home","PageUp","PageDown","getNextKeyListItem","item","items","layout","loop","previous","numOfItems","next"],"mappings":"qHAQO,SAASA,EAAmBC,EAAOC,EAAMC,GAC5C,MAAMC,EAAcH,EAAMI,MAAKC,GAAoB,IAAfA,EAAEC,WAChCC,EAAaN,EAAKG,MAAKI,GAAKC,EAAoBD,GAAGJ,MAAKM,GAAKA,IAAMP,MACnEQ,EAAkBC,MAAMC,KAAKJ,EAAoBF,IAAaO,QAAOJ,KAAOV,EAAMI,MAAKC,GAAKA,IAAMK,MAClGK,EAAYd,EAAKe,OAAS,EAC1BC,EAAeN,EAAgBK,OAAS,GACxCE,KAAEA,EAAIC,QAAEA,EAAOC,IAAEA,GAAQlB,EAC/B,IAAImB,EAAIV,EAAgBW,QAAQnB,GAC5BoB,EAAItB,EAAKqB,QAAQf,GACrB,MAAMiB,EAAsB,QAARJ,EAAgBK,EAAkBC,WAAaD,EAAkBE,UAC/EC,EAAoB,QAARR,EAAgBK,EAAkBE,UAAYF,EAAkBC,WA+BlF,OA9BIR,IAASO,EAAkBI,SAAiB,IAANN,EACtCA,GAAQ,EAEHL,IAASO,EAAkBK,WAAaP,EAAIR,EACjDQ,GAAQ,EAEHL,IAASM,GAAqB,IAANH,EAC7BA,GAAQ,EAEHH,IAASU,GAAaP,EAAIJ,EAC/BI,GAAQ,EAEHH,IAASO,EAAkBM,KAChCV,EAAIJ,EACAE,IACAI,EAAIR,IAGHG,IAASO,EAAkBO,MAChCX,EAAI,EACAF,IACAI,EAAI,IAGHL,IAASO,EAAkBQ,OAChCV,EAAIA,EAAI,EAAI,EAAIA,EAAI,EAAI,EAEnBL,IAASO,EAAkBS,WAChCX,EAAIA,EAAI,EAAIR,EAAYQ,EAAI,EAAIR,GAE7B,CAAEM,EAAAA,EAAGE,EAAAA,GAET,SAASY,EAAmBC,EAAMC,EAAOnC,GAE5C,MAAMgB,KAAEA,EAAIoB,OAAEA,EAAMC,KAAEA,EAAInB,IAAEA,GAAQlB,EACpC,IAAIG,EAAIgC,EAAMf,QAAQc,GACtB,MAAMI,EAAWnC,EACXmB,EAAsB,QAARJ,EAAgBK,EAAkBC,WAAaD,EAAkBE,UAC/EC,EAAoB,QAARR,EAAgBK,EAAkBE,UAAYF,EAAkBC,WAC5Ee,EAAaJ,EAAMrB,OAAS,EA+BlC,MA9Be,eAAXsB,GAA2BpB,IAASO,EAAkBI,SAAiB,IAANxB,EACjEA,GAAQ,EAEQ,eAAXiC,GAA2BpB,IAASO,EAAkBI,SAAiB,IAANxB,GAAWkC,EACjFlC,EAAIoC,EAEY,eAAXH,GAA2BpB,IAASO,EAAkBK,WAAazB,EAAIoC,EAC5EpC,GAAQ,EAEQ,eAAXiC,GAA2BpB,IAASO,EAAkBK,WAAazB,IAAMoC,GAAcF,EAC5FlC,EAAI,EAEY,aAAXiC,GAAyBpB,IAASM,GAAqB,IAANnB,EACtDA,GAAQ,EAEQ,aAAXiC,GAAyBpB,IAASU,GAAavB,EAAIoC,EACxDpC,GAAQ,EAEHa,IAASO,EAAkBM,IAChC1B,EAAIoC,EAECvB,IAASO,EAAkBO,KAChC3B,EAAI,EAECa,IAASO,EAAkBQ,OAChC5B,EAAIA,EAAI,EAAI,EAAIA,EAAI,EAAI,EAEnBa,IAASO,EAAkBS,WAChC7B,EAAIA,EAAI,EAAIoC,EAAapC,EAAI,EAAIoC,GAE9B,CAAEC,KAAMrC,EAAGmC,SAAAA"}

package/internal/controllers/layer.controller.d.ts

@@ -0,0 +1,24 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+/**
+ * LayerController provides manage layer tracking for components. Ensures any component
+ * that may be a layer on top of other components is given a ordered index relative
+ * to other existing layers on the page.
+ *
+ * This makes layer tracking easier for CSS, such as targeting the top or bottom
+ * layer element or setting a z-index ordering.
+ */
+export declare function layer<T extends ReactiveElement>(): ClassDecorator;
+export declare class LayerController<T extends ReactiveElement> implements ReactiveController {
+    private host;
+    private observer;
+    constructor(host: T);
+    get isActiveLayer(): boolean;
+    get layerIndex(): number | null;
+    private get layers();
+    private set layers(value);
+    hostConnected(): void;
+    hostDisconnected(): void;
+    private updateLayer;
+    private addLayer;
+    private removeLayer;
+}

package/internal/controllers/layer.controller.js

@@ -0,0 +1,2 @@
+import{listenForAttributeChange as t}from"../utils/events.js";import{GlobalStateService as e}from"../services/global.service.js";function s(){return t=>{t.addInitializer((t=>{t.layerController||(t.layerController=new r(t))}))}}class r{constructor(t){this.host=t,this.host.addController(this)}get isActiveLayer(){return this.layers[this.layers.length-1]===this.host}get layerIndex(){const t=this.layers.indexOf(this.host);return-1===t?null:t}get layers(){return[...e.state.layerElements]}set layers(t){e.state.layerElements=[...t]}hostConnected(){this.host.hasAttribute("_demo-mode")||(this.updateLayer(),this.observer=t(this.host,"hidden",(()=>this.updateLayer())))}hostDisconnected(){this.observer?.disconnect(),this.removeLayer()}updateLayer(){this.host.hasAttribute("hidden")?this.removeLayer():this.addLayer(),this.layers.forEach(((t,e)=>t.setAttribute("cds-layer",""+e)))}addLayer(){this.layers.find((t=>this.host===t))||(this.layers=[...this.layers,this.host],"true"===this.host.ariaModal&&(this.layers.filter((t=>"true"===t.ariaModal)).forEach((t=>t.role="region")),this.host.role="dialog"))}removeLayer(){this.layers=this.layers.filter((t=>t!==this.host)),this.host.removeAttribute("cds-layer");const t=this.layers.find((t=>"true"===t.ariaModal));t&&(t.role="dialog")}}export{r as LayerController,s as layer};
+//# sourceMappingURL=layer.controller.js.map

package/internal/controllers/layer.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layer.controller.js","sources":["../../../../src/internal/controllers/layer.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { listenForAttributeChange } from '../utils/events.js';\nimport { GlobalStateService } from '../services/global.service.js';\n/**\n * LayerController provides manage layer tracking for components. Ensures any component\n * that may be a layer on top of other components is given a ordered index relative\n * to other existing layers on the page.\n *\n * This makes layer tracking easier for CSS, such as targeting the top or bottom\n * layer element or setting a z-index ordering.\n */\nexport function layer() {\n    return (target) => {\n        target.addInitializer((instance) => {\n            if (!instance.layerController) {\n                instance.layerController = new LayerController(instance);\n            }\n        });\n    };\n}\nexport class LayerController {\n    constructor(host) {\n        this.host = host;\n        this.host.addController(this);\n    }\n    get isActiveLayer() {\n        return this.layers[this.layers.length - 1] === this.host;\n    }\n    get layerIndex() {\n        const index = this.layers.indexOf(this.host);\n        return index === -1 ? null : index;\n    }\n    get layers() {\n        return [...GlobalStateService.state.layerElements];\n    }\n    set layers(layers) {\n        GlobalStateService.state.layerElements = [...layers];\n    }\n    hostConnected() {\n        if (!this.host.hasAttribute('_demo-mode')) {\n            this.updateLayer();\n            this.observer = listenForAttributeChange(this.host, 'hidden', () => this.updateLayer());\n        }\n    }\n    hostDisconnected() {\n        this.observer?.disconnect();\n        this.removeLayer();\n    }\n    updateLayer() {\n        if (this.host.hasAttribute('hidden')) {\n            this.removeLayer();\n        }\n        else {\n            this.addLayer();\n        }\n        this.layers.forEach((layer, i) => layer.setAttribute('cds-layer', `${i}`));\n    }\n    addLayer() {\n        if (!this.layers.find(layer => this.host === layer)) {\n            this.layers = [...this.layers, this.host];\n            // We do this so that screen-readers can make their way through nested/layered overlays.\n            // It sets a virtual cursor trap on the top-most overlay.\n            if (this.host.ariaModal === 'true') {\n                this.layers.filter(layer => layer.ariaModal === 'true').forEach(layer => (layer.role = 'region'));\n                this.host.role = 'dialog';\n            }\n        }\n    }\n    removeLayer() {\n        this.layers = this.layers.filter(layer => layer !== this.host);\n        this.host.removeAttribute('cds-layer');\n        const nextModal = this.layers.find(layer => layer.ariaModal === 'true');\n        if (nextModal) {\n            nextModal.role = 'dialog';\n        }\n    }\n}\n"],"names":["layer","target","addInitializer","instance","layerController","LayerController","constructor","host","this","addController","isActiveLayer","layers","length","layerIndex","index","indexOf","GlobalStateService","state","layerElements","hostConnected","hasAttribute","updateLayer","observer","listenForAttributeChange","hostDisconnected","disconnect","removeLayer","addLayer","forEach","i","setAttribute","find","ariaModal","filter","role","removeAttribute","nextModal"],"mappings":"iIAeO,SAASA,IACZ,OAAQC,IACJA,EAAOC,gBAAgBC,IACdA,EAASC,kBACVD,EAASC,gBAAkB,IAAIC,EAAgBF,QAKxD,MAAME,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKD,KAAKE,cAAcD,MAExBE,oBACA,OAAOF,KAAKG,OAAOH,KAAKG,OAAOC,OAAS,KAAOJ,KAAKD,KAEpDM,iBACA,MAAMC,EAAQN,KAAKG,OAAOI,QAAQP,KAAKD,MACvC,OAAkB,IAAXO,EAAe,KAAOA,EAE7BH,aACA,MAAO,IAAIK,EAAmBC,MAAMC,eAEpCP,WAAOA,GACPK,EAAmBC,MAAMC,cAAgB,IAAIP,GAEjDQ,gBACSX,KAAKD,KAAKa,aAAa,gBACxBZ,KAAKa,cACLb,KAAKc,SAAWC,EAAyBf,KAAKD,KAAM,UAAU,IAAMC,KAAKa,iBAGjFG,mBACIhB,KAAKc,UAAUG,aACfjB,KAAKkB,cAETL,cACQb,KAAKD,KAAKa,aAAa,UACvBZ,KAAKkB,cAGLlB,KAAKmB,WAETnB,KAAKG,OAAOiB,SAAQ,CAAC5B,EAAO6B,IAAM7B,EAAM8B,aAAa,YAAa,GAAGD,KAEzEF,WACSnB,KAAKG,OAAOoB,MAAK/B,GAASQ,KAAKD,OAASP,MACzCQ,KAAKG,OAAS,IAAIH,KAAKG,OAAQH,KAAKD,MAGR,SAAxBC,KAAKD,KAAKyB,YACVxB,KAAKG,OAAOsB,QAAOjC,GAA6B,SAApBA,EAAMgC,YAAsBJ,SAAQ5B,GAAUA,EAAMkC,KAAO,WACvF1B,KAAKD,KAAK2B,KAAO,WAI7BR,cACIlB,KAAKG,OAASH,KAAKG,OAAOsB,QAAOjC,GAASA,IAAUQ,KAAKD,OACzDC,KAAKD,KAAK4B,gBAAgB,aAC1B,MAAMC,EAAY5B,KAAKG,OAAOoB,MAAK/B,GAA6B,SAApBA,EAAMgC,YAC9CI,IACAA,EAAUF,KAAO"}

package/internal/controllers/responsive.controller.d.ts

@@ -0,0 +1,19 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+interface ResponsiveConfig {
+    skipFirst?: boolean;
+    element?: HTMLElement;
+}
+/**
+ * Provides a `cdsResizeChange` event when component dimensions are resized
+ */
+export declare function responsive<T extends ReactiveElement>(config?: ResponsiveConfig): ClassDecorator;
+export declare class ResponsiveController<T extends ReactiveElement> implements ReactiveController {
+    private host;
+    private observer;
+    private resizeElement;
+    private skipFirst;
+    constructor(host: T, config?: ResponsiveConfig);
+    hostConnected(): Promise<void>;
+    hostDisconnected(): void;
+}
+export {};

package/internal/controllers/responsive.controller.js

@@ -0,0 +1,2 @@
+function t(t={skipFirst:!1}){return e=>e.addInitializer((e=>new s(e,t)))}class s{constructor(t,s={skipFirst:!1}){this.host=t,this.skipFirst=!1,this.host.addController(this),this.skipFirst=!!s.skipFirst,this.resizeElement=s.element?s.element:this.host}async hostConnected(){await this.host.updateComplete,this.observer=new ResizeObserver((t=>{window.requestAnimationFrame((()=>{this.skipFirst?this.skipFirst=!1:(this.host.dispatchEvent(new CustomEvent("cdsResizeChange",{detail:t[0].contentRect})),this.host.requestUpdate())}))})),this.observer.observe(this.resizeElement)}hostDisconnected(){this.observer?.disconnect()}}export{s as ResponsiveController,t as responsive};
+//# sourceMappingURL=responsive.controller.js.map

package/internal/controllers/responsive.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive.controller.js","sources":["../../../../src/internal/controllers/responsive.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\n/**\n * Provides a `cdsResizeChange` event when component dimensions are resized\n */\nexport function responsive(config = { skipFirst: false }) {\n    return (target) => target.addInitializer((instance) => new ResponsiveController(instance, config));\n}\nexport class ResponsiveController {\n    constructor(host, config = { skipFirst: false }) {\n        this.host = host;\n        this.skipFirst = false;\n        this.host.addController(this);\n        this.skipFirst = !!config.skipFirst;\n        this.resizeElement = config.element ? config.element : this.host;\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        this.observer = new ResizeObserver(entries => {\n            window.requestAnimationFrame(() => {\n                if (this.skipFirst) {\n                    this.skipFirst = false;\n                }\n                else {\n                    this.host.dispatchEvent(new CustomEvent('cdsResizeChange', { detail: entries[0].contentRect }));\n                    this.host.requestUpdate();\n                }\n            });\n        });\n        this.observer.observe(this.resizeElement);\n    }\n    hostDisconnected() {\n        this.observer?.disconnect();\n    }\n}\n"],"names":["responsive","config","skipFirst","target","addInitializer","instance","ResponsiveController","constructor","host","this","addController","resizeElement","element","async","updateComplete","observer","ResizeObserver","entries","window","requestAnimationFrame","dispatchEvent","CustomEvent","detail","contentRect","requestUpdate","observe","hostDisconnected","disconnect"],"mappings":"AAQO,SAASA,EAAWC,EAAS,CAAEC,WAAW,IAC7C,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAAqBD,EAAUJ,KAEvF,MAAMK,EACTC,YAAYC,EAAMP,EAAS,CAAEC,WAAW,IACpCO,KAAKD,KAAOA,EACZC,KAAKP,WAAY,EACjBO,KAAKD,KAAKE,cAAcD,MACxBA,KAAKP,YAAcD,EAAOC,UAC1BO,KAAKE,cAAgBV,EAAOW,QAAUX,EAAOW,QAAUH,KAAKD,KAEhEK,4BACUJ,KAAKD,KAAKM,eAChBL,KAAKM,SAAW,IAAIC,gBAAeC,IAC/BC,OAAOC,uBAAsB,KACrBV,KAAKP,UACLO,KAAKP,WAAY,GAGjBO,KAAKD,KAAKY,cAAc,IAAIC,YAAY,kBAAmB,CAAEC,OAAQL,EAAQ,GAAGM,eAChFd,KAAKD,KAAKgB,uBAItBf,KAAKM,SAASU,QAAQhB,KAAKE,eAE/Be,mBACIjB,KAAKM,UAAUY"}

package/internal/controllers/scrollable-list-visibility.controller.d.ts

@@ -0,0 +1,13 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+/**
+ * List items default to `content-visibility: auto` for lazy initial render.
+ * On scroll set all row items to `content-visibility: visible` for eager render.
+ * This allows fast first render and smooth eager rendering anytime after for items within a bounded scroll box.
+ */
+export declare function scrollableVisibility<T extends ReactiveElement>(): ClassDecorator;
+export declare class ScrollableVisibilityController<T extends ReactiveElement> implements ReactiveController {
+    private host;
+    private get root();
+    constructor(host: T);
+    hostConnected(): Promise<void>;
+}

package/internal/controllers/scrollable-list-visibility.controller.js

@@ -0,0 +1,2 @@
+function t(){return t=>t.addInitializer((t=>new o(t)))}class o{constructor(t){this.host=t,this.host.addController(this)}get root(){return this.host.shadowRoot?this.host.shadowRoot:this.host}async hostConnected(){await this.host.updateComplete,this.root.addEventListener("scroll",(()=>this.host.style.setProperty("--row-content-visibility","visibile")),{once:!0,capture:!0})}}export{o as ScrollableVisibilityController,t as scrollableVisibility};
+//# sourceMappingURL=scrollable-list-visibility.controller.js.map

package/internal/controllers/scrollable-list-visibility.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollable-list-visibility.controller.js","sources":["../../../../src/internal/controllers/scrollable-list-visibility.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\n/**\n * List items default to `content-visibility: auto` for lazy initial render.\n * On scroll set all row items to `content-visibility: visible` for eager render.\n * This allows fast first render and smooth eager rendering anytime after for items within a bounded scroll box.\n */\nexport function scrollableVisibility() {\n    return (target) => target.addInitializer((instance) => new ScrollableVisibilityController(instance));\n}\nexport class ScrollableVisibilityController {\n    constructor(host) {\n        this.host = host;\n        this.host.addController(this);\n    }\n    get root() {\n        return this.host.shadowRoot ? this.host.shadowRoot : this.host;\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        this.root.addEventListener('scroll', () => this.host.style.setProperty('--row-content-visibility', 'visibile'), {\n            once: true,\n            capture: true,\n        });\n    }\n}\n"],"names":["scrollableVisibility","target","addInitializer","instance","ScrollableVisibilityController","constructor","host","this","addController","root","shadowRoot","async","updateComplete","addEventListener","style","setProperty","once","capture"],"mappings":"AAUO,SAASA,IACZ,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAA+BD,KAEvF,MAAMC,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKD,KAAKE,cAAcD,MAExBE,WACA,OAAOF,KAAKD,KAAKI,WAAaH,KAAKD,KAAKI,WAAaH,KAAKD,KAE9DK,4BACUJ,KAAKD,KAAKM,eAChBL,KAAKE,KAAKI,iBAAiB,UAAU,IAAMN,KAAKD,KAAKQ,MAAMC,YAAY,2BAA4B,aAAa,CAC5GC,MAAM,EACNC,SAAS"}

package/internal/controllers/touch.controller.d.ts

@@ -0,0 +1,22 @@
+import { ReactiveElement, ReactiveController } from 'lit';
+export declare type Touch = ReactiveElement;
+/**
+ * @internal Provides all nessesary events for basic touch gestures
+ *
+ * @event cdsTouchStart
+ * @event cdsTouchMove
+ * @event cdsTouchEnd
+ */
+export declare function touch<T extends Touch>(): ClassDecorator;
+export declare class TouchController<T extends Touch> implements ReactiveController {
+    private host;
+    constructor(host: T);
+    private startPosition;
+    private moveHandler;
+    private endHandler;
+    hostConnected(): Promise<void>;
+    private start;
+    private end;
+    private move;
+    private getCoordinates;
+}

package/internal/controllers/touch.controller.js

@@ -0,0 +1,2 @@
+import{getOffesetDifference as t}from"../utils/math.js";function e(){return t=>t.addInitializer((t=>new s(t)))}class s{constructor(t){this.host=t,this.moveHandler=this.move.bind(this),this.endHandler=this.end.bind(this),this.host.addController(this)}async hostConnected(){await this.host.updateComplete,this.host.addEventListener("pointerdown",(t=>this.start(t)),{passive:!0})}start(t){t.path.find((t=>t===this.host))&&(this.startPosition={x:t.clientX,y:t.clientY},document.addEventListener("pointerup",this.endHandler,{passive:!0}),document.addEventListener("pointermove",this.moveHandler,{passive:!0}),this.host.dispatchEvent(new CustomEvent("cdsTouchStart",{detail:{...this.startPosition}})))}end(t){if(this.startPosition){const e=this.getCoordinates(t);document.removeEventListener("pointerup",this.endHandler,!1),document.removeEventListener("pointermove",this.moveHandler,!1),this.host.dispatchEvent(new CustomEvent("cdsTouchEnd",{detail:e}))}}move(t){requestAnimationFrame((()=>{const e=this.getCoordinates(t);this.startPosition={x:t.clientX,y:t.clientY},this.host.dispatchEvent(new CustomEvent("cdsTouchMove",{detail:e}))}))}getCoordinates(e){return{x:e.clientX,y:e.clientY,offsetX:t(this.startPosition.x,e.clientX),offsetY:t(this.startPosition.y,e.clientY)}}}export{s as TouchController,e as touch};
+//# sourceMappingURL=touch.controller.js.map

package/internal/controllers/touch.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"touch.controller.js","sources":["../../../../src/internal/controllers/touch.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { getOffesetDifference } from '../utils/math.js';\n/**\n * @internal Provides all nessesary events for basic touch gestures\n *\n * @event cdsTouchStart\n * @event cdsTouchMove\n * @event cdsTouchEnd\n */\nexport function touch() {\n    return (target) => target.addInitializer((instance) => new TouchController(instance));\n}\nexport class TouchController {\n    constructor(host) {\n        this.host = host;\n        this.moveHandler = this.move.bind(this);\n        this.endHandler = this.end.bind(this);\n        this.host.addController(this);\n    }\n    async hostConnected() {\n        await this.host.updateComplete;\n        this.host.addEventListener('pointerdown', (e) => this.start(e), { passive: true });\n    }\n    start(e) {\n        if (e.path.find((el) => el === this.host)) {\n            this.startPosition = { x: e.clientX, y: e.clientY };\n            document.addEventListener('pointerup', this.endHandler, { passive: true });\n            document.addEventListener('pointermove', this.moveHandler, { passive: true });\n            this.host.dispatchEvent(new CustomEvent('cdsTouchStart', { detail: { ...this.startPosition } }));\n        }\n    }\n    end(e) {\n        if (this.startPosition) {\n            const detail = this.getCoordinates(e);\n            document.removeEventListener('pointerup', this.endHandler, false);\n            document.removeEventListener('pointermove', this.moveHandler, false);\n            this.host.dispatchEvent(new CustomEvent('cdsTouchEnd', { detail }));\n        }\n    }\n    move(e) {\n        requestAnimationFrame(() => {\n            const detail = this.getCoordinates(e);\n            this.startPosition = { x: e.clientX, y: e.clientY };\n            this.host.dispatchEvent(new CustomEvent('cdsTouchMove', { detail }));\n        });\n    }\n    getCoordinates(e) {\n        return {\n            x: e.clientX,\n            y: e.clientY,\n            offsetX: getOffesetDifference(this.startPosition.x, e.clientX),\n            offsetY: getOffesetDifference(this.startPosition.y, e.clientY),\n        };\n    }\n}\n"],"names":["touch","target","addInitializer","instance","TouchController","constructor","host","this","moveHandler","move","bind","endHandler","end","addController","async","updateComplete","addEventListener","e","start","passive","path","find","el","startPosition","x","clientX","y","clientY","document","dispatchEvent","CustomEvent","detail","getCoordinates","removeEventListener","requestAnimationFrame","offsetX","getOffesetDifference","offsetY"],"mappings":"wDAaO,SAASA,IACZ,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAAgBD,KAExE,MAAMC,EACTC,YAAYC,GACRC,KAAKD,KAAOA,EACZC,KAAKC,YAAcD,KAAKE,KAAKC,KAAKH,MAClCA,KAAKI,WAAaJ,KAAKK,IAAIF,KAAKH,MAChCA,KAAKD,KAAKO,cAAcN,MAE5BO,4BACUP,KAAKD,KAAKS,eAChBR,KAAKD,KAAKU,iBAAiB,eAAgBC,GAAMV,KAAKW,MAAMD,IAAI,CAAEE,SAAS,IAE/ED,MAAMD,GACEA,EAAEG,KAAKC,MAAMC,GAAOA,IAAOf,KAAKD,SAChCC,KAAKgB,cAAgB,CAAEC,EAAGP,EAAEQ,QAASC,EAAGT,EAAEU,SAC1CC,SAASZ,iBAAiB,YAAaT,KAAKI,WAAY,CAAEQ,SAAS,IACnES,SAASZ,iBAAiB,cAAeT,KAAKC,YAAa,CAAEW,SAAS,IACtEZ,KAAKD,KAAKuB,cAAc,IAAIC,YAAY,gBAAiB,CAAEC,OAAQ,IAAKxB,KAAKgB,mBAGrFX,IAAIK,GACA,GAAIV,KAAKgB,cAAe,CACpB,MAAMQ,EAASxB,KAAKyB,eAAef,GACnCW,SAASK,oBAAoB,YAAa1B,KAAKI,YAAY,GAC3DiB,SAASK,oBAAoB,cAAe1B,KAAKC,aAAa,GAC9DD,KAAKD,KAAKuB,cAAc,IAAIC,YAAY,cAAe,CAAEC,OAAAA,MAGjEtB,KAAKQ,GACDiB,uBAAsB,KAClB,MAAMH,EAASxB,KAAKyB,eAAef,GACnCV,KAAKgB,cAAgB,CAAEC,EAAGP,EAAEQ,QAASC,EAAGT,EAAEU,SAC1CpB,KAAKD,KAAKuB,cAAc,IAAIC,YAAY,eAAgB,CAAEC,OAAAA,QAGlEC,eAAef,GACX,MAAO,CACHO,EAAGP,EAAEQ,QACLC,EAAGT,EAAEU,QACLQ,QAASC,EAAqB7B,KAAKgB,cAAcC,EAAGP,EAAEQ,SACtDY,QAASD,EAAqB7B,KAAKgB,cAAcG,EAAGT,EAAEU"}

package/internal/controllers/trigger.controller.d.ts

@@ -0,0 +1,31 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+export declare type Triggerable = ReactiveElement & {
+    trigger?: HTMLElement;
+};
+/**
+ * The TriggerController will track the last known interacted element
+ * when the host component was created or shown. This is used for when a component
+ * needs to know the element that "triggered" the interaction.
+ *
+ * Examples include, popover types, closable types and draggable types.
+ */
+export declare function triggerable<T extends Triggerable>(config?: {
+    focus: boolean;
+}): ClassDecorator;
+export declare class TriggerController<T extends Triggerable> implements ReactiveController {
+    private host;
+    private config;
+    private observer;
+    constructor(host: T, config?: {
+        focus: boolean;
+    });
+    private activeElement;
+    private _current;
+    get current(): HTMLElement;
+    private _prev;
+    get prev(): HTMLElement;
+    hostConnected(): Promise<void>;
+    hostUpdate(): void;
+    hostDisconnected(): void;
+    private focusCurrent;
+}

package/internal/controllers/trigger.controller.js

@@ -0,0 +1,2 @@
+import{listenForAttributeChange as t}from"../utils/events.js";import{getActiveElement as s}from"../utils/focus.js";function e(t={focus:!0}){return s=>s.addInitializer((s=>new r(s,t)))}class r{constructor(t,e={focus:!0}){this.host=t,this.config=e,this.activeElement=s(),this.host.addController(this)}get current(){return this.host.trigger?this._current:this.activeElement}get prev(){return this._prev}async hostConnected(){this.observer=t(this.host,"hidden",(()=>{const t=s();!this.host.hidden&&t?this.activeElement=t:this.focusCurrent()}))}hostUpdate(){this._current!==this.host.trigger&&(this._prev=this._current,this._current=this.host.trigger?this.host.trigger:this.activeElement)}hostDisconnected(){this.focusCurrent(),this.observer?.disconnect()}focusCurrent(){this.config.focus&&this.current?.focus()}}export{r as TriggerController,e as triggerable};
+//# sourceMappingURL=trigger.controller.js.map

package/internal/controllers/trigger.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"trigger.controller.js","sources":["../../../../src/internal/controllers/trigger.controller.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { listenForAttributeChange } from '../utils/events.js';\nimport { getActiveElement } from '../utils/focus.js';\n/**\n * The TriggerController will track the last known interacted element\n * when the host component was created or shown. This is used for when a component\n * needs to know the element that \"triggered\" the interaction.\n *\n * Examples include, popover types, closable types and draggable types.\n */\nexport function triggerable(config = { focus: true }) {\n    return (target) => target.addInitializer((instance) => new TriggerController(instance, config));\n}\nexport class TriggerController {\n    constructor(host, config = { focus: true }) {\n        this.host = host;\n        this.config = config;\n        this.activeElement = getActiveElement();\n        this.host.addController(this);\n    }\n    get current() {\n        return this.host.trigger ? this._current : this.activeElement;\n    }\n    get prev() {\n        return this._prev;\n    }\n    async hostConnected() {\n        this.observer = listenForAttributeChange(this.host, 'hidden', () => {\n            const activeElement = getActiveElement();\n            if (!this.host.hidden && activeElement) {\n                this.activeElement = activeElement;\n            }\n            else {\n                this.focusCurrent();\n            }\n        });\n    }\n    hostUpdate() {\n        if (this._current !== this.host.trigger) {\n            this._prev = this._current;\n            this._current = this.host.trigger ? this.host.trigger : this.activeElement;\n        }\n    }\n    hostDisconnected() {\n        this.focusCurrent();\n        this.observer?.disconnect();\n    }\n    focusCurrent() {\n        if (this.config.focus) {\n            this.current?.focus();\n        }\n    }\n}\n"],"names":["triggerable","config","focus","target","addInitializer","instance","TriggerController","constructor","host","this","activeElement","getActiveElement","addController","current","trigger","_current","prev","_prev","async","observer","listenForAttributeChange","hidden","focusCurrent","hostUpdate","hostDisconnected","disconnect"],"mappings":"mHAcO,SAASA,EAAYC,EAAS,CAAEC,OAAO,IAC1C,OAAQC,GAAWA,EAAOC,gBAAgBC,GAAa,IAAIC,EAAkBD,EAAUJ,KAEpF,MAAMK,EACTC,YAAYC,EAAMP,EAAS,CAAEC,OAAO,IAChCO,KAAKD,KAAOA,EACZC,KAAKR,OAASA,EACdQ,KAAKC,cAAgBC,IACrBF,KAAKD,KAAKI,cAAcH,MAExBI,cACA,OAAOJ,KAAKD,KAAKM,QAAUL,KAAKM,SAAWN,KAAKC,cAEhDM,WACA,OAAOP,KAAKQ,MAEhBC,sBACIT,KAAKU,SAAWC,EAAyBX,KAAKD,KAAM,UAAU,KAC1D,MAAME,EAAgBC,KACjBF,KAAKD,KAAKa,QAAUX,EACrBD,KAAKC,cAAgBA,EAGrBD,KAAKa,kBAIjBC,aACQd,KAAKM,WAAaN,KAAKD,KAAKM,UAC5BL,KAAKQ,MAAQR,KAAKM,SAClBN,KAAKM,SAAWN,KAAKD,KAAKM,QAAUL,KAAKD,KAAKM,QAAUL,KAAKC,eAGrEc,mBACIf,KAAKa,eACLb,KAAKU,UAAUM,aAEnBH,eACQb,KAAKR,OAAOC,OACZO,KAAKI,SAASX"}

package/internal/decorators/animate.d.ts

@@ -1,2 +1,2 @@
-import { PropertyDrivenAnimation } from '../motion/interfaces.js';
-export declare function animate(config: PropertyDrivenAnimation): <T extends new (...args: any[]) => {}>(constr: T) => T;
+import { AnimatableElement, PropertyDrivenAnimation } from '../motion/interfaces.js';
+export declare function animate(config: PropertyDrivenAnimation): <T extends new (...args: any[]) => AnimatableElement>(constructor: T) => T;

package/internal/decorators/animate.js

@@ -1,2 +1,2 @@
-import{PRIVATE_ANIMATION_STATUS_ATTR_NAME as t,AnimationStatus as e}from"../motion/interfaces.js";import{runPropertyAnimations as o}from"../motion/utils.js";function i(i){return function(r){const s=r;return class extends s{updated(r){super.updated(r);const s=this;s._animations=i||void 0,s.hasAttribute(t)?s.hasAttribute("_demo-mode")||o(r,s):s.setAttribute(t,e.ready)}}}}export{i as animate};
+import{PRIVATE_ANIMATION_STATUS_ATTR_NAME as t,AnimationStatus as i}from"../motion/interfaces.js";import{runPropertyAnimations as o}from"../motion/utils.js";function e(e){return function(n){return class extends n{constructor(){super(...arguments);this._animationReady=!1,this._animationDemoMode=!1,this._animations=e}updated(e){if(super.updated(e),!this._animationReady&&!this.hasAttribute(t))return this.setAttribute(t,i.ready),void(this._animationReady=!0);!0===this._animationDemoMode||this.hasAttribute("_demo-mode")?this._animationDemoMode=!0:o(e,this)}}}}export{e as animate};
 //# sourceMappingURL=animate.js.map

package/internal/decorators/animate.js.map

@@ -1 +1 @@
-{"version":3,"file":"animate.js","sources":["../../../../src/internal/decorators/animate.ts"],"sourcesContent":null,"names":["animate","config","constr","_constr","[object Object]","props","super","updated","self","this","_animations","hasAttribute","PRIVATE_ANIMATION_STATUS_ATTR_NAME","runPropertyAnimations","setAttribute","AnimationStatus","ready"],"mappings":"6JAQO,SAASA,EAAQC,GACpB,OAAO,SAAwBC,GAC3B,MAAMC,EAAUD,EAChB,OAAO,cAAcC,EACjBC,QAAQC,GACJC,MAAMC,QAAQF,GACd,MAAMG,EAAOC,KACbD,EAAKE,YAAcT,QAAU,EACxBO,EAAKG,aAAaC,GAGbJ,EAAKG,aAAa,eAExBE,EAAsBR,EAAOG,GAJ7BA,EAAKM,aAAaF,EAAoCG,EAAgBC"}
+{"version":3,"file":"animate.js","sources":["../../../../src/internal/decorators/animate.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2022 VMware, Inc. All Rights Reserved.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\nimport { AnimationStatus, PRIVATE_ANIMATION_STATUS_ATTR_NAME, } from '../motion/interfaces.js';\nimport { runPropertyAnimations } from '../motion/utils.js';\n// decorator factory that extends the component constructor to inject animations code into it\nexport function animate(config) {\n    // eslint-disable-next-line @typescript-eslint/ban-types\n    return function _animationDecorator(constructor) {\n        return class extends constructor {\n            constructor() {\n                super(...arguments);\n                this._animationReady = false;\n                this._animationDemoMode = false;\n                this._animations = config;\n            }\n            updated(props) {\n                super.updated(props);\n                if (!this._animationReady && !this.hasAttribute(PRIVATE_ANIMATION_STATUS_ATTR_NAME)) {\n                    // this prevents animations from loading onpageload\n                    this.setAttribute(PRIVATE_ANIMATION_STATUS_ATTR_NAME, AnimationStatus.ready);\n                    this._animationReady = true;\n                    return;\n                }\n                if (this._animationDemoMode === true || this.hasAttribute('_demo-mode')) {\n                    // ignore if element has the _demo-mode attribute set;\n                    // _demo-mode is used for docs, static examples, and stories\n                    // _demo-mode is not intended for external use\n                    this._animationDemoMode = true;\n                    return;\n                }\n                runPropertyAnimations(props, this);\n            }\n        };\n    };\n}\n"],"names":["animate","config","constructor","super","this","_animationReady","_animationDemoMode","_animations","updated","props","hasAttribute","PRIVATE_ANIMATION_STATUS_ATTR_NAME","setAttribute","AnimationStatus","ready","runPropertyAnimations"],"mappings":"6JAQO,SAASA,EAAQC,GAEpB,OAAO,SAA6BC,GAChC,OAAO,cAAcA,EACjBA,cACIC,oBACAC,KAAKC,iBAAkB,EACvBD,KAAKE,oBAAqB,EAC1BF,KAAKG,YAAcN,EAEvBO,QAAQC,GAEJ,GADAN,MAAMK,QAAQC,IACTL,KAAKC,kBAAoBD,KAAKM,aAAaC,GAI5C,OAFAP,KAAKQ,aAAaD,EAAoCE,EAAgBC,YACtEV,KAAKC,iBAAkB,IAGK,IAA5BD,KAAKE,oBAA+BF,KAAKM,aAAa,cAItDN,KAAKE,oBAAqB,EAG9BS,EAAsBN,EAAOL"}

package/internal/decorators/element.d.ts

@@ -1,19 +1,16 @@
+import { Constructor, ClassDescriptor } from './utils.js';
+/**
+ * @experimental
+ * experimental decorator, waiting on Angular issue to be resolved https://github.com/angular/angular/issues/31495
+ * Class decorator factory that defines the decorated class as a custom element.
+ *
+ * ```
+ * @customElement('my-element')
+ * class MyElement {
+ *   render() {
+ *     return html``;
+ *   }
+ * }
+ * ```
+ */
 export declare const customElement: (tagName: string) => (classOrDescriptor: Constructor<HTMLElement> | ClassDescriptor) => any;
-interface ClassDescriptor {
-    kind: 'class';
-    elements: ClassElement[];
-    finisher?: <T>(classDef: Constructor<T>) => undefined | Constructor<T>;
-}
-interface ClassElement {
-    kind: 'field' | 'method';
-    key: PropertyKey;
-    placement: 'static' | 'prototype' | 'own';
-    initializer?: Function;
-    extras?: ClassElement[];
-    finisher?: <T>(classDef: Constructor<T>) => undefined | Constructor<T>;
-    descriptor?: PropertyDescriptor;
-}
-export declare type Constructor<T> = {
-    new (...args: any[]): T;
-};
-export {};