@kyndryl-design-system/shidoka-applications 2.115.0 → 2.116.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/components/reusable/pagetitle/pageTitle.d.ts +4 -2
  2. package/components/reusable/pagetitle/pageTitle.d.ts.map +1 -1
  3. package/components/reusable/pagetitle/pageTitle.js +44 -22
  4. package/components/reusable/pagetitle/pageTitle.js.map +1 -1
  5. package/custom-elements.json +1 -1
  6. package/package.json +1 -1
package/components/reusable/pagetitle/pageTitle.d.ts CHANGED
@@ -5,7 +5,7 @@ import type { PageTitleOption } from './pageTitleOption';
5
5
  * Page Title
6
6
  *
7
7
  * If the contextual variant is used to trigger navigation, consider using anchor elements instead, as buttons do not convey destination information to assistive technology users.
8
- * @slot icon - Slot for icon. Use size 56 * 56 as per UX guidelines.
8
+ * @slot icon - Slot for icon. Use a duotone icon up to 56px for `type="primary"`, or a monotone icon sized to match smaller types.
9
9
  * @slot unnamed - Slot for `kyn-pagetitle-option` elements when using the contextual variant.
10
10
  * @fires on-change - Fired when a contextual dropdown item is selected. Detail: `{ value: string, text: string }`.
11
11
  */
@@ -17,7 +17,7 @@ export declare class PageTitle extends LitElement {
17
17
  accessor pageTitle: string;
18
18
  /** Page subtitle text. */
19
19
  accessor subTitle: string;
20
- /** Type of page title `'primary'` , `'secondary'` & `'tertiary'`. */
20
+ /** Type of page title. Controls typography, color, icon scale, and heading level: `'primary'` (h1), `'secondary'` (h2), or `'tertiary'` (h3). */
21
21
  accessor type: string;
22
22
  /** Set this to `true` for AI theme. */
23
23
  accessor aiConnected: boolean;
@@ -56,6 +56,8 @@ export declare class PageTitle extends LitElement {
56
56
  private _closeDropdown;
57
57
  private _handleTriggerKeydown;
58
58
  private _handleListboxKeydown;
59
+ private _getHeadingTag;
60
+ private _renderHeading;
59
61
  render(): import("lit-html").TemplateResult<1>;
60
62
  private _renderContextualTitle;
61
63
  }
package/components/reusable/pagetitle/pageTitle.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pageTitle.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/pagetitle/pageTitle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAUlD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD;;;;;;;GAOG;AAEH,qBACa,SAAU,SAAQ,UAAU;IACvC,OAAgB,MAAM,0BAA4B;IAElD,qBAAqB;IAErB,QAAQ,CAAC,QAAQ,SAAM;IAEvB,wFAAwF;IAExF,QAAQ,CAAC,SAAS,SAAM;IAExB,0BAA0B;IAE1B,QAAQ,CAAC,QAAQ,SAAM;IAEvB,qEAAqE;IAErE,QAAQ,CAAC,IAAI,SAAa;IAE1B,uCAAuC;IAEvC,QAAQ,CAAC,WAAW,UAAS;IAE7B,qEAAqE;IAErE,QAAQ,CAAC,UAAU,UAAS;IAE5B,+CAA+C;IAE/C,QAAQ,CAAC,IAAI,UAAS;IAEtB;;OAEG;IAEH,QAAQ,CAAC,aAAa,SAAM;IAE5B;;;OAGG;IAEH,QAAQ,CAAC,QAAQ,EAAG,KAAK,CAAC,eAAe,CAAC,CAAC;IAE3C;;OAEG;IACH,OAAO,CAAC,gBAAgB,CAItB;IAEF;;OAEG;IACH,OAAO,CAAC,kBAAkB,CAaxB;IAEO,iBAAiB;IAMjB,oBAAoB;IAMpB,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAMnD,OAAO,CAAC,YAAY;IAepB,OAAO,CAAC,iBAAiB;IAKzB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,WAAW;IAUnB;;OAEG;IACH,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,qBAAqB;IA+B7B,OAAO,CAAC,qBAAqB;IAkCpB,MAAM;IAwCf,OAAO,CAAC,sBAAsB;CAkC/B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,SAAS,CAAC;KAC7B;CACF"}
1
+ {"version":3,"file":"pageTitle.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/pagetitle/pageTitle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAUlD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD;;;;;;;GAOG;AAEH,qBACa,SAAU,SAAQ,UAAU;IACvC,OAAgB,MAAM,0BAA4B;IAElD,qBAAqB;IAErB,QAAQ,CAAC,QAAQ,SAAM;IAEvB,wFAAwF;IAExF,QAAQ,CAAC,SAAS,SAAM;IAExB,0BAA0B;IAE1B,QAAQ,CAAC,QAAQ,SAAM;IAEvB,iJAAiJ;IAEjJ,QAAQ,CAAC,IAAI,SAAa;IAE1B,uCAAuC;IAEvC,QAAQ,CAAC,WAAW,UAAS;IAE7B,qEAAqE;IAErE,QAAQ,CAAC,UAAU,UAAS;IAE5B,+CAA+C;IAE/C,QAAQ,CAAC,IAAI,UAAS;IAEtB;;OAEG;IAEH,QAAQ,CAAC,aAAa,SAAM;IAE5B;;;OAGG;IAEH,QAAQ,CAAC,QAAQ,EAAG,KAAK,CAAC,eAAe,CAAC,CAAC;IAE3C;;OAEG;IACH,OAAO,CAAC,gBAAgB,CAItB;IAEF;;OAEG;IACH,OAAO,CAAC,kBAAkB,CAaxB;IAEO,iBAAiB;IAMjB,oBAAoB;IAMpB,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAMnD,OAAO,CAAC,YAAY;IAepB,OAAO,CAAC,iBAAiB;IAKzB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,WAAW;IAUnB;;OAEG;IACH,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,qBAAqB;IA+B7B,OAAO,CAAC,qBAAqB;IAkC7B,OAAO,CAAC,cAAc;IAWtB,OAAO,CAAC,cAAc;IAcb,MAAM;IAwCf,OAAO,CAAC,sBAAsB;CAmC/B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,SAAS,CAAC;KAC7B;CACF"}
package/components/reusable/pagetitle/pageTitle.js CHANGED
@@ -1,4 +1,4 @@
1
- import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPrivateFieldGet as n,__classPrivateFieldSet as a}from"tslib";import{css as o,LitElement as l,unsafeCSS as s,html as r}from"lit";import{customElement as d,property as h,queryAssignedElements as c}from"lit/decorators.js";import{classMap as p}from"lit/directives/class-map.js";import{unsafeSVG as g}from"lit/directives/unsafe-svg.js";import{B as m}from"../../../vendor/@kyndryl-design-system/shidoka-icons-DG_R4Jwh.js";import"./pageTitleOption.js";var v=o`*,
1
+ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPrivateFieldGet as n,__classPrivateFieldSet as a}from"tslib";import{css as o,LitElement as r,unsafeCSS as s,html as l}from"lit";import{customElement as d,property as h,queryAssignedElements as c}from"lit/decorators.js";import{classMap as p}from"lit/directives/class-map.js";import{unsafeSVG as g}from"lit/directives/unsafe-svg.js";import{B as m}from"../../../vendor/@kyndryl-design-system/shidoka-icons-DG_R4Jwh.js";import"./pageTitleOption.js";var v=o`*,
2
2
  *::before,
3
3
  *::after {
4
4
  box-sizing: border-box;
@@ -34,6 +34,21 @@ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPr
34
34
 
35
35
  :host {
36
36
  display: block;
37
+ --page-title-icon-size: 56px;
38
+ --page-title-icon-gap: 16px;
39
+ --page-title-chevron-size: 24px;
40
+ }
41
+
42
+ :host([type=secondary]) {
43
+ --page-title-icon-size: 32px;
44
+ --page-title-icon-gap: 12px;
45
+ --page-title-chevron-size: 20px;
46
+ }
47
+
48
+ :host([type=tertiary]) {
49
+ --page-title-icon-size: 20px;
50
+ --page-title-icon-gap: 8px;
51
+ --page-title-chevron-size: 16px;
37
52
  }
38
53
 
39
54
  .page-title {
@@ -248,10 +263,24 @@ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPr
248
263
  }
249
264
  }
250
265
 
251
- .icon-wrapper slot[name=icon]::slotted(*) {
252
- max-width: 56px;
253
- max-height: 56px;
254
- margin-right: 16px;
266
+ .icon-wrapper {
267
+ display: inline-flex;
268
+ align-items: center;
269
+ justify-content: center;
270
+ flex-shrink: 0;
271
+ }
272
+
273
+ .icon-wrapper slot[name=icon]::slotted(*),
274
+ .icon-wrapper slot[name=icon]::slotted(svg) {
275
+ display: inline-flex;
276
+ align-items: center;
277
+ justify-content: center;
278
+ width: var(--page-title-icon-size);
279
+ height: var(--page-title-icon-size);
280
+ max-width: var(--page-title-icon-size);
281
+ max-height: var(--page-title-icon-size);
282
+ margin-right: var(--page-title-icon-gap);
283
+ flex-shrink: 0;
255
284
  }
256
285
 
257
286
  .contextual-wrapper {
@@ -294,19 +323,14 @@ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPr
294
323
  transition: transform 150ms ease-out;
295
324
  }
296
325
  .chevron-icon svg {
297
- width: 24px;
298
- height: 24px;
326
+ width: var(--page-title-chevron-size);
327
+ height: var(--page-title-chevron-size);
299
328
  fill: currentColor;
300
329
  }
301
330
  .chevron-icon--open {
302
331
  transform: rotate(-180deg);
303
332
  }
304
333
 
305
- .page-title-tertiary .chevron-icon svg {
306
- width: 16px;
307
- height: 16px;
308
- }
309
-
310
334
  .contextual-dropdown {
311
335
  display: flex;
312
336
  flex-direction: column;
@@ -336,7 +360,7 @@ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPr
336
360
  opacity: 1;
337
361
  visibility: visible;
338
362
  z-index: 11;
339
- }`;let u=(()=>{var o,u,f,k,y,b,x,w,z;let _,C,T,$,D,S,L,V,E,O,j,M=[d("kyn-page-title")],W=[],q=l,R=[],A=[],B=[],K=[],P=[],U=[],H=[],I=[],Y=[],F=[],G=[],J=[],N=[],Q=[],X=[],Z=[],ee=[],te=[];return C=class extends q{constructor(){super(...arguments),o.set(this,i(this,R,"")),u.set(this,(i(this,A),i(this,B,""))),f.set(this,(i(this,K),i(this,P,""))),k.set(this,(i(this,U),i(this,H,"primary"))),y.set(this,(i(this,I),i(this,Y,!1))),b.set(this,(i(this,F),i(this,G,!1))),x.set(this,(i(this,J),i(this,N,!1))),w.set(this,(i(this,Q),i(this,X,""))),z.set(this,(i(this,Z),i(this,ee,void 0))),this._onDocumentClick=(i(this,te),e=>{e.composedPath().includes(this)||this._closeDropdown()}),this._handleOptionClick=e=>{var t,i;const n=e.detail;e.stopPropagation();const a=this.selectedValue!==n.value;this.selectedValue=n.value,this._syncOptions(),a&&this._emitChange(n),this._closeDropdown(),null===(i=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector(".contextual-trigger"))||void 0===i||i.focus()}}get headLine(){return n(this,o,"f")}set headLine(e){a(this,o,e,"f")}get pageTitle(){return n(this,u,"f")}set pageTitle(e){a(this,u,e,"f")}get subTitle(){return n(this,f,"f")}set subTitle(e){a(this,f,e,"f")}get type(){return n(this,k,"f")}set type(e){a(this,k,e,"f")}get aiConnected(){return n(this,y,"f")}set aiConnected(e){a(this,y,e,"f")}get contextual(){return n(this,b,"f")}set contextual(e){a(this,b,e,"f")}get open(){return n(this,x,"f")}set open(e){a(this,x,e,"f")}get selectedValue(){return n(this,w,"f")}set selectedValue(e){a(this,w,e,"f")}get _options(){return n(this,z,"f")}set _options(e){a(this,z,e,"f")}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._onDocumentClick),this.addEventListener("on-option-click",this._handleOptionClick)}disconnectedCallback(){document.removeEventListener("click",this._onDocumentClick),this.removeEventListener("on-option-click",this._handleOptionClick),super.disconnectedCallback()}updated(e){e.has("selectedValue")&&this._syncOptions()}_syncOptions(){var e;if(!(null===(e=this._options)||void 0===e?void 0:e.length))return;this._options.find((e=>e.value===this.selectedValue))||!this._options.length?this._options.forEach((e=>{e.selected=e.value===this.selectedValue})):this.selectedValue=this._options[0].value}_handleSlotChange(){this._syncOptions(),this.requestUpdate()}_getDisplayTitle(){var e;if(this.contextual){const t=null===(e=this._options)||void 0===e?void 0:e.find((e=>e.selected));return(null==t?void 0:t.text)||this.pageTitle}return this.pageTitle}_emitChange(e){this.dispatchEvent(new CustomEvent("on-change",{detail:{value:e.value,text:e.text},bubbles:!0,composed:!0}))}_toggleDropdown(){this.open=!this.open}_closeDropdown(){this.open=!1}_handleTriggerKeydown(e){switch(e.key){case"Escape":this._closeDropdown();break;case"ArrowDown":e.preventDefault(),this.open||(this.open=!0),this.updateComplete.then((()=>{var e,t,i,n;null===(n=null===(i=null===(t=null===(e=this._options)||void 0===e?void 0:e[0])||void 0===t?void 0:t.shadowRoot)||void 0===i?void 0:i.querySelector('[role="option"]'))||void 0===n||n.focus()}));break;case"ArrowUp":e.preventDefault(),this.open||(this.open=!0),this.updateComplete.then((()=>{var e,t,i;const n=null===(e=this._options)||void 0===e?void 0:e[this._options.length-1];null===(i=null===(t=null==n?void 0:n.shadowRoot)||void 0===t?void 0:t.querySelector('[role="option"]'))||void 0===i||i.focus()}))}}_handleListboxKeydown(e){var t,i,n,a,o,l;if(!(null===(t=this._options)||void 0===t?void 0:t.length))return;if("ArrowDown"!==e.key&&"ArrowUp"!==e.key&&"Escape"!==e.key)return;if("Escape"===e.key)return this._closeDropdown(),void(null===(n=null===(i=this.shadowRoot)||void 0===i?void 0:i.querySelector(".contextual-trigger"))||void 0===n||n.focus());e.preventDefault();const s=document.activeElement,r=this._options.findIndex((e=>{var t;return e===s||(null===(t=e.shadowRoot)||void 0===t?void 0:t.contains(s))})),d=r>=0?r:0;let h;h="ArrowDown"===e.key?d===this._options.length-1?0:d+1:0===d?this._options.length-1:d-1,null===(l=null===(o=null===(a=this._options[h])||void 0===a?void 0:a.shadowRoot)||void 0===o?void 0:o.querySelector('[role="option"]'))||void 0===l||l.focus()}render(){const e={"page-title":!0,[`page-title-${this.type}`]:!0,"ai-connected":this.aiConnected},t={"page-subtitle":!0,[`page-subtitle-${this.type}`]:!0},i=this._getDisplayTitle();return r`
363
+ }`;let u=(()=>{var o,u,f,y,k,x,b,w,z;let _,C,T,$,D,S,L,V,j,E,O,M=[d("kyn-page-title")],W=[],q=r,H=[],R=[],A=[],B=[],K=[],P=[],U=[],I=[],Y=[],F=[],G=[],J=[],N=[],Q=[],X=[],Z=[],ee=[],te=[];return C=class extends q{constructor(){super(...arguments),o.set(this,i(this,H,"")),u.set(this,(i(this,R),i(this,A,""))),f.set(this,(i(this,B),i(this,K,""))),y.set(this,(i(this,P),i(this,U,"primary"))),k.set(this,(i(this,I),i(this,Y,!1))),x.set(this,(i(this,F),i(this,G,!1))),b.set(this,(i(this,J),i(this,N,!1))),w.set(this,(i(this,Q),i(this,X,""))),z.set(this,(i(this,Z),i(this,ee,void 0))),this._onDocumentClick=(i(this,te),e=>{e.composedPath().includes(this)||this._closeDropdown()}),this._handleOptionClick=e=>{var t,i;const n=e.detail;e.stopPropagation();const a=this.selectedValue!==n.value;this.selectedValue=n.value,this._syncOptions(),a&&this._emitChange(n),this._closeDropdown(),null===(i=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector(".contextual-trigger"))||void 0===i||i.focus()}}get headLine(){return n(this,o,"f")}set headLine(e){a(this,o,e,"f")}get pageTitle(){return n(this,u,"f")}set pageTitle(e){a(this,u,e,"f")}get subTitle(){return n(this,f,"f")}set subTitle(e){a(this,f,e,"f")}get type(){return n(this,y,"f")}set type(e){a(this,y,e,"f")}get aiConnected(){return n(this,k,"f")}set aiConnected(e){a(this,k,e,"f")}get contextual(){return n(this,x,"f")}set contextual(e){a(this,x,e,"f")}get open(){return n(this,b,"f")}set open(e){a(this,b,e,"f")}get selectedValue(){return n(this,w,"f")}set selectedValue(e){a(this,w,e,"f")}get _options(){return n(this,z,"f")}set _options(e){a(this,z,e,"f")}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._onDocumentClick),this.addEventListener("on-option-click",this._handleOptionClick)}disconnectedCallback(){document.removeEventListener("click",this._onDocumentClick),this.removeEventListener("on-option-click",this._handleOptionClick),super.disconnectedCallback()}updated(e){e.has("selectedValue")&&this._syncOptions()}_syncOptions(){var e;if(!(null===(e=this._options)||void 0===e?void 0:e.length))return;this._options.find((e=>e.value===this.selectedValue))||!this._options.length?this._options.forEach((e=>{e.selected=e.value===this.selectedValue})):this.selectedValue=this._options[0].value}_handleSlotChange(){this._syncOptions(),this.requestUpdate()}_getDisplayTitle(){var e;if(this.contextual){const t=null===(e=this._options)||void 0===e?void 0:e.find((e=>e.selected));return(null==t?void 0:t.text)||this.pageTitle}return this.pageTitle}_emitChange(e){this.dispatchEvent(new CustomEvent("on-change",{detail:{value:e.value,text:e.text},bubbles:!0,composed:!0}))}_toggleDropdown(){this.open=!this.open}_closeDropdown(){this.open=!1}_handleTriggerKeydown(e){switch(e.key){case"Escape":this._closeDropdown();break;case"ArrowDown":e.preventDefault(),this.open||(this.open=!0),this.updateComplete.then((()=>{var e,t,i,n;null===(n=null===(i=null===(t=null===(e=this._options)||void 0===e?void 0:e[0])||void 0===t?void 0:t.shadowRoot)||void 0===i?void 0:i.querySelector('[role="option"]'))||void 0===n||n.focus()}));break;case"ArrowUp":e.preventDefault(),this.open||(this.open=!0),this.updateComplete.then((()=>{var e,t,i;const n=null===(e=this._options)||void 0===e?void 0:e[this._options.length-1];null===(i=null===(t=null==n?void 0:n.shadowRoot)||void 0===t?void 0:t.querySelector('[role="option"]'))||void 0===i||i.focus()}))}}_handleListboxKeydown(e){var t,i,n,a,o,r;if(!(null===(t=this._options)||void 0===t?void 0:t.length))return;if("ArrowDown"!==e.key&&"ArrowUp"!==e.key&&"Escape"!==e.key)return;if("Escape"===e.key)return this._closeDropdown(),void(null===(n=null===(i=this.shadowRoot)||void 0===i?void 0:i.querySelector(".contextual-trigger"))||void 0===n||n.focus());e.preventDefault();const s=document.activeElement,l=this._options.findIndex((e=>{var t;return e===s||(null===(t=e.shadowRoot)||void 0===t?void 0:t.contains(s))})),d=l>=0?l:0;let h;h="ArrowDown"===e.key?d===this._options.length-1?0:d+1:0===d?this._options.length-1:d-1,null===(r=null===(o=null===(a=this._options[h])||void 0===a?void 0:a.shadowRoot)||void 0===o?void 0:o.querySelector('[role="option"]'))||void 0===r||r.focus()}_getHeadingTag(){switch(this.type){case"secondary":return"h2";case"tertiary":return"h3";default:return"h1"}}_renderHeading(e,t){switch(this._getHeadingTag()){case"h2":return l`<h2 class="${p(e)}">${t}</h2>`;case"h3":return l`<h3 class="${p(e)}">${t}</h3>`;default:return l`<h1 class="${p(e)}">${t}</h1>`}}render(){const e={"page-title":!0,[`page-title-${this.type}`]:!0,"ai-connected":this.aiConnected},t={"page-subtitle":!0,[`page-subtitle-${this.type}`]:!0},i=this._getDisplayTitle();return l`
340
364
  <div class="page-title-wrapper">
341
365
  <div class="icon-wrapper">
342
366
  <slot name="icon"></slot>
@@ -344,19 +368,18 @@ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPr
344
368
 
345
369
  <div class="page-title-text-wrapper">
346
370
  <!-- Headline -->
347
- ${""!==this.headLine?r`<div class="page-headline">${this.headLine}</div>`:null}
371
+ ${""!==this.headLine?l`<div class="page-headline">${this.headLine}</div>`:null}
348
372
  <!-- Title -->
349
- ${this.contextual?this._renderContextualTitle(e,i):r`<h1 class="${p(e)}">${i}</h1>`}
373
+ ${this.contextual?this._renderContextualTitle(e,i):this._renderHeading(e,i)}
350
374
  <!-- Subtitle -->
351
- ${""!==this.subTitle?r`<div class="${p(t)}">
375
+ ${""!==this.subTitle?l`<div class="${p(t)}">
352
376
  ${this.subTitle}
353
377
  </div>`:null}
354
378
  </div>
355
379
  </div>
356
- `}_renderContextualTitle(e,t){return r`
380
+ `}_renderContextualTitle(e,t){return l`
357
381
  <div class="contextual-wrapper">
358
- <h1 class="${p(e)}">
359
- <button
382
+ ${this._renderHeading(e,l`<button
360
383
  class="contextual-trigger"
361
384
  aria-expanded="${this.open}"
362
385
  aria-haspopup="listbox"
@@ -368,8 +391,7 @@ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPr
368
391
  <span class="chevron-icon ${this.open?"chevron-icon--open":""}">
369
392
  ${g(m)}
370
393
  </span>
371
- </button>
372
- </h1>
394
+ </button>`)}
373
395
  <div
374
396
  id="contextual-listbox"
375
397
  class="contextual-dropdown ${this.open?"contextual-dropdown--open":""}"
@@ -379,5 +401,5 @@ import{__setFunctionName as e,__esDecorate as t,__runInitializers as i,__classPr
379
401
  <slot @slotchange="${this._handleSlotChange}"></slot>
380
402
  </div>
381
403
  </div>
382
- `}},o=new WeakMap,u=new WeakMap,f=new WeakMap,k=new WeakMap,y=new WeakMap,b=new WeakMap,x=new WeakMap,w=new WeakMap,z=new WeakMap,e(C,"PageTitle"),(()=>{var e;const i="function"==typeof Symbol&&Symbol.metadata?Object.create(null!==(e=q[Symbol.metadata])&&void 0!==e?e:null):void 0;T=[h({type:String})],$=[h({type:String})],D=[h({type:String})],S=[h({type:String})],L=[h({type:Boolean})],V=[h({type:Boolean,reflect:!0})],E=[h({type:Boolean,reflect:!0})],O=[h({type:String,reflect:!0})],j=[c({selector:"kyn-pagetitle-option"})],t(C,null,T,{kind:"accessor",name:"headLine",static:!1,private:!1,access:{has:e=>"headLine"in e,get:e=>e.headLine,set:(e,t)=>{e.headLine=t}},metadata:i},R,A),t(C,null,$,{kind:"accessor",name:"pageTitle",static:!1,private:!1,access:{has:e=>"pageTitle"in e,get:e=>e.pageTitle,set:(e,t)=>{e.pageTitle=t}},metadata:i},B,K),t(C,null,D,{kind:"accessor",name:"subTitle",static:!1,private:!1,access:{has:e=>"subTitle"in e,get:e=>e.subTitle,set:(e,t)=>{e.subTitle=t}},metadata:i},P,U),t(C,null,S,{kind:"accessor",name:"type",static:!1,private:!1,access:{has:e=>"type"in e,get:e=>e.type,set:(e,t)=>{e.type=t}},metadata:i},H,I),t(C,null,L,{kind:"accessor",name:"aiConnected",static:!1,private:!1,access:{has:e=>"aiConnected"in e,get:e=>e.aiConnected,set:(e,t)=>{e.aiConnected=t}},metadata:i},Y,F),t(C,null,V,{kind:"accessor",name:"contextual",static:!1,private:!1,access:{has:e=>"contextual"in e,get:e=>e.contextual,set:(e,t)=>{e.contextual=t}},metadata:i},G,J),t(C,null,E,{kind:"accessor",name:"open",static:!1,private:!1,access:{has:e=>"open"in e,get:e=>e.open,set:(e,t)=>{e.open=t}},metadata:i},N,Q),t(C,null,O,{kind:"accessor",name:"selectedValue",static:!1,private:!1,access:{has:e=>"selectedValue"in e,get:e=>e.selectedValue,set:(e,t)=>{e.selectedValue=t}},metadata:i},X,Z),t(C,null,j,{kind:"accessor",name:"_options",static:!1,private:!1,access:{has:e=>"_options"in e,get:e=>e._options,set:(e,t)=>{e._options=t}},metadata:i},ee,te),t(null,_={value:C},M,{kind:"class",name:C.name,metadata:i},null,W),C=_.value,i&&Object.defineProperty(C,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:i})})(),C.styles=s(v),i(C,W),C})();export{u as PageTitle};
404
+ `}},o=new WeakMap,u=new WeakMap,f=new WeakMap,y=new WeakMap,k=new WeakMap,x=new WeakMap,b=new WeakMap,w=new WeakMap,z=new WeakMap,e(C,"PageTitle"),(()=>{var e;const i="function"==typeof Symbol&&Symbol.metadata?Object.create(null!==(e=q[Symbol.metadata])&&void 0!==e?e:null):void 0;T=[h({type:String})],$=[h({type:String})],D=[h({type:String})],S=[h({type:String,reflect:!0})],L=[h({type:Boolean})],V=[h({type:Boolean,reflect:!0})],j=[h({type:Boolean,reflect:!0})],E=[h({type:String,reflect:!0})],O=[c({selector:"kyn-pagetitle-option"})],t(C,null,T,{kind:"accessor",name:"headLine",static:!1,private:!1,access:{has:e=>"headLine"in e,get:e=>e.headLine,set:(e,t)=>{e.headLine=t}},metadata:i},H,R),t(C,null,$,{kind:"accessor",name:"pageTitle",static:!1,private:!1,access:{has:e=>"pageTitle"in e,get:e=>e.pageTitle,set:(e,t)=>{e.pageTitle=t}},metadata:i},A,B),t(C,null,D,{kind:"accessor",name:"subTitle",static:!1,private:!1,access:{has:e=>"subTitle"in e,get:e=>e.subTitle,set:(e,t)=>{e.subTitle=t}},metadata:i},K,P),t(C,null,S,{kind:"accessor",name:"type",static:!1,private:!1,access:{has:e=>"type"in e,get:e=>e.type,set:(e,t)=>{e.type=t}},metadata:i},U,I),t(C,null,L,{kind:"accessor",name:"aiConnected",static:!1,private:!1,access:{has:e=>"aiConnected"in e,get:e=>e.aiConnected,set:(e,t)=>{e.aiConnected=t}},metadata:i},Y,F),t(C,null,V,{kind:"accessor",name:"contextual",static:!1,private:!1,access:{has:e=>"contextual"in e,get:e=>e.contextual,set:(e,t)=>{e.contextual=t}},metadata:i},G,J),t(C,null,j,{kind:"accessor",name:"open",static:!1,private:!1,access:{has:e=>"open"in e,get:e=>e.open,set:(e,t)=>{e.open=t}},metadata:i},N,Q),t(C,null,E,{kind:"accessor",name:"selectedValue",static:!1,private:!1,access:{has:e=>"selectedValue"in e,get:e=>e.selectedValue,set:(e,t)=>{e.selectedValue=t}},metadata:i},X,Z),t(C,null,O,{kind:"accessor",name:"_options",static:!1,private:!1,access:{has:e=>"_options"in e,get:e=>e._options,set:(e,t)=>{e._options=t}},metadata:i},ee,te),t(null,_={value:C},M,{kind:"class",name:C.name,metadata:i},null,W),C=_.value,i&&Object.defineProperty(C,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:i})})(),C.styles=s(v),i(C,W),C})();export{u as PageTitle};
383
405
  //# sourceMappingURL=pageTitle.js.map
package/components/reusable/pagetitle/pageTitle.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pageTitle.js","sources":["../../../../src/components/reusable/pagetitle/pageTitle.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 { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport downIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/chevron-down.svg';\nimport PageTitleScss from './pageTitle.scss?inline';\nimport './pageTitleOption';\nimport type { PageTitleOption } from './pageTitleOption';\n\n/**\n * Page Title\n *\n * If the contextual variant is used to trigger navigation, consider using anchor elements instead, as buttons do not convey destination information to assistive technology users.\n * @slot icon - Slot for icon. Use size 56 * 56 as per UX guidelines.\n * @slot unnamed - Slot for `kyn-pagetitle-option` elements when using the contextual variant.\n * @fires on-change - Fired when a contextual dropdown item is selected. Detail: `{ value: string, text: string }`.\n */\n\n@customElement('kyn-page-title')\nexport class PageTitle extends LitElement {\n static override styles = unsafeCSS(PageTitleScss);\n\n /** Headline text. */\n @property({ type: String })\n accessor headLine = '';\n\n /** Page title text (required). Used as fallback when no contextual item is selected. */\n @property({ type: String })\n accessor pageTitle = '';\n\n /** Page subtitle text. */\n @property({ type: String })\n accessor subTitle = '';\n\n /** Type of page title `'primary'` , `'secondary'` & `'tertiary'`. */\n @property({ type: String })\n accessor type = 'primary';\n\n /** Set this to `true` for AI theme. */\n @property({ type: Boolean })\n accessor aiConnected = false;\n\n /** Enables the contextual dropdown variant with a chevron toggle. */\n @property({ type: Boolean, reflect: true })\n accessor contextual = false;\n\n /** Whether the contextual dropdown is open. */\n @property({ type: Boolean, reflect: true })\n accessor open = false;\n\n /** The value of the currently selected contextual item. Auto-selects first item if not set.\n * @internal\n */\n @property({ type: String, reflect: true })\n accessor selectedValue = '';\n\n /**\n * Slotted `kyn-pagetitle-option` elements.\n * @internal\n */\n @queryAssignedElements({ selector: 'kyn-pagetitle-option' })\n accessor _options!: Array<PageTitleOption>;\n\n /**\n * @ignore\n */\n private _onDocumentClick = (e: Event) => {\n if (!e.composedPath().includes(this)) {\n this._closeDropdown();\n }\n };\n\n /**\n * @ignore\n */\n private _handleOptionClick = (e: Event) => {\n const detail = (e as CustomEvent).detail;\n e.stopPropagation();\n const changed = this.selectedValue !== detail.value;\n this.selectedValue = detail.value;\n this._syncOptions();\n if (changed) {\n this._emitChange(detail);\n }\n this._closeDropdown();\n this.shadowRoot\n ?.querySelector<HTMLButtonElement>('.contextual-trigger')\n ?.focus();\n };\n\n override connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this._onDocumentClick);\n this.addEventListener('on-option-click', this._handleOptionClick);\n }\n\n override disconnectedCallback() {\n document.removeEventListener('click', this._onDocumentClick);\n this.removeEventListener('on-option-click', this._handleOptionClick);\n super.disconnectedCallback();\n }\n\n override updated(changedProps: Map<string, unknown>) {\n if (changedProps.has('selectedValue')) {\n this._syncOptions();\n }\n }\n\n private _syncOptions() {\n if (!this._options?.length) return;\n\n // Auto-select first if selectedValue doesn't match any option\n const match = this._options.find((o) => o.value === this.selectedValue);\n if (!match && this._options.length) {\n this.selectedValue = this._options[0].value;\n return; // will re-trigger via updated()\n }\n\n this._options.forEach((option) => {\n option.selected = option.value === this.selectedValue;\n });\n }\n\n private _handleSlotChange() {\n this._syncOptions();\n this.requestUpdate();\n }\n\n private _getDisplayTitle(): string {\n if (this.contextual) {\n const selected = this._options?.find((o) => o.selected);\n return selected?.text || this.pageTitle;\n }\n return this.pageTitle;\n }\n\n private _emitChange(item: { value: string; text: string }) {\n this.dispatchEvent(\n new CustomEvent('on-change', {\n detail: { value: item.value, text: item.text },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n /**\n * @internal\n */\n private _toggleDropdown() {\n this.open = !this.open;\n }\n\n private _closeDropdown() {\n this.open = false;\n }\n\n private _handleTriggerKeydown(e: KeyboardEvent) {\n switch (e.key) {\n case 'Escape':\n this._closeDropdown();\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!this.open) {\n this.open = true;\n }\n this.updateComplete.then(() => {\n this._options?.[0]?.shadowRoot\n ?.querySelector<HTMLElement>('[role=\"option\"]')\n ?.focus();\n });\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!this.open) {\n this.open = true;\n }\n this.updateComplete.then(() => {\n const last = this._options?.[this._options.length - 1];\n last?.shadowRoot\n ?.querySelector<HTMLElement>('[role=\"option\"]')\n ?.focus();\n });\n break;\n }\n }\n\n private _handleListboxKeydown(e: KeyboardEvent) {\n if (!this._options?.length) return;\n if (e.key !== 'ArrowDown' && e.key !== 'ArrowUp' && e.key !== 'Escape')\n return;\n\n if (e.key === 'Escape') {\n this._closeDropdown();\n this.shadowRoot\n ?.querySelector<HTMLButtonElement>('.contextual-trigger')\n ?.focus();\n return;\n }\n\n e.preventDefault();\n\n // Find currently focused option\n const activeEl = document.activeElement;\n const idx = this._options.findIndex(\n (o) => o === activeEl || o.shadowRoot?.contains(activeEl as Node)\n );\n const currentIdx = idx >= 0 ? idx : 0;\n\n let nextIdx: number;\n if (e.key === 'ArrowDown') {\n nextIdx = currentIdx === this._options.length - 1 ? 0 : currentIdx + 1;\n } else {\n nextIdx = currentIdx === 0 ? this._options.length - 1 : currentIdx - 1;\n }\n\n this._options[nextIdx]?.shadowRoot\n ?.querySelector<HTMLElement>('[role=\"option\"]')\n ?.focus();\n }\n\n override render() {\n const classes = {\n 'page-title': true,\n [`page-title-${this.type}`]: true,\n 'ai-connected': this.aiConnected,\n };\n\n const subTitleClasses = {\n 'page-subtitle': true,\n [`page-subtitle-${this.type}`]: true,\n };\n\n const displayTitle = this._getDisplayTitle();\n\n return html`\n <div class=\"page-title-wrapper\">\n <div class=\"icon-wrapper\">\n <slot name=\"icon\"></slot>\n </div>\n\n <div class=\"page-title-text-wrapper\">\n <!-- Headline -->\n ${this.headLine !== ''\n ? html`<div class=\"page-headline\">${this.headLine}</div>`\n : null}\n <!-- Title -->\n ${this.contextual\n ? this._renderContextualTitle(classes, displayTitle)\n : html`<h1 class=\"${classMap(classes)}\">${displayTitle}</h1>`}\n <!-- Subtitle -->\n ${this.subTitle !== ''\n ? html`<div class=\"${classMap(subTitleClasses)}\">\n ${this.subTitle}\n </div>`\n : null}\n </div>\n </div>\n `;\n }\n\n private _renderContextualTitle(\n classes: Record<string, boolean>,\n displayTitle: string\n ) {\n return html`\n <div class=\"contextual-wrapper\">\n <h1 class=\"${classMap(classes)}\">\n <button\n class=\"contextual-trigger\"\n aria-expanded=\"${this.open}\"\n aria-haspopup=\"listbox\"\n aria-controls=\"contextual-listbox\"\n @click=\"${this._toggleDropdown}\"\n @keydown=\"${this._handleTriggerKeydown}\"\n >\n <span class=\"contextual-label\">${displayTitle}</span>\n <span class=\"chevron-icon ${this.open ? 'chevron-icon--open' : ''}\">\n ${unsafeSVG(downIcon)}\n </span>\n </button>\n </h1>\n <div\n id=\"contextual-listbox\"\n class=\"contextual-dropdown ${this.open\n ? 'contextual-dropdown--open'\n : ''}\"\n role=\"listbox\"\n @keydown=\"${this._handleListboxKeydown}\"\n >\n <slot @slotchange=\"${this._handleSlotChange}\"></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-page-title': PageTitle;\n }\n}\n"],"names":["PageTitle","customElement","LitElement","_classThis","_classSuper","_PageTitle_headLine_accessor_storage","set","this","__runInitializers","_headLine_initializers","_PageTitle_pageTitle_accessor_storage","_headLine_extraInitializers","_pageTitle_initializers","_PageTitle_subTitle_accessor_storage","_pageTitle_extraInitializers","_subTitle_initializers","_PageTitle_type_accessor_storage","_subTitle_extraInitializers","_type_initializers","_PageTitle_aiConnected_accessor_storage","_type_extraInitializers","_aiConnected_initializers","_PageTitle_contextual_accessor_storage","_aiConnected_extraInitializers","_contextual_initializers","_PageTitle_open_accessor_storage","_contextual_extraInitializers","_open_initializers","_PageTitle_selectedValue_accessor_storage","_open_extraInitializers","_selectedValue_initializers","_PageTitle__options_accessor_storage","_selectedValue_extraInitializers","__options_initializers","_onDocumentClick","__options_extraInitializers","e","composedPath","includes","_closeDropdown","_handleOptionClick","detail","stopPropagation","changed","selectedValue","value","_syncOptions","_emitChange","_b","_a","shadowRoot","querySelector","focus","headLine","__classPrivateFieldGet","__classPrivateFieldSet","pageTitle","subTitle","type","aiConnected","contextual","open","_options","connectedCallback","super","document","addEventListener","disconnectedCallback","removeEventListener","updated","changedProps","has","length","find","o","forEach","option","selected","_handleSlotChange","requestUpdate","_getDisplayTitle","text","item","dispatchEvent","CustomEvent","bubbles","composed","_toggleDropdown","_handleTriggerKeydown","key","preventDefault","updateComplete","then","_d","_c","last","_handleListboxKeydown","activeEl","activeElement","idx","findIndex","contains","currentIdx","nextIdx","_f","_e","render","classes","subTitleClasses","displayTitle","html","_renderContextualTitle","classMap","unsafeSVG","downIcon","_headLine_decorators","property","String","_pageTitle_decorators","_subTitle_decorators","_type_decorators","_aiConnected_decorators","Boolean","reflect","__options_decorators","queryAssignedElements","selector","__esDecorate","kind","name","static","private","access","obj","get","metadata","_metadata","_contextual_decorators","_open_decorators","_selectedValue_decorators","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","PageTitleScss"],"mappings":"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"}
1
+ {"version":3,"file":"pageTitle.js","sources":["../../../../src/components/reusable/pagetitle/pageTitle.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 { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport downIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/chevron-down.svg';\nimport PageTitleScss from './pageTitle.scss?inline';\nimport './pageTitleOption';\nimport type { PageTitleOption } from './pageTitleOption';\n\n/**\n * Page Title\n *\n * If the contextual variant is used to trigger navigation, consider using anchor elements instead, as buttons do not convey destination information to assistive technology users.\n * @slot icon - Slot for icon. Use a duotone icon up to 56px for `type=\"primary\"`, or a monotone icon sized to match smaller types.\n * @slot unnamed - Slot for `kyn-pagetitle-option` elements when using the contextual variant.\n * @fires on-change - Fired when a contextual dropdown item is selected. Detail: `{ value: string, text: string }`.\n */\n\n@customElement('kyn-page-title')\nexport class PageTitle extends LitElement {\n static override styles = unsafeCSS(PageTitleScss);\n\n /** Headline text. */\n @property({ type: String })\n accessor headLine = '';\n\n /** Page title text (required). Used as fallback when no contextual item is selected. */\n @property({ type: String })\n accessor pageTitle = '';\n\n /** Page subtitle text. */\n @property({ type: String })\n accessor subTitle = '';\n\n /** Type of page title. Controls typography, color, icon scale, and heading level: `'primary'` (h1), `'secondary'` (h2), or `'tertiary'` (h3). */\n @property({ type: String, reflect: true })\n accessor type = 'primary';\n\n /** Set this to `true` for AI theme. */\n @property({ type: Boolean })\n accessor aiConnected = false;\n\n /** Enables the contextual dropdown variant with a chevron toggle. */\n @property({ type: Boolean, reflect: true })\n accessor contextual = false;\n\n /** Whether the contextual dropdown is open. */\n @property({ type: Boolean, reflect: true })\n accessor open = false;\n\n /** The value of the currently selected contextual item. Auto-selects first item if not set.\n * @internal\n */\n @property({ type: String, reflect: true })\n accessor selectedValue = '';\n\n /**\n * Slotted `kyn-pagetitle-option` elements.\n * @internal\n */\n @queryAssignedElements({ selector: 'kyn-pagetitle-option' })\n accessor _options!: Array<PageTitleOption>;\n\n /**\n * @ignore\n */\n private _onDocumentClick = (e: Event) => {\n if (!e.composedPath().includes(this)) {\n this._closeDropdown();\n }\n };\n\n /**\n * @ignore\n */\n private _handleOptionClick = (e: Event) => {\n const detail = (e as CustomEvent).detail;\n e.stopPropagation();\n const changed = this.selectedValue !== detail.value;\n this.selectedValue = detail.value;\n this._syncOptions();\n if (changed) {\n this._emitChange(detail);\n }\n this._closeDropdown();\n this.shadowRoot\n ?.querySelector<HTMLButtonElement>('.contextual-trigger')\n ?.focus();\n };\n\n override connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this._onDocumentClick);\n this.addEventListener('on-option-click', this._handleOptionClick);\n }\n\n override disconnectedCallback() {\n document.removeEventListener('click', this._onDocumentClick);\n this.removeEventListener('on-option-click', this._handleOptionClick);\n super.disconnectedCallback();\n }\n\n override updated(changedProps: Map<string, unknown>) {\n if (changedProps.has('selectedValue')) {\n this._syncOptions();\n }\n }\n\n private _syncOptions() {\n if (!this._options?.length) return;\n\n // Auto-select first if selectedValue doesn't match any option\n const match = this._options.find((o) => o.value === this.selectedValue);\n if (!match && this._options.length) {\n this.selectedValue = this._options[0].value;\n return; // will re-trigger via updated()\n }\n\n this._options.forEach((option) => {\n option.selected = option.value === this.selectedValue;\n });\n }\n\n private _handleSlotChange() {\n this._syncOptions();\n this.requestUpdate();\n }\n\n private _getDisplayTitle(): string {\n if (this.contextual) {\n const selected = this._options?.find((o) => o.selected);\n return selected?.text || this.pageTitle;\n }\n return this.pageTitle;\n }\n\n private _emitChange(item: { value: string; text: string }) {\n this.dispatchEvent(\n new CustomEvent('on-change', {\n detail: { value: item.value, text: item.text },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n /**\n * @internal\n */\n private _toggleDropdown() {\n this.open = !this.open;\n }\n\n private _closeDropdown() {\n this.open = false;\n }\n\n private _handleTriggerKeydown(e: KeyboardEvent) {\n switch (e.key) {\n case 'Escape':\n this._closeDropdown();\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!this.open) {\n this.open = true;\n }\n this.updateComplete.then(() => {\n this._options?.[0]?.shadowRoot\n ?.querySelector<HTMLElement>('[role=\"option\"]')\n ?.focus();\n });\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!this.open) {\n this.open = true;\n }\n this.updateComplete.then(() => {\n const last = this._options?.[this._options.length - 1];\n last?.shadowRoot\n ?.querySelector<HTMLElement>('[role=\"option\"]')\n ?.focus();\n });\n break;\n }\n }\n\n private _handleListboxKeydown(e: KeyboardEvent) {\n if (!this._options?.length) return;\n if (e.key !== 'ArrowDown' && e.key !== 'ArrowUp' && e.key !== 'Escape')\n return;\n\n if (e.key === 'Escape') {\n this._closeDropdown();\n this.shadowRoot\n ?.querySelector<HTMLButtonElement>('.contextual-trigger')\n ?.focus();\n return;\n }\n\n e.preventDefault();\n\n // Find currently focused option\n const activeEl = document.activeElement;\n const idx = this._options.findIndex(\n (o) => o === activeEl || o.shadowRoot?.contains(activeEl as Node)\n );\n const currentIdx = idx >= 0 ? idx : 0;\n\n let nextIdx: number;\n if (e.key === 'ArrowDown') {\n nextIdx = currentIdx === this._options.length - 1 ? 0 : currentIdx + 1;\n } else {\n nextIdx = currentIdx === 0 ? this._options.length - 1 : currentIdx - 1;\n }\n\n this._options[nextIdx]?.shadowRoot\n ?.querySelector<HTMLElement>('[role=\"option\"]')\n ?.focus();\n }\n\n private _getHeadingTag(): 'h1' | 'h2' | 'h3' {\n switch (this.type) {\n case 'secondary':\n return 'h2';\n case 'tertiary':\n return 'h3';\n default:\n return 'h1';\n }\n }\n\n private _renderHeading(\n classes: Record<string, boolean>,\n content: unknown\n ) {\n switch (this._getHeadingTag()) {\n case 'h2':\n return html`<h2 class=\"${classMap(classes)}\">${content}</h2>`;\n case 'h3':\n return html`<h3 class=\"${classMap(classes)}\">${content}</h3>`;\n default:\n return html`<h1 class=\"${classMap(classes)}\">${content}</h1>`;\n }\n }\n\n override render() {\n const classes = {\n 'page-title': true,\n [`page-title-${this.type}`]: true,\n 'ai-connected': this.aiConnected,\n };\n\n const subTitleClasses = {\n 'page-subtitle': true,\n [`page-subtitle-${this.type}`]: true,\n };\n\n const displayTitle = this._getDisplayTitle();\n\n return html`\n <div class=\"page-title-wrapper\">\n <div class=\"icon-wrapper\">\n <slot name=\"icon\"></slot>\n </div>\n\n <div class=\"page-title-text-wrapper\">\n <!-- Headline -->\n ${this.headLine !== ''\n ? html`<div class=\"page-headline\">${this.headLine}</div>`\n : null}\n <!-- Title -->\n ${this.contextual\n ? this._renderContextualTitle(classes, displayTitle)\n : this._renderHeading(classes, displayTitle)}\n <!-- Subtitle -->\n ${this.subTitle !== ''\n ? html`<div class=\"${classMap(subTitleClasses)}\">\n ${this.subTitle}\n </div>`\n : null}\n </div>\n </div>\n `;\n }\n\n private _renderContextualTitle(\n classes: Record<string, boolean>,\n displayTitle: string\n ) {\n return html`\n <div class=\"contextual-wrapper\">\n ${this._renderHeading(\n classes,\n html`<button\n class=\"contextual-trigger\"\n aria-expanded=\"${this.open}\"\n aria-haspopup=\"listbox\"\n aria-controls=\"contextual-listbox\"\n @click=\"${this._toggleDropdown}\"\n @keydown=\"${this._handleTriggerKeydown}\"\n >\n <span class=\"contextual-label\">${displayTitle}</span>\n <span class=\"chevron-icon ${this.open ? 'chevron-icon--open' : ''}\">\n ${unsafeSVG(downIcon)}\n </span>\n </button>`\n )}\n <div\n id=\"contextual-listbox\"\n class=\"contextual-dropdown ${this.open\n ? 'contextual-dropdown--open'\n : ''}\"\n role=\"listbox\"\n @keydown=\"${this._handleListboxKeydown}\"\n >\n <slot @slotchange=\"${this._handleSlotChange}\"></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-page-title': PageTitle;\n }\n}\n"],"names":["PageTitle","customElement","LitElement","_classThis","_classSuper","_PageTitle_headLine_accessor_storage","set","this","__runInitializers","_headLine_initializers","_PageTitle_pageTitle_accessor_storage","_headLine_extraInitializers","_pageTitle_initializers","_PageTitle_subTitle_accessor_storage","_pageTitle_extraInitializers","_subTitle_initializers","_PageTitle_type_accessor_storage","_subTitle_extraInitializers","_type_initializers","_PageTitle_aiConnected_accessor_storage","_type_extraInitializers","_aiConnected_initializers","_PageTitle_contextual_accessor_storage","_aiConnected_extraInitializers","_contextual_initializers","_PageTitle_open_accessor_storage","_contextual_extraInitializers","_open_initializers","_PageTitle_selectedValue_accessor_storage","_open_extraInitializers","_selectedValue_initializers","_PageTitle__options_accessor_storage","_selectedValue_extraInitializers","__options_initializers","_onDocumentClick","__options_extraInitializers","e","composedPath","includes","_closeDropdown","_handleOptionClick","detail","stopPropagation","changed","selectedValue","value","_syncOptions","_emitChange","_b","_a","shadowRoot","querySelector","focus","headLine","__classPrivateFieldGet","__classPrivateFieldSet","pageTitle","subTitle","type","aiConnected","contextual","open","_options","connectedCallback","super","document","addEventListener","disconnectedCallback","removeEventListener","updated","changedProps","has","length","find","o","forEach","option","selected","_handleSlotChange","requestUpdate","_getDisplayTitle","text","item","dispatchEvent","CustomEvent","bubbles","composed","_toggleDropdown","_handleTriggerKeydown","key","preventDefault","updateComplete","then","_d","_c","last","_handleListboxKeydown","activeEl","activeElement","idx","findIndex","contains","currentIdx","nextIdx","_f","_e","_getHeadingTag","_renderHeading","classes","content","html","classMap","render","subTitleClasses","displayTitle","_renderContextualTitle","unsafeSVG","downIcon","_headLine_decorators","property","String","_pageTitle_decorators","_subTitle_decorators","reflect","_aiConnected_decorators","Boolean","__options_decorators","queryAssignedElements","selector","__esDecorate","kind","name","static","private","access","obj","get","metadata","_metadata","_type_decorators","_contextual_decorators","_open_decorators","_selectedValue_decorators","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","PageTitleScss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAuBaA,EAAS,yDADrBC,EAAc,0BACgBC,qGAARC,EAAA,cAAQC,oCAKpBC,EAAAC,IAAAC,KAAAC,EAAAD,KAAAE,EAAW,KAIXC,EAAAJ,IAAAC,MAAAC,EAAAD,KAAAI,GAAAH,EAAAD,KAAAK,EAAY,MAIZC,EAAAP,IAAAC,MAAAC,EAAAD,KAAAO,GAAAN,EAAAD,KAAAQ,EAAW,MAIXC,EAAAV,IAAAC,MAAAC,EAAAD,KAAAU,GAAAT,EAAAD,KAAAW,EAAO,aAIPC,EAAAb,IAAAC,MAAAC,EAAAD,KAAAa,GAAAZ,EAAAD,KAAAc,GAAc,KAIdC,EAAAhB,IAAAC,MAAAC,EAAAD,KAAAgB,GAAAf,EAAAD,KAAAiB,GAAa,KAIbC,EAAAnB,IAAAC,MAAAC,EAAAD,KAAAmB,GAAAlB,EAAAD,KAAAoB,GAAO,KAMPC,EAAAtB,IAAAC,MAAAC,EAAAD,KAAAsB,GAAArB,EAAAD,KAAAuB,EAAgB,MAOhBC,EAAAzB,IAAAC,MAAAC,EAAAD,KAAAyB,GAAAxB,EAAAD,KAAA0B,QAAA,KAKD1B,KAAA2B,kBAAgB1B,EAAAD,KAAA4B,IAAIC,IACrBA,EAAEC,eAAeC,SAAS/B,OAC7BA,KAAKgC,gBACP,GAMMhC,KAAAiC,mBAAsBJ,YAC5B,MAAMK,EAAUL,EAAkBK,OAClCL,EAAEM,kBACF,MAAMC,EAAUpC,KAAKqC,gBAAkBH,EAAOI,MAC9CtC,KAAKqC,cAAgBH,EAAOI,MAC5BtC,KAAKuC,eACDH,GACFpC,KAAKwC,YAAYN,GAEnBlC,KAAKgC,iBAEsD,QAD3DS,EAAe,QAAfC,EAAA1C,KAAK2C,kBAAU,IAAAD,OAAA,EAAAA,EACXE,cAAiC,8BAAsB,IAAAH,GAAAA,EACvDI,OAAO,CA2Of,CA1SE,YAASC,GAAQ,OAAAC,EAAA/C,KAAAF,EAAA,IAAA,CAAjB,YAASgD,CAAQR,GAAAU,EAAAhD,KAAAF,EAAAwC,EAAA,IAAA,CAIjB,aAASW,GAAS,OAAAF,EAAA/C,KAAAG,EAAA,IAAA,CAAlB,aAAS8C,CAASX,GAAAU,EAAAhD,KAAAG,EAAAmC,EAAA,IAAA,CAIlB,YAASY,GAAQ,OAAAH,EAAA/C,KAAAM,EAAA,IAAA,CAAjB,YAAS4C,CAAQZ,GAAAU,EAAAhD,KAAAM,EAAAgC,EAAA,IAAA,CAIjB,QAASa,GAAI,OAAAJ,EAAA/C,KAAAS,EAAA,IAAA,CAAb,QAAS0C,CAAIb,GAAAU,EAAAhD,KAAAS,EAAA6B,EAAA,IAAA,CAIb,eAASc,GAAW,OAAAL,EAAA/C,KAAAY,EAAA,IAAA,CAApB,eAASwC,CAAWd,GAAAU,EAAAhD,KAAAY,EAAA0B,EAAA,IAAA,CAIpB,cAASe,GAAU,OAAAN,EAAA/C,KAAAe,EAAA,IAAA,CAAnB,cAASsC,CAAUf,GAAAU,EAAAhD,KAAAe,EAAAuB,EAAA,IAAA,CAInB,QAASgB,GAAI,OAAAP,EAAA/C,KAAAkB,EAAA,IAAA,CAAb,QAASoC,CAAIhB,GAAAU,EAAAhD,KAAAkB,EAAAoB,EAAA,IAAA,CAMb,iBAASD,GAAa,OAAAU,EAAA/C,KAAAqB,EAAA,IAAA,CAAtB,iBAASgB,CAAaC,GAAAU,EAAAhD,KAAAqB,EAAAiB,EAAA,IAAA,CAOtB,YAASiB,GAAQ,OAAAR,EAAA/C,KAAAwB,EAAA,IAAA,CAAjB,YAAS+B,CAAQjB,GAAAU,EAAAhD,KAAAwB,EAAAc,EAAA,IAAA,CA6BR,iBAAAkB,GACPC,MAAMD,oBACNE,SAASC,iBAAiB,QAAS3D,KAAK2B,kBACxC3B,KAAK2D,iBAAiB,kBAAmB3D,KAAKiC,mBAChD,CAES,oBAAA2B,GACPF,SAASG,oBAAoB,QAAS7D,KAAK2B,kBAC3C3B,KAAK6D,oBAAoB,kBAAmB7D,KAAKiC,oBACjDwB,MAAMG,sBACR,CAES,OAAAE,CAAQC,GACXA,EAAaC,IAAI,kBACnBhE,KAAKuC,cAET,CAEQ,YAAAA,SACN,KAAkB,QAAbG,EAAA1C,KAAKuD,gBAAQ,IAAAb,OAAA,EAAAA,EAAEuB,QAAQ,OAGdjE,KAAKuD,SAASW,MAAMC,GAAMA,EAAE7B,QAAUtC,KAAKqC,kBAC3CrC,KAAKuD,SAASU,OAK5BjE,KAAKuD,SAASa,SAASC,IACrBA,EAAOC,SAAWD,EAAO/B,QAAUtC,KAAKqC,aAAa,IALrDrC,KAAKqC,cAAgBrC,KAAKuD,SAAS,GAAGjB,KAO1C,CAEQ,iBAAAiC,GACNvE,KAAKuC,eACLvC,KAAKwE,eACP,CAEQ,gBAAAC,SACN,GAAIzE,KAAKqD,WAAY,CACnB,MAAMiB,UAAW5B,EAAA1C,KAAKuD,+BAAUW,MAAMC,GAAMA,EAAEG,WAC9C,OAAOA,aAAQ,EAARA,EAAUI,OAAQ1E,KAAKiD,SAChC,CACA,OAAOjD,KAAKiD,SACd,CAEQ,WAAAT,CAAYmC,GAClB3E,KAAK4E,cACH,IAAIC,YAAY,YAAa,CAC3B3C,OAAQ,CAAEI,MAAOqC,EAAKrC,MAAOoC,KAAMC,EAAKD,MACxCI,SAAS,EACTC,UAAU,IAGhB,CAKQ,eAAAC,GACNhF,KAAKsD,MAAQtD,KAAKsD,IACpB,CAEQ,cAAAtB,GACNhC,KAAKsD,MAAO,CACd,CAEQ,qBAAA2B,CAAsBpD,GAC5B,OAAQA,EAAEqD,KACR,IAAK,SACHlF,KAAKgC,iBACL,MACF,IAAK,YACHH,EAAEsD,iBACGnF,KAAKsD,OACRtD,KAAKsD,MAAO,GAEdtD,KAAKoF,eAAeC,MAAK,iBAE0B,QADjDC,EAA8B,kBAA9B7C,UAAAC,EAAA1C,KAAKuD,+BAAW,yBAAIZ,kBAAU,IAAA4C,OAAA,EAAAA,EAC1B3C,cAA2B,0BAAkB,IAAA0C,GAAAA,EAC7CzC,OAAO,IAEb,MACF,IAAK,UACHhB,EAAEsD,iBACGnF,KAAKsD,OACRtD,KAAKsD,MAAO,GAEdtD,KAAKoF,eAAeC,MAAK,eACvB,MAAMG,EAAoB,QAAb9C,EAAA1C,KAAKuD,gBAAQ,IAAAb,OAAA,EAAAA,EAAG1C,KAAKuD,SAASU,OAAS,GAEH,QADjDsB,EAAgB,UAAhBC,aAAI,EAAJA,EAAM7C,kBAAU,IAAAF,OAAA,EAAAA,EACZG,cAA2B,0BAAkB,IAAA2C,GAAAA,EAC7C1C,OAAO,IAInB,CAEQ,qBAAA4C,CAAsB5D,mBAC5B,KAAkB,QAAba,EAAA1C,KAAKuD,gBAAQ,IAAAb,OAAA,EAAAA,EAAEuB,QAAQ,OAC5B,GAAc,cAAVpC,EAAEqD,KAAiC,YAAVrD,EAAEqD,KAA+B,WAAVrD,EAAEqD,IACpD,OAEF,GAAc,WAAVrD,EAAEqD,IAKJ,OAJAlF,KAAKgC,sBAEsD,QAD3DuD,EAAe,QAAf9C,EAAAzC,KAAK2C,kBAAU,IAAAF,OAAA,EAAAA,EACXG,cAAiC,8BAAsB,IAAA2C,GAAAA,EACvD1C,SAINhB,EAAEsD,iBAGF,MAAMO,EAAWhC,SAASiC,cACpBC,EAAM5F,KAAKuD,SAASsC,WACvB1B,UAAM,OAAAA,IAAMuB,IAAwB,QAAZhD,EAAAyB,EAAExB,kBAAU,IAAAD,OAAA,EAAAA,EAAEoD,SAASJ,GAAiB,IAE7DK,EAAaH,GAAO,EAAIA,EAAM,EAEpC,IAAII,EAEFA,EADY,cAAVnE,EAAEqD,IACMa,IAAe/F,KAAKuD,SAASU,OAAS,EAAI,EAAI8B,EAAa,EAE5C,IAAfA,EAAmB/F,KAAKuD,SAASU,OAAS,EAAI8B,EAAa,EAItB,QADjDE,EAAkC,UAAZ,QAAtBX,EAAAtF,KAAKuD,SAASyC,UAAQ,IAAAV,OAAA,EAAAA,EAAE3C,kBAAU,IAAAuD,OAAA,EAAAA,EAC9BtD,cAA2B,0BAAkB,IAAAqD,GAAAA,EAC7CpD,OACN,CAEQ,cAAAsD,GACN,OAAQnG,KAAKmD,MACX,IAAK,YACH,MAAO,KACT,IAAK,WACH,MAAO,KACT,QACE,MAAO,KAEb,CAEQ,cAAAiD,CACNC,EACAC,GAEA,OAAQtG,KAAKmG,kBACX,IAAK,KACH,OAAOI,CAAI,cAAcC,EAASH,OAAaC,SACjD,IAAK,KACH,OAAOC,CAAI,cAAcC,EAASH,OAAaC,SACjD,QACE,OAAOC,CAAI,cAAcC,EAASH,OAAaC,SAErD,CAES,MAAAG,GACP,MAAMJ,EAAU,CACd,cAAc,EACd,CAAC,cAAcrG,KAAKmD,SAAS,EAC7B,eAAgBnD,KAAKoD,aAGjBsD,EAAkB,CACtB,iBAAiB,EACjB,CAAC,iBAAiB1G,KAAKmD,SAAS,GAG5BwD,EAAe3G,KAAKyE,mBAE1B,OAAO8B,CAAI;;;;;;;;YAQe,KAAlBvG,KAAK8C,SACHyD,CAAI,8BAA8BvG,KAAK8C,iBACvC;;YAEF9C,KAAKqD,WACHrD,KAAK4G,uBAAuBP,EAASM,GACrC3G,KAAKoG,eAAeC,EAASM;;YAEb,KAAlB3G,KAAKkD,SACHqD,CAAI,eAAeC,EAASE;kBACxB1G,KAAKkD;sBAET;;;KAIZ,CAEQ,sBAAA0D,CACNP,EACAM,GAEA,OAAOJ,CAAI;;UAELvG,KAAKoG,eACLC,EACAE,CAAI;;6BAEevG,KAAKsD;;;sBAGZtD,KAAKgF;wBACHhF,KAAKiF;;6CAEgB0B;wCACL3G,KAAKsD,KAAO,qBAAuB;gBAC3DuD,EAAUC;;;;;uCAMa9G,KAAKsD,KAC9B,4BACA;;sBAEQtD,KAAKyF;;+BAEIzF,KAAKuE;;;KAIlC,wRA1SCwC,EAAA,CAAAC,EAAS,CAAE7D,KAAM8D,UAIjBC,EAAA,CAAAF,EAAS,CAAE7D,KAAM8D,UAIjBE,EAAA,CAAAH,EAAS,CAAE7D,KAAM8D,aAIjBD,EAAS,CAAE7D,KAAM8D,OAAQG,SAAS,KAIlCC,EAAA,CAAAL,EAAS,CAAE7D,KAAMmE,cAIjBN,EAAS,CAAE7D,KAAMmE,QAASF,SAAS,QAInCJ,EAAS,CAAE7D,KAAMmE,QAASF,SAAS,QAMnCJ,EAAS,CAAE7D,KAAM8D,OAAQG,SAAS,KAOlCG,EAAA,CAAAC,EAAsB,CAAEC,SAAU,0BApCnCC,EAAA9H,EAAA,KAAAmH,EAAA,CAAAY,KAAA,WAAAC,KAAA,WAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASlF,SAAQ/C,IAAA,CAAAiI,EAAA1F,KAAA0F,EAARlF,SAAQR,CAAA,GAAA4F,SAAAC,GAAAjI,EAAAE,GAIjBsH,EAAA9H,EAAA,KAAAsH,EAAA,CAAAS,KAAA,WAAAC,KAAA,YAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,cAAAA,EAAAC,IAAAD,GAAAA,EAAS/E,UAASlD,IAAA,CAAAiI,EAAA1F,KAAA0F,EAAT/E,UAASX,CAAA,GAAA4F,SAAAC,GAAA9H,EAAAE,GAIlBmH,EAAA9H,EAAA,KAAAuH,EAAA,CAAAQ,KAAA,WAAAC,KAAA,WAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAAS9E,SAAQnD,IAAA,CAAAiI,EAAA1F,KAAA0F,EAAR9E,SAAQZ,CAAA,GAAA4F,SAAAC,GAAA3H,EAAAE,GAIjBgH,EAAA9H,EAAA,KAAAwI,EAAA,CAAAT,KAAA,WAAAC,KAAA,OAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,SAAAA,EAAAC,IAAAD,GAAAA,EAAS7E,KAAIpD,IAAA,CAAAiI,EAAA1F,KAAA0F,EAAJ7E,KAAIb,CAAA,GAAA4F,SAAAC,GAAAxH,EAAAE,GAIb6G,EAAA9H,EAAA,KAAAyH,EAAA,CAAAM,KAAA,WAAAC,KAAA,cAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,gBAAAA,EAAAC,IAAAD,GAAAA,EAAS5E,YAAWrD,IAAA,CAAAiI,EAAA1F,KAAA0F,EAAX5E,YAAWd,CAAA,GAAA4F,SAAAC,GAAArH,EAAAE,GAIpB0G,EAAA9H,EAAA,KAAAyI,EAAA,CAAAV,KAAA,WAAAC,KAAA,aAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,eAAAA,EAAAC,IAAAD,GAAAA,EAAS3E,WAAUtD,IAAA,CAAAiI,EAAA1F,KAAA0F,EAAV3E,WAAUf,CAAA,GAAA4F,SAAAC,GAAAlH,EAAAE,GAInBuG,EAAA9H,EAAA,KAAA0I,EAAA,CAAAX,KAAA,WAAAC,KAAA,OAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,SAAAA,EAAAC,IAAAD,GAAAA,EAAS1E,KAAIvD,IAAA,CAAAiI,EAAA1F,KAAA0F,EAAJ1E,KAAIhB,CAAA,GAAA4F,SAAAC,GAAA/G,EAAAE,GAMboG,EAAA9H,EAAA,KAAA2I,EAAA,CAAAZ,KAAA,WAAAC,KAAA,gBAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,kBAAAA,EAAAC,IAAAD,GAAAA,EAAS3F,cAAatC,IAAA,CAAAiI,EAAA1F,KAAA0F,EAAb3F,cAAaC,CAAA,GAAA4F,SAAAC,GAAA5G,EAAAE,GAOtBiG,EAAA9H,EAAA,KAAA2H,EAAA,CAAAI,KAAA,WAAAC,KAAA,WAAAC,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA/D,IAAAgE,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASzE,SAAQxD,IAAA,CAAAiI,EAAA1F,KAAA0F,EAARzE,SAAQjB,CAAA,GAAA4F,SAAAC,GAAAzG,GAAAE,IA1CnB8F,EAAA,KAAAc,EAAA,CAAAlG,MAAA1C,GAAA6I,EAAA,CAAAd,KAAA,QAAAC,KAAAhI,EAAAgI,KAAAM,SAAAC,GAAA,KAAAO,iHACkB9I,EAAA+I,OAASC,EAAUC,GADxB5I,EAAAL,EAAA8I,MAAS"}