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.scss.js CHANGED Viewed

@@ -7,7 +7,7 @@
 import { css } from "lit";
 //#region src/components/tearsheet-preview/tearsheet.scss?lit
-var tearsheet_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,.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,.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,.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,.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{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{margin-inline-start:-1rem}.c4p--tearsheet__next__scroller-container{inset-block-end:0;inset-inline-end:-2.5rem;position:absolute}@media (max-width:41.98rem){.c4p--tearsheet__next__scroller-container{inset-inline-end:-1.5rem}}.c4p--tearsheet__next__scroller-container .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}"]);
+var tearsheet_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,.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,.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,.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,.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{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{margin-inline-start:-1rem}.c4p--tearsheet__next__scroller-container{inset-block-end:0;inset-inline-end:-2.5rem;position:absolute}@media (max-width:41.98rem){.c4p--tearsheet__next__scroller-container{inset-inline-end:-1.5rem}}.c4p--tearsheet__next__scroller-container .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}"]);
 //#endregion
 export { tearsheet_default as default };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"tearsheet.scss.js","names":[],"sources":["../../../src/components/tearsheet-preview/tearsheet.scss?lit"],"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$css--plex: true !default;\n\n@use '@carbon/styles/scss/breakpoint' as ;\n@use '@carbon/styles/scss/motion' as ;\n@use '@carbon/styles/scss/spacing' as ;\n@use '@carbon/styles/scss/theme' as ;\n@use '@carbon/styles/scss/type';\n@use '@carbon/styles/scss/utilities';\n@use '@carbon/styles/scss/utilities/ai-gradient' as ;\n\n@use '@carbon/ibm-products-styles/scss/components/Tearsheet/_tearsheet_next.scss'\n as ;\n\n$c4p-prefix: 'c4p';\n$carbon-prefix: 'cds-custom';\n\n$block-class__next: #{$c4p-prefix}--tearsheet__next;\n$motion-duration: $duration-moderate-02;\n\n@mixin collapsed-element {\n overflow: hidden;\n padding: 0;\n margin: 0;\n max-block-size: 0;\n opacity: 0;\n pointer-events: none;\n transition: all $motion-duration motion(entrance, expressive);\n}\n.#{$block-class__next}--has-ai-label::part(dialog) {\n border: 1px solid transparent !important; / stylelint-disable-line declaration-no-important /\n\n / override carbon ai removing background gradient /\n background:\n linear-gradient(to top, var(--cds-custom-layer), var(--cds-custom-layer)) padding-box,\n linear-gradient(\n to bottom,\n var(--cds-custom-ai-border-start, #78a9ff),\n var(--cds-custom-ai-border-end, #d0e2ff)\n )\n border-box,\n linear-gradient(to top, var(--cds-custom-layer), var(--cds-custom-layer)) border-box;\n border-block-end: 0;\n box-shadow: 0 4px 10px 2px $ai-drop-shadow;\n}\n\n.#{$block-class__next}__main-content {\n position: relative;\n\n &.#{$block-class__next}__flush {\n padding-inline: 0;\n }\n\n &.#{$block-class__next}__main-content--no-summary {\n grid-column: 1 / -1;\n }\n\n &.#{$block-class__next}__main-content--has-ai-label {\n @include ai-popover-gradient('default', 0, 'background');\n\n box-shadow: inset 0 -80px 70px -65px $ai-inner-shadow;\n }\n}\n\n:host ::slotted([slot='summary-content']) {\n @extend .#{$block-class__next}__summary-content;\n}\n\n:host ::slotted([slot='summary-content'][is-flush]) {\n padding-inline: 0;\n}\n:host(#{$c4p-prefix}-preview-tearsheet) {\n @media screen and (prefers-reduced-motion: reduce) {\n ::part(dialog) {\n align-self: flex-end;\n border: 1px solid $border-subtle-01;\n block-size: 100%;\n inset-block-start: auto;\n max-block-size: calc(\n 100% - var(--tearsheet-vertical-gap, #{$spacing-09})\n );\n transform: translate3d(0, min(95vh, 500px), 0);\n transition: none;\n }\n }\n\n ::part(dialog) {\n align-self: flex-end;\n border: 1px solid $border-subtle-01;\n block-size: 100%;\n inset-block-start: auto;\n max-block-size: calc(100% - var(--tearsheet-vertical-gap, #{$spacing-09}));\n transform: translate3d(0, min(95vh, 500px), 0);\n transition:\n transform $motion-duration motion(entrance, expressive),\n max-block-size $motion-duration motion(entrance, expressive);\n }\n\n ::slotted([slot='influencer']) {\n @extend .#{$block-class__next}__influencer;\n }\n\n ::slotted([slot='influencer'][is-flush]) {\n padding-inline: 0;\n }\n\n ::slotted([slot='body']) {\n @extend .#{$block-class__next}__body;\n }\n\n ::slotted([slot='footer']) {\n @extend .#{$block-class__next}__footer;\n }\n}\n:host(#{$c4p-prefix}-preview-tearsheet[open]) {\n ::part(dialog) {\n transform: translate3d(0, 0, 0);\n transition: transform $duration-moderate-02 motion(entrance, expressive);\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n }\n}\n\n// This will set full screen height for tearsheets in mobile devices\n:host(:not(.#{$block-class__next}--stack-activated.is-visible)) {\n ::part(dialog) {\n @include breakpoint-down(md) {\n max-block-size: none;\n }\n }\n}\n\n// Stacking styles\n:host(\n #{$c4p-prefix}-preview-tearsheet.#{$block-class__next}--stack-activated.is-visible\n) {\n --overlay-color: #{$overlay};\n --overlay-alpha: 0.5;\n\n &::before {\n position: fixed;\n z-index: calc(#{utilities.z('modal')} - var(--stack-depth, 0));\n display: block;\n background: var(--overlay-color);\n content: '';\n inset: 0;\n opacity: calc(var(--overlay-alpha) - var(--stack-depth) 0.1);\n pointer-events: none;\n\n transition:\n background-color $motion-duration motion(exit, expressive),\n opacity $motion-duration motion(exit, expressive);\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n }\n\n #{$carbon-prefix}-modal {\n background-color: transparent;\n }\n\n ::part(dialog) {\n max-block-size: calc(\n 100% - var(--tearsheet-vertical-gap, #{$spacing-09}) +\n var(--block-size-change)\n );\n transform: scaleX(var(--scale-factor));\n }\n}\n\n// Narrow variant styles\n:host(#{$c4p-prefix}-preview-tearsheet[variant='narrow']) {\n .#{$block-class__next}__header {\n padding-inline: $spacing-05;\n }\n\n .#{$block-class__next}__header.#{$block-class__next}__header-collapsed {\n .#{$block-class__next}__header-actions {\n display: none;\n }\n }\n\n .#{$block-class__next}__header-content-wrapper {\n display: flex;\n flex-direction: column;\n }\n\n .#{$block-class__next}__header-title {\n @include type.type-style('heading-03');\n }\n\n .#{$block-class__next}__content__header-actions {\n justify-content: flex-start;\n margin-inline-end: 0;\n }\n\n .#{$block-class__next}__body {\n grid-template-columns: 1fr 0;\n }\n\n ::slotted([slot='influencer']),\n ::slotted([slot='summary-content']) {\n padding: 0 !important; /* stylelint-disable-line declaration-no-important /\n }\n}\n\n// Small screen styles\n@include breakpoint-down(md) {\n :host(#{$c4p-prefix}-preview-tearsheet) {\n ::slotted([slot='influencer']),\n ::slotted([slot='summary-content']) {\n padding: 0 !important; / stylelint-disable-line declaration-no-important */\n }\n }\n}\n\n.#{$block-class__next}__header-label {\n @extend .#{$block-class__next}__header-label;\n}\n.#{$block-class__next}__header-title {\n @extend .#{$block-class__next}__header-title;\n}\n\n.#{$block-class__next}__header-description {\n @extend .#{$block-class__next}__header-description;\n}\n\n:host {\n #{$c4p-prefix}-side-panel::part(dialog) {\n @extend .#{$block-class__next}__side-panel; // Extend the side panel styles}\n }\n}\n\n:host-context(#{$c4p-prefix}-preview-tearsheet[variant='narrow']) {\n ::slotted([slot='summary-content']) {\n padding: 0;\n }\n}\n\n:host ::slotted([slot='footer']) {\n padding-block: 0;\n}\n"],"mappings":""}
1	+ {"version":3,"file":"tearsheet.scss.js","names":[],"sources":["../../../src/components/tearsheet-preview/tearsheet.scss?lit"],"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$css--plex: true !default;\n\n@use '@carbon/styles/scss/breakpoint' as ;\n@use '@carbon/styles/scss/motion' as ;\n@use '@carbon/styles/scss/spacing' as ;\n@use '@carbon/styles/scss/theme' as ;\n@use '@carbon/styles/scss/type';\n@use '@carbon/styles/scss/utilities';\n@use '@carbon/styles/scss/utilities/ai-gradient' as ;\n@use '@carbon/styles/scss/utilities/focus-outline';\n\n@use '@carbon/ibm-products-styles/scss/components/Tearsheet/_tearsheet_next.scss'\n as ;\n\n$c4p-prefix: 'c4p';\n$carbon-prefix: 'cds-custom';\n\n$block-class__next: #{$c4p-prefix}--tearsheet__next;\n$motion-duration: $duration-moderate-02;\n\n@mixin collapsed-element {\n overflow: hidden;\n padding: 0;\n margin: 0;\n max-block-size: 0;\n opacity: 0;\n pointer-events: none;\n transition: all $motion-duration motion(entrance, expressive);\n}\n.#{$block-class__next}--has-ai-label::part(dialog) {\n border: 1px solid transparent !important; / stylelint-disable-line declaration-no-important /\n\n / override carbon ai removing background gradient /\n background:\n linear-gradient(to top, var(--cds-custom-layer), var(--cds-custom-layer)) padding-box,\n linear-gradient(\n to bottom,\n var(--cds-custom-ai-border-start, #78a9ff),\n var(--cds-custom-ai-border-end, #d0e2ff)\n )\n border-box,\n linear-gradient(to top, var(--cds-custom-layer), var(--cds-custom-layer)) border-box;\n border-block-end: 0;\n box-shadow: 0 4px 10px 2px $ai-drop-shadow;\n}\n\n.#{$block-class__next}__main-content {\n position: relative;\n\n &.#{$block-class__next}__flush {\n padding-inline: 0;\n }\n\n &.#{$block-class__next}__main-content--no-summary {\n grid-column: 1 / -1;\n }\n\n &.#{$block-class__next}__main-content--has-ai-label {\n @include ai-popover-gradient('default', 0, 'background');\n\n box-shadow: inset 0 -80px 70px -65px $ai-inner-shadow;\n }\n}\n\n:host ::slotted([slot='summary-content']) {\n @extend .#{$block-class__next}__summary-content;\n}\n\n:host ::slotted([slot='summary-content']:focus) {\n @include focus-outline.focus-outline('outline');\n}\n\n:host ::slotted([slot='summary-content'][is-flush]) {\n padding-inline: 0;\n}\n:host(#{$c4p-prefix}-preview-tearsheet) {\n @media screen and (prefers-reduced-motion: reduce) {\n ::part(dialog) {\n align-self: flex-end;\n border: 1px solid $border-subtle-01;\n block-size: 100%;\n inset-block-start: auto;\n max-block-size: calc(\n 100% - var(--tearsheet-vertical-gap, #{$spacing-09})\n );\n transform: translate3d(0, min(95vh, 500px), 0);\n transition: none;\n }\n }\n\n ::part(dialog) {\n align-self: flex-end;\n border: 1px solid $border-subtle-01;\n block-size: 100%;\n inset-block-start: auto;\n max-block-size: calc(100% - var(--tearsheet-vertical-gap, #{$spacing-09}));\n transform: translate3d(0, min(95vh, 500px), 0);\n transition:\n transform $motion-duration motion(entrance, expressive),\n max-block-size $motion-duration motion(entrance, expressive);\n }\n\n ::slotted([slot='influencer']) {\n @extend .#{$block-class__next}__influencer;\n }\n\n ::slotted([slot='influencer'][is-flush]) {\n padding-inline: 0;\n }\n\n ::slotted([slot='body']) {\n @extend .#{$block-class__next}__body;\n }\n\n ::slotted([slot='footer']) {\n @extend .#{$block-class__next}__footer;\n }\n}\n:host(#{$c4p-prefix}-preview-tearsheet[open]) {\n ::part(dialog) {\n transform: translate3d(0, 0, 0);\n transition: transform $duration-moderate-02 motion(entrance, expressive);\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n }\n}\n\n// This will set full screen height for tearsheets in mobile devices\n:host(:not(.#{$block-class__next}--stack-activated.is-visible)) {\n ::part(dialog) {\n @include breakpoint-down(md) {\n max-block-size: none;\n }\n }\n}\n\n// Stacking styles\n:host(\n #{$c4p-prefix}-preview-tearsheet.#{$block-class__next}--stack-activated.is-visible\n) {\n --overlay-color: #{$overlay};\n --overlay-alpha: 0.5;\n\n &::before {\n position: fixed;\n z-index: calc(#{utilities.z('modal')} - var(--stack-depth, 0));\n display: block;\n background: var(--overlay-color);\n content: '';\n inset: 0;\n opacity: calc(var(--overlay-alpha) - var(--stack-depth) 0.1);\n pointer-events: none;\n\n transition:\n background-color $motion-duration motion(exit, expressive),\n opacity $motion-duration motion(exit, expressive);\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n }\n\n #{$carbon-prefix}-modal {\n background-color: transparent;\n }\n\n ::part(dialog) {\n max-block-size: calc(\n 100% - var(--tearsheet-vertical-gap, #{$spacing-09}) +\n var(--block-size-change)\n );\n transform: scaleX(var(--scale-factor));\n }\n}\n\n// Narrow variant styles\n:host(#{$c4p-prefix}-preview-tearsheet[variant='narrow']) {\n .#{$block-class__next}__header {\n padding-inline: $spacing-05;\n }\n\n .#{$block-class__next}__header.#{$block-class__next}__header-collapsed {\n .#{$block-class__next}__header-actions {\n display: none;\n }\n }\n\n .#{$block-class__next}__header-content-wrapper {\n display: flex;\n flex-direction: column;\n }\n\n .#{$block-class__next}__header-title {\n @include type.type-style('heading-03');\n }\n\n .#{$block-class__next}__content__header-actions {\n justify-content: flex-start;\n margin-inline-end: 0;\n }\n\n .#{$block-class__next}__body {\n grid-template-columns: 1fr 0;\n }\n\n ::slotted([slot='influencer']),\n ::slotted([slot='summary-content']) {\n padding: 0 !important; /* stylelint-disable-line declaration-no-important /\n }\n}\n\n// Small screen styles\n@include breakpoint-down(md) {\n :host(#{$c4p-prefix}-preview-tearsheet) {\n ::slotted([slot='influencer']),\n ::slotted([slot='summary-content']) {\n padding: 0 !important; / stylelint-disable-line declaration-no-important */\n }\n }\n}\n\n.#{$block-class__next}__header-label {\n @extend .#{$block-class__next}__header-label;\n}\n.#{$block-class__next}__header-title {\n @extend .#{$block-class__next}__header-title;\n}\n\n.#{$block-class__next}__header-description {\n @extend .#{$block-class__next}__header-description;\n}\n\n:host {\n #{$c4p-prefix}-side-panel::part(dialog) {\n @extend .#{$block-class__next}__side-panel; // Extend the side panel styles}\n }\n}\n\n:host-context(#{$c4p-prefix}-preview-tearsheet[variant='narrow']) {\n ::slotted([slot='summary-content']) {\n padding: 0;\n }\n}\n\n:host ::slotted([slot='footer']) {\n padding-block: 0;\n}\n"],"mappings":""}

package/es-custom/ibm-products-web-components/package.js CHANGED Viewed

@@ -6,7 +6,7 @@
  */
 //#region package.json
-var version = "0.41.1-rc.0";
+var version = "0.42.0-rc.0";
 //#endregion
 export { version };

package/es-custom/utilities/manageFocusTrap/manageFocusTrap.js CHANGED Viewed

@@ -16,25 +16,161 @@ import { prefix, selectorTabbable } from "@carbon/web-components/es/globals/sett
 * LICENSE file in the root directory of this source tree.
 */
 /**
-* Traps focus within a set of containers, ensuring it stays within focusable elements.
-* @param {NodeListOf<Element>} containers - The containers to trap focus within.
-* @returns {object} An object with a `cleanup` method to remove event listeners.
+* Simple object to store containers by uniqueId
+* { id: [container1, container2, ...] }
 */
-let _containers = [];
-const registerFocusableContainers = (container) => {
-	if (container) _containers.push(container);
+const containers = {};
+/**
+* Default key for backward compatibility when no uniqueId is provided
+*/
+const DEFAULT_KEY = "__default__";
+/**
+* Registers a focusable container to be included in the focus trap.
+*
+* This function allows child components to register their shadow roots or DOM elements
+* so that the focus trap utility can query focusable elements within them. This is necessary
+* because shadow DOM boundaries prevent direct querying from parent components.
+*
+* @param container - The HTMLElement or ShadowRoot to register as a focusable container.
+*                    If null, the function returns early without registering.
+* @param uniqueId - Optional unique identifier to scope containers to a specific component instance.
+*                   If not provided, uses a default key for backward compatibility.
+*
+* @example
+* // In a child component's firstUpdated lifecycle
+* protected firstUpdated() {
+*   const uniqueId = tearsheetSignal.get().uniqueId;
+*   registerFocusableContainers(this.shadowRoot, uniqueId);
+* }
+*
+* @example
+* // Without uniqueId (uses default key)
+* registerFocusableContainers(this.shadowRoot);
+*/
+const registerFocusableContainers = (container, uniqueId) => {
+	if (!container) return;
+	const id = uniqueId || DEFAULT_KEY;
+	if (!containers[id]) containers[id] = [];
+	if (!containers[id].includes(container)) containers[id].push(container);
 };
-const clearFocusableContainers = () => {
-	_containers.length = 0;
+/**
+* UnRegisters a previously registered focusable container.
+*
+* This function should be called in the component's disconnectedCallback lifecycle method
+* to clean up and prevent memory leaks when the component is removed from the DOM.
+*
+* @param container - The HTMLElement or ShadowRoot to unregister.
+*                    If null, the function returns early without doing anything.
+* @param uniqueId - Optional unique identifier that was used when registering the container.
+*                   If not provided, uses the default key.
+*
+* @example
+* // In a child component's disconnectedCallback
+* disconnectedCallback() {
+*   super.disconnectedCallback();
+*   const uniqueId = tearsheetSignal.get().uniqueId;
+*   unregisterFocusableContainers(this.shadowRoot, uniqueId);
+* }
+*
+* @example
+* // Without uniqueId (uses default key)
+* disconnectedCallback() {
+*   super.disconnectedCallback();
+*   unregisterFocusableContainers(this.shadowRoot);
+* }
+*/
+const unregisterFocusableContainers = (container, uniqueId) => {
+	if (!container) return;
+	const id = uniqueId || DEFAULT_KEY;
+	if (containers[id]) {
+		containers[id] = containers[id].filter((c) => c !== container);
+		if (containers[id].length === 0) delete containers[id];
+	}
 };
-const trapFocus = (containers) => {
+/**
+* Clears all registered focusable containers, either globally or for a specific uniqueId.
+*
+* This function is typically called when a parent component (like a tearsheet or modal) is closing
+* or being removed from the DOM. It ensures all registered containers are cleaned up to prevent
+* memory leaks.
+*
+* @param uniqueId - Optional unique identifier to clear containers for a specific component instance.
+*                   If provided, only containers registered with this uniqueId are cleared.
+*                   If not provided, ALL containers across all uniqueIds are cleared.
+*
+* @example
+* // Clear containers for a specific tearsheet instance
+* clearFocusableContainers(this.uniqueId);
+*
+* @example
+* // Clear all containers (typically in disconnectedCallback)
+* disconnectedCallback() {
+*   super.disconnectedCallback();
+*   this._trapFocusAPI?.cleanup();
+*   clearFocusableContainers();
+* }
+*/
+const clearFocusableContainers = (uniqueId) => {
+	if (uniqueId) delete containers[uniqueId];
+	else Object.keys(containers).forEach((key) => delete containers[key]);
+};
+/**
+* Traps keyboard focus within registered focusable containers.
+*
+* This function creates a focus trap that prevents Tab/Shift+Tab navigation from leaving
+* the registered containers. When the user reaches the last focusable element and presses Tab,
+* focus wraps to the first element, and vice versa with Shift+Tab.
+*
+* The function works with Shadow DOM by querying focusable elements from all registered
+* containers, which can include shadow roots from child components.
+*
+* @param wrapper - Optional wrapper element to attach the keydown listener to.
+*                  If not provided, defaults to document for backward compatibility.
+*                  Using a specific wrapper can improve performance and scope the listener.
+* @param uniqueId - Optional unique identifier to scope the focus trap to specific containers.
+*                   If provided, only containers registered with this uniqueId are included.
+*                   If not provided, uses the default key for backward compatibility.
+*
+* @returns An object with a `cleanup` method that removes event listeners.
+*          Call this method when the component is closing or unmounting.
+*
+* @example
+* // In a parent component when opening
+* protected updated(changedProps) {
+*   if (changedProps.has('open') && this.open) {
+*     // Update signal so children can register
+*     updateTearsheetSignals({ uniqueId: this.uniqueId });
+*
+*     // Wait for children to register, then trap focus
+*     requestAnimationFrame(() => {
+*       this._trapFocusAPI = trapFocus(this as HTMLElement, this.uniqueId);
+*     });
+*   }
+* }
+*
+* @example
+* // Without uniqueId (uses default key)
+* this._trapFocusAPI = trapFocus();
+*
+* @example
+* // Cleanup when closing
+* disconnectedCallback() {
+*   this._trapFocusAPI?.cleanup();
+*   clearFocusableContainers(this.uniqueId);
+* }
+*/
+const trapFocus = (wrapper, uniqueId) => {
 	const selectorTabbable$1 = selectorTabbable.replace(`${prefix}-button`, `${prefix}-button:not([disabled]), ${prefix}-selectable-tag`);
-	if (containers && containers.length > 0) _containers = containers;
-	if (!_containers.length) return { cleanup: () => {} };
+	const containerArray = containers[uniqueId || DEFAULT_KEY];
+	if (!containerArray || containerArray.length === 0) return { cleanup: () => {} };
+	const eventTarget = wrapper || document;
 	/**
-	* Given a container element, return the best candidate to focus.
-	* - If element itself is tabbable, return it.
-	* - Otherwise, find the first tabbable descendant.
+	* Determines the best focusable element within a given container.
+	*
+	* @param el - The element to check for ability to focus
+	* @returns The focusable element, or null if none found
+	*
+	* @internal
 	*/
 	const getFocusTarget = (el) => {
 		if (!el) return null;
@@ -42,21 +178,29 @@ const trapFocus = (containers) => {
 		return el.querySelector("button, [tabindex]:not([tabindex=\"-1\"])") || el;
 	};
 	/**
-	* Returns the "real" active element in the document, resolving through
-	* Shadow DOM and slot boundaries when necessary.
+	* Returns the actual focused element, resolving through Shadow DOM and slot boundaries.
 	*
-	* In some cases `document.activeElement` may not reflect the actual
-	* tabbable node that has focus:
-	*   - If focus is inside a shadow root, `document.activeElement` is the host,
-	*     not the element inside. This utility dives into the shadowRoot to find
-	*     the inner active element.
-	*   - If focus is on a `<slot>` element, this function resolves to the first
-	*     tabbable assigned element within the slot.
+	* In standard DOM, `document.activeElement` returns the focused element. However, with
+	* Shadow DOM and slots, this can be misleading:
+	* - If focus is inside a shadow root, `document.activeElement` returns the host element,
+	*   not the actual focused element inside the shadow root.
+	* - If focus is on a `<slot>` element, we need to resolve to the assigned element.
+	*
+	* This function traverses shadow roots to find the true focused element, stopping at
+	* tabbable elements like buttons to avoid going too deep into component internals.
+	*
+	* @returns The actual focused element in the document
+	*
+	* @internal
 	*/
 	const getRealActiveElement = () => {
 		let activeElement = document.activeElement;
-		if (activeElement && selectorTabbable$1.indexOf(activeElement.tagName.toLocaleLowerCase()) == -1 && activeElement?.shadowRoot?.activeElement) activeElement = activeElement.shadowRoot.activeElement;
+		while (activeElement && activeElement.shadowRoot && activeElement.shadowRoot.activeElement) {
+			const nextElement = activeElement.shadowRoot.activeElement;
+			const tagName = activeElement.tagName.toLowerCase();
+			if (selectorTabbable$1.indexOf(tagName) !== -1 || tagName.includes("-button") || activeElement.hasAttribute("tabindex")) break;
+			activeElement = nextElement;
+		}
 		if (activeElement?.tagName === "SLOT") {
 			let assigned;
 			if (activeElement instanceof HTMLSlotElement) assigned = activeElement.assignedElements({ flatten: true });
@@ -66,11 +210,18 @@ const trapFocus = (containers) => {
 		return activeElement;
 	};
 	requestAnimationFrame(() => {
-		getFocusTarget(getAllFocusableElements(_containers)[0])?.focus({ preventScroll: true });
+		getFocusTarget(getAllFocusableElements(containerArray)[0])?.focus({ preventScroll: true });
 	});
+	/**
+	* Handles Tab and Shift+Tab key presses to trap focus within containers.
+	*
+	* @param e - The keyboard event
+	*
+	* @internal
+	*/
 	function onKeyDown(e) {
 		if (e.key !== "Tab") return;
-		const elements = getAllFocusableElements(_containers);
+		const elements = getAllFocusableElements(containerArray);
 		const first = elements[0];
 		const last = elements[elements.length - 1];
 		const active = getRealActiveElement();
@@ -85,16 +236,20 @@ const trapFocus = (containers) => {
 		}
 	}
 	/**
-	* Retrieves all focusable elements within the provided containers.
-	**/
+	* Retrieves all focusable elements from all registered containers.
+	*
+	* @param containers - Array of containers to query for focusable elements
+	* @returns Array of all focusable elements found
+	*
+	* @internal
+	*/
 	const getAllFocusableElements = (containers) => containers.flatMap((container) => [...container.querySelectorAll(selectorTabbable$1)]).filter(Boolean);
-	document.addEventListener("keydown", onKeyDown, true);
+	eventTarget.addEventListener("keydown", onKeyDown, true);
 	return { cleanup: () => {
-		document.removeEventListener("keydown", onKeyDown, true);
-		_containers.length = 0;
+		eventTarget.removeEventListener("keydown", onKeyDown, true);
 	} };
 };
 //#endregion
-export { clearFocusableContainers, registerFocusableContainers, trapFocus };
+export { clearFocusableContainers, registerFocusableContainers, trapFocus, unregisterFocusableContainers };
 //# sourceMappingURL=manageFocusTrap.js.map

package/es-custom/utilities/manageFocusTrap/manageFocusTrap.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"manageFocusTrap.js","names":["selectorTabbable","selectorTabbableCarbon","carbonPrefix"],"sources":["../../../src/utilities/manageFocusTrap/manageFocusTrap.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2025\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 {\n selectorTabbable as selectorTabbableCarbon,\n prefix as carbonPrefix,\n} from '@carbon/web-components/es/globals/settings';\n/\n Traps focus within a set of containers, ensuring it stays within focusable elements.\n * @param {NodeListOf<Element>} containers - The containers to trap focus within.\n * @returns {object} An object with a `cleanup` method to remove event listeners.\n /\nlet _containers: HTMLElement[] = [];\n\nexport const registerFocusableContainers = (container) => {\n if (container) {\n _containers.push(container);\n }\n};\nexport const clearFocusableContainers = () => {\n _containers.length = 0;\n};\nexport const trapFocus = (containers?: HTMLElement[]) => {\n const selectorTabbable = selectorTabbableCarbon.replace(\n `${carbonPrefix}-button`,\n `${carbonPrefix}-button:not([disabled]), ${carbonPrefix}-selectable-tag`\n );\n\n if (containers && containers.length > 0) {\n _containers = containers;\n }\n if (!_containers.length) {\n return { cleanup: () => {} };\n }\n\n /\n Given a container element, return the best candidate to focus.\n * - If element itself is tabbable, return it.\n * - Otherwise, find the first tabbable descendant.\n /\n const getFocusTarget = (el) => {\n if (!el) {\n return null;\n }\n if (el.tagName === 'BUTTON' \|\| el.tabIndex >= 0) {\n return el;\n }\n const inner = el.querySelector('button, [tabindex]:not([tabindex=\"-1\"])');\n return inner \|\| el;\n };\n\n /\n\n Returns the \"real\" active element in the document, resolving through\n * Shadow DOM and slot boundaries when necessary.\n \n In some cases `document.activeElement` may not reflect the actual\n * tabbable node that has focus:\n * - If focus is inside a shadow root, `document.activeElement` is the host,\n * not the element inside. This utility dives into the shadowRoot to find\n * the inner active element.\n * - If focus is on a `<slot>` element, this function resolves to the first\n * tabbable assigned element within the slot.\n /\n const getRealActiveElement = () => {\n let activeElement = document.activeElement;\n\n // If inside shadow DOM\n if (\n activeElement &&\n selectorTabbable.indexOf(activeElement.tagName.toLocaleLowerCase()) ==\n -1 &&\n activeElement?.shadowRoot?.activeElement\n ) {\n activeElement = activeElement.shadowRoot.activeElement;\n }\n\n // If active element is a slot\n if (activeElement?.tagName === 'SLOT') {\n let assigned: Element[] \| undefined;\n\n if (activeElement instanceof HTMLSlotElement) {\n assigned = activeElement.assignedElements({ flatten: true });\n }\n const candidate = assigned?.find((node) =>\n node.matches('button, [tabindex]:not([tabindex=\"-1\"])')\n );\n if (candidate) {\n activeElement = candidate;\n }\n }\n\n return activeElement;\n };\n\n //Optionally focus first element immediately\n requestAnimationFrame(() => {\n const elements = getAllFocusableElements(_containers);\n getFocusTarget(elements[0])?.focus({ preventScroll: true });\n });\n\n function onKeyDown(e) {\n if (e.key !== 'Tab') {\n return;\n }\n\n // Flatten all focusable elements from all containers\n const elements = getAllFocusableElements(_containers);\n\n const first = elements[0];\n const last = elements[elements.length - 1];\n const active = getRealActiveElement();\n\n if (e.shiftKey) {\n // Shift+Tab wrap\n if (active === first \|\| first.contains(active)) {\n e.preventDefault();\n getFocusTarget(last)?.focus();\n }\n } else {\n // Tab wrap\n if (active === last \|\| last.contains(active)) {\n e.preventDefault();\n getFocusTarget(first)?.focus();\n }\n }\n }\n\n /\n Retrieves all focusable elements within the provided containers.\n **/\n const getAllFocusableElements = (containers) =>\n containers\n .flatMap((container) => [...container.querySelectorAll(selectorTabbable)])\n .filter(Boolean);\n\n document.addEventListener('keydown', onKeyDown, true);\n\n return {\n cleanup: () => {\n document.removeEventListener('keydown', onKeyDown, true);\n _containers.length = 0;\n },\n };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAI,cAA6B,EAAE;AAEnC,MAAa,+BAA+B,cAAc;AACxD,KAAI,UACF,aAAY,KAAK,UAAU;;AAG/B,MAAa,iCAAiC;AAC5C,aAAY,SAAS;;AAEvB,MAAa,aAAa,eAA+B;CACvD,MAAMA,qBAAmBC,iBAAuB,QAC9C,GAAGC,OAAa,UAChB,GAAGA,OAAa,2BAA2BA,OAAa,iBACzD;AAED,KAAI,cAAc,WAAW,SAAS,EACpC,eAAc;AAEhB,KAAI,CAAC,YAAY,OACf,QAAO,EAAE,eAAe,IAAI;;;;;;CAQ9B,MAAM,kBAAkB,OAAO;AAC7B,MAAI,CAAC,GACH,QAAO;AAET,MAAI,GAAG,YAAY,YAAY,GAAG,YAAY,EAC5C,QAAO;AAGT,SADc,GAAG,cAAc,4CACnB,IAAI;;;;;;;;;;;;;;;CAgBlB,MAAM,6BAA6B;EACjC,IAAI,gBAAgB,SAAS;AAG7B,MACE,iBACAF,mBAAiB,QAAQ,cAAc,QAAQ,mBAAmB,CAAC,IACjE,MACF,eAAe,YAAY,cAE3B,iBAAgB,cAAc,WAAW;AAI3C,MAAI,eAAe,YAAY,QAAQ;GACrC,IAAI;AAEJ,OAAI,yBAAyB,gBAC3B,YAAW,cAAc,iBAAiB,EAAE,SAAS,MAAM,CAAC;GAE9D,MAAM,YAAY,UAAU,MAAM,SAChC,KAAK,QAAQ,4CAA0C,CACxD;AACD,OAAI,UACF,iBAAgB;;AAIpB,SAAO;;AAIT,6BAA4B;AAE1B,iBADiB,wBAAwB,YAClB,CAAC,GAAG,EAAE,MAAM,EAAE,eAAe,MAAM,CAAC;GAC3D;CAEF,SAAS,UAAU,GAAG;AACpB,MAAI,EAAE,QAAQ,MACZ;EAIF,MAAM,WAAW,wBAAwB,YAAY;EAErD,MAAM,QAAQ,SAAS;EACvB,MAAM,OAAO,SAAS,SAAS,SAAS;EACxC,MAAM,SAAS,sBAAsB;AAErC,MAAI,EAAE;OAEA,WAAW,SAAS,MAAM,SAAS,OAAO,EAAE;AAC9C,MAAE,gBAAgB;AAClB,mBAAe,KAAK,EAAE,OAAO;;aAI3B,WAAW,QAAQ,KAAK,SAAS,OAAO,EAAE;AAC5C,KAAE,gBAAgB;AAClB,kBAAe,MAAM,EAAE,OAAO;;;;;;CAQpC,MAAM,2BAA2B,eAC/B,WACG,SAAS,cAAc,CAAC,GAAG,UAAU,iBAAiBA,mBAAiB,CAAC,CAAC,CACzE,OAAO,QAAQ;AAEpB,UAAS,iBAAiB,WAAW,WAAW,KAAK;AAErD,QAAO,EACL,eAAe;AACb,WAAS,oBAAoB,WAAW,WAAW,KAAK;AACxD,cAAY,SAAS;IAExB"}
1	+ {"version":3,"file":"manageFocusTrap.js","names":["selectorTabbable","selectorTabbableCarbon","carbonPrefix"],"sources":["../../../src/utilities/manageFocusTrap/manageFocusTrap.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2025\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 {\n selectorTabbable as selectorTabbableCarbon,\n prefix as carbonPrefix,\n} from '@carbon/web-components/es/globals/settings';\n\n/\n Simple object to store containers by uniqueId\n * { id: [container1, container2, ...] }\n /\nconst containers: Record<string, Array<HTMLElement \| ShadowRoot>> = {};\n\n/\n Default key for backward compatibility when no uniqueId is provided\n /\nconst DEFAULT_KEY = '__default__';\n\n/\n Registers a focusable container to be included in the focus trap.\n \n This function allows child components to register their shadow roots or DOM elements\n * so that the focus trap utility can query focusable elements within them. This is necessary\n * because shadow DOM boundaries prevent direct querying from parent components.\n \n @param container - The HTMLElement or ShadowRoot to register as a focusable container.\n * If null, the function returns early without registering.\n * @param uniqueId - Optional unique identifier to scope containers to a specific component instance.\n * If not provided, uses a default key for backward compatibility.\n \n @example\n * // In a child component's firstUpdated lifecycle\n * protected firstUpdated() {\n * const uniqueId = tearsheetSignal.get().uniqueId;\n * registerFocusableContainers(this.shadowRoot, uniqueId);\n * }\n \n @example\n * // Without uniqueId (uses default key)\n * registerFocusableContainers(this.shadowRoot);\n /\nexport const registerFocusableContainers = (\n container: HTMLElement \| ShadowRoot \| null,\n uniqueId?: string\n) => {\n if (!container) {\n return;\n }\n\n const id = uniqueId \|\| DEFAULT_KEY;\n\n // Initialize array if it doesn't exist\n if (!containers[id]) {\n containers[id] = [];\n }\n\n // Add container if not already present\n if (!containers[id].includes(container)) {\n containers[id].push(container);\n }\n};\n\n/\n UnRegisters a previously registered focusable container.\n \n This function should be called in the component's disconnectedCallback lifecycle method\n * to clean up and prevent memory leaks when the component is removed from the DOM.\n \n @param container - The HTMLElement or ShadowRoot to unregister.\n * If null, the function returns early without doing anything.\n * @param uniqueId - Optional unique identifier that was used when registering the container.\n * If not provided, uses the default key.\n \n @example\n * // In a child component's disconnectedCallback\n * disconnectedCallback() {\n * super.disconnectedCallback();\n * const uniqueId = tearsheetSignal.get().uniqueId;\n * unregisterFocusableContainers(this.shadowRoot, uniqueId);\n * }\n \n @example\n * // Without uniqueId (uses default key)\n * disconnectedCallback() {\n * super.disconnectedCallback();\n * unregisterFocusableContainers(this.shadowRoot);\n * }\n /\nexport const unregisterFocusableContainers = (\n container: HTMLElement \| ShadowRoot \| null,\n uniqueId?: string\n) => {\n if (!container) {\n return;\n }\n\n const id = uniqueId \|\| DEFAULT_KEY;\n if (containers[id]) {\n containers[id] = containers[id].filter((c) => c !== container);\n if (containers[id].length === 0) {\n delete containers[id];\n }\n }\n};\n\n/\n Clears all registered focusable containers, either globally or for a specific uniqueId.\n \n This function is typically called when a parent component (like a tearsheet or modal) is closing\n * or being removed from the DOM. It ensures all registered containers are cleaned up to prevent\n * memory leaks.\n \n @param uniqueId - Optional unique identifier to clear containers for a specific component instance.\n * If provided, only containers registered with this uniqueId are cleared.\n * If not provided, ALL containers across all uniqueIds are cleared.\n \n @example\n * // Clear containers for a specific tearsheet instance\n * clearFocusableContainers(this.uniqueId);\n \n @example\n * // Clear all containers (typically in disconnectedCallback)\n * disconnectedCallback() {\n * super.disconnectedCallback();\n * this._trapFocusAPI?.cleanup();\n * clearFocusableContainers();\n * }\n /\nexport const clearFocusableContainers = (uniqueId?: string) => {\n if (uniqueId) {\n delete containers[uniqueId];\n } else {\n Object.keys(containers).forEach((key) => delete containers[key]);\n }\n};\n\n/\n Traps keyboard focus within registered focusable containers.\n \n This function creates a focus trap that prevents Tab/Shift+Tab navigation from leaving\n * the registered containers. When the user reaches the last focusable element and presses Tab,\n * focus wraps to the first element, and vice versa with Shift+Tab.\n \n The function works with Shadow DOM by querying focusable elements from all registered\n * containers, which can include shadow roots from child components.\n \n @param wrapper - Optional wrapper element to attach the keydown listener to.\n * If not provided, defaults to document for backward compatibility.\n * Using a specific wrapper can improve performance and scope the listener.\n * @param uniqueId - Optional unique identifier to scope the focus trap to specific containers.\n * If provided, only containers registered with this uniqueId are included.\n * If not provided, uses the default key for backward compatibility.\n \n @returns An object with a `cleanup` method that removes event listeners.\n * Call this method when the component is closing or unmounting.\n \n @example\n * // In a parent component when opening\n * protected updated(changedProps) {\n * if (changedProps.has('open') && this.open) {\n * // Update signal so children can register\n * updateTearsheetSignals({ uniqueId: this.uniqueId });\n \n // Wait for children to register, then trap focus\n * requestAnimationFrame(() => {\n * this._trapFocusAPI = trapFocus(this as HTMLElement, this.uniqueId);\n * });\n * }\n * }\n \n @example\n * // Without uniqueId (uses default key)\n * this._trapFocusAPI = trapFocus();\n \n @example\n * // Cleanup when closing\n * disconnectedCallback() {\n * this._trapFocusAPI?.cleanup();\n * clearFocusableContainers(this.uniqueId);\n * }\n /\nexport const trapFocus = (wrapper?: HTMLElement, uniqueId?: string) => {\n const selectorTabbable = selectorTabbableCarbon.replace(\n `${carbonPrefix}-button`,\n `${carbonPrefix}-button:not([disabled]), ${carbonPrefix}-selectable-tag`\n );\n\n // Get containers for this uniqueId (or default key for backward compatibility)\n const id = uniqueId \|\| DEFAULT_KEY;\n\n const containerArray = containers[id];\n\n if (!containerArray \|\| containerArray.length === 0) {\n return { cleanup: () => {} };\n }\n\n // Use wrapper if provided, otherwise default to document for backward compatibility\n const eventTarget = wrapper \|\| document;\n\n /\n Determines the best focusable element within a given container.\n \n @param el - The element to check for ability to focus\n * @returns The focusable element, or null if none found\n \n @internal\n /\n const getFocusTarget = (el) => {\n if (!el) {\n return null;\n }\n if (el.tagName === 'BUTTON' \|\| el.tabIndex >= 0) {\n return el;\n }\n const inner = el.querySelector('button, [tabindex]:not([tabindex=\"-1\"])');\n return inner \|\| el;\n };\n\n /\n Returns the actual focused element, resolving through Shadow DOM and slot boundaries.\n \n In standard DOM, `document.activeElement` returns the focused element. However, with\n * Shadow DOM and slots, this can be misleading:\n * - If focus is inside a shadow root, `document.activeElement` returns the host element,\n * not the actual focused element inside the shadow root.\n * - If focus is on a `<slot>` element, we need to resolve to the assigned element.\n \n This function traverses shadow roots to find the true focused element, stopping at\n * tabbable elements like buttons to avoid going too deep into component internals.\n \n @returns The actual focused element in the document\n \n @internal\n /\n const getRealActiveElement = () => {\n let activeElement = document.activeElement;\n\n // Traverse through nested shadow DOMs, but stop at tabbable elements\n // This ensures we stop at cds-custom-button level, not go deeper into its shadow root\n while (\n activeElement &&\n activeElement.shadowRoot &&\n activeElement.shadowRoot.activeElement\n ) {\n const nextElement = activeElement.shadowRoot.activeElement;\n\n // Check if current element is a tabbable element (like cds-custom-button)\n // If so, stop here instead of going deeper\n const tagName = activeElement.tagName.toLowerCase();\n if (\n selectorTabbable.indexOf(tagName) !== -1 \|\|\n tagName.includes('-button') \|\|\n activeElement.hasAttribute('tabindex')\n ) {\n break;\n }\n\n activeElement = nextElement;\n }\n\n // If active element is a slot, resolve to the assigned element\n if (activeElement?.tagName === 'SLOT') {\n let assigned: Element[] \| undefined;\n\n if (activeElement instanceof HTMLSlotElement) {\n assigned = activeElement.assignedElements({ flatten: true });\n }\n const candidate = assigned?.find((node) =>\n node.matches('button, [tabindex]:not([tabindex=\"-1\"])')\n );\n if (candidate) {\n activeElement = candidate;\n }\n }\n\n return activeElement;\n };\n\n //Optionally focus first element immediately\n requestAnimationFrame(() => {\n const elements = getAllFocusableElements(containerArray);\n getFocusTarget(elements[0])?.focus({ preventScroll: true });\n });\n\n /\n Handles Tab and Shift+Tab key presses to trap focus within containers.\n \n @param e - The keyboard event\n \n @internal\n /\n function onKeyDown(e) {\n if (e.key !== 'Tab') {\n return;\n }\n\n // Flatten all focusable elements from all containers\n const elements = getAllFocusableElements(containerArray);\n\n const first = elements[0];\n const last = elements[elements.length - 1];\n const active = getRealActiveElement();\n\n if (e.shiftKey) {\n // Shift+Tab wrap\n if (active === first \|\| first.contains(active)) {\n e.preventDefault();\n getFocusTarget(last)?.focus();\n }\n } else {\n // Tab wrap\n if (active === last \|\| last.contains(active)) {\n e.preventDefault();\n getFocusTarget(first)?.focus();\n }\n }\n }\n\n /\n Retrieves all focusable elements from all registered containers.\n \n @param containers - Array of containers to query for focusable elements\n * @returns Array of all focusable elements found\n \n @internal\n */\n const getAllFocusableElements = (containers) =>\n containers\n .flatMap((container) => [...container.querySelectorAll(selectorTabbable)])\n .filter(Boolean);\n\n eventTarget.addEventListener('keydown', onKeyDown, true);\n\n return {\n cleanup: () => {\n eventTarget.removeEventListener('keydown', onKeyDown, true);\n // Don't clear containers here - let components unregister themselves\n },\n };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,aAA8D,EAAE;;;;AAKtE,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;AAyBpB,MAAa,+BACX,WACA,aACG;AACH,KAAI,CAAC,UACH;CAGF,MAAM,KAAK,YAAY;AAGvB,KAAI,CAAC,WAAW,IACd,YAAW,MAAM,EAAE;AAIrB,KAAI,CAAC,WAAW,IAAI,SAAS,UAAU,CACrC,YAAW,IAAI,KAAK,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BlC,MAAa,iCACX,WACA,aACG;AACH,KAAI,CAAC,UACH;CAGF,MAAM,KAAK,YAAY;AACvB,KAAI,WAAW,KAAK;AAClB,aAAW,MAAM,WAAW,IAAI,QAAQ,MAAM,MAAM,UAAU;AAC9D,MAAI,WAAW,IAAI,WAAW,EAC5B,QAAO,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BxB,MAAa,4BAA4B,aAAsB;AAC7D,KAAI,SACF,QAAO,WAAW;KAElB,QAAO,KAAK,WAAW,CAAC,SAAS,QAAQ,OAAO,WAAW,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDpE,MAAa,aAAa,SAAuB,aAAsB;CACrE,MAAMA,qBAAmBC,iBAAuB,QAC9C,GAAGC,OAAa,UAChB,GAAGA,OAAa,2BAA2BA,OAAa,iBACzD;CAKD,MAAM,iBAAiB,WAFZ,YAAY;AAIvB,KAAI,CAAC,kBAAkB,eAAe,WAAW,EAC/C,QAAO,EAAE,eAAe,IAAI;CAI9B,MAAM,cAAc,WAAW;;;;;;;;;CAU/B,MAAM,kBAAkB,OAAO;AAC7B,MAAI,CAAC,GACH,QAAO;AAET,MAAI,GAAG,YAAY,YAAY,GAAG,YAAY,EAC5C,QAAO;AAGT,SADc,GAAG,cAAc,4CACnB,IAAI;;;;;;;;;;;;;;;;;;CAmBlB,MAAM,6BAA6B;EACjC,IAAI,gBAAgB,SAAS;AAI7B,SACE,iBACA,cAAc,cACd,cAAc,WAAW,eACzB;GACA,MAAM,cAAc,cAAc,WAAW;GAI7C,MAAM,UAAU,cAAc,QAAQ,aAAa;AACnD,OACEF,mBAAiB,QAAQ,QAAQ,KAAK,MACtC,QAAQ,SAAS,UAAU,IAC3B,cAAc,aAAa,WAAW,CAEtC;AAGF,mBAAgB;;AAIlB,MAAI,eAAe,YAAY,QAAQ;GACrC,IAAI;AAEJ,OAAI,yBAAyB,gBAC3B,YAAW,cAAc,iBAAiB,EAAE,SAAS,MAAM,CAAC;GAE9D,MAAM,YAAY,UAAU,MAAM,SAChC,KAAK,QAAQ,4CAA0C,CACxD;AACD,OAAI,UACF,iBAAgB;;AAIpB,SAAO;;AAIT,6BAA4B;AAE1B,iBADiB,wBAAwB,eAClB,CAAC,GAAG,EAAE,MAAM,EAAE,eAAe,MAAM,CAAC;GAC3D;;;;;;;;CASF,SAAS,UAAU,GAAG;AACpB,MAAI,EAAE,QAAQ,MACZ;EAIF,MAAM,WAAW,wBAAwB,eAAe;EAExD,MAAM,QAAQ,SAAS;EACvB,MAAM,OAAO,SAAS,SAAS,SAAS;EACxC,MAAM,SAAS,sBAAsB;AAErC,MAAI,EAAE;OAEA,WAAW,SAAS,MAAM,SAAS,OAAO,EAAE;AAC9C,MAAE,gBAAgB;AAClB,mBAAe,KAAK,EAAE,OAAO;;aAI3B,WAAW,QAAQ,KAAK,SAAS,OAAO,EAAE;AAC5C,KAAE,gBAAgB;AAClB,kBAAe,MAAM,EAAE,OAAO;;;;;;;;;;;CAapC,MAAM,2BAA2B,eAC/B,WACG,SAAS,cAAc,CAAC,GAAG,UAAU,iBAAiBA,mBAAiB,CAAC,CAAC,CACzE,OAAO,QAAQ;AAEpB,aAAY,iBAAiB,WAAW,WAAW,KAAK;AAExD,QAAO,EACL,eAAe;AACb,cAAY,oBAAoB,WAAW,WAAW,KAAK;IAG9D"}

package/lib/components/coachmark/coachmark-body.d.ts CHANGED Viewed

@@ -20,7 +20,7 @@ declare const CDSCoachmarkBody_base: {
             };
         };
     };
-} & typeof LitElement;
+} & typeof LitElement & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
 /**
  * coachmark-body for content body
  * @element c4p-coachmark-body

package/lib/components/coachmark/coachmark-header.d.ts CHANGED Viewed

@@ -21,7 +21,7 @@ declare const CDSCoachmarkHeader_base: {
             };
         };
     };
-} & typeof LitElement;
+} & typeof LitElement & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
 /**
  * coachmark-header for content header section
  * @element c4p-coachmark-header

package/lib/components/coachmark/coachmark.d.ts CHANGED Viewed

@@ -22,7 +22,7 @@ declare const CDSCoachmark_base: {
             };
         };
     };
-} & typeof LitElement;
+} & typeof LitElement & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
 /**
  * coachmark main component
  * @element c4p-coachmark

package/lib/components/interstitial-screen/interstitial-screen-body.d.ts CHANGED Viewed

@@ -21,7 +21,7 @@ declare const CDSInterstitialScreenBody_base: {
             };
         };
     };
-} & typeof LitElement;
+} & typeof LitElement & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
 /**
  * interstitial-screen-body for body section
  * @element c4p-interstitial-screen-body

package/lib/components/interstitial-screen/interstitial-screen-footer.d.ts CHANGED Viewed

@@ -25,7 +25,7 @@ declare const CDSInterstitialScreenFooter_base: {
             };
         };
     };
-} & typeof CDSModalFooter;
+} & typeof CDSModalFooter & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
 /**
  * interstitial-screen-footer for footer section
  * @element c4p-interstitial-screen-footer

package/lib/components/interstitial-screen/interstitial-screen-header.d.ts CHANGED Viewed

@@ -21,7 +21,7 @@ declare const CDSInterstitialScreenHeader_base: {
             };
         };
     };
-} & typeof LitElement;
+} & typeof LitElement & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
 /**
  * interstitial-screen-header for header section
  * @element c4p-interstitial-screen-header

package/lib/components/interstitial-screen/interstitial-screen.d.ts CHANGED Viewed

@@ -28,7 +28,7 @@ declare const CDSInterstitialScreen_base: {
             };
         };
     };
-} & typeof LitElement;
+} & typeof LitElement & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
 /**
  * interstitial-screen main component
  * @element c4p-interstitial-screen

package/lib/components/interstitial-screen/interstitial-screen.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interstitial-screen.d.ts","sourceRoot":"","sources":["../../../src/components/interstitial-screen/interstitial-screen.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,OAAO,EAAE,MAAM,KAAK,CAAC;AAGhD,OAAO,qDAAqD,CAAC;~~AAc7D~~,eAAO,MAAM,UAAU,6BAAmC,CAAC;AAE3D,MAAM,MAAM,uBAAuB,GAAG;IACpC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;;;;;;;;;;~~uBAhBU~~,CAAC;;;;;~~AAiBb~~;;;;;;;;;GASG;AAEH,cACM,qBAAsB,SAAQ,0BAEnC;IACC;;;OAGG;IAGH,YAAY,EAAE,OAAO,CAAS;IAC9B;;OAEG;IAEH,IAAI,EAAE,OAAO,CAAS;IAGtB,WAAW,EAAE,KAAK,CAAC;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAM;IAC9D;;OAEG;IACsB,SAAS,EAAG,WAAW,CAAC;IAEjD,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,aAAa,CAAwC;IAE7D,iBAAiB;IAIjB,oBAAoB,IAAI,IAAI;~~IAK5B~~,YAAY;IAUZ,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC;IAyB5D,OAAO,CAAC,uBAAuB,CA2B7B;IAEF;;;;OAIG;IAGH,OAAO,CAAC,mBAAmB,CASzB;IAEF,OAAO,CAAC,uBAAuB,CAE7B;IAEF,YAAY,CAAC,CAAC,KAAA;IA2Cd,gBAAgB;IAUhB,WAAW;IAkBX,MAAM;IAQN,MAAM,CAAC,MAAM,MAAU;IAEvB,MAAM,KAAK,yBAAyB,WAEnC;IACD;;;;OAIG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;OAEG;IACH,MAAM,KAAK,UAAU,WAEpB;CACF;AAED,eAAe,qBAAqB,CAAC"}
1	+ {"version":3,"file":"interstitial-screen.d.ts","sourceRoot":"","sources":["../../../src/components/interstitial-screen/interstitial-screen.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,OAAO,EAAE,MAAM,KAAK,CAAC;AAGhD,OAAO,qDAAqD,CAAC;AAiB7D,eAAO,MAAM,UAAU,6BAAmC,CAAC;AAE3D,MAAM,MAAM,uBAAuB,GAAG;IACpC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;;;;;;;;;;uBAnBU,CAAC;;;;;AAoBb;;;;;;;;;GASG;AAEH,cACM,qBAAsB,SAAQ,0BAEnC;IACC;;;OAGG;IAGH,YAAY,EAAE,OAAO,CAAS;IAC9B;;OAEG;IAEH,IAAI,EAAE,OAAO,CAAS;IAGtB,WAAW,EAAE,KAAK,CAAC;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAM;IAC9D;;OAEG;IACsB,SAAS,EAAG,WAAW,CAAC;IAEjD,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,aAAa,CAAwC;IAE7D,iBAAiB;IAIjB,oBAAoB,IAAI,IAAI;IAM5B,YAAY;IAUZ,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC;IAyB5D,OAAO,CAAC,uBAAuB,CA2B7B;IAEF;;;;OAIG;IAGH,OAAO,CAAC,mBAAmB,CASzB;IAEF,OAAO,CAAC,uBAAuB,CAE7B;IAEF,YAAY,CAAC,CAAC,KAAA;IA2Cd,gBAAgB;IAUhB,WAAW;IAkBX,MAAM;IAQN,MAAM,CAAC,MAAM,MAAU;IAEvB,MAAM,KAAK,yBAAyB,WAEnC;IACD;;;;OAIG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;OAEG;IACH,MAAM,KAAK,UAAU,WAEpB;CACF;AAED,eAAe,qBAAqB,CAAC"}

package/lib/components/page-header/context.d.ts CHANGED Viewed

@@ -12,5 +12,6 @@ export declare const pageHeaderContext: import("@lit/context").Context<{
     fullyCollapsed: boolean;
     root: null;
     titleClipped: boolean;
+    disableStickyTabBar: boolean;
 }, unknown>;
 //# sourceMappingURL=context.d.ts.map

package/lib/components/page-header/context.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/components/page-header/context.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,eAAO,MAAM,iBAAiB~~;;;;;;WAM5B~~,CAAC"}
1	+ {"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/components/page-header/context.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,eAAO,MAAM,iBAAiB;;;;;;;WAO5B,CAAC"}

package/lib/components/page-header/page-header-breadcrumb.d.ts CHANGED Viewed

@@ -30,6 +30,9 @@ declare class CDSPageHeaderBreadcrumb extends LitElement {
      */
     contentActionsFlush: boolean;
     context: any;
+    connectedCallback(): void;
+    updated(changedProperties: Map<string, any>): void;
+    private updateFixedClass;
     render(): import("lit-html").TemplateResult<1>;
     static styles: any;
 }