npm - @carbon/ibm-products-web-components - Versions diffs - 0.41.1 → 0.42.0 - Mend

@carbon/ibm-products-web-components 0.41.1 → 0.42.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 (160) hide show

package/es-custom/components/tearsheet-preview/tearsheet-influencer.js CHANGED Viewed

@@ -38,6 +38,7 @@ let CDSTearsheetInfluencer = class CDSTearsheetInfluencer extends SignalWatcher(
 		this.slot = "influencer";
 		this.isFlush = false;
 		this.influencerPanelOpen = false;
+		this.influencerPanelAriaLabel = "Influencer panel";
 		this.handleClose = () => {
 			this.influencerPanelOpen = false;
 			this.dispatchEvent(new CustomEvent("cds-custom-tearsheet-influencer-closed", {
@@ -54,6 +55,8 @@ let CDSTearsheetInfluencer = class CDSTearsheetInfluencer extends SignalWatcher(
           size="sm"
           ?open="${this.influencerPanelOpen}"
           placement="left"
+          aria-label="${this.influencerPanelAriaLabel}"
+          aria-modal="true"
           @c4p-side-panel-closed="${this.handleClose}"
         >
           <slot></slot>
@@ -74,6 +77,7 @@ __decorate([property({
 	reflect: true,
 	attribute: "influencer-panel-open"
 })], CDSTearsheetInfluencer.prototype, "influencerPanelOpen", void 0);
+__decorate([property({ attribute: "influencer-panel-aria-label" })], CDSTearsheetInfluencer.prototype, "influencerPanelAriaLabel", void 0);
 CDSTearsheetInfluencer = __decorate([carbonElement(`c4p-tearsheet-influencer`)], CDSTearsheetInfluencer);
 var tearsheet_influencer_default = CDSTearsheetInfluencer;
 //#endregion

package/es-custom/components/tearsheet-preview/tearsheet-influencer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tearsheet-influencer.js","names":["styles","customElement"],"sources":["../../../src/components/tearsheet-preview/tearsheet-influencer.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport '../side-panel/index.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\n\nimport styles from './tearsheet.scss?lit';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { tearsheetSignal } from './tearsheet-signal.js';\nimport { prefix } from '../../globals/settings.js';\n\n/\n Tearsheet Influencer component - Left-side panel for contextual information.\n * Automatically converts to a slide-in panel on small screens.\n \n @element c4p-tearsheet-influencer\n * @slot - Content for the influencer panel\n * @fires cds-custom-tearsheet-influencer-closed - Fired when the influencer panel is closed (mobile only)\n /\n@customElement(`${prefix}-tearsheet-influencer`)\nclass CDSTearsheetInfluencer extends SignalWatcher(\n HostListenerMixin(LitElement)\n) {\n @property({ reflect: true })\n slot = 'influencer';\n\n @property({ type: Boolean, reflect: true, attribute: 'is-flush' })\n isFlush: boolean = false;\n\n /\n In mobile screens left side influencer section won't be visible by default.\n * This prop can be toggled to open/close left panel in this case.\n /\n @property({\n type: Boolean,\n reflect: true,\n attribute: 'influencer-panel-open',\n })\n influencerPanelOpen: boolean = false;\n\n /\n Handler for closing the influencer panel\n */\n private handleClose = () => {\n this.influencerPanelOpen = false;\n this.dispatchEvent(\n new CustomEvent('cds-custom-tearsheet-influencer-closed', {\n bubbles: true,\n composed: true,\n })\n );\n };\n\n render() {\n const { isSm } = tearsheetSignal.get();\n\n return !isSm\n ? html` <aside>\n <slot></slot>\n </aside>`\n : html` <c4p-side-panel\n size=\"sm\"\n ?open=\"${this.influencerPanelOpen}\"\n placement=\"left\"\n @c4p-side-panel-closed=\"${this.handleClose}\"\n >\n <slot></slot>\n </c4p-side-panel>`;\n }\n\n static styles = styles;\n}\nexport default CDSTearsheetInfluencer;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,yBAAA,MACM,+BAA+B,cACnC,kBAAkB,WAAW,CAC9B,CAAC;;;cAEO;iBAGY;6BAWY;~~2BAKH~~;AAC1B,QAAK,sBAAsB;AAC3B,QAAK,cACH,IAAI,YAAY,mCAAmC;IACjD,SAAS;IACT,UAAU;IACX,CAAC,CACH;;;CAGH,SAAS;EACP,MAAM,EAAE,SAAS,gBAAgB,KAAK;AAEtC,SAAO,CAAC,OACJ,IAAI;;oBAGJ,IAAI;;mBAEO,KAAK,oBAAoB;;~~oCAER~~,KAAK,YAAY;;;;;;gBAMnCA;;;~~YA/Cf~~,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,uBAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAY,CAAC,CAAA,EAAA,uBAAA,WAAA,WAAA,KAAA,EAAA;YAOjE,SAAS;CACR,MAAM;CACN,SAAS;CACT,WAAW;CACZ,CAAC,CAAA,EAAA,uBAAA,WAAA,uBAAA,KAAA,EAAA;~~qCAlBHC~~,cAAc,2BAAiC,CAAA,EAAA,uBAAA;~~AAqDhD~~,IAAA,+BAAe"}
1	+ {"version":3,"file":"tearsheet-influencer.js","names":["styles","customElement"],"sources":["../../../src/components/tearsheet-preview/tearsheet-influencer.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport '../side-panel/index.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\n\nimport styles from './tearsheet.scss?lit';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { tearsheetSignal } from './tearsheet-signal.js';\nimport { prefix } from '../../globals/settings.js';\n\n/\n Tearsheet Influencer component - Left-side panel for contextual information.\n * Automatically converts to a slide-in panel on small screens.\n \n @element c4p-tearsheet-influencer\n * @slot - Content for the influencer panel\n * @fires cds-custom-tearsheet-influencer-closed - Fired when the influencer panel is closed (mobile only)\n /\n@customElement(`${prefix}-tearsheet-influencer`)\nclass CDSTearsheetInfluencer extends SignalWatcher(\n HostListenerMixin(LitElement)\n) {\n @property({ reflect: true })\n slot = 'influencer';\n\n @property({ type: Boolean, reflect: true, attribute: 'is-flush' })\n isFlush: boolean = false;\n\n /\n In mobile screens left side influencer section won't be visible by default.\n * This prop can be toggled to open/close left panel in this case.\n /\n @property({\n type: Boolean,\n reflect: true,\n attribute: 'influencer-panel-open',\n })\n influencerPanelOpen: boolean = false;\n\n /\n Optional aria-label for the influencer panel. Defaults to \"Influencer panel\".\n /\n @property({ attribute: 'influencer-panel-aria-label' })\n influencerPanelAriaLabel: string = 'Influencer panel';\n\n /\n Handler for closing the influencer panel\n */\n private handleClose = () => {\n this.influencerPanelOpen = false;\n this.dispatchEvent(\n new CustomEvent('cds-custom-tearsheet-influencer-closed', {\n bubbles: true,\n composed: true,\n })\n );\n };\n\n render() {\n const { isSm } = tearsheetSignal.get();\n\n return !isSm\n ? html` <aside>\n <slot></slot>\n </aside>`\n : html` <c4p-side-panel\n size=\"sm\"\n ?open=\"${this.influencerPanelOpen}\"\n placement=\"left\"\n aria-label=\"${this.influencerPanelAriaLabel}\"\n aria-modal=\"true\"\n @c4p-side-panel-closed=\"${this.handleClose}\"\n >\n <slot></slot>\n </c4p-side-panel>`;\n }\n\n static styles = styles;\n}\nexport default CDSTearsheetInfluencer;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,yBAAA,MACM,+BAA+B,cACnC,kBAAkB,WAAW,CAC9B,CAAC;;;cAEO;iBAGY;6BAWY;kCAMI;2BAKP;AAC1B,QAAK,sBAAsB;AAC3B,QAAK,cACH,IAAI,YAAY,mCAAmC;IACjD,SAAS;IACT,UAAU;IACX,CAAC,CACH;;;CAGH,SAAS;EACP,MAAM,EAAE,SAAS,gBAAgB,KAAK;AAEtC,SAAO,CAAC,OACJ,IAAI;;oBAGJ,IAAI;;mBAEO,KAAK,oBAAoB;;wBAEpB,KAAK,yBAAyB;;oCAElB,KAAK,YAAY;;;;;;gBAMnCA;;;YAvDf,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,uBAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAY,CAAC,CAAA,EAAA,uBAAA,WAAA,WAAA,KAAA,EAAA;YAOjE,SAAS;CACR,MAAM;CACN,SAAS;CACT,WAAW;CACZ,CAAC,CAAA,EAAA,uBAAA,WAAA,uBAAA,KAAA,EAAA;YAMD,SAAS,EAAE,WAAW,+BAA+B,CAAC,CAAA,EAAA,uBAAA,WAAA,4BAAA,KAAA,EAAA;qCAxBxDC,cAAc,2BAAiC,CAAA,EAAA,uBAAA;AA6DhD,IAAA,+BAAe"}

package/es-custom/components/tearsheet-preview/tearsheet-navigation-bar.scss.js CHANGED Viewed

@@ -7,7 +7,7 @@
 import { css } from "lit";
 //#region src/components/tearsheet-preview/tearsheet-navigation-bar.scss?lit
-var tearsheet_navigation_bar_default = css(["@keyframes cds-custom--hide-feedback{0%{opacity:1;visibility:inherit}to{opacity:0;visibility:hidden}}@keyframes cds-custom--show-feedback{0%{opacity:0;visibility:hidden}to{opacity:1;visibility:inherit}}@keyframes cds-custom--skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:left}20%{opacity:1;transform:scaleX(1);transform-origin:left}28%{transform:scaleX(1);transform-origin:right}51%{transform:scaleX(0);transform-origin:right}58%{transform:scaleX(0);transform-origin:right}82%{transform:scaleX(1);transform-origin:right}83%{transform:scaleX(1);transform-origin:left}96%{transform:scaleX(0);transform-origin:left}to{opacity:.3;transform:scaleX(0);transform-origin:left}}.cds-custom--layout--size-xs{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-xs,1.5rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-xs{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-xs,1.5rem))}.cds-custom--layout-constraint--size__min-xs{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-xs,1.5rem)}.cds-custom--layout-constraint--size__max-xs{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-xs,1.5rem)}.cds-custom--layout--size-sm{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-sm,2rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-sm{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-sm,2rem))}.cds-custom--layout-constraint--size__min-sm{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-sm,2rem)}.cds-custom--layout-constraint--size__max-sm{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-sm,2rem)}.cds-custom--layout--size-md{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-md,2.5rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-md{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-md,2.5rem))}.cds-custom--layout-constraint--size__min-md{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-md,2.5rem)}.cds-custom--layout-constraint--size__max-md{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-md,2.5rem)}.cds-custom--layout--size-lg{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-lg,3rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-lg{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-lg,3rem))}.cds-custom--layout-constraint--size__min-lg{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-lg,3rem)}.cds-custom--layout-constraint--size__max-lg{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-lg,3rem)}.cds-custom--layout--size-xl{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-xl,4rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-xl{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-xl,4rem))}.cds-custom--layout-constraint--size__min-xl{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-xl,4rem)}.cds-custom--layout-constraint--size__max-xl{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-xl,4rem)}.cds-custom--layout--size-2xl{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-2xl,5rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-2xl{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-2xl,5rem))}.cds-custom--layout-constraint--size__min-2xl{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-2xl,5rem)}.cds-custom--layout-constraint--size__max-2xl{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-2xl,5rem)}.cds-custom--layout--density-condensed{--cds-custom-layout-density-padding-inline-context:var(--cds-custom-layout-density-padding-inline-condensed,0.5rem);--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context)}.cds-custom--layout-constraint--density__default-condensed{--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context,var(--cds-custom-layout-density-padding-inline-condensed,0.5rem))}.cds-custom--layout-constraint--density__min-condensed{--cds-custom-layout-density-padding-inline-min:var(--cds-custom-layout-density-padding-inline-condensed,0.5rem)}.cds-custom--layout-constraint--density__max-condensed{--cds-custom-layout-density-padding-inline-max:var(--cds-custom-layout-density-padding-inline-condensed,0.5rem)}.cds-custom--layout--density-normal{--cds-custom-layout-density-padding-inline-context:var(--cds-custom-layout-density-padding-inline-normal,1rem);--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context)}.cds-custom--layout-constraint--density__default-normal{--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context,var(--cds-custom-layout-density-padding-inline-normal,1rem))}.cds-custom--layout-constraint--density__min-normal{--cds-custom-layout-density-padding-inline-min:var(--cds-custom-layout-density-padding-inline-normal,1rem)}.cds-custom--layout-constraint--density__max-normal{--cds-custom-layout-density-padding-inline-max:var(--cds-custom-layout-density-padding-inline-normal,1rem)}:root{--cds-custom-layout-size-height-xs:1.5rem;--cds-custom-layout-size-height-sm:2rem;--cds-custom-layout-size-height-md:2.5rem;--cds-custom-layout-size-height-lg:3rem;--cds-custom-layout-size-height-xl:4rem;--cds-custom-layout-size-height-2xl:5rem;--cds-custom-layout-size-height-min:0px;--cds-custom-layout-size-height-max:999999999px;--cds-custom-layout-density-padding-inline-condensed:0.5rem;--cds-custom-layout-density-padding-inline-normal:1rem;--cds-custom-layout-density-padding-inline-min:0px;--cds-custom-layout-density-padding-inline-max:999999999px}.cds-custom--assistive-text,.cds-custom--visually-hidden{block-size:1px;border:0;margin:-1px;overflow:hidden;padding:0;position:absolute;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted){animation:c4p--tearsheet__next--presence-tearsheet__enter .24s cubic-bezier(0,0,.3,1);opacity:1}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:c4p--tearsheet__next--presence-tearsheet--container__enter .24s cubic-bezier(0,0,.3,1);transform:translateZ(0)}@media screen and (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:none}}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted).c4p--tearsheet__next--stacked.is-visible .c4p--tearsheet__next__container{transform:scaleX(var(--scale-factor))}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted)[data-tearsheet-exiting]{animation:c4p--tearsheet__next--presence-tearsheet__exit .24s cubic-bezier(.4,.14,1,1) forwards}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted)[data-tearsheet-exiting].c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:c4p--tearsheet__next--presence-tearsheet--container__exit .24s cubic-bezier(0,0,.3,1) forwards}@media screen and (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted)[data-tearsheet-exiting].c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:none}}.c4p--tearsheet__next.c4p--tearsheet__next--keep-mounted:not(.is-visible).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transform:translate3d(0,min(95vh,500px),0)}@keyframes c4p--tearsheet__next--presence-tearsheet__enter{0%{opacity:0;transition:none}}@keyframes c4p--tearsheet__next--presence-tearsheet__exit{to{opacity:0}}@keyframes c4p--tearsheet__next--presence-tearsheet--container__enter{0%{transform:translate3d(0,min(95vh,500px),0);transition:none}}@keyframes c4p--tearsheet__next--presence-tearsheet--container__exit{to{transform:translate3d(0,min(95vh,500px),0)}}.c4p--tearsheet__next .c4p--tearsheet__next__container{align-self:flex-end;block-size:100%;border:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);inset-block-start:auto;max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem));max-inline-size:var(--tearsheet-max-inline-size,1312px)}@media (max-width:41.98rem){.c4p--tearsheet__next:not(.c4p--tearsheet__next--stack-activated.is-visible) .c4p--tearsheet__next__container{max-block-size:none}}.c4p--tearsheet__next:not(.is-visible).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transform:translate3d(0,min(95vh,500px),0)}.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next--has-ai-label .c4p--tearsheet__next__container{background:linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,#78a9ff),var(--cds-custom-ai-border-end,#d0e2ff)) border-box,linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) border-box;border:1px solid transparent;border-block-end:0;box-shadow:0 4px 10px 2px var(--cds-custom-ai-drop-shadow,rgba(15,98,254,.1))}.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next--has-ai-label .c4p--tearsheet__next__main-content{background:linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)) 0,var(--cds-custom-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-custom-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,rgba(166,200,255,.64)),var(--cds-custom-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-custom-ai-inner-shadow,rgba(69,137,255,.1));position:relative}.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transition:transform .24s cubic-bezier(0,0,.3,1),max-block-size .24s cubic-bezier(0,0,.3,1)}@media screen and (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transition:none}}.c4p--tearsheet__next .c4p--tearsheet__next__header{align-content:space-between;border-block-end:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);display:flex;flex-wrap:wrap;margin-block:0;max-block-size:50vh;padding-block-end:0;padding-block-start:1.5rem;padding-inline:2rem}.c4p--tearsheet__next .c4p--tearsheet__next__header>*{flex-basis:100%}.c4p--tearsheet__next .c4p--tearsheet__next__header>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button){margin-block-end:1.5rem}@media (max-width:41.98rem){.c4p--tearsheet__next .c4p--tearsheet__next__header{padding-inline:1rem}}.c4p--tearsheet__next .cds-custom--modal-container--sm .cds-custom--modal-header{padding-inline-end:2rem}.c4p--tearsheet__next .c4p--tearsheet__next__header-content-wrapper{display:grid;flex-basis:unset;gap:1rem;grid-template-columns:minmax(auto,40rem) minmax(var(--tearsheet-header-title-grid-width,0),1fr);inline-size:calc(100% - var(--tearsheet-header-action-offset))}@media (max-width:41.98rem){.c4p--tearsheet__next .c4p--tearsheet__next__header-content-wrapper{display:flex;flex-direction:column}}@media (min-width:42rem){.c4p--tearsheet__next:not(.c4p--tearsheet__next--narrow) .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-actions{order:2}.c4p--tearsheet__next:not(.c4p--tearsheet__next--narrow) .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-content{order:1}}.c4p--tearsheet__next .c4p--tearsheet__next__header>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button,.c4p--tearsheet__next__decorator,.excludeFromCollapse){max-block-size:50vh;opacity:1;overflow:hidden;transition:max-block-size .24s cubic-bezier(0,0,.3,1),opacity .24s cubic-bezier(0,0,.3,1),margin .24s cubic-bezier(0,0,.3,1),padding .24s cubic-bezier(0,0,.3,1);visibility:hidden}.c4p--tearsheet__next .c4p--tearsheet__next__header .c4p--tearsheet__next__header-actions,.c4p--tearsheet__next .c4p--tearsheet__next__header .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-content :not(.c4p--tearsheet__next__content__title-wrapper,.c4p--tearsheet__next__header-label){opacity:1;transition:all .24s cubic-bezier(0,0,.3,1),opacity .24s cubic-bezier(0,0,.3,1)}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed{padding-block-start:.75rem;transition:padding .24s cubic-bezier(0,0,.3,1)}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions>:not(.c4p--tearsheet__next__content__header-actions),.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-content>:not(.c4p--tearsheet__next__content__title-wrapper) *,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content>:not(.c4p--tearsheet__next__content__title-wrapper),.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button,.c4p--tearsheet__next__decorator,.excludeFromCollapse),.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button,.c4p--tearsheet__next__decorator,.excludeFromCollapse) *{margin:0;max-block-size:0;opacity:0;overflow:hidden;padding:0;pointer-events:none;transition:all .24s cubic-bezier(0,0,.3,1);visibility:hidden}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title{align-items:center;font-size:var(--cds-custom-label-02-font-size,.875rem);font-weight:var(--cds-custom-label-02-font-weight,400);letter-spacing:var(--cds-custom-label-02-letter-spacing,.16px);line-height:var(--cds-custom-label-02-line-height,1.28572);margin-block-start:.25rem;transition:all .24s cubic-bezier(0,0,.3,1)}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title>span{align-items:center;block-size:1.5rem;display:flex}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title .c4p--tearsheet__next__title-end svg,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title .c4p--tearsheet__next__title-start svg{inline-size:1rem}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content{align-self:center;margin-block-end:0}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__content__header-actions{margin-block-start:-.125rem}@media (max-width:41.98rem){.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions{display:none}}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__content__title-wrapper,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content-wrapper,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title{margin-block:0;transition:margin-block .24s ease}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content-wrapper{min-block-size:2.5rem;padding-block-end:.75rem}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__navigation-bar:before{background:var(--cds-custom-border-subtle-01,#c6c6c6);block-size:1px;content:\"\";inline-size:calc(100% + 5rem);inset-block-start:0;inset-inline-start:-2rem;pointer-events:none;position:absolute;z-index:1}.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible{--overlay-color:var(--cds-custom-overlay,rgba(0,0,0,.6));--overlay-alpha:0.5;background-color:initial;z-index:calc(9000 - var(--stack-depth, 0))}.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible:before{background:var(--overlay-color);content:\"\";display:block;inset:0;opacity:calc(var(--overlay-alpha) - var(--stack-depth)*.1);position:absolute;transition:background-color .24s cubic-bezier(.4,.14,1,1),opacity .24s cubic-bezier(.4,.14,1,1)}@media (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible:before{transition:none}}.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible.is-visible .c4p--tearsheet__next__container{max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem) + var(--block-size-change));transform:scaleX(var(--scale-factor))}.c4p--tearsheet__next__header-label{color:var(--cds-custom-text-secondary,#525252);font-size:var(--cds-custom-label-01-font-size,.75rem);font-weight:var(--cds-custom-label-01-font-weight,400);letter-spacing:var(--cds-custom-label-01-letter-spacing,.32px);line-height:var(--cds-custom-label-01-line-height,1.33333);margin-block-end:.25rem}.c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-04-font-size,1.75rem);font-weight:var(--cds-custom-heading-04-font-weight,400);letter-spacing:var(--cds-custom-heading-04-letter-spacing,0);line-height:var(--cds-custom-heading-04-line-height,1.28572)}@media (max-width:41.98rem){.c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-03-font-size,1.25rem);font-weight:var(--cds-custom-heading-03-font-weight,400);letter-spacing:var(--cds-custom-heading-03-letter-spacing,0);line-height:var(--cds-custom-heading-03-line-height,1.4)}}.c4p--tearsheet__next__header-title{align-items:flex-start;display:flex;gap:1rem;margin-block-end:.5rem}.c4p--tearsheet__next__header-title svg{flex-shrink:0}.c4p--tearsheet__next__header-title .c4p--tearsheet__next__title-end{margin-inline-start:1rem}.c4p--tearsheet__next__header-description{font-size:var(--cds-custom-body-compact-01-font-size,.875rem);font-weight:var(--cds-custom-body-compact-01-font-weight,400);letter-spacing:var(--cds-custom-body-compact-01-letter-spacing,.16px);line-height:var(--cds-custom-body-compact-01-line-height,1.28572)}.c4p--tearsheet__next__header--no-close-icon{display:none}.c4p--tearsheet__next__decorator{inset-block-start:.625rem;inset-inline-end:3rem;position:absolute}.c4p--tearsheet__next__navigation-bar,:host{align-items:center;display:flex;gap:.125rem;justify-content:space-between;max-inline-size:calc(100% - .75rem);min-block-size:2.5rem;position:relative}.c4p--tearsheet__next__navigation-bar .cds-custom--tabs,:host .cds-custom--tabs{margin-inline-start:-1rem}.c4p--tearsheet__next__scroller-container,:host ::slotted([slot=scroller]){inset-block-end:0;inset-inline-end:-2.5rem;position:absolute}@media (max-width:41.98rem){.c4p--tearsheet__next__scroller-container,:host ::slotted([slot=scroller]){inset-inline-end:-1.5rem}}.c4p--tearsheet__next__scroller-container .c4p--tearsheet__next__scroller-button-icon-collapsed,:host ::slotted([slot=scroller]) .c4p--tearsheet__next__scroller-button-icon-collapsed{transform:rotate(-180deg)}.c4p--tearsheet__next__header-actions{display:flex;justify-content:flex-end}.c4p--tearsheet__next__content__header-actions{align-items:center;block-size:2rem;display:flex;flex:0 0 auto;inline-size:100%;justify-content:flex-end;margin-block-start:-14px;overflow:hidden}.c4p--tearsheet__next__content__header-actions>.c4p--tearsheet__next__header-action-item:not([data-hidden=true]){margin-inline-end:.5rem}.c4p--tearsheet__next__content__header-actions>.c4p--tearsheet__next__header-action-item:not([data-hidden=true]):nth-last-child(2){margin-inline-end:0}.c4p--tearsheet__next__content__header-actions>*{flex-shrink:0}@media (max-width:41.98rem){.c4p--tearsheet__next__content__header-actions{justify-content:flex-start;margin-inline-end:0}}.c4p--tearsheet__next__header-actions,.c4p--tearsheet__next__header-content{margin-block-end:1.5rem}@media (min-width:42rem){.c4p--tearsheet__next--wide .c4p--tearsheet__next__container{inline-size:calc(100% - 8rem)}}.c4p--tearsheet__next__body-layout{display:grid;grid-template-areas:\"influencer body\" \"influencer footer\";grid-template-columns:var(--tearsheet-influencer-width,16rem) 1fr;grid-template-rows:1fr auto;padding-block:0;padding-inline-end:0}.c4p--tearsheet__next__body-layout:not(.c4p--tearsheet__next__body-layout--has-influencer){grid-template-areas:\"body\" \"footer\";grid-template-columns:1fr}.c4p--tearsheet__next__influencer,:host(c4p-preview-tearsheet) ::slotted([slot=influencer]){border-inline-end:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);grid-area:influencer}.c4p--tearsheet__next__body,:host(c4p-preview-tearsheet) ::slotted([slot=body]){display:grid;grid-area:body;grid-template-columns:1fr var(--tearsheet-summary-content-width,16rem);overflow:hidden;position:relative}@media (max-width:41.98rem){.c4p--tearsheet__next__body,:host(c4p-preview-tearsheet) ::slotted([slot=body]){grid-template-columns:1fr 0}}.c4p--tearsheet__next__body>:only-child,:host(c4p-preview-tearsheet) ::slotted([slot=body])>:only-child{grid-column:1/-1}.c4p--tearsheet__next__footer,:host(c4p-preview-tearsheet) ::slotted([slot=footer]){block-size:5rem;border-block-start:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);grid-area:footer;overflow:hidden}@media (max-width:41.98rem){.c4p--tearsheet__next__footer,:host(c4p-preview-tearsheet) ::slotted([slot=footer]){block-size:4rem}}@media (max-width:19.98rem){.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--three-actions,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--three-actions::slotted([slot=footer]){overflow-x:auto;overflow-y:hidden}.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--three-actions .c4p--action-set,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--three-actions::slotted([slot=footer]) .c4p--action-set{display:inline-flex;flex-shrink:0;min-inline-size:-moz-max-content;min-inline-size:max-content}}@media (max-width:41.98rem){.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--many-actions,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--many-actions::slotted([slot=footer]){overflow-x:auto;overflow-y:hidden}.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--many-actions .c4p--action-set,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--many-actions::slotted([slot=footer]) .c4p--action-set{display:inline-flex;flex-shrink:0;min-inline-size:-moz-max-content;min-inline-size:max-content}}.c4p--tearsheet__next__influencer,.c4p--tearsheet__next__main-content,.c4p--tearsheet__next__summary-content,:host ::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) ::slotted([slot=influencer]){overflow:auto}.c4p--tearsheet__next__influencer:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__main-content:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__summary-content:not(.c4p--tearsheet__next__flush),:host :not(.c4p--tearsheet__next__flush)::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) :not(.c4p--tearsheet__next__flush)::slotted([slot=influencer]){padding-inline:2rem}@media (max-width:41.98rem){.c4p--tearsheet__next__influencer:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__main-content:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__summary-content:not(.c4p--tearsheet__next__flush),:host :not(.c4p--tearsheet__next__flush)::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) :not(.c4p--tearsheet__next__flush)::slotted([slot=influencer]){padding-inline:1rem}}.c4p--tearsheet__next__side-panel,:host c4p-side-panel::part(dialog){block-size:100%;inline-size:100%!important;inset-block-start:0;max-inline-size:none;position:absolute;z-index:9999}.c4p--tearsheet__next__side-panel .c4p--side-panel__header,:host c4p-side-panel::part(dialog) .c4p--side-panel__header{min-block-size:0}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header{padding-inline:1rem}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header.c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions{display:none}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header.c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content{align-self:flex-start}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header-content-wrapper{display:flex;flex-direction:column}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-03-font-size,1.25rem);font-weight:var(--cds-custom-heading-03-font-weight,400);letter-spacing:var(--cds-custom-heading-03-letter-spacing,0);line-height:var(--cds-custom-heading-03-line-height,1.4)}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__content__header-actions{justify-content:flex-start;margin-inline-end:0}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__body,:host(c4p-preview-tearsheet) .c4p--tearsheet__next--narrow ::slotted([slot=body]){grid-template-columns:1fr 0}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__influencer:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next--narrow .c4p--tearsheet__next__main-content:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next--narrow .c4p--tearsheet__next__summary-content:not(.c4p--tearsheet__next__flush),:host .c4p--tearsheet__next--narrow :not(.c4p--tearsheet__next__flush)::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) .c4p--tearsheet__next--narrow :not(.c4p--tearsheet__next__flush)::slotted([slot=influencer]){padding-inline:1rem}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__footer,:host(c4p-preview-tearsheet) .c4p--tearsheet__next--narrow ::slotted([slot=footer]){block-size:4rem}.c4p--tearsheet__next--has-ai-label::part(dialog){background:linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,#78a9ff),var(--cds-custom-ai-border-end,#d0e2ff)) border-box,linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) border-box;border:1px solid transparent!important;border-block-end:0;box-shadow:0 4px 10px 2px var(--cds-custom-ai-drop-shadow,rgba(15,98,254,.1))}.c4p--tearsheet__next__main-content{position:relative}.c4p--tearsheet__next__main-content.c4p--tearsheet__next__flush{padding-inline:0}.c4p--tearsheet__next__main-content.c4p--tearsheet__next__main-content--no-summary{grid-column:1/-1}.c4p--tearsheet__next__main-content.c4p--tearsheet__next__main-content--has-ai-label{background:linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)) 0,var(--cds-custom-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-custom-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,rgba(166,200,255,.64)),var(--cds-custom-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-custom-ai-inner-shadow,rgba(69,137,255,.1))}:host ::slotted([slot=summary-content][is-flush]){padding-inline:0}@media screen and (prefers-reduced-motion:reduce){:host(c4p-preview-tearsheet) ::part(dialog){align-self:flex-end;block-size:100%;border:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);inset-block-start:auto;max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem));transform:translate3d(0,min(95vh,500px),0);transition:none}}:host(c4p-preview-tearsheet) ::part(dialog){align-self:flex-end;block-size:100%;border:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);inset-block-start:auto;max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem));transform:translate3d(0,min(95vh,500px),0);transition:transform .24s cubic-bezier(0,0,.3,1),max-block-size .24s cubic-bezier(0,0,.3,1)}:host(c4p-preview-tearsheet) ::slotted([slot=influencer][is-flush]){padding-inline:0}:host(c4p-preview-tearsheet[open]) ::part(dialog){transform:translateZ(0);transition:transform .24s cubic-bezier(0,0,.3,1)}@media (prefers-reduced-motion:reduce){:host(c4p-preview-tearsheet[open]) ::part(dialog){transition:none}}@media (max-width:41.98rem){:host(:not(.c4p--tearsheet__next--stack-activated.is-visible)) ::part(dialog){max-block-size:none}}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible){--overlay-color:var(--cds-custom-overlay,rgba(0,0,0,.6));--overlay-alpha:0.5}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible):before{background:var(--overlay-color);content:\"\";display:block;inset:0;opacity:calc(var(--overlay-alpha) - var(--stack-depth)*.1);pointer-events:none;position:fixed;transition:background-color .24s cubic-bezier(.4,.14,1,1),opacity .24s cubic-bezier(.4,.14,1,1);z-index:calc(9000 - var(--stack-depth, 0))}@media (prefers-reduced-motion:reduce){:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible):before{transition:none}}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible) cds-custom-modal{background-color:transparent}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible) ::part(dialog){max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem) + var(--block-size-change));transform:scaleX(var(--scale-factor))}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header{padding-inline:1rem}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header.c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions{display:none}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header-content-wrapper{display:flex;flex-direction:column}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-03-font-size,1.25rem);font-weight:var(--cds-custom-heading-03-font-weight,400);letter-spacing:var(--cds-custom-heading-03-letter-spacing,0);line-height:var(--cds-custom-heading-03-line-height,1.4)}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__content__header-actions{justify-content:flex-start;margin-inline-end:0}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__body,:host(c4p-preview-tearsheet[variant=narrow]):host(c4p-preview-tearsheet) ::slotted([slot=body]){grid-template-columns:1fr 0}:host(c4p-preview-tearsheet[variant=narrow]) ::slotted([slot=influencer]),:host(c4p-preview-tearsheet[variant=narrow]) ::slotted([slot=summary-content]){padding:0!important}@media (max-width:41.98rem){:host(c4p-preview-tearsheet) ::slotted([slot=influencer]),:host(c4p-preview-tearsheet) ::slotted([slot=summary-content]){padding:0!important}}:host-context(c4p-preview-tearsheet[variant=narrow]) ::slotted([slot=summary-content]){padding:0}:host ::slotted([slot=footer]){padding-block:0}:host ::slotted(cds-custom-tabs){margin-inline-start:-1rem}"]);
+var tearsheet_navigation_bar_default = css(["@keyframes cds-custom--hide-feedback{0%{opacity:1;visibility:inherit}to{opacity:0;visibility:hidden}}@keyframes cds-custom--show-feedback{0%{opacity:0;visibility:hidden}to{opacity:1;visibility:inherit}}@keyframes cds-custom--skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:left}20%{opacity:1;transform:scaleX(1);transform-origin:left}28%{transform:scaleX(1);transform-origin:right}51%{transform:scaleX(0);transform-origin:right}58%{transform:scaleX(0);transform-origin:right}82%{transform:scaleX(1);transform-origin:right}83%{transform:scaleX(1);transform-origin:left}96%{transform:scaleX(0);transform-origin:left}to{opacity:.3;transform:scaleX(0);transform-origin:left}}.cds-custom--layout--size-xs{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-xs,1.5rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-xs{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-xs,1.5rem))}.cds-custom--layout-constraint--size__min-xs{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-xs,1.5rem)}.cds-custom--layout-constraint--size__max-xs{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-xs,1.5rem)}.cds-custom--layout--size-sm{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-sm,2rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-sm{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-sm,2rem))}.cds-custom--layout-constraint--size__min-sm{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-sm,2rem)}.cds-custom--layout-constraint--size__max-sm{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-sm,2rem)}.cds-custom--layout--size-md{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-md,2.5rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-md{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-md,2.5rem))}.cds-custom--layout-constraint--size__min-md{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-md,2.5rem)}.cds-custom--layout-constraint--size__max-md{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-md,2.5rem)}.cds-custom--layout--size-lg{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-lg,3rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-lg{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-lg,3rem))}.cds-custom--layout-constraint--size__min-lg{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-lg,3rem)}.cds-custom--layout-constraint--size__max-lg{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-lg,3rem)}.cds-custom--layout--size-xl{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-xl,4rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-xl{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-xl,4rem))}.cds-custom--layout-constraint--size__min-xl{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-xl,4rem)}.cds-custom--layout-constraint--size__max-xl{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-xl,4rem)}.cds-custom--layout--size-2xl{--cds-custom-layout-size-height-context:var(--cds-custom-layout-size-height-2xl,5rem);--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context)}.cds-custom--layout-constraint--size__default-2xl{--cds-custom-layout-size-height:var(--cds-custom-layout-size-height-context,var(--cds-custom-layout-size-height-2xl,5rem))}.cds-custom--layout-constraint--size__min-2xl{--cds-custom-layout-size-height-min:var(--cds-custom-layout-size-height-2xl,5rem)}.cds-custom--layout-constraint--size__max-2xl{--cds-custom-layout-size-height-max:var(--cds-custom-layout-size-height-2xl,5rem)}.cds-custom--layout--density-condensed{--cds-custom-layout-density-padding-inline-context:var(--cds-custom-layout-density-padding-inline-condensed,0.5rem);--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context)}.cds-custom--layout-constraint--density__default-condensed{--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context,var(--cds-custom-layout-density-padding-inline-condensed,0.5rem))}.cds-custom--layout-constraint--density__min-condensed{--cds-custom-layout-density-padding-inline-min:var(--cds-custom-layout-density-padding-inline-condensed,0.5rem)}.cds-custom--layout-constraint--density__max-condensed{--cds-custom-layout-density-padding-inline-max:var(--cds-custom-layout-density-padding-inline-condensed,0.5rem)}.cds-custom--layout--density-normal{--cds-custom-layout-density-padding-inline-context:var(--cds-custom-layout-density-padding-inline-normal,1rem);--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context)}.cds-custom--layout-constraint--density__default-normal{--cds-custom-layout-density-padding-inline:var(--cds-custom-layout-density-padding-inline-context,var(--cds-custom-layout-density-padding-inline-normal,1rem))}.cds-custom--layout-constraint--density__min-normal{--cds-custom-layout-density-padding-inline-min:var(--cds-custom-layout-density-padding-inline-normal,1rem)}.cds-custom--layout-constraint--density__max-normal{--cds-custom-layout-density-padding-inline-max:var(--cds-custom-layout-density-padding-inline-normal,1rem)}:root{--cds-custom-layout-size-height-xs:1.5rem;--cds-custom-layout-size-height-sm:2rem;--cds-custom-layout-size-height-md:2.5rem;--cds-custom-layout-size-height-lg:3rem;--cds-custom-layout-size-height-xl:4rem;--cds-custom-layout-size-height-2xl:5rem;--cds-custom-layout-size-height-min:0px;--cds-custom-layout-size-height-max:999999999px;--cds-custom-layout-density-padding-inline-condensed:0.5rem;--cds-custom-layout-density-padding-inline-normal:1rem;--cds-custom-layout-density-padding-inline-min:0px;--cds-custom-layout-density-padding-inline-max:999999999px}.cds-custom--assistive-text,.cds-custom--visually-hidden{block-size:1px;border:0;margin:-1px;overflow:hidden;padding:0;position:absolute;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted){animation:c4p--tearsheet__next--presence-tearsheet__enter .24s cubic-bezier(0,0,.3,1);opacity:1}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:c4p--tearsheet__next--presence-tearsheet--container__enter .24s cubic-bezier(0,0,.3,1);transform:translateZ(0)}@media screen and (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:none}}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted).c4p--tearsheet__next--stacked.is-visible .c4p--tearsheet__next__container{transform:scaleX(var(--scale-factor))}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted)[data-tearsheet-exiting]{animation:c4p--tearsheet__next--presence-tearsheet__exit .24s cubic-bezier(.4,.14,1,1) forwards}.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted)[data-tearsheet-exiting].c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:c4p--tearsheet__next--presence-tearsheet--container__exit .24s cubic-bezier(0,0,.3,1) forwards}@media screen and (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next:not(.c4p--tearsheet__next--keep-mounted)[data-tearsheet-exiting].c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{animation:none}}.c4p--tearsheet__next.c4p--tearsheet__next--keep-mounted:not(.is-visible).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transform:translate3d(0,min(95vh,500px),0)}@keyframes c4p--tearsheet__next--presence-tearsheet__enter{0%{opacity:0;transition:none}}@keyframes c4p--tearsheet__next--presence-tearsheet__exit{to{opacity:0}}@keyframes c4p--tearsheet__next--presence-tearsheet--container__enter{0%{transform:translate3d(0,min(95vh,500px),0);transition:none}}@keyframes c4p--tearsheet__next--presence-tearsheet--container__exit{to{transform:translate3d(0,min(95vh,500px),0)}}.c4p--tearsheet__next .c4p--tearsheet__next__container{align-self:flex-end;block-size:100%;border:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);inset-block-start:auto;max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem));max-inline-size:var(--tearsheet-max-inline-size,1312px)}@media (max-width:41.98rem){.c4p--tearsheet__next:not(.c4p--tearsheet__next--stack-activated.is-visible) .c4p--tearsheet__next__container{max-block-size:none}}.c4p--tearsheet__next:not(.is-visible).c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transform:translate3d(0,min(95vh,500px),0)}.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next--has-ai-label .c4p--tearsheet__next__container{background:linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,#78a9ff),var(--cds-custom-ai-border-end,#d0e2ff)) border-box,linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) border-box;border:1px solid transparent;border-block-end:0;box-shadow:0 4px 10px 2px var(--cds-custom-ai-drop-shadow,rgba(15,98,254,.1))}.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next--has-ai-label .c4p--tearsheet__next__main-content{background:linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)) 0,var(--cds-custom-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-custom-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,rgba(166,200,255,.64)),var(--cds-custom-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-custom-ai-inner-shadow,rgba(69,137,255,.1));position:relative}.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transition:transform .24s cubic-bezier(0,0,.3,1),max-block-size .24s cubic-bezier(0,0,.3,1)}@media screen and (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next.c4p--tearsheet__next .c4p--tearsheet__next__container{transition:none}}.c4p--tearsheet__next .c4p--tearsheet__next__header{align-content:space-between;border-block-end:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);display:flex;flex-wrap:wrap;margin-block:0;max-block-size:50vh;padding-block-end:0;padding-block-start:1.5rem;padding-inline:2rem}.c4p--tearsheet__next .c4p--tearsheet__next__header>*{flex-basis:100%}.c4p--tearsheet__next .c4p--tearsheet__next__header>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button){margin-block-end:1.5rem}@media (max-width:41.98rem){.c4p--tearsheet__next .c4p--tearsheet__next__header{padding-inline:1rem}}.c4p--tearsheet__next .cds-custom--modal-container--sm .cds-custom--modal-header{padding-inline-end:2rem}.c4p--tearsheet__next .c4p--tearsheet__next__header-content-wrapper{display:grid;flex-basis:unset;gap:1rem;grid-template-columns:minmax(auto,40rem) minmax(var(--tearsheet-header-title-grid-width,0),1fr);inline-size:calc(100% - var(--tearsheet-header-action-offset))}@media (max-width:41.98rem){.c4p--tearsheet__next .c4p--tearsheet__next__header-content-wrapper{display:flex;flex-direction:column}}@media (min-width:42rem){.c4p--tearsheet__next:not(.c4p--tearsheet__next--narrow) .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-actions{order:2}.c4p--tearsheet__next:not(.c4p--tearsheet__next--narrow) .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-content{order:1}}.c4p--tearsheet__next .c4p--tearsheet__next__header>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button,.c4p--tearsheet__next__decorator,.excludeFromCollapse){max-block-size:50vh;opacity:1;overflow:hidden;transition:max-block-size .24s cubic-bezier(0,0,.3,1),opacity .24s cubic-bezier(0,0,.3,1),margin .24s cubic-bezier(0,0,.3,1),padding .24s cubic-bezier(0,0,.3,1);visibility:hidden}.c4p--tearsheet__next .c4p--tearsheet__next__header .c4p--tearsheet__next__header-actions,.c4p--tearsheet__next .c4p--tearsheet__next__header .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-content :not(.c4p--tearsheet__next__content__title-wrapper,.c4p--tearsheet__next__header-label){opacity:1;transition:all .24s cubic-bezier(0,0,.3,1),opacity .24s cubic-bezier(0,0,.3,1)}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed{padding-block-start:.75rem;transition:padding .24s cubic-bezier(0,0,.3,1)}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions>:not(.c4p--tearsheet__next__content__header-actions),.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-content>:not(.c4p--tearsheet__next__content__title-wrapper) *,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content>:not(.c4p--tearsheet__next__content__title-wrapper),.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button,.c4p--tearsheet__next__decorator,.excludeFromCollapse),.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed>:not(.c4p--tearsheet__next__navigation-bar,:host,.c4p--tearsheet__next__header-content-wrapper,.cds-custom--modal-close-button,.c4p--tearsheet__next__close-button,.c4p--tearsheet__next__decorator,.excludeFromCollapse) *{margin:0;max-block-size:0;opacity:0;overflow:hidden;padding:0;pointer-events:none;transition:all .24s cubic-bezier(0,0,.3,1);visibility:hidden}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title{align-items:center;font-size:var(--cds-custom-label-02-font-size,.875rem);font-weight:var(--cds-custom-label-02-font-weight,400);letter-spacing:var(--cds-custom-label-02-letter-spacing,.16px);line-height:var(--cds-custom-label-02-line-height,1.28572);margin-block-start:.25rem;transition:all .24s cubic-bezier(0,0,.3,1)}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title>span{align-items:center;block-size:1.5rem;display:flex}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title .c4p--tearsheet__next__title-end svg,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title .c4p--tearsheet__next__title-start svg{inline-size:1rem}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content{align-self:center;margin-block-end:0}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__content__header-actions{margin-block-start:-.125rem}@media (max-width:41.98rem){.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions{display:none}}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__content__title-wrapper,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content-wrapper,.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title{margin-block:0;transition:margin-block .24s ease}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content-wrapper{min-block-size:2.5rem;padding-block-end:.75rem}.c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__navigation-bar:before{background:var(--cds-custom-border-subtle-01,#c6c6c6);block-size:1px;content:\"\";inline-size:calc(100% + 5rem);inset-block-start:0;inset-inline-start:-2rem;pointer-events:none;position:absolute;z-index:1}.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible{--overlay-color:var(--cds-custom-overlay,rgba(0,0,0,.6));--overlay-alpha:0.5;background-color:initial;z-index:calc(9000 - var(--stack-depth, 0))}.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible:before{background:var(--overlay-color);content:\"\";display:block;inset:0;opacity:calc(var(--overlay-alpha) - var(--stack-depth)*.1);position:absolute;transition:background-color .24s cubic-bezier(.4,.14,1,1),opacity .24s cubic-bezier(.4,.14,1,1)}@media (prefers-reduced-motion:reduce){.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible:before{transition:none}}.c4p--tearsheet__next.c4p--tearsheet__next--stack-activated.is-visible.is-visible .c4p--tearsheet__next__container{max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem) + var(--block-size-change));transform:scaleX(var(--scale-factor))}.c4p--tearsheet__next__header-label{color:var(--cds-custom-text-secondary,#525252);font-size:var(--cds-custom-label-01-font-size,.75rem);font-weight:var(--cds-custom-label-01-font-weight,400);letter-spacing:var(--cds-custom-label-01-letter-spacing,.32px);line-height:var(--cds-custom-label-01-line-height,1.33333);margin-block-end:.25rem}.c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-04-font-size,1.75rem);font-weight:var(--cds-custom-heading-04-font-weight,400);letter-spacing:var(--cds-custom-heading-04-letter-spacing,0);line-height:var(--cds-custom-heading-04-line-height,1.28572)}@media (max-width:41.98rem){.c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-03-font-size,1.25rem);font-weight:var(--cds-custom-heading-03-font-weight,400);letter-spacing:var(--cds-custom-heading-03-letter-spacing,0);line-height:var(--cds-custom-heading-03-line-height,1.4)}}.c4p--tearsheet__next__header-title{align-items:flex-start;display:flex;gap:1rem;margin-block-end:.5rem}.c4p--tearsheet__next__header-title svg{flex-shrink:0}.c4p--tearsheet__next__header-title .c4p--tearsheet__next__title-end{margin-inline-start:1rem}.c4p--tearsheet__next__header-description{font-size:var(--cds-custom-body-compact-01-font-size,.875rem);font-weight:var(--cds-custom-body-compact-01-font-weight,400);letter-spacing:var(--cds-custom-body-compact-01-letter-spacing,.16px);line-height:var(--cds-custom-body-compact-01-line-height,1.28572)}.c4p--tearsheet__next__header--no-close-icon{display:none}.c4p--tearsheet__next__decorator{inset-block-start:.625rem;inset-inline-end:3rem;position:absolute}.c4p--tearsheet__next__navigation-bar,:host{align-items:center;display:flex;gap:.125rem;justify-content:space-between;max-inline-size:calc(100% - .75rem);min-block-size:2.5rem;position:relative}.c4p--tearsheet__next__navigation-bar .cds-custom--tabs,:host .cds-custom--tabs{margin-inline-start:-1rem}.c4p--tearsheet__next__scroller-container,:host ::slotted([slot=scroller]){inset-block-end:0;inset-inline-end:-2.5rem;position:absolute}@media (max-width:41.98rem){.c4p--tearsheet__next__scroller-container,:host ::slotted([slot=scroller]){inset-inline-end:-1.5rem}}.c4p--tearsheet__next__scroller-container .c4p--tearsheet__next__scroller-button-icon-collapsed,:host ::slotted([slot=scroller]) .c4p--tearsheet__next__scroller-button-icon-collapsed{transform:rotate(-180deg)}.c4p--tearsheet__next__header-actions{display:flex;justify-content:flex-end}.c4p--tearsheet__next__content__header-actions{align-items:center;block-size:2rem;display:flex;flex:0 0 auto;inline-size:100%;justify-content:flex-end;margin-block-start:-14px;overflow:hidden}.c4p--tearsheet__next__content__header-actions>.c4p--tearsheet__next__header-action-item:not([data-hidden=true]){margin-inline-end:.5rem}.c4p--tearsheet__next__content__header-actions>.c4p--tearsheet__next__header-action-item:not([data-hidden=true]):nth-last-child(2){margin-inline-end:0}.c4p--tearsheet__next__content__header-actions>*{flex-shrink:0}@media (max-width:41.98rem){.c4p--tearsheet__next__content__header-actions{justify-content:flex-start;margin-inline-end:0}}.c4p--tearsheet__next__header-actions,.c4p--tearsheet__next__header-content{margin-block-end:1.5rem}@media (min-width:42rem){.c4p--tearsheet__next--wide .c4p--tearsheet__next__container{inline-size:calc(100% - 8rem)}}.c4p--tearsheet__next__body-layout{display:grid;grid-template-areas:\"influencer body\" \"influencer footer\";grid-template-columns:var(--tearsheet-influencer-width,16rem) 1fr;grid-template-rows:1fr auto;padding-block:0;padding-inline-end:0}.c4p--tearsheet__next__body-layout:not(.c4p--tearsheet__next__body-layout--has-influencer){grid-template-areas:\"body\" \"footer\";grid-template-columns:1fr}.c4p--tearsheet__next__influencer,:host(c4p-preview-tearsheet) ::slotted([slot=influencer]){border-inline-end:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);grid-area:influencer}.c4p--tearsheet__next__body,:host(c4p-preview-tearsheet) ::slotted([slot=body]){display:grid;grid-area:body;grid-template-columns:1fr var(--tearsheet-summary-content-width,16rem);overflow:hidden;position:relative}@media (max-width:41.98rem){.c4p--tearsheet__next__body,:host(c4p-preview-tearsheet) ::slotted([slot=body]){grid-template-columns:1fr 0}}.c4p--tearsheet__next__body>:only-child,:host(c4p-preview-tearsheet) ::slotted([slot=body])>:only-child{grid-column:1/-1}.c4p--tearsheet__next__footer,:host(c4p-preview-tearsheet) ::slotted([slot=footer]){block-size:5rem;border-block-start:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);grid-area:footer;overflow:hidden}@media (max-width:41.98rem){.c4p--tearsheet__next__footer,:host(c4p-preview-tearsheet) ::slotted([slot=footer]){block-size:4rem}}@media (max-width:19.98rem){.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--three-actions,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--three-actions::slotted([slot=footer]){overflow-x:auto;overflow-y:hidden}.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--three-actions .c4p--action-set,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--three-actions::slotted([slot=footer]) .c4p--action-set{display:inline-flex;flex-shrink:0;min-inline-size:-moz-max-content;min-inline-size:max-content}}@media (max-width:41.98rem){.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--many-actions,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--many-actions::slotted([slot=footer]){overflow-x:auto;overflow-y:hidden}.c4p--tearsheet__next__footer.c4p--tearsheet__next__footer--many-actions .c4p--action-set,:host(c4p-preview-tearsheet) .c4p--tearsheet__next__footer--many-actions::slotted([slot=footer]) .c4p--action-set{display:inline-flex;flex-shrink:0;min-inline-size:-moz-max-content;min-inline-size:max-content}}.c4p--tearsheet__next__influencer,.c4p--tearsheet__next__main-content,.c4p--tearsheet__next__summary-content,:host ::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) ::slotted([slot=influencer]){overflow:auto}.c4p--tearsheet__next__influencer:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__main-content:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__summary-content:not(.c4p--tearsheet__next__flush),:host :not(.c4p--tearsheet__next__flush)::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) :not(.c4p--tearsheet__next__flush)::slotted([slot=influencer]){padding-inline:2rem}@media (max-width:41.98rem){.c4p--tearsheet__next__influencer:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__main-content:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next__summary-content:not(.c4p--tearsheet__next__flush),:host :not(.c4p--tearsheet__next__flush)::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) :not(.c4p--tearsheet__next__flush)::slotted([slot=influencer]){padding-inline:1rem}}.c4p--tearsheet__next__influencer:focus,.c4p--tearsheet__next__main-content:focus,.c4p--tearsheet__next__summary-content:focus,:host :focus::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) :focus::slotted([slot=influencer]){outline:2px solid var(--cds-custom-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.c4p--tearsheet__next__influencer:focus,.c4p--tearsheet__next__main-content:focus,.c4p--tearsheet__next__summary-content:focus,:host :focus::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) :focus::slotted([slot=influencer]){outline-style:dotted}}.c4p--tearsheet__next__side-panel,:host c4p-side-panel::part(dialog){block-size:100%;inline-size:100%!important;inset-block-start:0;max-inline-size:none;position:absolute;z-index:9999}.c4p--tearsheet__next__side-panel .c4p--side-panel__header,:host c4p-side-panel::part(dialog) .c4p--side-panel__header{min-block-size:0}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header{padding-inline:1rem}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header.c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions{display:none}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header.c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content{align-self:flex-start}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header-content-wrapper{display:flex;flex-direction:column}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-03-font-size,1.25rem);font-weight:var(--cds-custom-heading-03-font-weight,400);letter-spacing:var(--cds-custom-heading-03-letter-spacing,0);line-height:var(--cds-custom-heading-03-line-height,1.4)}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__content__header-actions{justify-content:flex-start;margin-inline-end:0}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__body,:host(c4p-preview-tearsheet) .c4p--tearsheet__next--narrow ::slotted([slot=body]){grid-template-columns:1fr 0}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__influencer:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next--narrow .c4p--tearsheet__next__main-content:not(.c4p--tearsheet__next__flush),.c4p--tearsheet__next--narrow .c4p--tearsheet__next__summary-content:not(.c4p--tearsheet__next__flush),:host .c4p--tearsheet__next--narrow :not(.c4p--tearsheet__next__flush)::slotted([slot=summary-content]),:host(c4p-preview-tearsheet) .c4p--tearsheet__next--narrow :not(.c4p--tearsheet__next__flush)::slotted([slot=influencer]){padding-inline:1rem}.c4p--tearsheet__next--narrow .c4p--tearsheet__next__footer,:host(c4p-preview-tearsheet) .c4p--tearsheet__next--narrow ::slotted([slot=footer]){block-size:4rem}.c4p--tearsheet__next--has-ai-label::part(dialog){background:linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,#78a9ff),var(--cds-custom-ai-border-end,#d0e2ff)) border-box,linear-gradient(to top,var(--cds-custom-layer),var(--cds-custom-layer)) border-box;border:1px solid transparent!important;border-block-end:0;box-shadow:0 4px 10px 2px var(--cds-custom-ai-drop-shadow,rgba(15,98,254,.1))}.c4p--tearsheet__next__main-content{position:relative}.c4p--tearsheet__next__main-content.c4p--tearsheet__next__flush{padding-inline:0}.c4p--tearsheet__next__main-content.c4p--tearsheet__next__main-content--no-summary{grid-column:1/-1}.c4p--tearsheet__next__main-content.c4p--tearsheet__next__main-content--has-ai-label{background:linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)) 0,var(--cds-custom-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-custom-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-custom-ai-border-start,rgba(166,200,255,.64)),var(--cds-custom-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff)),var(--cds-custom-background,var(--cds-custom-ai-popover-background,#fff))) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-custom-ai-inner-shadow,rgba(69,137,255,.1))}:host ::slotted([slot=summary-content]:focus){outline:2px solid var(--cds-custom-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){:host ::slotted([slot=summary-content]:focus){outline-style:dotted}}:host ::slotted([slot=summary-content][is-flush]){padding-inline:0}@media screen and (prefers-reduced-motion:reduce){:host(c4p-preview-tearsheet) ::part(dialog){align-self:flex-end;block-size:100%;border:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);inset-block-start:auto;max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem));transform:translate3d(0,min(95vh,500px),0);transition:none}}:host(c4p-preview-tearsheet) ::part(dialog){align-self:flex-end;block-size:100%;border:1px solid var(--cds-custom-border-subtle-01,#c6c6c6);inset-block-start:auto;max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem));transform:translate3d(0,min(95vh,500px),0);transition:transform .24s cubic-bezier(0,0,.3,1),max-block-size .24s cubic-bezier(0,0,.3,1)}:host(c4p-preview-tearsheet) ::slotted([slot=influencer][is-flush]){padding-inline:0}:host(c4p-preview-tearsheet[open]) ::part(dialog){transform:translateZ(0);transition:transform .24s cubic-bezier(0,0,.3,1)}@media (prefers-reduced-motion:reduce){:host(c4p-preview-tearsheet[open]) ::part(dialog){transition:none}}@media (max-width:41.98rem){:host(:not(.c4p--tearsheet__next--stack-activated.is-visible)) ::part(dialog){max-block-size:none}}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible){--overlay-color:var(--cds-custom-overlay,rgba(0,0,0,.6));--overlay-alpha:0.5}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible):before{background:var(--overlay-color);content:\"\";display:block;inset:0;opacity:calc(var(--overlay-alpha) - var(--stack-depth)*.1);pointer-events:none;position:fixed;transition:background-color .24s cubic-bezier(.4,.14,1,1),opacity .24s cubic-bezier(.4,.14,1,1);z-index:calc(9000 - var(--stack-depth, 0))}@media (prefers-reduced-motion:reduce){:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible):before{transition:none}}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible) cds-custom-modal{background-color:transparent}:host(c4p-preview-tearsheet.c4p--tearsheet__next--stack-activated.is-visible) ::part(dialog){max-block-size:calc(100% - var(--tearsheet-vertical-gap, 3rem) + var(--block-size-change));transform:scaleX(var(--scale-factor))}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header{padding-inline:1rem}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header.c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions{display:none}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header-content-wrapper{display:flex;flex-direction:column}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__header-title{font-size:var(--cds-custom-heading-03-font-size,1.25rem);font-weight:var(--cds-custom-heading-03-font-weight,400);letter-spacing:var(--cds-custom-heading-03-letter-spacing,0);line-height:var(--cds-custom-heading-03-line-height,1.4)}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__content__header-actions{justify-content:flex-start;margin-inline-end:0}:host(c4p-preview-tearsheet[variant=narrow]) .c4p--tearsheet__next__body,:host(c4p-preview-tearsheet[variant=narrow]):host(c4p-preview-tearsheet) ::slotted([slot=body]){grid-template-columns:1fr 0}:host(c4p-preview-tearsheet[variant=narrow]) ::slotted([slot=influencer]),:host(c4p-preview-tearsheet[variant=narrow]) ::slotted([slot=summary-content]){padding:0!important}@media (max-width:41.98rem){:host(c4p-preview-tearsheet) ::slotted([slot=influencer]),:host(c4p-preview-tearsheet) ::slotted([slot=summary-content]){padding:0!important}}:host-context(c4p-preview-tearsheet[variant=narrow]) ::slotted([slot=summary-content]){padding:0}:host ::slotted([slot=footer]){padding-block:0}:host ::slotted(cds-custom-tabs){margin-inline-start:-1rem}"]);
 //#endregion
 export { tearsheet_navigation_bar_default as default };

package/es-custom/components/tearsheet-preview/tearsheet-signal.js CHANGED Viewed

@@ -27,7 +27,8 @@ const defaultTearsheetSignal = {
 	variant: "wide",
 	isSm: false,
 	open: false,
-	hasAILabel: false
+	hasAILabel: false,
+	uniqueId: ""
 };
 const tearsheetSignal = signal(defaultTearsheetSignal);
 /**

package/es-custom/components/tearsheet-preview/tearsheet-signal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tearsheet-signal.js","names":[],"sources":["../../../src/components/tearsheet-preview/tearsheet-signal.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport { signal } from '@lit-labs/signals';\nimport { prefix } from '../../globals/settings';\n\n/\n Block class for tearsheet component\n /\nexport const blockClass = `${prefix}--tearsheet__next`;\n\ninterface TearsheetSignalType {\n hasCloseIcon: boolean;\n fullyCollapsed: boolean;\n disableHeaderCollapse: boolean;\n variant: 'wide' \| 'narrow';\n isSm: boolean;\n open: boolean;\n hasAILabel: boolean;\n}\nexport const defaultTearsheetSignal: TearsheetSignalType = {\n hasCloseIcon: true,\n fullyCollapsed: false,\n disableHeaderCollapse: false,\n variant: 'wide',\n isSm: false,\n open: false,\n hasAILabel: false,\n};\nexport const tearsheetSignal = signal<TearsheetSignalType>(\n defaultTearsheetSignal\n);\n\n/\n Update one or more properties in the tearsheet signal\n /\nexport const updateTearsheetSignals = (\n updates: Partial<TearsheetSignalType>\n) => {\n tearsheetSignal.set({\n ...tearsheetSignal.get(),\n ...updates,\n });\n};\n\n/\n Reset tearsheet signal to default values\n */\nexport const resetTearsheetSignal = () => {\n tearsheetSignal.set(defaultTearsheetSignal);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAcA,MAAa,aAAa;~~AAW1B~~,MAAa,yBAA8C;CACzD,cAAc;CACd,gBAAgB;CAChB,uBAAuB;CACvB,SAAS;CACT,MAAM;CACN,MAAM;CACN,YAAY;~~CACb~~;AACD,MAAa,kBAAkB,OAC7B,uBACD;;;;AAKD,MAAa,0BACX,YACG;AACH,iBAAgB,IAAI;EAClB,GAAG,gBAAgB,KAAK;EACxB,GAAG;EACJ,CAAC;;;;;AAMJ,MAAa,6BAA6B;AACxC,iBAAgB,IAAI,uBAAuB"}
1	+ {"version":3,"file":"tearsheet-signal.js","names":[],"sources":["../../../src/components/tearsheet-preview/tearsheet-signal.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport { signal } from '@lit-labs/signals';\nimport { prefix } from '../../globals/settings';\n\n/\n Block class for tearsheet component\n /\nexport const blockClass = `${prefix}--tearsheet__next`;\n\ninterface TearsheetSignalType {\n hasCloseIcon: boolean;\n fullyCollapsed: boolean;\n disableHeaderCollapse: boolean;\n variant: 'wide' \| 'narrow';\n isSm: boolean;\n open: boolean;\n hasAILabel: boolean;\n uniqueId: string;\n}\nexport const defaultTearsheetSignal: TearsheetSignalType = {\n hasCloseIcon: true,\n fullyCollapsed: false,\n disableHeaderCollapse: false,\n variant: 'wide',\n isSm: false,\n open: false,\n hasAILabel: false,\n uniqueId: '',\n};\nexport const tearsheetSignal = signal<TearsheetSignalType>(\n defaultTearsheetSignal\n);\n\n/\n Update one or more properties in the tearsheet signal\n /\nexport const updateTearsheetSignals = (\n updates: Partial<TearsheetSignalType>\n) => {\n tearsheetSignal.set({\n ...tearsheetSignal.get(),\n ...updates,\n });\n};\n\n/\n Reset tearsheet signal to default values\n */\nexport const resetTearsheetSignal = () => {\n tearsheetSignal.set(defaultTearsheetSignal);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAcA,MAAa,aAAa;AAY1B,MAAa,yBAA8C;CACzD,cAAc;CACd,gBAAgB;CAChB,uBAAuB;CACvB,SAAS;CACT,MAAM;CACN,MAAM;CACN,YAAY;CACZ,UAAU;CACX;AACD,MAAa,kBAAkB,OAC7B,uBACD;;;;AAKD,MAAa,0BACX,YACG;AACH,iBAAgB,IAAI;EAClB,GAAG,gBAAgB,KAAK;EACxB,GAAG;EACJ,CAAC;;;;;AAMJ,MAAa,6BAA6B;AACxC,iBAAgB,IAAI,uBAAuB"}

package/es-custom/components/tearsheet-preview/tearsheet-summary-content.js CHANGED Viewed

@@ -40,6 +40,7 @@ let CDSTearsheetSummaryContent = class CDSTearsheetSummaryContent extends Signal
 		this.slot = "summary-content";
 		this.isFlush = false;
 		this.summaryPanelOpen = false;
+		this.summaryPanelAriaLabel = "Summary panel";
 		this.handleClose = () => {
 			this.summaryPanelOpen = false;
 			this.dispatchEvent(new CustomEvent("cds-custom-tearsheet-summary-closed", {
@@ -61,6 +62,8 @@ let CDSTearsheetSummaryContent = class CDSTearsheetSummaryContent extends Signal
           ?slide-in=${true}
           ?open="${this.summaryPanelOpen}"
           placement="right"
+          aria-label="${this.summaryPanelAriaLabel}"
+          aria-modal="true"
           @c4p-side-panel-closed="${this.handleClose}"
         >
           <slot></slot>
@@ -81,6 +84,7 @@ __decorate([property({
 	reflect: true,
 	attribute: "summary-panel-open"
 })], CDSTearsheetSummaryContent.prototype, "summaryPanelOpen", void 0);
+__decorate([property({ attribute: "summary-panel-aria-label" })], CDSTearsheetSummaryContent.prototype, "summaryPanelAriaLabel", void 0);
 CDSTearsheetSummaryContent = __decorate([carbonElement(`c4p-tearsheet-summary-content`)], CDSTearsheetSummaryContent);
 var tearsheet_summary_content_default = CDSTearsheetSummaryContent;
 //#endregion

package/es-custom/components/tearsheet-preview/tearsheet-summary-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tearsheet-summary-content.js","names":["styles","customElement"],"sources":["../../../src/components/tearsheet-preview/tearsheet-summary-content.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport '../side-panel/index.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { classMap } from 'lit-html/directives/class-map.js';\nimport styles from './tearsheet.scss?lit';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { tearsheetSignal } from './tearsheet-signal';\n\nconst blockClass = `${prefix}--tearsheet__next`;\n\n/\n Tearsheet Summary Content component - Right-side panel for summary details.\n * Automatically converts to a slide-in panel on small screens.\n \n @element c4p-tearsheet-summary-content\n * @slot - Content for the summary panel\n * @fires cds-custom-tearsheet-summary-closed - Fired when the summary panel is closed (mobile only)\n /\n@customElement(`${prefix}-tearsheet-summary-content`)\nclass CDSTearsheetSummaryContent extends SignalWatcher(\n HostListenerMixin(LitElement)\n) {\n @property({ reflect: true })\n slot = 'summary-content';\n\n @property({ type: Boolean, reflect: true, attribute: 'is-flush' })\n isFlush: boolean = false;\n\n /\n In mobile screens right side summary-content section won't be visible by default.\n * This prop can be toggled to open/close right panel in this case.\n /\n @property({ type: Boolean, reflect: true, attribute: 'summary-panel-open' })\n summaryPanelOpen: boolean = false;\n\n /\n Handler for closing the summary panel\n */\n private handleClose = () => {\n this.summaryPanelOpen = false;\n this.dispatchEvent(\n new CustomEvent('cds-custom-tearsheet-summary-closed', {\n bubbles: true,\n composed: true,\n })\n );\n };\n\n firstUpdated() {\n this.classList.add(`${blockClass}__summary-content`);\n }\n\n render() {\n const { isSm } = tearsheetSignal.get();\n\n const classes = classMap({\n [`${blockClass}__flush`]: this.isFlush,\n });\n\n return !isSm\n ? html` <aside class=\"${classes}\">\n <slot></slot>\n </aside>`\n : html` <c4p-side-panel\n size=\"sm\"\n ?slide-in=${true}\n ?open=\"${this.summaryPanelOpen}\"\n placement=\"right\"\n @c4p-side-panel-closed=\"${this.handleClose}\"\n >\n <slot></slot>\n </c4p-side-panel>`;\n }\n\n static styles = styles;\n}\nexport default CDSTearsheetSummaryContent;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,aAAa;;;;;;;;;AAUnB,IAAA,6BAAA,MACM,mCAAmC,cACvC,kBAAkB,WAAW,CAC9B,CAAC;;;cAEO;iBAGY;0BAOS;~~2BAKA~~;AAC1B,QAAK,mBAAmB;AACxB,QAAK,cACH,IAAI,YAAY,gCAAgC;IAC9C,SAAS;IACT,UAAU;IACX,CAAC,CACH;;;CAGH,eAAe;AACb,OAAK,UAAU,IAAI,GAAG,WAAW,mBAAmB;;CAGtD,SAAS;EACP,MAAM,EAAE,SAAS,gBAAgB,KAAK;EAEtC,MAAM,UAAU,SAAS,GACtB,GAAG,WAAW,WAAW,KAAK,SAChC,CAAC;AAEF,SAAO,CAAC,OACJ,IAAI,kBAAkB,QAAQ;;oBAG9B,IAAI;;sBAEU,KAAK;mBACR,KAAK,iBAAiB;;~~oCAEL~~,KAAK,YAAY;;;;;;gBAMnCA;;;~~YApDf~~,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,2BAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAY,CAAC,CAAA,EAAA,2BAAA,WAAA,WAAA,KAAA,EAAA;YAOjE,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAsB,CAAC,CAAA,EAAA,2BAAA,WAAA,oBAAA,KAAA,EAAA;~~yCAd7EC~~,cAAc,gCAAsC,CAAA,EAAA,2BAAA;~~AA0DrD~~,IAAA,oCAAe"}
1	+ {"version":3,"file":"tearsheet-summary-content.js","names":["styles","customElement"],"sources":["../../../src/components/tearsheet-preview/tearsheet-summary-content.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport '../side-panel/index.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { classMap } from 'lit-html/directives/class-map.js';\nimport styles from './tearsheet.scss?lit';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { tearsheetSignal } from './tearsheet-signal';\n\nconst blockClass = `${prefix}--tearsheet__next`;\n\n/\n Tearsheet Summary Content component - Right-side panel for summary details.\n * Automatically converts to a slide-in panel on small screens.\n \n @element c4p-tearsheet-summary-content\n * @slot - Content for the summary panel\n * @fires cds-custom-tearsheet-summary-closed - Fired when the summary panel is closed (mobile only)\n /\n@customElement(`${prefix}-tearsheet-summary-content`)\nclass CDSTearsheetSummaryContent extends SignalWatcher(\n HostListenerMixin(LitElement)\n) {\n @property({ reflect: true })\n slot = 'summary-content';\n\n @property({ type: Boolean, reflect: true, attribute: 'is-flush' })\n isFlush: boolean = false;\n\n /\n In mobile screens right side summary-content section won't be visible by default.\n * This prop can be toggled to open/close right panel in this case.\n /\n @property({ type: Boolean, reflect: true, attribute: 'summary-panel-open' })\n summaryPanelOpen: boolean = false;\n\n /\n Optional aria-label for the summary panel. Defaults to \"Summary panel\".\n /\n @property({ attribute: 'summary-panel-aria-label' })\n summaryPanelAriaLabel: string = 'Summary panel';\n\n /\n Handler for closing the summary panel\n */\n private handleClose = () => {\n this.summaryPanelOpen = false;\n this.dispatchEvent(\n new CustomEvent('cds-custom-tearsheet-summary-closed', {\n bubbles: true,\n composed: true,\n })\n );\n };\n\n firstUpdated() {\n this.classList.add(`${blockClass}__summary-content`);\n }\n\n render() {\n const { isSm } = tearsheetSignal.get();\n\n const classes = classMap({\n [`${blockClass}__flush`]: this.isFlush,\n });\n\n return !isSm\n ? html` <aside class=\"${classes}\">\n <slot></slot>\n </aside>`\n : html` <c4p-side-panel\n size=\"sm\"\n ?slide-in=${true}\n ?open=\"${this.summaryPanelOpen}\"\n placement=\"right\"\n aria-label=\"${this.summaryPanelAriaLabel}\"\n aria-modal=\"true\"\n @c4p-side-panel-closed=\"${this.handleClose}\"\n >\n <slot></slot>\n </c4p-side-panel>`;\n }\n\n static styles = styles;\n}\nexport default CDSTearsheetSummaryContent;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,aAAa;;;;;;;;;AAUnB,IAAA,6BAAA,MACM,mCAAmC,cACvC,kBAAkB,WAAW,CAC9B,CAAC;;;cAEO;iBAGY;0BAOS;+BAMI;2BAKJ;AAC1B,QAAK,mBAAmB;AACxB,QAAK,cACH,IAAI,YAAY,gCAAgC;IAC9C,SAAS;IACT,UAAU;IACX,CAAC,CACH;;;CAGH,eAAe;AACb,OAAK,UAAU,IAAI,GAAG,WAAW,mBAAmB;;CAGtD,SAAS;EACP,MAAM,EAAE,SAAS,gBAAgB,KAAK;EAEtC,MAAM,UAAU,SAAS,GACtB,GAAG,WAAW,WAAW,KAAK,SAChC,CAAC;AAEF,SAAO,CAAC,OACJ,IAAI,kBAAkB,QAAQ;;oBAG9B,IAAI;;sBAEU,KAAK;mBACR,KAAK,iBAAiB;;wBAEjB,KAAK,sBAAsB;;oCAEf,KAAK,YAAY;;;;;;gBAMnCA;;;YA5Df,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,2BAAA,WAAA,QAAA,KAAA,EAAA;YAG3B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAY,CAAC,CAAA,EAAA,2BAAA,WAAA,WAAA,KAAA,EAAA;YAOjE,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAsB,CAAC,CAAA,EAAA,2BAAA,WAAA,oBAAA,KAAA,EAAA;YAM3E,SAAS,EAAE,WAAW,4BAA4B,CAAC,CAAA,EAAA,2BAAA,WAAA,yBAAA,KAAA,EAAA;yCApBrDC,cAAc,gCAAsC,CAAA,EAAA,2BAAA;AAkErD,IAAA,oCAAe"}

package/es-custom/components/tearsheet-preview/tearsheet.js CHANGED Viewed

@@ -11,6 +11,7 @@ import tearsheet_default$1 from "./tearsheet.scss.js";
 import { MatchMediaController } from "../../globals/js/utils/match-media-controller.js";
 import { blockClass, updateTearsheetSignals } from "./tearsheet-signal.js";
 import { stackManager } from "./stack-signal.js";
+import { clearFocusableContainers, trapFocus } from "../../utilities/manageFocusTrap/manageFocusTrap.js";
 import { LitElement, html } from "lit";
 import { property, query, state } from "lit/decorators.js";
 import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
@@ -54,6 +55,8 @@ let CDSTearsheet = class CDSTearsheet extends SignalWatcher(HostListenerMixin(Li
 		this.uniqueId = `tearsheet-${Math.random().toString(36).substr(2, 9)}`;
 		this._stackingEnabled = false;
 		this.isSm = false;
+		this._trapFocusAPI = null;
+		this._wasOpen = false;
 		this.smMediaQuery = `(max-width: ${breakpoints.md.width})`;
 		this.isSmallDevice = new MatchMediaController(this, this.smMediaQuery, false);
 		this.handleStackConnected = (event) => {
@@ -111,7 +114,8 @@ let CDSTearsheet = class CDSTearsheet extends SignalWatcher(HostListenerMixin(Li
 			variant: this.variant,
 			isSm: this.isSm,
 			open: this.open,
-			hasAILabel: this.hasAILabel
+			hasAILabel: this.hasAILabel,
+			uniqueId: this.uniqueId
 		});
 	}
 	updated(_changedProperties) {
@@ -129,10 +133,29 @@ let CDSTearsheet = class CDSTearsheet extends SignalWatcher(HostListenerMixin(Li
 	}
 	handleOpenPropertyChange(_changedProperties) {
 		if (!_changedProperties.has("open")) return;
+		const wasOpen = this._wasOpen;
+		const isOpen = this.open;
 		updateTearsheetSignals({ open: this.open });
 		if (this._stackingEnabled && this.modalBodyElement) stackManager.notifyStack(this.uniqueId, this.open, this.modalBodyElement);
 		this.classList.toggle("is-visible", this.open);
 		if (this._stackingEnabled) this.updateStackProperties();
+		if (!wasOpen && isOpen) {
+			updateTearsheetSignals({ uniqueId: this.uniqueId });
+			requestAnimationFrame(() => {
+				this._trapFocusAPI = trapFocus(this, this.uniqueId);
+			});
+		}
+		this._wasOpen = isOpen;
+		if (!this.open && this.launcherButtonRef) setTimeout(() => {
+			if (this.launcherButtonRef instanceof HTMLElement) {
+				const headerActionItem = this.launcherButtonRef.closest(`.${blockClass}__header-action-item`);
+				if (headerActionItem) {
+					const menuButton = headerActionItem.closest(`.${blockClass}__content__header-actions`)?.querySelector(`.${blockClass}__header-actions-menuButton:not(.${blockClass}__header-actions-menuButton--hidden) button`);
+					if (menuButton instanceof HTMLElement) menuButton.focus();
+					else this.launcherButtonRef.focus();
+				} else this.launcherButtonRef.focus();
+			}
+		}, 100);
 	}
 	updateCSSPropertiesIfNeeded(_changedProperties) {
 		if (_changedProperties.has("influencerWidth") || _changedProperties.has("summaryContentWidth") || _changedProperties.has("verticalGap")) this.updateCSSCustomProperties();
@@ -159,6 +182,8 @@ let CDSTearsheet = class CDSTearsheet extends SignalWatcher(HostListenerMixin(Li
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
+		this._trapFocusAPI?.cleanup();
+		clearFocusableContainers();
 		this.removeEventListener(`c4p-tearsheet-header-close-button-clicked`, this.handleHeaderCloseButtonClick);
 		this.removeEventListener(`c4p-tearsheet-stack-connected`, this.handleStackConnected);
 		this.removeEventListener(`c4p-tearsheet-stack-step-size-changed`, this.handleStackStepSizeChanged);
@@ -250,6 +275,7 @@ let CDSTearsheet = class CDSTearsheet extends SignalWatcher(HostListenerMixin(Li
 			[`${blockClass}--has-decorator`]: this.hasDecorator && !this.hasAILabel
 		});
 		const containerClasses = `${blockClass}__container ${this.containerClassName}`;
+		const computedAriaLabelledby = !this.ariaLabel && this.headerContentElement?.titleId ? this.headerContentElement.titleId : void 0;
 		return html`<cds-custom-modal
       class=${classes}
       size=${this.variant === "narrow" ? "sm" : "lg"}
@@ -257,6 +283,7 @@ let CDSTearsheet = class CDSTearsheet extends SignalWatcher(HostListenerMixin(Li
       container-class="${containerClasses}"
       ?prevent-close-on-click-outside="${this.preventCloseOnClickOutside}"
       aria-label="${ifDefined(this.ariaLabel || void 0)}"
+      aria-labelledby="${ifDefined(computedAriaLabelledby)}"
       selector-primary-focus="${ifDefined(this.selectorPrimaryFocus || void 0)}"
       selectors-floating-menus="${this.getFloatingMenuSelectors()}"
       @cds-custom-modal-beingclosed="${this.handleClose}"
@@ -295,8 +322,10 @@ __decorate([property({
 	type: Boolean,
 	attribute: "prevent-close-on-click-outside"
 })], CDSTearsheet.prototype, "preventCloseOnClickOutside", void 0);
+__decorate([property({ attribute: false })], CDSTearsheet.prototype, "launcherButtonRef", void 0);
 __decorate([state()], CDSTearsheet.prototype, "isSm", void 0);
 __decorate([query("cds-custom-modal-body")], CDSTearsheet.prototype, "modalBodyElement", void 0);
+__decorate([query(`c4p-tearsheet-header-content`)], CDSTearsheet.prototype, "headerContentElement", void 0);
 CDSTearsheet = __decorate([carbonElement(`c4p-preview-tearsheet`)], CDSTearsheet);
 var tearsheet_default = CDSTearsheet;
 //#endregion

package/es-custom/components/tearsheet-preview/tearsheet.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tearsheet.js","names":["styles","customElement"],"sources":["../../../src/components/tearsheet-preview/tearsheet.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { LitElement, PropertyValues, html } from 'lit';\nimport { property, state, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './tearsheet.scss?lit';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { classMap } from 'lit-html/directives/class-map.js';\nimport { MatchMediaController } from '../../globals/js/utils/match-media-controller';\nimport { breakpoints } from '@carbon/layout';\nimport { blockClass, updateTearsheetSignals } from './tearsheet-signal';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { stackManager } from './stack-signal';\n\n/\n Tearsheet component - A slide-out panel for displaying detailed content.\n \n @element c4p-preview-tearsheet\n * @slot header - The header content of the tearsheet\n * @slot influencer - Optional left sidebar content (wide variant only)\n * @slot body - Main body content\n * @slot footer - Footer content with actions\n * @fires c4p-preview-tearsheet-beingclosed - Fired when the tearsheet is about to close\n * @fires c4p-preview-tearsheet-closed - Fired after the tearsheet has closed\n /\n@customElement(`${prefix}-preview-tearsheet`)\nclass CDSTearsheet extends SignalWatcher(HostListenerMixin(LitElement)) {\n /\n Specifies whether the tearsheet is currently open.\n /\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n\n /\n User can pass any class names that will be added to the modal container\n /\n @property({ attribute: 'container-class-name' })\n containerClassName: string = '';\n\n /\n Default influencer takes 256px, this allows override eg: 300px, 20rem\n /\n @property({ attribute: 'influencer-width' })\n influencerWidth: string = '';\n\n /\n Default summary content takes 256px, this allows override eg: 300px, 20rem\n /\n @property({ attribute: 'summary-content-width' })\n summaryContentWidth: string = '';\n\n /\n Defines the gap from top of the viewport. Defaulted to 3rem\n /\n @property({ attribute: 'vertical-gap' })\n verticalGap: string = '';\n\n /\n Default to wide variant. Pass in narrow for narrow tearsheet\n /\n @property({ reflect: true })\n variant: 'wide' \| 'narrow' = 'wide';\n\n /\n Specify the CSS selectors that match the floating menus (comma-separated)\n /\n @property({ attribute: 'selectors-floating-menus' })\n selectorsFloatingMenus: string = '';\n\n /\n Specify a CSS selector that matches the DOM element that should be focused when the Modal opens\n /\n @property({ attribute: 'selector-primary-focus' })\n selectorPrimaryFocus: string = '';\n\n /\n Prevents the modal from closing when clicking outside\n /\n @property({ type: Boolean, attribute: 'prevent-close-on-click-outside' })\n preventCloseOnClickOutside: boolean = false;\n\n /\n Unique ID for this tearsheet instance\n /\n private uniqueId: string = `tearsheet-${Math.random().toString(36).substr(2, 9)}`;\n\n /\n Internal flag to track if stacking is enabled (via wrapper)\n /\n private _stackingEnabled: boolean = false;\n\n /\n Internal state for tracking if the tearsheet is in small screen mode\n /\n @state()\n private isSm: boolean = false;\n\n /\n Query the modal body element\n /\n @query('cds-custom-modal-body')\n private modalBodyElement?: HTMLElement;\n\n private smMediaQuery = `(max-width: ${breakpoints.md.width})`;\n private isSmallDevice = new MatchMediaController(\n this,\n this.smMediaQuery,\n false\n );\n /\n Checks if the tearsheet has a decorator (AI label or other)\n /\n private get hasDecorator(): boolean {\n const headerElement = this.querySelector(`${prefix}-tearsheet-header`);\n if (!headerElement) {\n return false;\n }\n const decorator = headerElement.querySelector('[slot=\"decorator\"]');\n return !!decorator;\n }\n\n /\n Checks if the tearsheet has an AI label decorator\n /\n private get hasAILabel(): boolean {\n const headerElement = this.querySelector(`${prefix}-tearsheet-header`);\n if (!headerElement) {\n return false;\n }\n const decorator = headerElement.querySelector('[slot=\"decorator\"]');\n if (!decorator) {\n return false;\n }\n const tagName = decorator.tagName.toLowerCase();\n return tagName === 'cds-custom-ai-label' \|\| tagName === `${prefix}-ai-label`;\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n // Listen for stack wrapper events first\n this.addEventListener(\n `${prefix}-tearsheet-stack-connected`,\n this.handleStackConnected as EventListener\n );\n this.addEventListener(\n `${prefix}-tearsheet-stack-step-size-changed`,\n this.handleStackStepSizeChanged as EventListener\n );\n\n // Check if this tearsheet is wrapped in a stack provider\n // This handles the case where the stack wrapper connected before this tearsheet\n this._checkForStackWrapper();\n\n // Set visibility class\n if (this.open) {\n this.classList.add('is-visible');\n } else {\n this.classList.remove('is-visible');\n }\n\n // Listen for close button click from header\n this.addEventListener(\n `${prefix}-tearsheet-header-close-button-clicked`,\n this.handleHeaderCloseButtonClick as EventListener\n );\n }\n\n protected firstUpdated(_changedProperties: PropertyValues): void {\n this.updateCSSCustomProperties();\n this.isSm = this.isSmallDevice?.matches \|\| this.variant === 'narrow';\n // Initialize all signals on first update\n updateTearsheetSignals({\n variant: this.variant,\n isSm: this.isSm,\n open: this.open,\n hasAILabel: this.hasAILabel,\n });\n }\n\n protected updated(_changedProperties: PropertyValues): void {\n this.updateIsSmState(_changedProperties);\n this.handleOpenPropertyChange(_changedProperties);\n this.updateCSSPropertiesIfNeeded(_changedProperties);\n\n if (_changedProperties.has('variant')) {\n updateTearsheetSignals({ variant: this.variant });\n }\n\n if (_changedProperties.has('isSm')) {\n this.updateInfluencerVisibility();\n }\n\n this.updateStackPropertiesIfNeeded();\n }\n\n private updateIsSmState(_changedProperties: PropertyValues): void {\n const previousIsSm = this.isSm;\n this.isSm = this.isSmallDevice?.matches \|\| this.variant === 'narrow';\n\n if (this.isSm !== previousIsSm) {\n updateTearsheetSignals({ isSm: this.isSm });\n }\n }\n\n private handleOpenPropertyChange(_changedProperties: PropertyValues): void {\n if (!_changedProperties.has('open')) {\n return;\n }\n\n updateTearsheetSignals({ open: this.open });\n\n // Only register with stack manager if stacking is enabled\n if (this._stackingEnabled && this.modalBodyElement) {\n stackManager.notifyStack(this.uniqueId, this.open, this.modalBodyElement);\n }\n\n this.classList.toggle('is-visible', this.open);\n\n // Only update stack properties if stacking is enabled\n if (this._stackingEnabled) {\n this.updateStackProperties();\n }\n }\n\n private updateCSSPropertiesIfNeeded(\n _changedProperties: PropertyValues\n ): void {\n const hasRelevantChanges =\n _changedProperties.has('influencerWidth') \|\|\n _changedProperties.has('summaryContentWidth') \|\|\n _changedProperties.has('verticalGap');\n\n if (hasRelevantChanges) {\n this.updateCSSCustomProperties();\n }\n }\n\n private updateStackPropertiesIfNeeded(): void {\n // Only update if stacking is enabled\n if (!this._stackingEnabled) {\n return;\n }\n\n const stackState = stackManager.state;\n if (stackState.stack.length > 0) {\n this.updateStackProperties();\n }\n }\n\n /\n Update CSS custom properties for stacking\n /\n private updateStackProperties(): void {\n const stackState = stackManager.state;\n const depth = stackManager.getDepth(this.uniqueId);\n const scaleFactor = stackManager.getScaleFactor(this.uniqueId);\n const blockSizeChange = stackManager.getBlockSizeChange(this.uniqueId);\n\n // Manage --stack-activated class on host element\n if (stackState.stack.length > 1) {\n this.classList.add(`${blockClass}--stack-activated`);\n } else {\n this.classList.remove(`${blockClass}--stack-activated`);\n }\n\n if (depth !== -1) {\n this.style.setProperty('--stack-depth', depth.toString());\n this.style.setProperty('--scale-factor', scaleFactor.toString());\n this.style.setProperty('--block-size-change', blockSizeChange);\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n // Remove event listeners\n this.removeEventListener(\n `${prefix}-tearsheet-header-close-button-clicked`,\n this.handleHeaderCloseButtonClick as EventListener\n );\n this.removeEventListener(\n `${prefix}-tearsheet-stack-connected`,\n this.handleStackConnected as EventListener\n );\n this.removeEventListener(\n `${prefix}-tearsheet-stack-step-size-changed`,\n this.handleStackStepSizeChanged as EventListener\n );\n\n // Notify stack manager that this tearsheet is closing (only if stacking was enabled)\n if (this._stackingEnabled) {\n stackManager.notifyStack(this.uniqueId, false, null);\n }\n\n // Clean up CSS custom properties\n if (this.influencerWidth) {\n document.documentElement.style.removeProperty(\n '--tearsheet-influencer-width'\n );\n }\n if (this.summaryContentWidth) {\n document.documentElement.style.removeProperty(\n '--tearsheet-summary-content-width'\n );\n }\n if (this.verticalGap) {\n document.documentElement.style.removeProperty('--tearsheet-vertical-gap');\n }\n }\n\n /\n Update CSS custom properties for dynamic styling\n /\n private updateCSSCustomProperties(): void {\n if (this.influencerWidth) {\n document.documentElement.style.setProperty(\n '--tearsheet-influencer-width',\n this.influencerWidth\n );\n }\n if (this.summaryContentWidth) {\n document.documentElement.style.setProperty(\n '--tearsheet-summary-content-width',\n this.summaryContentWidth\n );\n }\n if (this.verticalGap) {\n document.documentElement.style.setProperty(\n '--tearsheet-vertical-gap',\n this.verticalGap\n );\n }\n }\n\n /\n Update influencer visibility based on slot content and screen size\n * Handles both slot changes and screen size changes\n /\n private updateInfluencerVisibility(slot?: HTMLSlotElement): void {\n const influencerSlot =\n slot \|\|\n (this.shadowRoot?.querySelector(\n 'slot[name=\"influencer\"]'\n ) as HTMLSlotElement);\n\n if (!influencerSlot) {\n return;\n }\n\n const hasContent =\n influencerSlot.assignedNodes({ flatten: true }).length > 0;\n const shouldShow = hasContent && !this.isSm;\n\n // Update CSS class on modal body\n if (this.modalBodyElement) {\n if (shouldShow) {\n this.modalBodyElement.classList.add(\n `${blockClass}__body-layout--has-influencer`\n );\n } else {\n this.modalBodyElement.classList.remove(\n `${blockClass}__body-layout--has-influencer`\n );\n }\n }\n }\n\n /\n Check if this tearsheet is wrapped in a stack provider\n /\n private _checkForStackWrapper(): void {\n // Check if there's a c4p-tearsheet-stack ancestor\n let parent = this.parentElement;\n while (parent) {\n if (parent.tagName.toLowerCase() === `${prefix}-tearsheet-stack`) {\n this._stackingEnabled = true;\n return;\n }\n parent = parent.parentElement;\n }\n this._stackingEnabled = false;\n }\n\n /\n Handle stack wrapper connected event\n /\n private handleStackConnected = (event: Event) => {\n event.stopPropagation();\n this._stackingEnabled = true;\n };\n\n /\n Handle stack step size changed event\n /\n private handleStackStepSizeChanged = (event: Event) => {\n event.stopPropagation();\n // Stack manager is already updated by the wrapper\n // Just trigger a re-render of stack properties if needed\n if (this._stackingEnabled && this.open) {\n this.updateStackProperties();\n }\n };\n\n /\n Handle influencer slot change\n /\n private handleInfluencerSlotChange = (e: Event) => {\n const slot = e.target as HTMLSlotElement;\n this.updateInfluencerVisibility(slot);\n };\n\n /\n Common method to handle tearsheet close with proper event dispatching\n * @param originalEvent - The original event that triggered the close (optional)\n * @param useAsync - Whether to dispatch closed event asynchronously\n /\n private closeTearsheet(originalEvent?: Event, useAsync: boolean = false) {\n // Dispatch the beingclosed event (cancelable)\n const beforeCloseEvent = new CustomEvent(\n `${prefix}-preview-tearsheet-beingclosed`,\n {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: {},\n }\n );\n\n if (!this.dispatchEvent(beforeCloseEvent)) {\n // If event was cancelled, prevent closing\n if (originalEvent) {\n originalEvent.preventDefault();\n }\n return;\n }\n\n // Close the tearsheet\n this.open = false;\n\n // Dispatch closed event\n const dispatchClosedEvent = () => {\n this.dispatchEvent(\n new CustomEvent(`${prefix}-preview-tearsheet-closed`, {\n bubbles: true,\n composed: true,\n detail: {},\n })\n );\n };\n\n if (useAsync) {\n // Use microtask for async scenarios (e.g., click outside)\n Promise.resolve().then(dispatchClosedEvent);\n } else {\n dispatchClosedEvent();\n }\n }\n\n /\n Handle close button click from the header\n * This is an internal event that triggers the tearsheet to close\n /\n private handleHeaderCloseButtonClick = (event: Event) => {\n // Stop the internal event from propagating\n event.stopPropagation();\n this.closeTearsheet();\n };\n\n /\n Handle close event from the modal (ESC key, click outside, etc.)\n /\n private handleClose = (event: Event) => {\n this.closeTearsheet(event, true);\n };\n\n /\n Parse floating menu selectors from comma-separated string\n */\n private getFloatingMenuSelectors(): string {\n const defaultSelectors = [\n `.${prefix}--overflow-menu-options`,\n `.${prefix}--tooltip`,\n '.flatpickr-calendar',\n `.${blockClass}__container`,\n `.${prefix}--menu`,\n ];\n\n const customSelectors = this.selectorsFloatingMenus\n ? this.selectorsFloatingMenus.split(',').map((s) => s.trim())\n : [];\n\n return [...defaultSelectors, ...customSelectors].join(',');\n }\n\n render() {\n const classes = classMap({\n [blockClass]: true,\n [`${blockClass}--wide`]: this.variant === 'wide',\n [`${blockClass}--narrow`]: this.variant === 'narrow',\n [`${blockClass}--has-ai-label`]: this.hasAILabel,\n [`${blockClass}--has-decorator`]: this.hasDecorator && !this.hasAILabel,\n });\n\n const containerClasses = `${blockClass}__container ${this.containerClassName}`;\n\n return html`<cds-custom-modal\n class=${classes}\n size=${this.variant === 'narrow' ? 'sm' : 'lg'}\n ?open=\"${this.open}\"\n container-class=\"${containerClasses}\"\n ?prevent-close-on-click-outside=\"${this.preventCloseOnClickOutside}\"\n aria-label=\"${ifDefined(this.ariaLabel \|\| undefined)}\"\n selector-primary-focus=\"${ifDefined(\n this.selectorPrimaryFocus \|\| undefined\n )}\"\n selectors-floating-menus=\"${this.getFloatingMenuSelectors()}\"\n @cds-custom-modal-beingclosed=\"${this.handleClose}\"\n @cds-custom-modal-closed=\"${this.handleClose}\"\n ?full-width=\"${true}\"\n ai-label=\"${ifDefined(this.hasAILabel \|\| undefined)}\"\n >\n <slot name=\"decorator\"></slot>\n <slot name=\"header\"></slot>\n <cds-custom-modal-body class=\"${blockClass}__body-layout\">\n <slot\n name=\"influencer\"\n @slotchange=${this.handleInfluencerSlotChange}\n ></slot>\n <slot name=\"body\"></slot>\n <slot name=\"footer\"></slot>\n </cds-custom-modal-body>\n </cds-custom-modal>`;\n }\n\n static styles = styles;\n}\n\nexport default CDSTearsheet;\n"],"mappings":"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"}
1	+ {"version":3,"file":"tearsheet.js","names":["styles","customElement"],"sources":["../../../src/components/tearsheet-preview/tearsheet.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { LitElement, PropertyValues, html } from 'lit';\nimport { property, state, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './tearsheet.scss?lit';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { classMap } from 'lit-html/directives/class-map.js';\nimport { MatchMediaController } from '../../globals/js/utils/match-media-controller';\nimport { breakpoints } from '@carbon/layout';\nimport { blockClass, updateTearsheetSignals } from './tearsheet-signal';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { stackManager } from './stack-signal';\nimport {\n trapFocus,\n clearFocusableContainers,\n} from '../../utilities/manageFocusTrap/manageFocusTrap';\n\n/\n Tearsheet component - A slide-out panel for displaying detailed content.\n \n @element c4p-preview-tearsheet\n * @slot header - The header content of the tearsheet\n * @slot influencer - Optional left sidebar content (wide variant only)\n * @slot body - Main body content\n * @slot footer - Footer content with actions\n * @fires c4p-preview-tearsheet-beingclosed - Fired when the tearsheet is about to close\n * @fires c4p-preview-tearsheet-closed - Fired after the tearsheet has closed\n /\n@customElement(`${prefix}-preview-tearsheet`)\nclass CDSTearsheet extends SignalWatcher(HostListenerMixin(LitElement)) {\n /\n Specifies whether the tearsheet is currently open.\n /\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n\n /\n User can pass any class names that will be added to the modal container\n /\n @property({ attribute: 'container-class-name' })\n containerClassName: string = '';\n\n /\n Default influencer takes 256px, this allows override eg: 300px, 20rem\n /\n @property({ attribute: 'influencer-width' })\n influencerWidth: string = '';\n\n /\n Default summary content takes 256px, this allows override eg: 300px, 20rem\n /\n @property({ attribute: 'summary-content-width' })\n summaryContentWidth: string = '';\n\n /\n Defines the gap from top of the viewport. Defaulted to 3rem\n /\n @property({ attribute: 'vertical-gap' })\n verticalGap: string = '';\n\n /\n Default to wide variant. Pass in narrow for narrow tearsheet\n /\n @property({ reflect: true })\n variant: 'wide' \| 'narrow' = 'wide';\n\n /\n Specify the CSS selectors that match the floating menus (comma-separated)\n /\n @property({ attribute: 'selectors-floating-menus' })\n selectorsFloatingMenus: string = '';\n\n /\n Specify a CSS selector that matches the DOM element that should be focused when the Modal opens\n /\n @property({ attribute: 'selector-primary-focus' })\n selectorPrimaryFocus: string = '';\n\n /\n Prevents the modal from closing when clicking outside\n /\n @property({ type: Boolean, attribute: 'prevent-close-on-click-outside' })\n preventCloseOnClickOutside: boolean = false;\n\n /\n Optional ref to the trigger button that opened the tearsheet. Focus will return here when tearsheet closes.\n /\n @property({ attribute: false })\n launcherButtonRef?: HTMLElement;\n\n /\n Unique ID for this tearsheet instance\n /\n private uniqueId: string = `tearsheet-${Math.random().toString(36).substr(2, 9)}`;\n\n /\n Internal flag to track if stacking is enabled (via wrapper)\n /\n private _stackingEnabled: boolean = false;\n\n /\n Internal state for tracking if the tearsheet is in small screen mode\n /\n @state()\n private isSm: boolean = false;\n\n /\n Query the modal body element\n /\n @query('cds-custom-modal-body')\n private modalBodyElement?: HTMLElement;\n\n private _trapFocusAPI: { cleanup: () => void } \| null = null;\n private _wasOpen = false;\n /\n Query the header content element to get its titleId\n /\n @query(`${prefix}-tearsheet-header-content`)\n private headerContentElement?: any;\n\n private smMediaQuery = `(max-width: ${breakpoints.md.width})`;\n private isSmallDevice = new MatchMediaController(\n this,\n this.smMediaQuery,\n false\n );\n /\n Checks if the tearsheet has a decorator (AI label or other)\n /\n private get hasDecorator(): boolean {\n const headerElement = this.querySelector(`${prefix}-tearsheet-header`);\n if (!headerElement) {\n return false;\n }\n const decorator = headerElement.querySelector('[slot=\"decorator\"]');\n return !!decorator;\n }\n\n /\n Checks if the tearsheet has an AI label decorator\n /\n private get hasAILabel(): boolean {\n const headerElement = this.querySelector(`${prefix}-tearsheet-header`);\n if (!headerElement) {\n return false;\n }\n const decorator = headerElement.querySelector('[slot=\"decorator\"]');\n if (!decorator) {\n return false;\n }\n const tagName = decorator.tagName.toLowerCase();\n return tagName === 'cds-custom-ai-label' \|\| tagName === `${prefix}-ai-label`;\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n // Listen for stack wrapper events first\n this.addEventListener(\n `${prefix}-tearsheet-stack-connected`,\n this.handleStackConnected as EventListener\n );\n this.addEventListener(\n `${prefix}-tearsheet-stack-step-size-changed`,\n this.handleStackStepSizeChanged as EventListener\n );\n\n // Check if this tearsheet is wrapped in a stack provider\n // This handles the case where the stack wrapper connected before this tearsheet\n this._checkForStackWrapper();\n\n // Set visibility class\n if (this.open) {\n this.classList.add('is-visible');\n } else {\n this.classList.remove('is-visible');\n }\n\n // Listen for close button click from header\n this.addEventListener(\n `${prefix}-tearsheet-header-close-button-clicked`,\n this.handleHeaderCloseButtonClick as EventListener\n );\n }\n\n protected firstUpdated(_changedProperties: PropertyValues): void {\n this.updateCSSCustomProperties();\n this.isSm = this.isSmallDevice?.matches \|\| this.variant === 'narrow';\n // Initialize all signals on first update, including uniqueId so children can register\n updateTearsheetSignals({\n variant: this.variant,\n isSm: this.isSm,\n open: this.open,\n hasAILabel: this.hasAILabel,\n uniqueId: this.uniqueId,\n });\n }\n\n protected updated(_changedProperties: PropertyValues): void {\n this.updateIsSmState(_changedProperties);\n this.handleOpenPropertyChange(_changedProperties);\n this.updateCSSPropertiesIfNeeded(_changedProperties);\n\n if (_changedProperties.has('variant')) {\n updateTearsheetSignals({ variant: this.variant });\n }\n\n if (_changedProperties.has('isSm')) {\n this.updateInfluencerVisibility();\n }\n\n this.updateStackPropertiesIfNeeded();\n }\n\n private updateIsSmState(_changedProperties: PropertyValues): void {\n const previousIsSm = this.isSm;\n this.isSm = this.isSmallDevice?.matches \|\| this.variant === 'narrow';\n\n if (this.isSm !== previousIsSm) {\n updateTearsheetSignals({ isSm: this.isSm });\n }\n }\n\n private handleOpenPropertyChange(_changedProperties: PropertyValues): void {\n if (!_changedProperties.has('open')) {\n return;\n }\n const wasOpen = this._wasOpen;\n const isOpen = this.open;\n\n updateTearsheetSignals({ open: this.open });\n\n // Only register with stack manager if stacking is enabled\n if (this._stackingEnabled && this.modalBodyElement) {\n stackManager.notifyStack(this.uniqueId, this.open, this.modalBodyElement);\n }\n\n this.classList.toggle('is-visible', this.open);\n\n // Only update stack properties if stacking is enabled\n if (this._stackingEnabled) {\n this.updateStackProperties();\n }\n\n // Initialize focus trap when tearsheet opens\n if (!wasOpen && isOpen) {\n // `focusableContainers` holds the containers where we can query DOM elements.\n // Our strategy here is to let child/slotted components register their containers,\n // which are then passed to `trapFocus`. This allows the utility to query elements\n // directly without being blocked by shadow DOM boundaries.\n\n // Update signal with current uniqueId FIRST so children can register\n updateTearsheetSignals({ uniqueId: this.uniqueId });\n\n // Use requestAnimationFrame to ensure child components have registered their containers\n requestAnimationFrame(() => {\n this._trapFocusAPI = trapFocus(this as HTMLElement, this.uniqueId);\n });\n }\n\n this._wasOpen = isOpen;\n // Return focus to launcher button when tearsheet closes\n if (!this.open && this.launcherButtonRef) {\n // Use a small delay to ensure the tearsheet has fully closed\n setTimeout(() => {\n if (this.launcherButtonRef instanceof HTMLElement) {\n // Check if the button is inside a TearsheetHeaderActions component\n const headerActionItem = this.launcherButtonRef.closest(\n `.${blockClass}__header-action-item`\n );\n\n if (headerActionItem) {\n // This is a button inside TearsheetHeaderActions\n // Check if it's currently visible or if items are collapsed to menu\n const headerActionsContainer = headerActionItem.closest(\n `.${blockClass}__content__header-actions`\n );\n const menuButton = headerActionsContainer?.querySelector(\n `.${blockClass}__header-actions-menuButton:not(.${blockClass}__header-actions-menuButton--hidden) button`\n );\n\n if (menuButton instanceof HTMLElement) {\n // On small screens, action buttons collapse to menu - focus the menu button\n menuButton.focus();\n } else {\n // On large screens, focus the action button directly\n this.launcherButtonRef.focus();\n }\n } else {\n // Regular button ref (not inside TearsheetHeaderActions): focus directly\n this.launcherButtonRef.focus();\n }\n }\n }, 100);\n }\n }\n\n private updateCSSPropertiesIfNeeded(\n _changedProperties: PropertyValues\n ): void {\n const hasRelevantChanges =\n _changedProperties.has('influencerWidth') \|\|\n _changedProperties.has('summaryContentWidth') \|\|\n _changedProperties.has('verticalGap');\n\n if (hasRelevantChanges) {\n this.updateCSSCustomProperties();\n }\n }\n\n private updateStackPropertiesIfNeeded(): void {\n // Only update if stacking is enabled\n if (!this._stackingEnabled) {\n return;\n }\n\n const stackState = stackManager.state;\n if (stackState.stack.length > 0) {\n this.updateStackProperties();\n }\n }\n\n /\n Update CSS custom properties for stacking\n /\n private updateStackProperties(): void {\n const stackState = stackManager.state;\n const depth = stackManager.getDepth(this.uniqueId);\n const scaleFactor = stackManager.getScaleFactor(this.uniqueId);\n const blockSizeChange = stackManager.getBlockSizeChange(this.uniqueId);\n\n // Manage --stack-activated class on host element\n if (stackState.stack.length > 1) {\n this.classList.add(`${blockClass}--stack-activated`);\n } else {\n this.classList.remove(`${blockClass}--stack-activated`);\n }\n\n if (depth !== -1) {\n this.style.setProperty('--stack-depth', depth.toString());\n this.style.setProperty('--scale-factor', scaleFactor.toString());\n this.style.setProperty('--block-size-change', blockSizeChange);\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n // Cleanup focus trap and clear all registered containers\n this._trapFocusAPI?.cleanup();\n\n clearFocusableContainers();\n\n // Remove event listeners\n this.removeEventListener(\n `${prefix}-tearsheet-header-close-button-clicked`,\n this.handleHeaderCloseButtonClick as EventListener\n );\n this.removeEventListener(\n `${prefix}-tearsheet-stack-connected`,\n this.handleStackConnected as EventListener\n );\n this.removeEventListener(\n `${prefix}-tearsheet-stack-step-size-changed`,\n this.handleStackStepSizeChanged as EventListener\n );\n\n // Notify stack manager that this tearsheet is closing (only if stacking was enabled)\n if (this._stackingEnabled) {\n stackManager.notifyStack(this.uniqueId, false, null);\n }\n\n // Clean up CSS custom properties\n if (this.influencerWidth) {\n document.documentElement.style.removeProperty(\n '--tearsheet-influencer-width'\n );\n }\n if (this.summaryContentWidth) {\n document.documentElement.style.removeProperty(\n '--tearsheet-summary-content-width'\n );\n }\n if (this.verticalGap) {\n document.documentElement.style.removeProperty('--tearsheet-vertical-gap');\n }\n }\n\n /\n Update CSS custom properties for dynamic styling\n /\n private updateCSSCustomProperties(): void {\n if (this.influencerWidth) {\n document.documentElement.style.setProperty(\n '--tearsheet-influencer-width',\n this.influencerWidth\n );\n }\n if (this.summaryContentWidth) {\n document.documentElement.style.setProperty(\n '--tearsheet-summary-content-width',\n this.summaryContentWidth\n );\n }\n if (this.verticalGap) {\n document.documentElement.style.setProperty(\n '--tearsheet-vertical-gap',\n this.verticalGap\n );\n }\n }\n\n /\n Update influencer visibility based on slot content and screen size\n * Handles both slot changes and screen size changes\n /\n private updateInfluencerVisibility(slot?: HTMLSlotElement): void {\n const influencerSlot =\n slot \|\|\n (this.shadowRoot?.querySelector(\n 'slot[name=\"influencer\"]'\n ) as HTMLSlotElement);\n\n if (!influencerSlot) {\n return;\n }\n\n const hasContent =\n influencerSlot.assignedNodes({ flatten: true }).length > 0;\n const shouldShow = hasContent && !this.isSm;\n\n // Update CSS class on modal body\n if (this.modalBodyElement) {\n if (shouldShow) {\n this.modalBodyElement.classList.add(\n `${blockClass}__body-layout--has-influencer`\n );\n } else {\n this.modalBodyElement.classList.remove(\n `${blockClass}__body-layout--has-influencer`\n );\n }\n }\n }\n\n /\n Check if this tearsheet is wrapped in a stack provider\n /\n private _checkForStackWrapper(): void {\n // Check if there's a c4p-tearsheet-stack ancestor\n let parent = this.parentElement;\n while (parent) {\n if (parent.tagName.toLowerCase() === `${prefix}-tearsheet-stack`) {\n this._stackingEnabled = true;\n return;\n }\n parent = parent.parentElement;\n }\n this._stackingEnabled = false;\n }\n\n /\n Handle stack wrapper connected event\n /\n private handleStackConnected = (event: Event) => {\n event.stopPropagation();\n this._stackingEnabled = true;\n };\n\n /\n Handle stack step size changed event\n /\n private handleStackStepSizeChanged = (event: Event) => {\n event.stopPropagation();\n // Stack manager is already updated by the wrapper\n // Just trigger a re-render of stack properties if needed\n if (this._stackingEnabled && this.open) {\n this.updateStackProperties();\n }\n };\n\n /\n Handle influencer slot change\n /\n private handleInfluencerSlotChange = (e: Event) => {\n const slot = e.target as HTMLSlotElement;\n this.updateInfluencerVisibility(slot);\n };\n\n /\n Common method to handle tearsheet close with proper event dispatching\n * @param originalEvent - The original event that triggered the close (optional)\n * @param useAsync - Whether to dispatch closed event asynchronously\n /\n private closeTearsheet(originalEvent?: Event, useAsync: boolean = false) {\n // Dispatch the beingclosed event (cancelable)\n const beforeCloseEvent = new CustomEvent(\n `${prefix}-preview-tearsheet-beingclosed`,\n {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: {},\n }\n );\n\n if (!this.dispatchEvent(beforeCloseEvent)) {\n // If event was cancelled, prevent closing\n if (originalEvent) {\n originalEvent.preventDefault();\n }\n return;\n }\n\n // Close the tearsheet\n this.open = false;\n\n // Dispatch closed event\n const dispatchClosedEvent = () => {\n this.dispatchEvent(\n new CustomEvent(`${prefix}-preview-tearsheet-closed`, {\n bubbles: true,\n composed: true,\n detail: {},\n })\n );\n };\n\n if (useAsync) {\n // Use microtask for async scenarios (e.g., click outside)\n Promise.resolve().then(dispatchClosedEvent);\n } else {\n dispatchClosedEvent();\n }\n }\n\n /\n Handle close button click from the header\n * This is an internal event that triggers the tearsheet to close\n /\n private handleHeaderCloseButtonClick = (event: Event) => {\n // Stop the internal event from propagating\n event.stopPropagation();\n this.closeTearsheet();\n };\n\n /\n Handle close event from the modal (ESC key, click outside, etc.)\n /\n private handleClose = (event: Event) => {\n this.closeTearsheet(event, true);\n };\n\n /\n Parse floating menu selectors from comma-separated string\n */\n private getFloatingMenuSelectors(): string {\n const defaultSelectors = [\n `.${prefix}--overflow-menu-options`,\n `.${prefix}--tooltip`,\n '.flatpickr-calendar',\n `.${blockClass}__container`,\n `.${prefix}--menu`,\n ];\n\n const customSelectors = this.selectorsFloatingMenus\n ? this.selectorsFloatingMenus.split(',').map((s) => s.trim())\n : [];\n\n return [...defaultSelectors, ...customSelectors].join(',');\n }\n\n render() {\n const classes = classMap({\n [blockClass]: true,\n [`${blockClass}--wide`]: this.variant === 'wide',\n [`${blockClass}--narrow`]: this.variant === 'narrow',\n [`${blockClass}--has-ai-label`]: this.hasAILabel,\n [`${blockClass}--has-decorator`]: this.hasDecorator && !this.hasAILabel,\n });\n\n const containerClasses = `${blockClass}__container ${this.containerClassName}`;\n\n const computedAriaLabelledby =\n !this.ariaLabel && this.headerContentElement?.titleId\n ? this.headerContentElement.titleId\n : undefined;\n\n return html`<cds-custom-modal\n class=${classes}\n size=${this.variant === 'narrow' ? 'sm' : 'lg'}\n ?open=\"${this.open}\"\n container-class=\"${containerClasses}\"\n ?prevent-close-on-click-outside=\"${this.preventCloseOnClickOutside}\"\n aria-label=\"${ifDefined(this.ariaLabel \|\| undefined)}\"\n aria-labelledby=\"${ifDefined(computedAriaLabelledby)}\"\n selector-primary-focus=\"${ifDefined(\n this.selectorPrimaryFocus \|\| undefined\n )}\"\n selectors-floating-menus=\"${this.getFloatingMenuSelectors()}\"\n @cds-custom-modal-beingclosed=\"${this.handleClose}\"\n @cds-custom-modal-closed=\"${this.handleClose}\"\n ?full-width=\"${true}\"\n ai-label=\"${ifDefined(this.hasAILabel \|\| undefined)}\"\n >\n <slot name=\"decorator\"></slot>\n <slot name=\"header\"></slot>\n <cds-custom-modal-body class=\"${blockClass}__body-layout\">\n <slot\n name=\"influencer\"\n @slotchange=${this.handleInfluencerSlotChange}\n ></slot>\n <slot name=\"body\"></slot>\n <slot name=\"footer\"></slot>\n </cds-custom-modal-body>\n </cds-custom-modal>`;\n }\n\n static styles = styles;\n}\n\nexport default CDSTearsheet;\n"],"mappings":"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"}