@kyndryl-design-system/shidoka-applications 2.62.0 → 2.62.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"headerLink.d.ts","sourceRoot":"","sources":["../../../../src/components/global/header/headerLink.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAUlD,OAAO,0BAA0B,CAAC;AAKlC;;;;;;GAMG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,OAAgB,MAAM,0BAA6B;IAEnD,uBAAuB;IAEvB,QAAQ,CAAC,IAAI,UAAS;IAEtB,gBAAgB;IAEhB,QAAQ,CAAC,IAAI,SAAM;IAEnB,oIAAoI;IAEpI,QAAQ,CAAC,MAAM,EAAG,OAAO,CAAU;IAEnC,oIAAoI;IAEpI,QAAQ,CAAC,GAAG,SAAM;IAElB,sEAAsE;IAEtE,QAAQ,CAAC,QAAQ,UAAS;IAE1B;;OAEG;IAEH,QAAQ,CAAC,KAAK,SAAK;IAEnB,+DAA+D;IAE/D,QAAQ,CAAC,OAAO,UAAS;IAEzB,iFAAiF;IAEjF,QAAQ,CAAC,WAAW,SAAY;IAEhC,2DAA2D;IAE3D,QAAQ,CAAC,eAAe,SAAK;IAE7B,qCAAqC;IAErC,QAAQ,CAAC,QAAQ,SAAU;IAE3B,8FAA8F;IAE9F,QAAQ,CAAC,WAAW,UAAS;IAE7B,qCAAqC;IAErC,QAAQ,CAAC,WAAW,SAAM;IAE1B;;;OAGG;IAEH,QAAQ,CAAC,UAAU,EAAG,KAAK,CAAC,WAAW,CAAC,CAAC;IAEzC;;OAEG;IACH,WAAW,EAAE,GAAG,CAAC;IAEjB;;OAEG;IAEH,QAAQ,CAAC,WAAW,EAAE,GAAG,CAAC;IAE1B;;OAEG;IAEH,QAAQ,CAAC,YAAY,EAAE,GAAG,CAAM;IAEvB,MAAM;
|
|
1
|
+
{"version":3,"file":"headerLink.d.ts","sourceRoot":"","sources":["../../../../src/components/global/header/headerLink.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAUlD,OAAO,0BAA0B,CAAC;AAKlC;;;;;;GAMG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,OAAgB,MAAM,0BAA6B;IAEnD,uBAAuB;IAEvB,QAAQ,CAAC,IAAI,UAAS;IAEtB,gBAAgB;IAEhB,QAAQ,CAAC,IAAI,SAAM;IAEnB,oIAAoI;IAEpI,QAAQ,CAAC,MAAM,EAAG,OAAO,CAAU;IAEnC,oIAAoI;IAEpI,QAAQ,CAAC,GAAG,SAAM;IAElB,sEAAsE;IAEtE,QAAQ,CAAC,QAAQ,UAAS;IAE1B;;OAEG;IAEH,QAAQ,CAAC,KAAK,SAAK;IAEnB,+DAA+D;IAE/D,QAAQ,CAAC,OAAO,UAAS;IAEzB,iFAAiF;IAEjF,QAAQ,CAAC,WAAW,SAAY;IAEhC,2DAA2D;IAE3D,QAAQ,CAAC,eAAe,SAAK;IAE7B,qCAAqC;IAErC,QAAQ,CAAC,QAAQ,SAAU;IAE3B,8FAA8F;IAE9F,QAAQ,CAAC,WAAW,UAAS;IAE7B,qCAAqC;IAErC,QAAQ,CAAC,WAAW,SAAM;IAE1B;;;OAGG;IAEH,QAAQ,CAAC,UAAU,EAAG,KAAK,CAAC,WAAW,CAAC,CAAC;IAEzC;;OAEG;IACH,WAAW,EAAE,GAAG,CAAC;IAEjB;;OAEG;IAEH,QAAQ,CAAC,WAAW,EAAE,GAAG,CAAC;IAE1B;;OAEG;IAEH,QAAQ,CAAC,YAAY,EAAE,GAAG,CAAM;IAEvB,MAAM;IA+Ef,OAAO,CAAC,aAAa;IAKrB,OAAO,CAAC,aAAa;IAyBrB,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,sBAAsB;IAI9B,OAAO,CAAC,kBAAkB;IAU1B,OAAO,CAAC,kBAAkB;IAc1B,OAAO,CAAC,WAAW;IAenB,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,cAAc;IAuBtB,OAAO,CAAC,aAAa;IAuBrB,gBAAgB;IAChB,OAAO,CAAC,eAAe,CAEpB;IAEM,YAAY;IAIZ,UAAU,CAAC,YAAY,EAAE,GAAG;IAM5B,iBAAiB;IAQjB,oBAAoB;CAO9B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,UAAU,CAAC;KAC/B;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"headerLink.js","sources":["../../../../src/components/global/header/headerLink.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html, unsafeCSS } from 'lit';\nimport {\n customElement,\n property,\n state,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { debounce } from '../../../common/helpers/helpers';\nimport HeaderLinkScss from './headerLink.scss?inline';\nimport '../../reusable/textInput';\nimport arrowIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/chevron-right.svg';\nimport backIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/arrow-left.svg';\nimport searchIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/search.svg';\n\n/**\n * Component for navigation links within the Header.\n * @fires on-click - Captures the click event and emits the original event details. `detail:{ origEvent: Event ,defaultPrevented: boolean}`\n * @slot unnamed - Slot for link text/content.\n * @slot links - Slot for sublinks (up to two levels).\n * @slot icon - Slot for icon.\n */\n@customElement('kyn-header-link')\nexport class HeaderLink extends LitElement {\n static override styles = unsafeCSS(HeaderLinkScss);\n\n /** Link open state. */\n @property({ type: Boolean })\n accessor open = false;\n\n /** Link url. */\n @property({ type: String })\n accessor href = '';\n\n /** Defines a target attribute for where to load the URL. Possible options include \"_self\" (default), \"_blank\", \"_parent\", \"_top\" */\n @property({ type: String })\n accessor target = '_self' as const;\n\n /** Defines a relationship between a linked resource and the document. An empty string (default) means no particular relationship */\n @property({ type: String })\n accessor rel = '';\n\n /** Link active state, for example when URL path matches link href. */\n @property({ type: Boolean })\n accessor isActive = false;\n\n /** Link level, supports two levels.\n * @ignore\n */\n @state()\n accessor level = 1;\n\n /** DEPRECATED. Adds a 1px shadow to the bottom of the link. */\n @property({ type: Boolean })\n accessor divider = false;\n\n /** Label for sub-menu link search input, which is visible with > 5 sub-links. */\n @property({ type: String })\n accessor searchLabel = 'Search';\n\n /** Number of child links required to show search input. */\n @property({ type: Number })\n accessor searchThreshold = 6;\n\n /** Text for mobile \"Back\" button. */\n @property({ type: String })\n accessor backText = 'Back';\n\n /** Add left padding when icon is not provided to align text with links that do have icons. */\n @property({ type: Boolean })\n accessor leftPadding = false;\n\n /** Text for mobile \"Back\" button. */\n @state()\n accessor _searchTerm = '';\n\n /**\n * Queries any slotted HTML elements.\n * @ignore\n */\n @queryAssignedElements({ slot: 'links' })\n accessor slottedEls!: Array<HTMLElement>;\n\n /** Timeout function to delay flyout open.\n * @internal\n */\n _enterTimer: any;\n\n /** Timeout function to delay flyout close.\n * @internal\n */\n @state()\n accessor _leaveTimer: any;\n\n /** Menu positioning\n * @internal\n */\n @state()\n accessor menuPosition: any = {};\n\n override render() {\n const classes = {\n menu: this.slottedEls.length,\n [`level--${this.level}`]: true,\n divider: this.divider,\n open: this.open,\n };\n\n const linkClasses = {\n 'nav-link': true,\n active: this.isActive,\n interactive: this.level == 1,\n 'padding-left': this.leftPadding,\n };\n\n const menuClasses = {\n menu__content: true,\n slotted: this.slottedEls.length,\n };\n\n const Links = this.querySelectorAll(\n ':scope > kyn-header-link, :scope > kyn-header-category > kyn-header-link'\n );\n\n return html`\n <div\n class=\"${classMap(classes)}\"\n @pointerleave=${(e: PointerEvent) => this.handlePointerLeave(e)}\n @pointerenter=${(e: PointerEvent) => this.handlePointerEnter(e)}\n >\n <a\n target=${this.target}\n rel=${this.rel}\n href=${this.href}\n class=${classMap(linkClasses)}\n @click=${(e: Event) => this.handleClick(e)}\n @pointerenter=${(e: PointerEvent) => this.handlePointerEnter(e)}\n >\n <slot></slot>\n\n ${this.slottedEls.length\n ? html` <span class=\"arrow\">${unsafeSVG(arrowIcon)}</span> `\n : null}\n </a>\n\n <div\n class=${classMap(menuClasses)}\n style=${`top: ${this.menuPosition.top}px; left: ${this.menuPosition.left}px;`}\n >\n <button class=\"go-back\" @click=${() => this._handleBack()}>\n <span>${unsafeSVG(backIcon)}</span>\n ${this.backText}\n </button>\n\n ${Links.length >= this.searchThreshold\n ? html`\n <kyn-text-input\n hideLabel\n size=\"sm\"\n label=${this.searchLabel}\n placeholder=${this.searchLabel}\n value=${this._searchTerm}\n @on-input=${(e: Event) => this._handleSearch(e)}\n >\n <span slot=\"icon\" class=\"search-icon\">\n ${unsafeSVG(searchIcon)}\n </span>\n ${this.searchLabel}\n </kyn-text-input>\n `\n : null}\n\n <slot name=\"links\" @slotchange=${this._handleLinksSlotChange}></slot>\n </div>\n </div>\n `;\n }\n\n private _handleSearch(e: any) {\n this._searchTerm = e.detail.value.toLowerCase();\n this._searchFilter();\n }\n\n private _searchFilter() {\n const Links: any = this.querySelectorAll(\n ':scope > kyn-header-link, :scope > kyn-header-category > kyn-header-link'\n );\n\n Links.forEach((link: any) => {\n // get link text\n const nodes: any = link.shadowRoot?.querySelector('slot')?.assignedNodes({\n flatten: true,\n });\n let linkText = '';\n for (let i = 0; i < nodes.length; i++) {\n linkText += nodes[i].textContent.trim();\n }\n\n if (linkText.toLowerCase().includes(this._searchTerm)) {\n link.style.display = 'block';\n } else {\n link.style.display = 'none';\n }\n });\n\n this._positionMenu();\n }\n\n private _handleBack() {\n this.open = false;\n }\n\n private _handleLinksSlotChange() {\n this.requestUpdate();\n }\n\n private handlePointerEnter(e: PointerEvent) {\n if (e.pointerType === 'mouse' && this.slottedEls.length) {\n clearTimeout(this._leaveTimer);\n\n this._enterTimer = setTimeout(() => {\n this.open = true;\n }, 150);\n }\n }\n\n private handlePointerLeave(e: PointerEvent) {\n if (\n e.pointerType === 'mouse' &&\n this.slottedEls.length &&\n this._searchTerm === ''\n ) {\n clearTimeout(this._enterTimer);\n\n this._leaveTimer = setTimeout(() => {\n this.open = false;\n }, 150);\n }\n }\n\n private handleClick(e: Event) {\n let preventDefault = false;\n\n if (this.slottedEls.length) {\n preventDefault = true;\n e.preventDefault();\n this.open = !this.open;\n }\n\n const event = new CustomEvent('on-click', {\n detail: { origEvent: e, defaultPrevented: preventDefault },\n });\n this.dispatchEvent(event);\n }\n\n private handleClickOut(e: Event) {\n if (!e.composedPath().includes(this)) {\n this.open = false;\n this._searchTerm = '';\n this._searchFilter();\n }\n }\n\n private determineLevel() {\n const ParentNode: any = this.parentNode;\n const GrandparentNode: any = ParentNode.parentNode;\n\n if (ParentNode.nodeName === 'KYN-HEADER-LINK') {\n this.level = ParentNode.level + 1;\n } else if (\n ParentNode.nodeName === 'KYN-HEADER-CATEGORY' &&\n GrandparentNode.nodeName === 'KYN-HEADER-LINK'\n ) {\n this.level = GrandparentNode.level + 1;\n } else {\n if (\n window.innerWidth < 672 &&\n ParentNode.nodeName === 'KYN-HEADER-FLYOUT'\n ) {\n this.level = 2;\n } else {\n this.level = 1;\n }\n }\n }\n\n private _positionMenu() {\n // determine submenu positioning\n const LinkBounds: any = this.getBoundingClientRect();\n const MenuBounds: any = this.shadowRoot\n ?.querySelector('.menu__content')\n ?.getBoundingClientRect();\n const Padding = 8;\n const HeaderHeight = 56;\n\n const LinkHalf = LinkBounds.top + LinkBounds.height / 2;\n const MenuHalf = MenuBounds.height / 2;\n\n const Top =\n LinkHalf + MenuHalf > window.innerHeight\n ? LinkHalf - MenuHalf - (LinkHalf + MenuHalf - window.innerHeight)\n : LinkHalf - MenuHalf;\n\n this.menuPosition = {\n top: Top < HeaderHeight ? HeaderHeight : Top,\n left: LinkBounds.right + Padding,\n };\n }\n\n /** @internal */\n private _debounceResize = debounce(() => {\n this.determineLevel();\n });\n\n override firstUpdated() {\n this.determineLevel();\n }\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('open') && this.open) {\n this._positionMenu();\n }\n }\n\n override connectedCallback() {\n super.connectedCallback();\n\n document.addEventListener('click', (e) => this.handleClickOut(e));\n\n window?.addEventListener('resize', this._debounceResize);\n }\n\n override disconnectedCallback() {\n document.removeEventListener('click', (e) => this.handleClickOut(e));\n\n window?.removeEventListener('resize', this._debounceResize);\n\n super.disconnectedCallback();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-header-link': HeaderLink;\n }\n}\n"],"names":["HeaderLink","customElement","LitElement","_classThis","_classSuper","_HeaderLink_open_accessor_storage","set","this","__runInitializers","_open_initializers","_HeaderLink_href_accessor_storage","_open_extraInitializers","_href_initializers","_HeaderLink_target_accessor_storage","_href_extraInitializers","_target_initializers","_HeaderLink_rel_accessor_storage","_target_extraInitializers","_rel_initializers","_HeaderLink_isActive_accessor_storage","_rel_extraInitializers","_isActive_initializers","_HeaderLink_level_accessor_storage","_isActive_extraInitializers","_level_initializers","_HeaderLink_divider_accessor_storage","_level_extraInitializers","_divider_initializers","_HeaderLink_searchLabel_accessor_storage","_divider_extraInitializers","_searchLabel_initializers","_HeaderLink_searchThreshold_accessor_storage","_searchLabel_extraInitializers","_searchThreshold_initializers","_HeaderLink_backText_accessor_storage","_searchThreshold_extraInitializers","_backText_initializers","_HeaderLink_leftPadding_accessor_storage","_backText_extraInitializers","_leftPadding_initializers","_HeaderLink__searchTerm_accessor_storage","_leftPadding_extraInitializers","__searchTerm_initializers","_HeaderLink_slottedEls_accessor_storage","__searchTerm_extraInitializers","_slottedEls_initializers","_enterTimer","_slottedEls_extraInitializers","_HeaderLink__leaveTimer_accessor_storage","__leaveTimer_initializers","_HeaderLink_menuPosition_accessor_storage","__leaveTimer_extraInitializers","_menuPosition_initializers","_debounceResize","_menuPosition_extraInitializers","debounce","determineLevel","open","__classPrivateFieldGet","value","__classPrivateFieldSet","href","target","rel","isActive","level","divider","searchLabel","searchThreshold","backText","leftPadding","_searchTerm","slottedEls","_leaveTimer","menuPosition","render","classes","menu","length","linkClasses","active","interactive","menuClasses","menu__content","slotted","Links","querySelectorAll","html","classMap","e","handlePointerLeave","handlePointerEnter","handleClick","unsafeSVG","arrowIcon","top","left","_handleBack","backIcon","_handleSearch","searchIcon","_handleLinksSlotChange","detail","toLowerCase","_searchFilter","forEach","link","nodes","_b","_a","shadowRoot","querySelector","assignedNodes","flatten","linkText","i","textContent","trim","includes","style","display","_positionMenu","requestUpdate","pointerType","clearTimeout","setTimeout","preventDefault","event","CustomEvent","origEvent","defaultPrevented","dispatchEvent","handleClickOut","composedPath","ParentNode","parentNode","GrandparentNode","nodeName","window","innerWidth","LinkBounds","getBoundingClientRect","MenuBounds","LinkHalf","height","MenuHalf","Top","innerHeight","right","firstUpdated","willUpdate","changedProps","has","connectedCallback","super","document","addEventListener","disconnectedCallback","removeEventListener","_open_decorators","property","type","Boolean","_href_decorators","String","_target_decorators","_rel_decorators","_isActive_decorators","_level_decorators","state","_divider_decorators","_searchLabel_decorators","_searchThreshold_decorators","Number","_backText_decorators","_leftPadding_decorators","__searchTerm_decorators","_slottedEls_decorators","queryAssignedElements","slot","__leaveTimer_decorators","_menuPosition_decorators","__esDecorate","kind","name","static","private","access","obj","get","metadata","_metadata","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","HeaderLinkScss"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"headerLink.js","sources":["../../../../src/components/global/header/headerLink.ts"],"sourcesContent":["import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { LitElement, html, unsafeCSS } from 'lit';\nimport {\n customElement,\n property,\n state,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { debounce } from '../../../common/helpers/helpers';\nimport HeaderLinkScss from './headerLink.scss?inline';\nimport '../../reusable/textInput';\nimport arrowIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/chevron-right.svg';\nimport backIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/arrow-left.svg';\nimport searchIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/search.svg';\n\n/**\n * Component for navigation links within the Header.\n * @fires on-click - Captures the click event and emits the original event details. `detail:{ origEvent: Event ,defaultPrevented: boolean}`\n * @slot unnamed - Slot for link text/content.\n * @slot links - Slot for sublinks (up to two levels).\n * @slot icon - Slot for icon.\n */\n@customElement('kyn-header-link')\nexport class HeaderLink extends LitElement {\n static override styles = unsafeCSS(HeaderLinkScss);\n\n /** Link open state. */\n @property({ type: Boolean })\n accessor open = false;\n\n /** Link url. */\n @property({ type: String })\n accessor href = '';\n\n /** Defines a target attribute for where to load the URL. Possible options include \"_self\" (default), \"_blank\", \"_parent\", \"_top\" */\n @property({ type: String })\n accessor target = '_self' as const;\n\n /** Defines a relationship between a linked resource and the document. An empty string (default) means no particular relationship */\n @property({ type: String })\n accessor rel = '';\n\n /** Link active state, for example when URL path matches link href. */\n @property({ type: Boolean })\n accessor isActive = false;\n\n /** Link level, supports two levels.\n * @ignore\n */\n @state()\n accessor level = 1;\n\n /** DEPRECATED. Adds a 1px shadow to the bottom of the link. */\n @property({ type: Boolean })\n accessor divider = false;\n\n /** Label for sub-menu link search input, which is visible with > 5 sub-links. */\n @property({ type: String })\n accessor searchLabel = 'Search';\n\n /** Number of child links required to show search input. */\n @property({ type: Number })\n accessor searchThreshold = 6;\n\n /** Text for mobile \"Back\" button. */\n @property({ type: String })\n accessor backText = 'Back';\n\n /** Add left padding when icon is not provided to align text with links that do have icons. */\n @property({ type: Boolean })\n accessor leftPadding = false;\n\n /** Text for mobile \"Back\" button. */\n @state()\n accessor _searchTerm = '';\n\n /**\n * Queries any slotted HTML elements.\n * @ignore\n */\n @queryAssignedElements({ slot: 'links' })\n accessor slottedEls!: Array<HTMLElement>;\n\n /** Timeout function to delay flyout open.\n * @internal\n */\n _enterTimer: any;\n\n /** Timeout function to delay flyout close.\n * @internal\n */\n @state()\n accessor _leaveTimer: any;\n\n /** Menu positioning\n * @internal\n */\n @state()\n accessor menuPosition: any = {};\n\n override render() {\n const classes = {\n menu: this.slottedEls.length,\n [`level--${this.level}`]: true,\n divider: this.divider,\n open: this.open,\n };\n\n const linkClasses = {\n 'nav-link': true,\n active: this.isActive,\n interactive: this.level == 1,\n 'padding-left': this.leftPadding,\n };\n\n const menuClasses = {\n menu__content: true,\n slotted: this.slottedEls.length,\n };\n\n const Links = this.querySelectorAll(\n ':scope > kyn-header-link, :scope > kyn-header-category > kyn-header-link'\n );\n\n return html`\n <div\n class=\"${classMap(classes)}\"\n @pointerleave=${(e: PointerEvent) => this.handlePointerLeave(e)}\n @pointerenter=${(e: PointerEvent) => this.handlePointerEnter(e)}\n >\n <a\n target=${this.target}\n rel=${this.rel}\n href=${this.href}\n class=${classMap(linkClasses)}\n @click=${(e: Event) => this.handleClick(e)}\n @pointerenter=${(e: PointerEvent) => this.handlePointerEnter(e)}\n >\n <slot></slot>\n\n ${this.slottedEls.length\n ? html` <span class=\"arrow\">${unsafeSVG(arrowIcon)}</span> `\n : null}\n </a>\n\n <div\n class=${classMap(menuClasses)}\n style=${`top: ${this.menuPosition.top}px; left: ${this.menuPosition.left}px;`}\n >\n <button class=\"go-back\" @click=${() => this._handleBack()}>\n <span>${unsafeSVG(backIcon)}</span>\n ${this.backText}\n </button>\n\n ${Links.length >= this.searchThreshold\n ? html`\n <kyn-text-input\n hideLabel\n size=\"sm\"\n type=\"search\"\n label=${this.searchLabel}\n placeholder=${this.searchLabel}\n value=${this._searchTerm}\n @on-input=${(e: Event) => this._handleSearch(e)}\n >\n <span slot=\"icon\" class=\"search-icon\">\n ${unsafeSVG(searchIcon)}\n </span>\n ${this.searchLabel}\n </kyn-text-input>\n `\n : null}\n\n <slot name=\"links\" @slotchange=${this._handleLinksSlotChange}></slot>\n </div>\n </div>\n `;\n }\n\n private _handleSearch(e: any) {\n this._searchTerm = e.detail.value.toLowerCase();\n this._searchFilter();\n }\n\n private _searchFilter() {\n const Links: any = this.querySelectorAll(\n ':scope > kyn-header-link, :scope > kyn-header-category > kyn-header-link'\n );\n\n Links.forEach((link: any) => {\n // get link text\n const nodes: any = link.shadowRoot?.querySelector('slot')?.assignedNodes({\n flatten: true,\n });\n let linkText = '';\n for (let i = 0; i < nodes.length; i++) {\n linkText += nodes[i].textContent.trim();\n }\n\n if (linkText.toLowerCase().includes(this._searchTerm)) {\n link.style.display = 'block';\n } else {\n link.style.display = 'none';\n }\n });\n\n this._positionMenu();\n }\n\n private _handleBack() {\n this.open = false;\n }\n\n private _handleLinksSlotChange() {\n this.requestUpdate();\n }\n\n private handlePointerEnter(e: PointerEvent) {\n if (e.pointerType === 'mouse' && this.slottedEls.length) {\n clearTimeout(this._leaveTimer);\n\n this._enterTimer = setTimeout(() => {\n this.open = true;\n }, 150);\n }\n }\n\n private handlePointerLeave(e: PointerEvent) {\n if (\n e.pointerType === 'mouse' &&\n this.slottedEls.length &&\n this._searchTerm === ''\n ) {\n clearTimeout(this._enterTimer);\n\n this._leaveTimer = setTimeout(() => {\n this.open = false;\n }, 150);\n }\n }\n\n private handleClick(e: Event) {\n let preventDefault = false;\n\n if (this.slottedEls.length) {\n preventDefault = true;\n e.preventDefault();\n this.open = !this.open;\n }\n\n const event = new CustomEvent('on-click', {\n detail: { origEvent: e, defaultPrevented: preventDefault },\n });\n this.dispatchEvent(event);\n }\n\n private handleClickOut(e: Event) {\n if (!e.composedPath().includes(this)) {\n this.open = false;\n this._searchTerm = '';\n this._searchFilter();\n }\n }\n\n private determineLevel() {\n const ParentNode: any = this.parentNode;\n const GrandparentNode: any = ParentNode.parentNode;\n\n if (ParentNode.nodeName === 'KYN-HEADER-LINK') {\n this.level = ParentNode.level + 1;\n } else if (\n ParentNode.nodeName === 'KYN-HEADER-CATEGORY' &&\n GrandparentNode.nodeName === 'KYN-HEADER-LINK'\n ) {\n this.level = GrandparentNode.level + 1;\n } else {\n if (\n window.innerWidth < 672 &&\n ParentNode.nodeName === 'KYN-HEADER-FLYOUT'\n ) {\n this.level = 2;\n } else {\n this.level = 1;\n }\n }\n }\n\n private _positionMenu() {\n // determine submenu positioning\n const LinkBounds: any = this.getBoundingClientRect();\n const MenuBounds: any = this.shadowRoot\n ?.querySelector('.menu__content')\n ?.getBoundingClientRect();\n const Padding = 8;\n const HeaderHeight = 56;\n\n const LinkHalf = LinkBounds.top + LinkBounds.height / 2;\n const MenuHalf = MenuBounds.height / 2;\n\n const Top =\n LinkHalf + MenuHalf > window.innerHeight\n ? LinkHalf - MenuHalf - (LinkHalf + MenuHalf - window.innerHeight)\n : LinkHalf - MenuHalf;\n\n this.menuPosition = {\n top: Top < HeaderHeight ? HeaderHeight : Top,\n left: LinkBounds.right + Padding,\n };\n }\n\n /** @internal */\n private _debounceResize = debounce(() => {\n this.determineLevel();\n });\n\n override firstUpdated() {\n this.determineLevel();\n }\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('open') && this.open) {\n this._positionMenu();\n }\n }\n\n override connectedCallback() {\n super.connectedCallback();\n\n document.addEventListener('click', (e) => this.handleClickOut(e));\n\n window?.addEventListener('resize', this._debounceResize);\n }\n\n override disconnectedCallback() {\n document.removeEventListener('click', (e) => this.handleClickOut(e));\n\n window?.removeEventListener('resize', this._debounceResize);\n\n super.disconnectedCallback();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-header-link': HeaderLink;\n }\n}\n"],"names":["HeaderLink","customElement","LitElement","_classThis","_classSuper","_HeaderLink_open_accessor_storage","set","this","__runInitializers","_open_initializers","_HeaderLink_href_accessor_storage","_open_extraInitializers","_href_initializers","_HeaderLink_target_accessor_storage","_href_extraInitializers","_target_initializers","_HeaderLink_rel_accessor_storage","_target_extraInitializers","_rel_initializers","_HeaderLink_isActive_accessor_storage","_rel_extraInitializers","_isActive_initializers","_HeaderLink_level_accessor_storage","_isActive_extraInitializers","_level_initializers","_HeaderLink_divider_accessor_storage","_level_extraInitializers","_divider_initializers","_HeaderLink_searchLabel_accessor_storage","_divider_extraInitializers","_searchLabel_initializers","_HeaderLink_searchThreshold_accessor_storage","_searchLabel_extraInitializers","_searchThreshold_initializers","_HeaderLink_backText_accessor_storage","_searchThreshold_extraInitializers","_backText_initializers","_HeaderLink_leftPadding_accessor_storage","_backText_extraInitializers","_leftPadding_initializers","_HeaderLink__searchTerm_accessor_storage","_leftPadding_extraInitializers","__searchTerm_initializers","_HeaderLink_slottedEls_accessor_storage","__searchTerm_extraInitializers","_slottedEls_initializers","_enterTimer","_slottedEls_extraInitializers","_HeaderLink__leaveTimer_accessor_storage","__leaveTimer_initializers","_HeaderLink_menuPosition_accessor_storage","__leaveTimer_extraInitializers","_menuPosition_initializers","_debounceResize","_menuPosition_extraInitializers","debounce","determineLevel","open","__classPrivateFieldGet","value","__classPrivateFieldSet","href","target","rel","isActive","level","divider","searchLabel","searchThreshold","backText","leftPadding","_searchTerm","slottedEls","_leaveTimer","menuPosition","render","classes","menu","length","linkClasses","active","interactive","menuClasses","menu__content","slotted","Links","querySelectorAll","html","classMap","e","handlePointerLeave","handlePointerEnter","handleClick","unsafeSVG","arrowIcon","top","left","_handleBack","backIcon","_handleSearch","searchIcon","_handleLinksSlotChange","detail","toLowerCase","_searchFilter","forEach","link","nodes","_b","_a","shadowRoot","querySelector","assignedNodes","flatten","linkText","i","textContent","trim","includes","style","display","_positionMenu","requestUpdate","pointerType","clearTimeout","setTimeout","preventDefault","event","CustomEvent","origEvent","defaultPrevented","dispatchEvent","handleClickOut","composedPath","ParentNode","parentNode","GrandparentNode","nodeName","window","innerWidth","LinkBounds","getBoundingClientRect","MenuBounds","LinkHalf","height","MenuHalf","Top","innerHeight","right","firstUpdated","willUpdate","changedProps","has","connectedCallback","super","document","addEventListener","disconnectedCallback","removeEventListener","_open_decorators","property","type","Boolean","_href_decorators","String","_target_decorators","_rel_decorators","_isActive_decorators","_level_decorators","state","_divider_decorators","_searchLabel_decorators","_searchThreshold_decorators","Number","_backText_decorators","_leftPadding_decorators","__searchTerm_decorators","_slottedEls_decorators","queryAssignedElements","slot","__leaveTimer_decorators","_menuPosition_decorators","__esDecorate","kind","name","static","private","access","obj","get","metadata","_metadata","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","HeaderLinkScss"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","sources":["../../../../src/components/reusable/tabs/tabs.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from 'lit';\nimport {\n customElement,\n property,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport TabsScss from './tabs.scss?inline';\n\n/**\n * Tabs.\n * @slot unnamed - Slot for kyn-tab-panel components.\n * @slot tabs - Slot for kyn-tab components.\n * @fires on-change - Emits the new selected Tab ID when switching tabs. `detail:{ origEvent: PointerEvent,selectedTabId: string }`\n */\n@customElement('kyn-tabs')\nexport class Tabs extends LitElement {\n static override styles = unsafeCSS(TabsScss);\n\n /** Size of the tab buttons, `'sm'` or `'md'`. Icon size: 16px. */\n @property({ type: String })\n accessor tabSize = 'md';\n\n /** Vertical orientation. */\n @property({ type: Boolean })\n accessor vertical = false;\n\n /** AI specifier. */\n @property({ type: Boolean })\n accessor aiConnected = false;\n\n /** Enables tab content change on focus with keyboard navigation/assistive technologies. */\n @property({ type: Boolean })\n accessor disableAutoFocusUpdate = false;\n\n /** Adds scrollable overflow to the tab panels. */\n @property({ type: Boolean })\n accessor scrollablePanels = false;\n\n /** Queries for slotted tabs.\n * @internal\n */\n @queryAssignedElements({ slot: 'tabs', selector: 'kyn-tab' })\n accessor _tabs!: any;\n\n /** Queries for slotted tab panels.\n * @internal\n */\n @queryAssignedElements({ selector: 'kyn-tab-panel' })\n accessor _tabPanels!: any;\n\n override render() {\n const wrapperClasses = {\n wrapper: true,\n vertical: this.vertical,\n scrollable: this.scrollablePanels,\n 'ai-connected': this.aiConnected,\n };\n\n const tabsClasses = {\n tabs: true,\n 'ai-connected': this.aiConnected,\n };\n\n return html`\n <div class=${classMap(wrapperClasses)}>\n <div\n class=${classMap(tabsClasses)}\n role=\"tablist\"\n @keydown=${(e: any) => this._handleKeyboard(e)}\n >\n <slot name=\"tabs\" @slotchange=${this._handleSlotChangeTabs}></slot>\n </div>\n\n <div class=\"panels\" tabindex=${this.scrollablePanels ? '0' : '-1'}>\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('tab-activated', (e) => this._handleChange(e));\n }\n\n override disconnectedCallback() {\n this.removeEventListener('tab-activated', (e) => this._handleChange(e));\n super.disconnectedCallback();\n }\n\n override willUpdate(changedProps: any) {\n if (\n changedProps.has('tabSize') ||\n changedProps.has('vertical') ||\n changedProps.has('aiConnected')\n ) {\n this._updateChildren();\n }\n }\n\n private _handleSlotChangeTabs() {\n this._updateChildren();\n }\n\n private _updateChildren() {\n this._tabs.forEach((tab: any) => {\n tab._size = this.tabSize;\n tab.vertical = this.vertical;\n tab.aiConnected = this.aiConnected;\n });\n\n this._tabPanels.forEach((tabPanel: any) => {\n tabPanel.vertical = this.vertical;\n });\n }\n\n /**\n * Updates children and emits a change event based on the provided\n * event details when a child kyn-tab is clicked.\n * @param {any} e - The parameter \"e\" is an event object that contains information about the event\n * that triggered the handleChange function.\n */\n private _handleChange(e: any) {\n e.stopPropagation();\n this._updateChildrenSelection(e.detail.tabId);\n this._emitChangeEvent(e.detail.origEvent, e.detail.tabId);\n }\n\n /**\n * Updates the selected property of tabs and the visible property of tab panels based on\n * the selected tab ID.\n * @param {string} selectedTabId - The selectedTabId parameter is a string that represents the ID of\n * the tab that is currently selected.\n */\n private _updateChildrenSelection(selectedTabId: string, updatePanel = true) {\n // update tabs selected prop\n this._tabs.forEach((tab: any) => {\n tab.selected = tab.id === selectedTabId;\n });\n\n // update tab-panels visible prop\n if (!updatePanel) return;\n this._tabPanels.forEach((tabPanel: any) => {\n tabPanel.visible = tabPanel.tabId === selectedTabId;\n });\n }\n\n /**\n * Creates and dispatches a custom event called 'on-change' with the provided original event and\n * selected tab ID as details.\n * @param {any} origEvent - The origEvent parameter is the original event object that triggered the\n * change event. It could be any type of event object, such as a click event or a keydown event.\n * @param {string} selectedTabId - The selectedTabId parameter is a string that represents the ID of\n * the selected tab.\n */\n private _emitChangeEvent(origEvent: any, selectedTabId: string) {\n const event = new CustomEvent('on-change', {\n detail: { origEvent: origEvent, selectedTabId: selectedTabId },\n });\n this.dispatchEvent(event);\n }\n\n /**\n * Handles keyboard events for navigating between tabs.\n * @param {any} e - The parameter `e` is an event object that represents the keyboard event. It\n * contains information about the keyboard event, such as the key code of the pressed key.\n * @returns In this code, the function `_handleKeyboard` returns nothing in all cases\n * except when the `keyCode` matches the left or right arrow key codes.\n */\n private _handleKeyboard(e: any) {\n const LEFT_ARROW_KEY_CODE = 37;\n const UP_ARROW_KEY_CODE = 38;\n const RIGHT_ARROW_KEY_CODE = 39;\n const DOWN_ARROW_KEY_CODE = 40;\n const ENTER_KEY_CODE = 13;\n const SPACE_KEY_CODE = 32;\n const TabCount = this._tabs.length;\n const SelectedTabIndex = this._tabs.findIndex((tab: any) => tab.selected);\n\n switch (e.keyCode) {\n case ENTER_KEY_CODE:\n case SPACE_KEY_CODE: {\n this._updateChildrenSelection(\n this._tabs[SelectedTabIndex].id,\n this.disableAutoFocusUpdate\n );\n return;\n }\n case LEFT_ARROW_KEY_CODE:\n case UP_ARROW_KEY_CODE: {\n // activate previous tab\n let prevIndex =\n SelectedTabIndex === 0 ? TabCount - 1 : SelectedTabIndex - 1;\n let prevTab = this._tabs[prevIndex];\n\n if (prevTab.disabled) {\n prevIndex = prevIndex === 0 ? TabCount - 1 : prevIndex - 1;\n prevTab = this._tabs[prevIndex];\n }\n\n prevTab.focus();\n\n this._updateChildrenSelection(prevTab.id, !this.disableAutoFocusUpdate);\n this._emitChangeEvent(e, prevTab.id);\n return;\n }\n case RIGHT_ARROW_KEY_CODE:\n case DOWN_ARROW_KEY_CODE: {\n // activate next tab\n let nextIndex =\n SelectedTabIndex === TabCount - 1 ? 0 : SelectedTabIndex + 1;\n let nextTab = this._tabs[nextIndex];\n\n if (nextTab.disabled) {\n nextIndex = nextIndex === TabCount - 1 ? 0 : nextIndex + 1;\n nextTab = this._tabs[nextIndex];\n }\n\n nextTab.focus();\n\n this._updateChildrenSelection(nextTab.id, !this.disableAutoFocusUpdate);\n this._emitChangeEvent(e, nextTab.id);\n return;\n }\n default: {\n return;\n }\n }\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-tabs': Tabs;\n }\n}\n"],"names":["Tabs","customElement","LitElement","_classThis","_classSuper","tabSize","__classPrivateFieldGet","this","_Tabs_tabSize_accessor_storage","value","__classPrivateFieldSet","vertical","_Tabs_vertical_accessor_storage","aiConnected","_Tabs_aiConnected_accessor_storage","disableAutoFocusUpdate","_Tabs_disableAutoFocusUpdate_accessor_storage","scrollablePanels","_Tabs_scrollablePanels_accessor_storage","_tabs","_Tabs__tabs_accessor_storage","_tabPanels","_Tabs__tabPanels_accessor_storage","render","wrapperClasses","wrapper","scrollable","tabsClasses","tabs","html","classMap","e","_handleKeyboard","_handleSlotChangeTabs","connectedCallback","super","addEventListener","_handleChange","disconnectedCallback","removeEventListener","willUpdate","changedProps","has","_updateChildren","forEach","tab","_size","tabPanel","stopPropagation","_updateChildrenSelection","detail","tabId","_emitChangeEvent","origEvent","selectedTabId","updatePanel","selected","id","visible","event","CustomEvent","dispatchEvent","TabCount","length","SelectedTabIndex","findIndex","keyCode","prevIndex","prevTab","disabled","focus","nextIndex","nextTab","set","__runInitializers","_tabSize_initializers","_tabSize_extraInitializers","_vertical_initializers","_vertical_extraInitializers","_aiConnected_initializers","_aiConnected_extraInitializers","_disableAutoFocusUpdate_initializers","_disableAutoFocusUpdate_extraInitializers","_scrollablePanels_initializers","_scrollablePanels_extraInitializers","__tabs_initializers","__tabs_extraInitializers","__tabPanels_initializers","_tabSize_decorators","property","type","String","_vertical_decorators","Boolean","_aiConnected_decorators","_disableAutoFocusUpdate_decorators","_scrollablePanels_decorators","queryAssignedElements","slot","selector","__tabPanels_decorators","__esDecorate","kind","name","static","private","access","obj","get","metadata","_metadata","__tabs_decorators","__tabPanels_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","TabsScss"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tabs.js","sources":["../../../../src/components/reusable/tabs/tabs.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from 'lit';\nimport {\n customElement,\n property,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport TabsScss from './tabs.scss?inline';\n\n/**\n * Tabs.\n * @slot unnamed - Slot for kyn-tab-panel components.\n * @slot tabs - Slot for kyn-tab components.\n * @fires on-change - Emits the new selected Tab ID when switching tabs. `detail:{ origEvent: PointerEvent,selectedTabId: string }`\n */\n@customElement('kyn-tabs')\nexport class Tabs extends LitElement {\n static override styles = unsafeCSS(TabsScss);\n\n /** Size of the tab buttons, `'sm'` or `'md'`. Icon size: 16px. */\n @property({ type: String })\n accessor tabSize = 'md';\n\n /** Vertical orientation. */\n @property({ type: Boolean })\n accessor vertical = false;\n\n /** AI specifier. */\n @property({ type: Boolean })\n accessor aiConnected = false;\n\n /** Enables tab content change on focus with keyboard navigation/assistive technologies. */\n @property({ type: Boolean })\n accessor disableAutoFocusUpdate = false;\n\n /** Adds scrollable overflow to the tab panels. */\n @property({ type: Boolean })\n accessor scrollablePanels = false;\n\n /** Queries for slotted tabs.\n * @internal\n */\n @queryAssignedElements({ slot: 'tabs', selector: 'kyn-tab' })\n accessor _tabs!: any;\n\n /** Queries for slotted tab panels.\n * @internal\n */\n @queryAssignedElements({ selector: 'kyn-tab-panel' })\n accessor _tabPanels!: any;\n\n override render() {\n const wrapperClasses = {\n wrapper: true,\n vertical: this.vertical,\n scrollable: this.scrollablePanels,\n 'ai-connected': this.aiConnected,\n };\n\n const tabsClasses = {\n tabs: true,\n 'ai-connected': this.aiConnected,\n };\n\n return html`\n <div class=${classMap(wrapperClasses)}>\n <div\n class=${classMap(tabsClasses)}\n role=\"tablist\"\n @keydown=${(e: any) => this._handleKeyboard(e)}\n >\n <slot name=\"tabs\" @slotchange=${this._handleSlotChangeTabs}></slot>\n </div>\n\n <div class=\"panels\" tabindex=${this.scrollablePanels ? '0' : '-1'}>\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('tab-activated', (e) => this._handleChange(e));\n }\n\n override disconnectedCallback() {\n this.removeEventListener('tab-activated', (e) => this._handleChange(e));\n super.disconnectedCallback();\n }\n\n override willUpdate(changedProps: any) {\n if (\n changedProps.has('tabSize') ||\n changedProps.has('vertical') ||\n changedProps.has('aiConnected')\n ) {\n this._updateChildren();\n }\n }\n\n private _handleSlotChangeTabs() {\n this._updateChildren();\n }\n\n private _updateChildren() {\n this._tabs.forEach((tab: any) => {\n tab._size = this.tabSize;\n tab.vertical = this.vertical;\n tab.aiConnected = this.aiConnected;\n });\n\n this._tabPanels.forEach((tabPanel: any) => {\n tabPanel.vertical = this.vertical;\n });\n }\n\n /**\n * Updates children and emits a change event based on the provided\n * event details when a child kyn-tab is clicked.\n * @param {any} e - The parameter \"e\" is an event object that contains information about the event\n * that triggered the handleChange function.\n */\n private _handleChange(e: any) {\n e.stopPropagation();\n this._updateChildrenSelection(e.detail.tabId);\n this._emitChangeEvent(e.detail.origEvent, e.detail.tabId);\n }\n\n /**\n * Updates the selected property of tabs and the visible property of tab panels based on\n * the selected tab ID.\n * @param {string} selectedTabId - The selectedTabId parameter is a string that represents the ID of\n * the tab that is currently selected.\n */\n private _updateChildrenSelection(selectedTabId: string, updatePanel = true) {\n // update tabs selected prop\n this._tabs.forEach((tab: any) => {\n tab.selected = tab.id === selectedTabId;\n });\n\n // update tab-panels visible prop\n if (!updatePanel) return;\n this._tabPanels.forEach((tabPanel: any) => {\n tabPanel.visible = tabPanel.tabId === selectedTabId;\n });\n }\n\n /**\n * Creates and dispatches a custom event called 'on-change' with the provided original event and\n * selected tab ID as details.\n * @param {any} origEvent - The origEvent parameter is the original event object that triggered the\n * change event. It could be any type of event object, such as a click event or a keydown event.\n * @param {string} selectedTabId - The selectedTabId parameter is a string that represents the ID of\n * the selected tab.\n */\n private _emitChangeEvent(origEvent: any, selectedTabId: string) {\n const event = new CustomEvent('on-change', {\n detail: { origEvent: origEvent, selectedTabId: selectedTabId },\n });\n this.dispatchEvent(event);\n }\n\n /**\n * Handles keyboard events for navigating between tabs.\n * @param {any} e - The parameter `e` is an event object that represents the keyboard event. It\n * contains information about the keyboard event, such as the key code of the pressed key.\n * @returns In this code, the function `_handleKeyboard` returns nothing in all cases\n * except when the `keyCode` matches the left or right arrow key codes.\n */\n private _handleKeyboard(e: any) {\n const LEFT_ARROW_KEY_CODE = 37;\n const UP_ARROW_KEY_CODE = 38;\n const RIGHT_ARROW_KEY_CODE = 39;\n const DOWN_ARROW_KEY_CODE = 40;\n const ENTER_KEY_CODE = 13;\n const SPACE_KEY_CODE = 32;\n const TabCount = this._tabs.length;\n const SelectedTabIndex = this._tabs.findIndex((tab: any) => tab.selected);\n\n switch (e.keyCode) {\n case ENTER_KEY_CODE:\n case SPACE_KEY_CODE: {\n this._updateChildrenSelection(\n this._tabs[SelectedTabIndex].id,\n this.disableAutoFocusUpdate\n );\n return;\n }\n case LEFT_ARROW_KEY_CODE:\n case UP_ARROW_KEY_CODE: {\n // activate previous tab\n let prevIndex =\n SelectedTabIndex === 0 ? TabCount - 1 : SelectedTabIndex - 1;\n let prevTab = this._tabs[prevIndex];\n\n if (prevTab.disabled) {\n prevIndex = prevIndex === 0 ? TabCount - 1 : prevIndex - 1;\n prevTab = this._tabs[prevIndex];\n }\n\n prevTab.focus();\n\n this._updateChildrenSelection(prevTab.id, !this.disableAutoFocusUpdate);\n this._emitChangeEvent(e, prevTab.id);\n return;\n }\n case RIGHT_ARROW_KEY_CODE:\n case DOWN_ARROW_KEY_CODE: {\n // activate next tab\n let nextIndex =\n SelectedTabIndex === TabCount - 1 ? 0 : SelectedTabIndex + 1;\n let nextTab = this._tabs[nextIndex];\n\n if (nextTab.disabled) {\n nextIndex = nextIndex === TabCount - 1 ? 0 : nextIndex + 1;\n nextTab = this._tabs[nextIndex];\n }\n\n nextTab.focus();\n\n this._updateChildrenSelection(nextTab.id, !this.disableAutoFocusUpdate);\n this._emitChangeEvent(e, nextTab.id);\n return;\n }\n default: {\n return;\n }\n }\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-tabs': Tabs;\n }\n}\n"],"names":["Tabs","customElement","LitElement","_classThis","_classSuper","tabSize","__classPrivateFieldGet","this","_Tabs_tabSize_accessor_storage","value","__classPrivateFieldSet","vertical","_Tabs_vertical_accessor_storage","aiConnected","_Tabs_aiConnected_accessor_storage","disableAutoFocusUpdate","_Tabs_disableAutoFocusUpdate_accessor_storage","scrollablePanels","_Tabs_scrollablePanels_accessor_storage","_tabs","_Tabs__tabs_accessor_storage","_tabPanels","_Tabs__tabPanels_accessor_storage","render","wrapperClasses","wrapper","scrollable","tabsClasses","tabs","html","classMap","e","_handleKeyboard","_handleSlotChangeTabs","connectedCallback","super","addEventListener","_handleChange","disconnectedCallback","removeEventListener","willUpdate","changedProps","has","_updateChildren","forEach","tab","_size","tabPanel","stopPropagation","_updateChildrenSelection","detail","tabId","_emitChangeEvent","origEvent","selectedTabId","updatePanel","selected","id","visible","event","CustomEvent","dispatchEvent","TabCount","length","SelectedTabIndex","findIndex","keyCode","prevIndex","prevTab","disabled","focus","nextIndex","nextTab","set","__runInitializers","_tabSize_initializers","_tabSize_extraInitializers","_vertical_initializers","_vertical_extraInitializers","_aiConnected_initializers","_aiConnected_extraInitializers","_disableAutoFocusUpdate_initializers","_disableAutoFocusUpdate_extraInitializers","_scrollablePanels_initializers","_scrollablePanels_extraInitializers","__tabs_initializers","__tabs_extraInitializers","__tabPanels_initializers","_tabSize_decorators","property","type","String","_vertical_decorators","Boolean","_aiConnected_decorators","_disableAutoFocusUpdate_decorators","_scrollablePanels_decorators","queryAssignedElements","slot","selector","__tabPanels_decorators","__esDecorate","kind","name","static","private","access","obj","get","metadata","_metadata","__tabs_decorators","__tabPanels_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","TabsScss"],"mappings":"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"}
|