@carbon/ibm-products-web-components 0.36.0 → 0.37.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.
- package/custom-elements.json +227 -26
- package/es/components/action-set/action-set.d.ts +109 -0
- package/es/components/action-set/action-set.d.ts.map +1 -0
- package/es/components/action-set/action-set.js +275 -0
- package/es/components/action-set/action-set.js.map +1 -0
- package/es/components/action-set/action-set.scss.js +15 -0
- package/es/components/action-set/action-set.scss.js.map +1 -0
- package/es/components/action-set/index.d.ts +11 -0
- package/es/components/action-set/index.d.ts.map +1 -0
- package/es/components/action-set/index.js +8 -0
- package/es/components/big-number/big-number-skeleton.js +1 -1
- package/es/components/big-number/big-number.js +1 -1
- package/es/components/checklist/checklist-icon.js +1 -1
- package/es/components/checklist/checklist-item.js +1 -1
- package/es/components/checklist/checklist.js +1 -1
- package/es/components/coachmark/coachmark-tagline/coachmark-tagline.d.ts +1 -0
- package/es/components/coachmark/coachmark-tagline/coachmark-tagline.d.ts.map +1 -1
- package/es/components/coachmark/coachmark-tagline/coachmark-tagline.js +4 -1
- package/es/components/coachmark/coachmark-tagline/coachmark-tagline.js.map +1 -1
- package/es/components/coachmark/coachmark-tagline/coachmark-tagline.scss.js +1 -1
- package/es/components/coachmark/coachmark-tagline/coachmark-tagline.scss.js.map +1 -1
- package/es/components/coachmark/coachmark.d.ts +5 -1
- package/es/components/coachmark/coachmark.d.ts.map +1 -1
- package/es/components/coachmark/coachmark.js +10 -5
- package/es/components/coachmark/coachmark.js.map +1 -1
- package/es/components/guide-banner/guide-banner.js +2 -2
- package/es/components/interstitial-screen/interstitial-screen-body.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body.scss.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.d.ts +1 -0
- package/es/components/interstitial-screen/interstitial-screen-footer.d.ts.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.js +20 -19
- package/es/components/interstitial-screen/interstitial-screen-footer.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.scss.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-header.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen.scss.js +1 -1
- package/es/components/notification-panel/notification-panel.js +2 -2
- package/es/components/notification-panel/notification.js +1 -1
- package/es/components/options-tile/options-tile.js +2 -2
- package/es/components/page-header/page-header-breadcrumb.js +1 -1
- package/es/components/page-header/page-header-content.js +1 -1
- package/es/components/page-header/page-header-scroller.js +2 -2
- package/es/components/side-panel/side-panel.js +2 -2
- package/es/components/tearsheet/tearsheet.js +2 -2
- package/es/components/tearsheet-preview/tearsheet-scroller.js +2 -2
- package/es/components/truncated-text/truncated-text.js +1 -1
- package/es/components/user-avatar/user-avatar.js +1 -1
- package/es/index.d.ts +1 -0
- package/es/index.d.ts.map +1 -1
- package/es/index.js +2 -1
- package/es/package.js +1 -1
- package/es-custom/components/action-set/action-set.js +275 -0
- package/es-custom/components/action-set/action-set.js.map +1 -0
- package/es-custom/components/action-set/action-set.scss.js +15 -0
- package/es-custom/components/action-set/action-set.scss.js.map +1 -0
- package/es-custom/components/action-set/index.js +8 -0
- package/es-custom/components/big-number/big-number-skeleton.js +1 -1
- package/es-custom/components/big-number/big-number.js +1 -1
- package/es-custom/components/checklist/checklist-icon.js +1 -1
- package/es-custom/components/checklist/checklist-item.js +1 -1
- package/es-custom/components/checklist/checklist.js +1 -1
- package/es-custom/components/coachmark/coachmark-tagline/coachmark-tagline.js +4 -1
- package/es-custom/components/coachmark/coachmark-tagline/coachmark-tagline.js.map +1 -1
- package/es-custom/components/coachmark/coachmark-tagline/coachmark-tagline.scss.js +1 -1
- package/es-custom/components/coachmark/coachmark-tagline/coachmark-tagline.scss.js.map +1 -1
- package/es-custom/components/coachmark/coachmark.js +10 -5
- package/es-custom/components/coachmark/coachmark.js.map +1 -1
- package/es-custom/components/guide-banner/guide-banner.js +2 -2
- package/es-custom/components/interstitial-screen/interstitial-screen-body.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body.scss.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.js +20 -19
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.scss.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-header.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen.scss.js +1 -1
- package/es-custom/components/notification-panel/notification-panel.js +2 -2
- package/es-custom/components/notification-panel/notification.js +1 -1
- package/es-custom/components/options-tile/options-tile.js +2 -2
- package/es-custom/components/page-header/page-header-breadcrumb.js +1 -1
- package/es-custom/components/page-header/page-header-content.js +1 -1
- package/es-custom/components/page-header/page-header-scroller.js +2 -2
- package/es-custom/components/side-panel/side-panel.js +2 -2
- package/es-custom/components/tearsheet/tearsheet.js +2 -2
- package/es-custom/components/tearsheet-preview/tearsheet-scroller.js +2 -2
- package/es-custom/components/truncated-text/truncated-text.js +1 -1
- package/es-custom/components/user-avatar/user-avatar.js +1 -1
- package/es-custom/index.js +2 -1
- package/es-custom/package.js +1 -1
- package/lib/components/action-set/action-set.d.ts +109 -0
- package/lib/components/action-set/action-set.d.ts.map +1 -0
- package/lib/components/action-set/index.d.ts +11 -0
- package/lib/components/action-set/index.d.ts.map +1 -0
- package/lib/components/coachmark/coachmark-tagline/coachmark-tagline.d.ts +1 -0
- package/lib/components/coachmark/coachmark-tagline/coachmark-tagline.d.ts.map +1 -1
- package/lib/components/coachmark/coachmark.d.ts +5 -1
- package/lib/components/coachmark/coachmark.d.ts.map +1 -1
- package/lib/components/interstitial-screen/interstitial-screen-footer.d.ts +1 -0
- package/lib/components/interstitial-screen/interstitial-screen-footer.d.ts.map +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.d.ts.map +1 -1
- package/package.json +4 -4
- package/scss/components/action-set/action-set.scss +71 -0
- package/scss/components/coachmark/coachmark-tagline/coachmark-tagline.scss +18 -0
- package/scss/components/interstitial-screen/interstitial-screen-body.scss +6 -0
- package/scss/components/interstitial-screen/interstitial-screen-footer.scss +34 -6
- package/telemetry.yml +11 -0
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2020, 2026
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
import { css } from "lit";
|
|
9
|
+
|
|
10
|
+
//#region src/components/action-set/action-set.scss?lit
|
|
11
|
+
var action_set_default = css([".c4p--action-set,:host(c4p-action-set){align-items:stretch;background-color:var(--cds-layer-01,#f4f4f4);justify-content:flex-end}.c4p--action-set .c4p--action-set__action-button,:host(c4p-action-set) .c4p--action-set__action-button{align-items:center;font-size:var(--cds-body-short-01-font-size,.875rem);font-weight:var(--cds-body-short-01-font-weight,400);letter-spacing:var(--cds-body-short-01-letter-spacing,.16px);line-height:var(--cds-body-short-01-line-height,1.28572);margin:0}.c4p--action-set .c4p--action-set__action-button.c4p--action-set__action-button--expressive,:host(c4p-action-set) .c4p--action-set__action-button.c4p--action-set__action-button--expressive{block-size:4rem;padding-block:1rem 2rem}.c4p--action-set.cds--btn-set .c4p--action-set__action-button.cds--btn,.c4p--action-set.cds--btn-set .c4p--action-set__action-button.cds--btn.cds--btn--expressive{max-inline-size:none}.c4p--action-set:not(.c4p--action-set--stacking) .c4p--action-set__action-button--ghost,:not(.c4p--action-set--stacking):host(c4p-action-set) .c4p--action-set__action-button--ghost{padding-inline-start:1rem}.c4p--action-set.c4p--action-set--row-single .c4p--action-set__action-button--ghost,.c4p--action-set.c4p--action-set--row-single.c4p--action-set--md .c4p--action-set__action-button{flex:0 0 100%}.c4p--action-set.c4p--action-set--row-double .c4p--action-set__action-button--ghost{flex:1 1 75%}.c4p--action-set.c4p--action-set--row-double.c4p--action-set--lg .c4p--action-set__action-button,.c4p--action-set.c4p--action-set--row-double.c4p--action-set--md .c4p--action-set__action-button,.c4p--action-set.c4p--action-set--row-single.c4p--action-set--lg .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),.c4p--action-set.c4p--action-set--row-triple .c4p--action-set__action-button--ghost{flex:0 1 50%}.c4p--action-set.c4p--action-set--row-triple .c4p--action-set__action-button--ghost{flex:1 1 50%}.c4p--action-set.cds--btn-set.c4p--action-set--2xl .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),.c4p--action-set.cds--btn-set.c4p--action-set--row-quadruple .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),.c4p--action-set.cds--btn-set.c4p--action-set--row-triple.c4p--action-set--lg .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),.c4p--action-set.cds--btn-set.c4p--action-set--xl .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost){flex:0 1 25%;max-inline-size:14.5rem}.c4p--action-set.cds--btn-set.c4p--action-set--row-quadruple .c4p--action-set__action-button--ghost{flex:1 1 25%}.c4p--action-set .c4p--action-set__action-button .cds--inline-loading,:host(c4p-action-set) .c4p--action-set__action-button .cds--inline-loading{inline-size:2rem;inset-block-start:0;inset-inline-end:0;position:absolute}.cds--layout--size-xs{--cds-layout-size-height-context:var(--cds-layout-size-height-xs,1.5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-xs{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-xs,1.5rem))}.cds--layout-constraint--size__min-xs{--cds-layout-size-height-min:var(--cds-layout-size-height-xs,1.5rem)}.cds--layout-constraint--size__max-xs{--cds-layout-size-height-max:var(--cds-layout-size-height-xs,1.5rem)}.cds--layout--size-sm{--cds-layout-size-height-context:var(--cds-layout-size-height-sm,2rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-sm{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-sm,2rem))}.cds--layout-constraint--size__min-sm{--cds-layout-size-height-min:var(--cds-layout-size-height-sm,2rem)}.cds--layout-constraint--size__max-sm{--cds-layout-size-height-max:var(--cds-layout-size-height-sm,2rem)}.cds--layout--size-md{--cds-layout-size-height-context:var(--cds-layout-size-height-md,2.5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-md{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-md,2.5rem))}.cds--layout-constraint--size__min-md{--cds-layout-size-height-min:var(--cds-layout-size-height-md,2.5rem)}.cds--layout-constraint--size__max-md{--cds-layout-size-height-max:var(--cds-layout-size-height-md,2.5rem)}.cds--layout--size-lg{--cds-layout-size-height-context:var(--cds-layout-size-height-lg,3rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-lg{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-lg,3rem))}.cds--layout-constraint--size__min-lg{--cds-layout-size-height-min:var(--cds-layout-size-height-lg,3rem)}.cds--layout-constraint--size__max-lg{--cds-layout-size-height-max:var(--cds-layout-size-height-lg,3rem)}.cds--layout--size-xl{--cds-layout-size-height-context:var(--cds-layout-size-height-xl,4rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-xl{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-xl,4rem))}.cds--layout-constraint--size__min-xl{--cds-layout-size-height-min:var(--cds-layout-size-height-xl,4rem)}.cds--layout-constraint--size__max-xl{--cds-layout-size-height-max:var(--cds-layout-size-height-xl,4rem)}.cds--layout--size-2xl{--cds-layout-size-height-context:var(--cds-layout-size-height-2xl,5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-2xl{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-2xl,5rem))}.cds--layout-constraint--size__min-2xl{--cds-layout-size-height-min:var(--cds-layout-size-height-2xl,5rem)}.cds--layout-constraint--size__max-2xl{--cds-layout-size-height-max:var(--cds-layout-size-height-2xl,5rem)}.cds--layout--density-condensed{--cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-condensed,0.5rem);--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context)}.cds--layout-constraint--density__default-condensed{--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context,var(--cds-layout-density-padding-inline-condensed,0.5rem))}.cds--layout-constraint--density__min-condensed{--cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-condensed,0.5rem)}.cds--layout-constraint--density__max-condensed{--cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-condensed,0.5rem)}.cds--layout--density-normal{--cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-normal,1rem);--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context)}.cds--layout-constraint--density__default-normal{--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context,var(--cds-layout-density-padding-inline-normal,1rem))}.cds--layout-constraint--density__min-normal{--cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-normal,1rem)}.cds--layout-constraint--density__max-normal{--cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-normal,1rem)}:root{--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px}.cds--layer-one,:root{--cds-layer:var(--cds-layer-01,#f4f4f4);--cds-layer-active:var(--cds-layer-active-01,#c6c6c6);--cds-layer-background:var(--cds-layer-background-01,#fff);--cds-layer-hover:var(--cds-layer-hover-01,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-01,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-01,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-01,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-01,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-01,#a8a8a8);--cds-field:var(--cds-field-01,#f4f4f4);--cds-field-hover:var(--cds-field-hover-01,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-00,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-01,#c6c6c6);--cds-border-strong:var(--cds-border-strong-01,#8d8d8d);--cds-border-tile:var(--cds-border-tile-01,#c6c6c6)}.cds--layer-two{--cds-layer:var(--cds-layer-02,#fff);--cds-layer-active:var(--cds-layer-active-02,#c6c6c6);--cds-layer-background:var(--cds-layer-background-02,#f4f4f4);--cds-layer-hover:var(--cds-layer-hover-02,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-02,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-02,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-02,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-02,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-02,#a8a8a8);--cds-field:var(--cds-field-02,#fff);--cds-field-hover:var(--cds-field-hover-02,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-01,#c6c6c6);--cds-border-subtle-selected:var(--cds-border-subtle-selected-02,#c6c6c6);--cds-border-strong:var(--cds-border-strong-02,#8d8d8d);--cds-border-tile:var(--cds-border-tile-02,#a8a8a8)}.cds--layer-three{--cds-layer:var(--cds-layer-03,#f4f4f4);--cds-layer-active:var(--cds-layer-active-03,#c6c6c6);--cds-layer-background:var(--cds-layer-background-03,#fff);--cds-layer-hover:var(--cds-layer-hover-03,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-03,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-03,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-03,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-03,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-03,#a8a8a8);--cds-field:var(--cds-field-03,#f4f4f4);--cds-field-hover:var(--cds-field-hover-03,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-02,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-03,#c6c6c6);--cds-border-strong:var(--cds-border-strong-03,#8d8d8d);--cds-border-tile:var(--cds-border-tile-03,#c6c6c6)}.cds--layer-one.cds--layer__with-background,.cds--layer-three.cds--layer__with-background,.cds--layer-two.cds--layer__with-background{background-color:var(--cds-layer-background)}@keyframes cds--hide-feedback{0%{opacity:1;visibility:inherit}to{opacity:0;visibility:hidden}}@keyframes cds--show-feedback{0%{opacity:0;visibility:hidden}to{opacity:1;visibility:inherit}}@keyframes cds--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--assistive-text,.cds--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}.cds--popover-container{display:inline-block}.cds--popover-container:not(.cds--popover--auto-align){position:relative}.cds--popover--high-contrast .cds--popover{--cds-popover-background-color:var(--cds-background-inverse,#393939);--cds-popover-text-color:var(--cds-text-inverse,#fff)}.cds--popover--drop-shadow .cds--popover{filter:var(--cds-popover-drop-shadow,drop-shadow(0 .125rem .125rem rgba(0,0,0,.2)))}.cds--popover--border>.cds--popover>.cds--popover-content{outline:1px solid var(--cds-popover-border-color,var(--cds-border-subtle));outline-offset:-1px}.cds--popover--caret{--cds-popover-offset:0.625rem}.cds--popover{inset:0;pointer-events:none;position:absolute;z-index:6000}.cds--popover-content{--cds-layout-size-height-sm:2rem}.cds--layout--size-sm :where(.cds--popover-content),.cds--popover-content.cds--layout--size-sm{--cds-layout-size-height:var(--cds-layout-size-height-sm)}.cds--popover-content{--cds-layout-size-height-md:2.5rem}.cds--layout--size-md :where(.cds--popover-content),.cds--popover-content.cds--layout--size-md{--cds-layout-size-height:var(--cds-layout-size-height-md)}.cds--popover-content{--cds-layout-size-height-lg:3rem}.cds--layout--size-lg :where(.cds--popover-content),.cds--popover-content.cds--layout--size-lg{--cds-layout-size-height:var(--cds-layout-size-height-lg)}.cds--popover-content{border:0;box-sizing:border-box;font-family:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}.cds--popover-content *,.cds--popover-content :after,.cds--popover-content :before{box-sizing:inherit}.cds--popover-content{background-color:var(--cds-popover-background-color,var(--cds-layer));border-radius:var(--cds-popover-border-radius,2px);color:var(--cds-popover-text-color,var(--cds-text-primary,#161616));display:none;inline-size:-moz-max-content;inline-size:max-content;max-inline-size:23rem;pointer-events:auto;position:absolute;z-index:6000}.cds--popover--open>.cds--popover>.cds--popover-content{display:block}.cds--popover--background-token__background>.cds--popover>.cds--popover-content{background-color:var(--cds-background,#fff)}.cds--popover-content:before{content:\"\";display:none;position:absolute}.cds--popover--open>.cds--popover>.cds--popover-content:before{display:block}.cds--popover--auto-align.cds--popover-caret,.cds--popover-caret{display:none;position:absolute;will-change:transform;z-index:6000}.cds--popover--auto-align.cds--popover-caret:after,.cds--popover-caret:after{background-color:var(--cds-popover-background-color,var(--cds-layer));content:\"\";display:block;position:absolute}.cds--popover--auto-align.cds--popover-caret:before,.cds--popover-caret:before{background-color:var(--cds-popover-border-color,var(--cds-border-subtle));content:\"\";display:none;position:absolute}.cds--popover--background-token__background>.cds--popover>.cds--popover-caret:after{background-color:var(--cds-background,#fff)}.cds--popover--auto-align.cds--popover--caret.cds--popover--open>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--border .cds--popover--auto-align.cds--popover-caret:before,.cds--popover--border .cds--popover-caret:before,.cds--popover--caret.cds--popover--open>.cds--popover>.cds--popover-caret{display:block}.cds--popover--tab-tip>.cds--popover>.cds--popover-caret{display:none}.cds--popover--bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-end:0;inset-inline-start:50%;transform:translate(-50%,calc(100% + var(--cds-popover-offset, 0rem)))}.cds--popover--bottom-end:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--bottom-start:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--bottom:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content{inset-block-end:-.25rem}.cds--popover--top-end:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--top-start:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--top:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content{inset-block-start:-.25rem}.cds--popover--bottom-start:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--top-start:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content{inset-inline-start:calc(50% - var(--cds-popover-offset, 0rem) - 1rem)}.cds--popover--bottom-end:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--top-end:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content{inset-inline-end:calc(50% - var(--cds-popover-offset, 0rem) - 1rem)}.cds--popover--right-end:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--right-start:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--right:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content{inset-inline-start:calc(100% + .25rem)}.cds--popover--left-end:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--left-start:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content,.cds--popover--left:not(.cds--popover--caret):not(.cds--popover--auto-align):not(.cds--popover--tab-tip)>.cds--popover>.cds--popover-content{inset-inline-end:calc(100% + .25rem)}[dir=rtl] .cds--popover--bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{transform:translate(50%,calc(100% + var(--cds-popover-offset, 0rem)))}.cds--popover--bottom-left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--bottom-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-end:0;inset-inline-start:calc(50% - var(--cds-popover-offset, 0rem));transform:translate(calc(var(--cds-popover-offset, 0rem)*-1),calc(100% + var(--cds-popover-offset, 0rem)))}[dir=rtl] .cds--popover--bottom-left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--bottom-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-end:calc(50% - var(--cds-popover-offset, 0rem));inset-inline-start:auto}.cds--popover--bottom-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--bottom-right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-end:0;inset-inline-end:calc(50% - var(--cds-popover-offset, 0rem));transform:translate(var(--cds-popover-offset,0),calc(100% + var(--cds-popover-offset, 0rem)))}[dir=rtl] .cds--popover--bottom-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--bottom-right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-start:calc(50% - var(--cds-popover-offset, 0rem))}.cds--popover--bottom-end>.cds--popover>.cds--popover-content:before,.cds--popover--bottom-left>.cds--popover>.cds--popover-content:before,.cds--popover--bottom-right>.cds--popover>.cds--popover-content:before,.cds--popover--bottom-start>.cds--popover>.cds--popover-content:before,.cds--popover--bottom>.cds--popover>.cds--popover-content:before{block-size:var(--cds-popover-offset,0);inset-block-start:0;inset-inline:0;transform:translateY(-100%)}.cds--popover--bottom-end>.cds--popover>.cds--popover-caret,.cds--popover--bottom-left>.cds--popover>.cds--popover-caret,.cds--popover--bottom-right>.cds--popover>.cds--popover-caret,.cds--popover--bottom-start>.cds--popover>.cds--popover-caret,.cds--popover--bottom>.cds--popover>.cds--popover-caret{block-size:var(--cds-popover-caret-height,.375rem);inline-size:var(--cds-popover-caret-width,.75rem);inset-block-end:0;inset-inline-start:50%;transform:translate(-50%,var(--cds-popover-offset,0))}.cds--popover--border.cds--popover--bottom-end>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom-left>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom-right>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom-start>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom>.cds--popover>.cds--popover-caret:before,.cds--popover--bottom-end>.cds--popover>.cds--popover-caret:after,.cds--popover--bottom-left>.cds--popover>.cds--popover-caret:after,.cds--popover--bottom-right>.cds--popover>.cds--popover-caret:after,.cds--popover--bottom-start>.cds--popover>.cds--popover-caret:after,.cds--popover--bottom>.cds--popover>.cds--popover-caret:after{block-size:var(--cds-popover-caret-height,.375rem);clip-path:polygon(0 100%,50% 0,100% 100%);inline-size:var(--cds-popover-caret-width,.75rem)}.cds--popover--border.cds--popover--bottom-end>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom-left>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom-right>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom-start>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom>.cds--popover>.cds--popover-caret:after{inline-size:calc(var(--cds-popover-caret-width, .75rem) - 1px);inset-block-start:1px;inset-inline-start:.5px}[dir=rtl] .cds--popover--bottom-end>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--bottom-left>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--bottom-right>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--bottom-start>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--bottom>.cds--popover>.cds--popover-caret{transform:translate(50%,var(--cds-popover-offset,0))}.cds--popover--bottom-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--bottom-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--bottom-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--bottom-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret{block-size:var(--cds-popover-caret-height,.375rem);inline-size:var(--cds-popover-caret-width,.75rem)}.cds--popover--border.cds--popover--bottom-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--bottom-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--bottom-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--bottom-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--bottom-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{block-size:var(--cds-popover-caret-height,.375rem);clip-path:polygon(0 100%,50% 0,100% 100%);inline-size:var(--cds-popover-caret-width,.75rem)}.cds--popover--border.cds--popover--bottom-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{inline-size:calc(var(--cds-popover-caret-width, .75rem) - 1px);inset-block-start:1px;inset-inline-start:.5px}.cds--popover--top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-start:0;inset-inline-start:50%;transform:translate(-50%,calc(-100% - var(--cds-popover-offset, 0rem)))}[dir=rtl] .cds--popover--top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{transform:translate(50%,calc(-100% - var(--cds-popover-offset, 0rem)))}.cds--popover--top-left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--top-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-start:0;inset-inline-start:calc(50% - var(--cds-popover-offset, 0rem));transform:translate(calc(var(--cds-popover-offset, 0rem)*-1),calc(-100% - var(--cds-popover-offset, 0rem)))}[dir=rtl] .cds--popover--top-left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--top-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-end:calc(50% - var(--cds-popover-offset, 0rem));inset-inline-start:auto}.cds--popover--top-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--top-right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-start:0;inset-inline-end:calc(50% - var(--cds-popover-offset, 0rem));transform:translate(var(--cds-popover-offset,0),calc(-100% - var(--cds-popover-offset, 0rem)))}[dir=rtl] .cds--popover--top-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--top-right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-start:calc(50% - var(--cds-popover-offset, 0rem))}.cds--popover--top-end>.cds--popover>.cds--popover-content:before,.cds--popover--top-left>.cds--popover>.cds--popover-content:before,.cds--popover--top-right>.cds--popover>.cds--popover-content:before,.cds--popover--top-start>.cds--popover>.cds--popover-content:before,.cds--popover--top>.cds--popover>.cds--popover-content:before{block-size:var(--cds-popover-offset,0);inset-block-end:0;inset-inline:0;transform:translateY(100%)}.cds--popover--top-end>.cds--popover>.cds--popover-caret,.cds--popover--top-left>.cds--popover>.cds--popover-caret,.cds--popover--top-right>.cds--popover>.cds--popover-caret,.cds--popover--top-start>.cds--popover>.cds--popover-caret,.cds--popover--top>.cds--popover>.cds--popover-caret{block-size:var(--cds-popover-caret-height,.375rem);inline-size:var(--cds-popover-caret-width,.75rem);inset-block-start:0;inset-inline-start:50%;transform:translate(-50%,calc(var(--cds-popover-offset, 0rem)*-1))}.cds--popover--border.cds--popover--top-end>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--top-left>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--top-right>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--top-start>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--top>.cds--popover>.cds--popover-caret:before,.cds--popover--top-end>.cds--popover>.cds--popover-caret:after,.cds--popover--top-left>.cds--popover>.cds--popover-caret:after,.cds--popover--top-right>.cds--popover>.cds--popover-caret:after,.cds--popover--top-start>.cds--popover>.cds--popover-caret:after,.cds--popover--top>.cds--popover>.cds--popover-caret:after{block-size:var(--cds-popover-caret-height,.375rem);clip-path:polygon(0 0,50% 100%,100% 0);inline-size:var(--cds-popover-caret-width,.75rem)}.cds--popover--border.cds--popover--top-end>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--top-left>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--top-right>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--top-start>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--top>.cds--popover>.cds--popover-caret:after{inline-size:calc(var(--cds-popover-caret-width, .75rem) - 1px);inset-block-start:-1px;inset-inline-start:.5px}[dir=rtl] .cds--popover--top-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--top-left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--top-right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--top-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret{transform:translate(50%,calc(var(--cds-popover-offset, 0rem)*-1))}.cds--popover--top-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--top-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--top-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--top-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret{block-size:var(--cds-popover-caret-height,.375rem);inline-size:var(--cds-popover-caret-width,.75rem)}.cds--popover--border.cds--popover--top-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--top-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--top-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--top-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--top-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--top-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--top-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--top-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{block-size:var(--cds-popover-caret-height,.375rem);clip-path:polygon(0 0,50% 100%,100% 0);inline-size:var(--cds-popover-caret-width,.75rem)}.cds--popover--border.cds--popover--top-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--top-left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--top-right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--top-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{inline-size:calc(var(--cds-popover-caret-width, .75rem) - 1px);inset-block-start:-1px;inset-inline-start:.5px}.cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-start:50%;inset-inline-start:100%;transform:translate(var(--cds-popover-offset,0),-50%)}.cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-start:50%;inset-inline-start:100%;transform:translate(var(--cds-popover-offset,0),calc(var(--cds-popover-offset, 0rem)*.5*-1 - 16px))}.cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-end:50%;inset-inline-start:100%;transform:translate(var(--cds-popover-offset,0),calc(var(--cds-popover-offset, 0rem)*.5 + 16px))}[dir=rtl] .cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-end:100%;inset-inline-start:auto}.cds--popover--right-bottom>.cds--popover>.cds--popover-content:before,.cds--popover--right-end>.cds--popover>.cds--popover-content:before,.cds--popover--right-start>.cds--popover>.cds--popover-content:before,.cds--popover--right-top>.cds--popover>.cds--popover-content:before,.cds--popover--right>.cds--popover>.cds--popover-content:before{inline-size:var(--cds-popover-offset,0);inset-block:0;inset-inline-start:0;transform:translateX(-100%)}.cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret{block-size:var(--cds-popover-caret-width,.75rem);inline-size:var(--cds-popover-caret-height,.375rem);inset-block-start:50%;inset-inline-start:100%;transform:translate(calc(var(--cds-popover-offset, 0rem) - 100%),-50%)}.cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after{block-size:var(--cds-popover-caret-width,.75rem);clip-path:polygon(0 50%,100% 0,100% 100%);inline-size:var(--cds-popover-caret-height,.375rem)}[dir=rtl] .cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret{inset-inline-end:100%;inset-inline-start:auto}.cds--popover--border.cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before{block-size:var(--cds-popover-caret-width,.75rem);clip-path:polygon(0 50%,100% 0,100% 100%);inline-size:var(--cds-popover-caret-height,.375rem)}.cds--popover--border.cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after{inset-inline-start:1px}[dir=rtl] .cds--popover--border.cds--popover--right-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after{inset-inline-start:-1px}.cds--popover--right-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--right-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--right-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--right-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret{block-size:var(--cds-popover-caret-width,.75rem);inline-size:var(--cds-popover-caret-height,.375rem)}.cds--popover--border.cds--popover--right-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--right-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--right-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--right-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--right-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--right-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--right-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--right-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{block-size:var(--cds-popover-caret-width,.75rem);clip-path:polygon(0 50%,100% 0,100% 100%);inline-size:var(--cds-popover-caret-height,.375rem)}.cds--popover--border.cds--popover--right-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--right-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--right-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--right-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{inset-inline-start:1px}[dir=rtl] .cds--popover--border.cds--popover--right-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--right-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--right-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--right-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before{margin-inline-start:1px}[dir=rtl] .cds--popover--border.cds--popover--right-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--right.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{inset-inline-start:0}.cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-start:50%;inset-inline-end:100%;transform:translate(calc(var(--cds-popover-offset, 0rem)*-1 + .1px),-50%)}.cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-start:50%;inset-inline-end:100%;transform:translate(calc(var(--cds-popover-offset, 0rem)*-1),calc(var(--cds-popover-offset, 0rem)*-.5 - 16px))}.cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-block-end:50%;inset-inline-end:100%;transform:translate(calc(var(--cds-popover-offset, 0rem)*-1),calc(var(--cds-popover-offset, 0rem)*.5 + 16px))}[dir=rtl] .cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-end:auto;inset-inline-start:100%}.cds--popover--left-bottom>.cds--popover>.cds--popover-content:before,.cds--popover--left-end>.cds--popover>.cds--popover-content:before,.cds--popover--left-start>.cds--popover>.cds--popover-content:before,.cds--popover--left-top>.cds--popover>.cds--popover-content:before,.cds--popover--left>.cds--popover>.cds--popover-content:before{inline-size:var(--cds-popover-offset,0);inset-block:0;inset-inline-end:0;transform:translateX(100%)}.cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,.cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret{block-size:var(--cds-popover-caret-width,.75rem);inline-size:var(--cds-popover-caret-height,.375rem);inset-block-start:50%;inset-inline-end:100%;transform:translate(calc(var(--cds-popover-offset, 0rem)*-1 + 100%),-50%)}.cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after{block-size:var(--cds-popover-caret-width,.75rem);clip-path:polygon(0 0,100% 50%,0 100%);inline-size:var(--cds-popover-caret-height,.375rem)}[dir=rtl] .cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret,[dir=rtl] .cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret{inset-inline-end:auto;inset-inline-start:100%}.cds--popover--border.cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before,.cds--popover--border.cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:before{block-size:var(--cds-popover-caret-width,.75rem);clip-path:polygon(0 0,100% 50%,0 100%);inline-size:var(--cds-popover-caret-height,.375rem)}.cds--popover--border.cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,.cds--popover--border.cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after{inset-inline-start:-1px}[dir=rtl] .cds--popover--border.cds--popover--left-bottom:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left-top:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-caret:after{inset-inline-start:1px}.cds--popover--left-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--left-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--left-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--left-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret,.cds--popover--left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret{block-size:var(--cds-popover-caret-width,.75rem);inline-size:var(--cds-popover-caret-height,.375rem)}.cds--popover--border.cds--popover--left-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--left-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--left-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--left-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--border.cds--popover--left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,.cds--popover--left-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--left-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--left-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--left-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{block-size:var(--cds-popover-caret-width,.75rem);clip-path:polygon(0 0,100% 50%,0 100%);inline-size:var(--cds-popover-caret-height,.375rem)}.cds--popover--border.cds--popover--left-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--left-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--left-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--left-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,.cds--popover--border.cds--popover--left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{inset-inline-start:-1px}[dir=rtl] .cds--popover--border.cds--popover--left-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--left-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--left-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--left-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before,[dir=rtl] .cds--popover--border.cds--popover--left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:before{margin-inline-start:-1px}[dir=rtl] .cds--popover--border.cds--popover--left-bottom.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left-end.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left-start.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left-top.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after,[dir=rtl] .cds--popover--border.cds--popover--left.cds--popover--auto-align>.cds--popover>.cds--popover-content>.cds--popover-caret:after{inset-inline-start:0}.cds--popover--tab-tip>.cds--popover>.cds--popover-content{border-radius:0}.cds--popover--tab-tip.cds--popover--bottom-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--tab-tip.cds--popover--top-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--tab-tip.cds--popover--bottom-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--tab-tip.cds--popover--top-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-start:0}.cds--popover--tab-tip.cds--popover--bottom-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,.cds--popover--tab-tip.cds--popover--top-end:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--tab-tip.cds--popover--bottom-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content,[dir=rtl] .cds--popover--tab-tip.cds--popover--top-start:not(.cds--popover--auto-align)>.cds--popover>.cds--popover-content{inset-inline-end:0;inset-inline-start:auto}.cds--popover--tab-tip .cds--popover{will-change:filter}.cds--popover--tab-tip__button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;box-sizing:border-box;cursor:pointer;display:inline-block;font-family:inherit;font-size:100%;inline-size:100%;margin:0;padding:0;text-align:start;vertical-align:baseline}.cds--popover--tab-tip__button *,.cds--popover--tab-tip__button :after,.cds--popover--tab-tip__button :before{box-sizing:inherit}.cds--popover--tab-tip__button::-moz-focus-inner{border:0}.cds--popover--tab-tip__button{align-items:center;block-size:2rem;display:inline-flex;inline-size:2rem;justify-content:center;position:relative}.cds--popover--tab-tip__button:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--popover--tab-tip__button:focus{outline-style:dotted}}.cds--popover--tab-tip__button:hover{background-color:var(--cds-layer-hover)}.cds--popover--tab-tip.cds--popover--open .cds--popover--tab-tip__button{background:var(--cds-layer);box-shadow:0 2px 2px rgba(0,0,0,.2)}.cds--popover--tab-tip.cds--popover--open .cds--popover--tab-tip__button:not(:focus):after{background:var(--cds-layer);block-size:2px;content:\"\";inline-size:100%;inset-block-end:0;position:absolute;z-index:6001}.cds--popover--tab-tip__button svg{fill:var(--cds-icon-primary,#161616)}.cds--tooltip{--cds-popover-offset:12px}.cds--tooltip-content{font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857);max-inline-size:18rem;overflow-wrap:break-word;padding:var(--cds-tooltip-padding-block,1rem) var(--cds-tooltip-padding-inline,1rem)}.cds--icon-tooltip{--cds-tooltip-padding-block:0.125rem;--cds-popover-caret-width:0.5rem;--cds-popover-caret-height:0.25rem;--cds-popover-offset:0.5rem}.cds--icon-tooltip .cds--tooltip-content{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.cds--definition-term{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;box-sizing:border-box;cursor:pointer;display:inline-block;font-family:inherit;font-size:100%;inline-size:100%;margin:0;padding:0;text-align:start;vertical-align:baseline}.cds--definition-term *,.cds--definition-term :after,.cds--definition-term :before{box-sizing:inherit}.cds--definition-term::-moz-focus-inner{border:0}.cds--definition-term{border-block-end:1px dotted var(--cds-border-strong);border-radius:0;color:var(--cds-text-primary,#161616)}.cds--definition-term:focus{outline:1px solid var(--cds-focus,#0f62fe)}@media screen and (prefers-contrast){.cds--definition-term:focus{outline-style:dotted}}.cds--definition-term:focus,.cds--definition-term:hover{border-block-end-color:var(--cds-border-interactive,#0f62fe)}.cds--definition-tooltip{font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857);max-inline-size:11rem;padding:.5rem 1rem;text-wrap:auto;word-break:break-word}.cds--btn{--cds-layout-size-height-local:clamp(max(var(--cds-layout-size-height-min),var(--cds-layout-size-height-xs)),var(--cds-layout-size-height,var(--cds-layout-size-height-lg)),min(var(--cds-layout-size-height-max),var(--cds-layout-size-height-2xl)));--cds-layout-density-padding-inline-local:clamp(var(--cds-layout-density-padding-inline-min),var(--cds-layout-density-padding-inline,var(--cds-layout-density-padding-inline-normal)),var(--cds-layout-density-padding-inline-max));--temp-1lh:(var(--cds-body-compact-01-line-height,1.28572) * 1em);--temp-expressive-1lh:(var(--cds-body-compact-02-line-height,1.375) * 1em);--temp-padding-block-max:calc((var(--cds-layout-size-height-lg) - var(--temp-1lh))/2 - 0.0625rem);border:0;box-sizing:border-box;font-family:inherit;font-size:100%;padding:0;vertical-align:baseline}.cds--btn *,.cds--btn :after,.cds--btn :before{box-sizing:inherit}.cds--btn{border-radius:0;cursor:pointer;display:inline-flex;flex-shrink:0;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);inline-size:-moz-max-content;inline-size:max-content;justify-content:space-between;letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);margin:0;max-inline-size:20rem;min-block-size:var(--cds-layout-size-height-local);outline:none;padding-block:min((var(--cds-layout-size-height-local) - var(--temp-1lh))/2 - .0625rem,var(--temp-padding-block-max));padding-inline:calc(var(--cds-layout-density-padding-inline-local) - .0625rem) calc(var(--cds-layout-density-padding-inline-local)*3 + .9375rem);position:relative;text-align:start;text-decoration:none;transition:background 70ms cubic-bezier(0,0,.38,.9),box-shadow 70ms cubic-bezier(0,0,.38,.9),border-color 70ms cubic-bezier(0,0,.38,.9),outline 70ms cubic-bezier(0,0,.38,.9);vertical-align:top}.cds--btn.cds--btn--disabled,.cds--btn.cds--btn--disabled:focus,.cds--btn.cds--btn--disabled:hover,.cds--btn:disabled,.cds--btn:focus:disabled,.cds--btn:hover:disabled{background:var(--cds-button-disabled,#c6c6c6);border-color:var(--cds-button-disabled,#c6c6c6);box-shadow:none;color:var(--cds-text-on-color-disabled,#8d8d8d);cursor:not-allowed}.cds--btn .cds--btn__icon,:host(cds-button) .cds--btn ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn ::slotted([slot=icon]){block-size:1rem;flex-shrink:0;inline-size:1rem;inset-block-start:min((var(--cds-layout-size-height-local) - 1rem)/2 - .0625rem,var(--temp-padding-block-max));inset-inline-end:var(--cds-layout-density-padding-inline-local);margin-block-start:.0625rem;position:absolute}.cds--btn::-moz-focus-inner{border:0;padding:0}.cds--btn--primary{background-color:var(--cds-button-primary,#0f62fe);border:1px solid transparent;color:var(--cds-text-on-color,#fff)}.cds--btn--primary:hover{background-color:var(--cds-button-primary-hover,#0050e6)}.cds--btn--primary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--primary:active{background-color:var(--cds-button-primary-active,#002d9c)}.cds--btn--primary .cds--btn__icon,.cds--btn--primary .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--primary ::slotted([slot=icon]),:host(cds-button) .cds--btn--primary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--primary ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--primary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--primary:hover,.cds--btn--secondary{color:var(--cds-text-on-color,#fff)}.cds--btn--secondary{background-color:var(--cds-button-secondary,#393939);border:1px solid transparent}.cds--btn--secondary:hover{background-color:var(--cds-button-secondary-hover,#474747)}.cds--btn--secondary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--secondary:active{background-color:var(--cds-button-secondary-active,#6f6f6f)}.cds--btn--secondary .cds--btn__icon,.cds--btn--secondary .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--secondary ::slotted([slot=icon]),:host(cds-button) .cds--btn--secondary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--secondary ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--secondary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--secondary:focus,.cds--btn--secondary:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--tertiary{background-color:transparent;border-color:var(--cds-button-tertiary,#0f62fe);border-style:solid;border-width:1px;color:var(--cds-button-tertiary,#0f62fe)}.cds--btn--tertiary:hover{background-color:var(--cds-button-tertiary-hover,#0050e6)}.cds--btn--tertiary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--tertiary .cds--btn__icon,.cds--btn--tertiary .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--tertiary ::slotted([slot=icon]),:host(cds-button) .cds--btn--tertiary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--tertiary ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--tertiary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--tertiary:focus,.cds--btn--tertiary:hover{color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary:focus{background-color:var(--cds-button-tertiary,#0f62fe)}.cds--btn--tertiary:active{background-color:var(--cds-button-tertiary-active,#002d9c);border-color:transparent;color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary.cds--btn--disabled,.cds--btn--tertiary.cds--btn--disabled:focus,.cds--btn--tertiary.cds--btn--disabled:hover,.cds--btn--tertiary:disabled,.cds--btn--tertiary:focus:disabled,.cds--btn--tertiary:hover:disabled{background:transparent;color:var(--cds-text-disabled,hsla(0,0%,9%,.25));outline:none}.cds--btn--ghost{background-color:transparent;border:1px solid transparent;color:var(--cds-link-primary,#0f62fe)}.cds--btn--ghost:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.cds--btn--ghost:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--ghost .cds--btn__icon,.cds--btn--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--ghost ::slotted([slot=icon]),:host(cds-button) .cds--btn--ghost ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--ghost ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--ghost ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--ghost{padding-inline-end:calc(var(--cds-layout-density-padding-inline-local) - .0625rem)}.cds--btn--ghost .cds--btn__icon,:host(cds-button) .cds--btn--ghost ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--ghost ::slotted([slot=icon]){align-self:center;margin-inline-start:.5rem;position:static}.cds--btn--ghost:active,.cds--btn--ghost:hover{color:var(--cds-link-primary-hover,#0043ce)}.cds--btn--ghost:active{background-color:var(--cds-background-active,hsla(0,0%,55%,.5))}.cds--btn--ghost.cds--btn--disabled,.cds--btn--ghost.cds--btn--disabled:focus,.cds--btn--ghost.cds--btn--disabled:hover,.cds--btn--ghost:disabled,.cds--btn--ghost:focus:disabled,.cds--btn--ghost:hover:disabled{background:transparent;border-color:transparent;color:var(--cds-text-disabled,hsla(0,0%,9%,.25));outline:none}.cds--btn--ghost:not([disabled]) svg{fill:var(--cds-icon-primary,#161616)}.cds--btn--icon-only{align-items:center;block-size:var(--cds-layout-size-height-local);inline-size:var(--cds-layout-size-height-local);justify-content:center;padding:0;padding-block-start:0}.cds--btn--icon-only>:first-child{min-inline-size:1rem}.cds--btn--icon-only .cds--btn__icon,:host(cds-button) .cds--btn--icon-only ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--icon-only ::slotted([slot=icon]){position:static}.cds--btn--icon-only.cds--btn--ghost:focus{background-color:var(--cds-background-active,hsla(0,0%,55%,.5));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe))}.cds--btn--icon-only.cds--btn--danger--ghost .cds--btn__icon,.cds--btn--icon-only.cds--btn--ghost .cds--btn__icon,:host(cds-button) .cds--btn--icon-only.cds--btn--danger--ghost ::slotted([slot=icon]),:host(cds-button) .cds--btn--icon-only.cds--btn--ghost ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--icon-only.cds--btn--danger--ghost ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--icon-only.cds--btn--ghost ::slotted([slot=icon]){margin:0}.cds--btn--icon-only.cds--btn--danger--ghost{padding-inline-end:calc(var(--cds-layout-density-padding-inline-local) - 1rem)}.cds--btn--xs:not(.cds--btn--icon-only){padding-block-start:1.5px}.cds--btn--md:not(.cds--btn--icon-only) .cds--btn__icon,.cds--btn--sm:not(.cds--btn--icon-only) .cds--btn__icon,.cds--btn--xs:not(.cds--btn--icon-only) .cds--btn__icon,:host(cds-button) .cds--btn--md:not(.cds--btn--icon-only) ::slotted([slot=icon]),:host(cds-button) .cds--btn--sm:not(.cds--btn--icon-only) ::slotted([slot=icon]),:host(cds-button) .cds--btn--xs:not(.cds--btn--icon-only) ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--md:not(.cds--btn--icon-only) ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--sm:not(.cds--btn--icon-only) ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--xs:not(.cds--btn--icon-only) ::slotted([slot=icon]){margin-block-start:0}.cds--btn--icon-only.cds--btn--selected{background:var(--cds-background-selected,hsla(0,0%,55%,.2))}.cds--btn path[data-icon-path=inner-path]{fill:none}.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--ghost.cds--btn--icon-only ::slotted([slot=icon]),:host(cds-button) .cds--btn--ghost.cds--btn--icon-only ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--ghost.cds--btn--icon-only ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--ghost.cds--btn--icon-only ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:var(--cds-icon-primary,#161616)}.cds--btn--ghost.cds--btn--icon-only[disabled] .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only[disabled] .cds--btn__icon path:not([data-icon-path]):not([fill=none]),.cds--btn.cds--btn--icon-only.cds--btn--ghost[disabled]:hover .cds--btn__icon,:host(cds-button) .cds--btn--ghost.cds--btn--icon-only[disabled] ::slotted([slot=icon]),:host(cds-button) .cds--btn--ghost.cds--btn--icon-only[disabled] ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--ghost.cds--btn--icon-only[disabled] ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--ghost.cds--btn--icon-only[disabled] ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:var(--cds-icon-on-color-disabled,#8d8d8d)}.cds--btn--ghost.cds--btn--icon-only[disabled],.cds--icon-tooltip--disabled .cds--tooltip-trigger__wrapper{cursor:not-allowed}.cds--icon-tooltip--disabled .cds--btn--icon-only[disabled]{pointer-events:none}.cds--btn--danger{background-color:var(--cds-button-danger-primary,#da1e28);border:1px solid transparent;color:var(--cds-text-on-color,#fff)}.cds--btn--danger:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger .cds--btn__icon,.cds--btn--danger .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--danger ::slotted([slot=icon]),:host(cds-button) .cds--btn--danger ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--danger ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--danger ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary{background-color:transparent;border-color:var(--cds-button-danger-secondary,#da1e28);border-style:solid;border-width:1px;color:var(--cds-button-danger-secondary,#da1e28)}.cds--btn--danger--tertiary:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger--tertiary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger--tertiary .cds--btn__icon,.cds--btn--danger--tertiary .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--danger--tertiary ::slotted([slot=icon]),:host(cds-button) .cds--btn--danger--tertiary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--danger--tertiary ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--danger--tertiary ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger--tertiary:hover{border-color:var(--cds-button-danger-hover,#b81921);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary:focus{background-color:var(--cds-button-danger-primary,#da1e28);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary:active{background-color:var(--cds-button-danger-active,#750e13);border-color:var(--cds-button-danger-active,#750e13);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary.cds--btn--disabled,.cds--btn--danger--tertiary.cds--btn--disabled:focus,.cds--btn--danger--tertiary.cds--btn--disabled:hover,.cds--btn--danger--tertiary:disabled,.cds--btn--danger--tertiary:focus:disabled,.cds--btn--danger--tertiary:hover:disabled{background:transparent;color:var(--cds-text-disabled,hsla(0,0%,9%,.25));outline:none}.cds--btn--danger--ghost{background-color:transparent;border:1px solid transparent;color:var(--cds-button-danger-secondary,#da1e28)}.cds--btn--danger--ghost:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger--ghost:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger--ghost:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger--ghost .cds--btn__icon,.cds--btn--danger--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]),:host(cds-button) .cds--btn--danger--ghost ::slotted([slot=icon]),:host(cds-button) .cds--btn--danger--ghost ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]),:host(cds-modal-footer-button) .cds--btn--danger--ghost ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--danger--ghost ::slotted([slot=icon]) path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger--ghost{padding-inline-end:calc(var(--cds-layout-density-padding-inline-local) - .0625rem)}.cds--btn--danger--ghost .cds--btn__icon,:host(cds-button) .cds--btn--danger--ghost ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn--danger--ghost ::slotted([slot=icon]){margin-inline-start:.5rem;position:static}.cds--btn--danger--ghost:active,.cds--btn--danger--ghost:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--danger--ghost.cds--btn--disabled,.cds--btn--danger--ghost.cds--btn--disabled:focus,.cds--btn--danger--ghost.cds--btn--disabled:hover,.cds--btn--danger--ghost:disabled,.cds--btn--danger--ghost:focus:disabled,.cds--btn--danger--ghost:hover:disabled{background:transparent;border-color:transparent;color:var(--cds-text-disabled,hsla(0,0%,9%,.25));outline:none}.cds--btn--expressive{font-size:var(--cds-body-compact-02-font-size,1rem);font-weight:var(--cds-body-compact-02-font-weight,400);letter-spacing:var(--cds-body-compact-02-letter-spacing,0);line-height:var(--cds-body-compact-02-line-height,1.375);padding-block:min((var(--cds-layout-size-height-local) - var(--temp-expressive-1lh))/2 - .0625rem,var(--temp-padding-block-max))}.cds--btn--icon-only.cds--btn--expressive{padding:12px 13px}.cds--btn.cds--btn--expressive .cds--btn__icon,:host(cds-button) .cds--btn.cds--btn--expressive ::slotted([slot=icon]),:host(cds-modal-footer-button) .cds--btn.cds--btn--expressive ::slotted([slot=icon]){block-size:1.25rem;inline-size:1.25rem}.cds--btn-set .cds--btn.cds--btn--expressive,:host(cds-button-set) .cds--btn.cds--btn--expressive,:host(cds-side-panel-button-set) .cds--btn.cds--btn--expressive{max-inline-size:20rem}.cds--btn.cds--skeleton{background:var(--cds-skeleton-background,#e8e8e8);border:none;box-shadow:none;padding:0;pointer-events:none;position:relative}.cds--btn.cds--skeleton:active,.cds--btn.cds--skeleton:focus,.cds--btn.cds--skeleton:hover{border:none;cursor:default;outline:none}.cds--btn.cds--skeleton:before{animation:cds--skeleton 3s ease-in-out infinite;background:var(--cds-skeleton-element,#c6c6c6);block-size:100%;content:\"\";inline-size:100%;inset-inline-start:0;position:absolute;will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--btn.cds--skeleton:before{animation:none}}@media (forced-colors:active),screen and (-ms-high-contrast:active){.cds--btn.cds--skeleton{background:CanvasText}.cds--btn.cds--skeleton:before{background:Canvas;forced-color-adjust:none}}.cds--btn.cds--skeleton{inline-size:9.375rem}.cds--btn-set,:host(cds-button-set),:host(cds-side-panel-button-set){display:flex}.cds--btn-set--stacked,:host(cds-button-set[stacked]){flex-direction:column}.cds--btn-set .cds--btn,:host(cds-button-set) .cds--btn,:host(cds-side-panel-button-set) .cds--btn{inline-size:100%;max-inline-size:12.25rem}.cds--btn-set .cds--btn:not(:focus),:host(cds-button-set) .cds--btn:not(:focus),:host(cds-side-panel-button-set) .cds--btn:not(:focus){box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0)}.cds--btn-set .cds--btn:first-of-type:not(:focus),:host(cds-button-set) .cds--btn:first-of-type:not(:focus),:host(cds-side-panel-button-set) .cds--btn:first-of-type:not(:focus){box-shadow:inherit}.cds--btn-set .cds--btn:focus+.cds--btn,:host(cds-button-set) .cds--btn:focus+.cds--btn,:host(cds-side-panel-button-set) .cds--btn:focus+.cds--btn{box-shadow:inherit}.cds--btn-set--stacked .cds--btn:not(:focus),:host(cds-button-set[stacked]) .cds--btn:not(:focus){box-shadow:0 -.0625rem 0 0 var(--cds-button-separator,#e0e0e0)}.cds--btn-set--stacked .cds--btn:first-of-type:not(:focus),:host(cds-button-set[stacked]) .cds--btn:first-of-type:not(:focus){box-shadow:inherit}.cds--btn-set .cds--btn.cds--btn--disabled,:host(cds-button-set) .cds--btn.cds--btn--disabled,:host(cds-side-panel-button-set) .cds--btn.cds--btn--disabled{box-shadow:-.0625rem 0 0 0 var(--cds-icon-on-color-disabled,#8d8d8d)}.cds--btn-set .cds--btn.cds--btn--disabled:first-of-type,:host(cds-button-set) .cds--btn.cds--btn--disabled:first-of-type,:host(cds-side-panel-button-set) .cds--btn.cds--btn--disabled:first-of-type{box-shadow:none}.cds--btn-set--stacked .cds--btn.cds--btn--disabled,:host(cds-button-set[stacked]) .cds--btn.cds--btn--disabled{box-shadow:0 -.0625rem 0 0 var(--cds-layer-selected-disabled,#8d8d8d)}.cds--btn-set--stacked .cds--btn.cds--btn--disabled:first-of-type,:host(cds-button-set[stacked]) .cds--btn.cds--btn--disabled:first-of-type{box-shadow:none}.cds--btn-set .cds--btn.cds--btn--loading,:host(cds-button-set) .cds--btn.cds--btn--loading,:host(cds-side-panel-button-set) .cds--btn.cds--btn--loading{background-color:transparent;border-color:transparent;box-shadow:none}.cds--btn--sm .cds--badge-indicator{margin-block-start:.25rem;margin-inline-end:.25rem}@media (forced-colors:active),screen and (-ms-high-contrast:active){.cds--btn:focus{color:Highlight;outline:1px solid Highlight}}[dir=rtl] .cds--btn-set .cds--btn:not(:focus),[dir=rtl] :host(cds-button-set) .cds--btn:not(:focus),[dir=rtl] :host(cds-side-panel-button-set) .cds--btn:not(:focus){box-shadow:.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0)}.cds--btn-set--fluid{container-type:inline-size}.cds--btn-set--fluid .cds--btn-set__fluid-inner{--flex-direction:row;align-items:stretch;display:flex;flex-direction:var(--flex-direction);inline-size:100%;justify-content:flex-end}.cds--btn-set--fluid .cds--btn-set__fluid-inner .cds--btn{flex:0 1 25%;max-inline-size:14.5rem}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack .cds--btn{min-inline-size:11rem}.cds--btn-set--fluid .cds--btn-set__fluid-inner .cds--btn--danger--ghost,.cds--btn-set--fluid .cds--btn-set__fluid-inner .cds--btn--ghost{flex:1 1 25%;max-inline-size:none;padding-inline-start:2rem}@container (width <= 11rem){.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:first-child:last-child){--flex-direction:column}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:first-child:last-child) .cds--btn{flex:initial;inline-size:100%;max-inline-size:none}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:first-child:last-child) .cds--btn--ghost{padding-inline-start:1rem}}@container (width <= 22rem){.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(2):last-child){--flex-direction:column}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(2):last-child) .cds--btn{flex:initial;inline-size:100%;max-inline-size:none}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(2):last-child) .cds--btn--ghost{padding-inline-start:1rem}}@container (width <= 33rem){.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(3):last-child){--flex-direction:column}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(3):last-child) .cds--btn{flex:initial;inline-size:100%;max-inline-size:none}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(3):last-child) .cds--btn--ghost{padding-inline-start:1rem}}@container (width <= 44rem){.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(4):last-child){--flex-direction:column}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(4):last-child) .cds--btn{flex:initial;inline-size:100%;max-inline-size:none}.cds--btn-set--fluid .cds--btn-set__fluid-inner--auto-stack:has(:nth-child(4):last-child) .cds--btn--ghost{padding-inline-start:1rem}}@container (width <= 44rem){.cds--btn-set--fluid .cds--btn-set__fluid-inner:has(:nth-child(2):last-child) .cds--btn{flex-basis:50%;max-inline-size:none}}@container (width <= 33rem){.cds--btn-set--fluid .cds--btn-set__fluid-inner:has(:first-child:last-child) .cds--btn{flex:1 1 100%;max-inline-size:none}}.cds--copy-btn{position:relative}.cds--copy-btn:hover{background-color:var(--cds-layer-hover)}.cds--copy-btn:active{background-color:var(--cds-layer-active)}.cds--copy-btn:before{block-size:0;border-style:solid;content:\"\";display:none;inline-size:0;position:absolute;z-index:6000}.cds--copy-btn .cds--copy-btn__feedback{background-color:var(--cds-background-inverse,#393939);block-size:auto;border-radius:.125rem;box-shadow:0 2px 6px var(--cds-shadow,rgba(0,0,0,.3));color:var(--cds-text-inverse,#fff);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:400;font-weight:var(--cds-body-compact-01-font-weight,400);inline-size:-moz-max-content;inline-size:max-content;letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);max-inline-size:13rem;min-inline-size:1.5rem;padding:.1875rem 1rem;text-align:start;transform:translateX(-50%);z-index:6000}@media (-ms-high-contrast:active),(-ms-high-contrast:none){.cds--copy-btn .cds--copy-btn__feedback{inline-size:auto}}@supports (-ms-accelerator:true){.cds--copy-btn .cds--copy-btn__feedback{inline-size:auto}}@supports (-ms-ime-align:auto){.cds--copy-btn .cds--copy-btn__feedback{inline-size:auto}}@media screen and (-ms-high-contrast:active),screen and (prefers-contrast){.cds--copy-btn .cds--copy-btn__feedback{border:1px solid transparent}}.cds--copy-btn .cds--copy-btn__feedback{box-sizing:content-box;display:none;margin:auto;overflow:visible;clip:auto}.cds--copy-btn.cds--copy-btn--animating .cds--copy-btn__feedback,.cds--copy-btn.cds--copy-btn--animating:before{display:block}.cds--copy-btn.cds--copy-btn--animating:before{border:none}.cds--copy-btn.cds--copy-btn--animating.cds--copy-btn--fade-out .cds--copy-btn__feedback,.cds--copy-btn.cds--copy-btn--animating.cds--copy-btn--fade-out:before{animation:cds--hide-feedback .11s cubic-bezier(.2,0,.38,.9)}.cds--copy-btn.cds--copy-btn--animating.cds--copy-btn--fade-in .cds--copy-btn__feedback,.cds--copy-btn.cds--copy-btn--animating.cds--copy-btn--fade-in:before{animation:cds--show-feedback .11s cubic-bezier(.2,0,.38,.9)}.cds--copy-btn svg{fill:var(--cds-icon-primary,#161616)}.cds--copy{font-size:0}.cds--chat-btn{border-radius:1.5rem}.cds--chat-btn:not(.cds--chat-btn--with-icon){padding-inline-end:.9375rem}.cds--chat-btn.cds--btn--md{border-radius:1.25rem}.cds--chat-btn.cds--btn--sm{border-radius:1rem}.cds--chat-btn--quick-action{align-items:center;background:transparent;border:1px solid var(--cds-chat-button,#0f62fe);color:var(--cds-chat-button,#0f62fe)}.cds--chat-btn--quick-action:hover:not(:active):not([disabled]){background:var(--cds-chat-button-hover,hsla(0,0%,55%,.12));border-color:transparent;color:var(--cds-chat-button-text-hover,#0043ce)}.cds--chat-btn--quick-action:active{background:var(--cds-chat-button-active,hsla(0,0%,55%,.5));border-color:transparent;color:var(--cds-chat-button-text-hover,#0043ce)}.cds--chat-btn--quick-action.cds--btn--ghost:focus{border-color:var(--cds-focus,#0f62fe);box-shadow:inset 0 0 0 1px var(--cds-focus,#0f62fe)}.cds--chat-btn--quick-action.cds--btn--ghost:hover:focus{border-color:var(--cds-focus,#0f62fe);box-shadow:inset 0 0 0 1px var(--cds-focus-inset,#fff)}.cds--chat-btn--quick-action[disabled],.cds--chat-btn--quick-action[disabled]:hover{border-color:var(--cds-button-disabled,#c6c6c6);color:var(--cds-button-disabled,#c6c6c6)}.cds--chat-btn--quick-action--selected,.cds--chat-btn--quick-action--selected[disabled],.cds--chat-btn--quick-action--selected[disabled]:hover{background:var(--cds-chat-button-selected,hsla(0,0%,55%,.2));border-color:transparent;color:var(--cds-chat-button-text-selected,#525252)}.cds--chat-btn--quick-action.cds--chat-btn--quick-action--selected:not([disabled]):active,.cds--chat-btn--quick-action.cds--chat-btn--quick-action--selected:not([disabled]):hover{color:var(--cds-chat-button-text-selected,#525252)}.cds--chat-btn.cds--skeleton{overflow:hidden}.cds--snippet html{font-size:100%}.cds--snippet body{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--snippet code{font-family:IBM Plex Mono,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,monospace}.cds--snippet strong{font-weight:600}.cds--snippet--disabled,.cds--snippet--disabled .cds--btn.cds--snippet-btn--expand{background-color:var(--cds-layer);color:var(--cds-text-disabled,hsla(0,0%,9%,.25))}.cds--snippet--disabled .cds--copy-btn,.cds--snippet--disabled .cds--copy-btn:hover,.cds--snippet--disabled .cds--snippet-btn--expand:hover{background-color:var(--cds-layer);color:var(--cds-text-disabled,hsla(0,0%,9%,.25));cursor:not-allowed}.cds--snippet--disabled .cds--snippet-btn--expand .cds--icon-chevron--down,.cds--snippet--disabled .cds--snippet__icon{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.cds--snippet code{font-family:var(--cds-code-01-font-family,\"IBM Plex Mono\",system-ui,-apple-system,BlinkMacSystemFont,\".SFNSText-Regular\",monospace);font-size:var(--cds-code-01-font-size,.75rem);font-weight:var(--cds-code-01-font-weight,400);letter-spacing:var(--cds-code-01-letter-spacing,.32px);line-height:var(--cds-code-01-line-height,1.33333)}.cds--snippet--inline html{font-size:100%}.cds--snippet--inline body{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--snippet--inline code{font-family:IBM Plex Mono,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,monospace}.cds--snippet--inline strong{font-weight:600}.cds--snippet--inline{background-color:var(--cds-layer);border:1px solid transparent;border-radius:4px;color:var(--cds-text-primary,#161616);cursor:pointer;display:inline;padding:0;position:relative}.cds--snippet--inline:hover{background-color:var(--cds-layer-hover)}.cds--snippet--inline:active{background-color:var(--cds-layer-active)}.cds--snippet--inline:focus{border:1px solid var(--cds-focus,#0f62fe);outline:none}.cds--snippet--inline:before{block-size:0;border:none;content:\"\";display:none;inline-size:0;position:absolute;z-index:6000}.cds--snippet--inline .cds--copy-btn__feedback{background-color:var(--cds-background-inverse,#393939);block-size:auto;border-radius:.125rem;box-shadow:0 2px 6px var(--cds-shadow,rgba(0,0,0,.3));color:var(--cds-text-inverse,#fff);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:400;font-weight:var(--cds-body-compact-01-font-weight,400);inline-size:-moz-max-content;inline-size:max-content;letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);max-inline-size:13rem;min-inline-size:1.5rem;padding:.1875rem 1rem;text-align:start;transform:translateX(-50%);z-index:6000}@media (-ms-high-contrast:active),(-ms-high-contrast:none){.cds--snippet--inline .cds--copy-btn__feedback{inline-size:auto}}@supports (-ms-accelerator:true){.cds--snippet--inline .cds--copy-btn__feedback{inline-size:auto}}@supports (-ms-ime-align:auto){.cds--snippet--inline .cds--copy-btn__feedback{inline-size:auto}}@media screen and (-ms-high-contrast:active),screen and (prefers-contrast){.cds--snippet--inline .cds--copy-btn__feedback{border:1px solid transparent}}.cds--snippet--inline .cds--copy-btn__feedback{box-sizing:content-box;display:none;margin:auto;overflow:visible;clip:auto}.cds--snippet--inline.cds--copy-btn--animating .cds--copy-btn__feedback,.cds--snippet--inline.cds--copy-btn--animating:before{display:block}.cds--snippet--inline.cds--copy-btn--animating.cds--copy-btn--fade-out .cds--copy-btn__feedback,.cds--snippet--inline.cds--copy-btn--animating.cds--copy-btn--fade-out:before{animation:cds--hide-feedback .11s cubic-bezier(.2,0,.38,.9)}.cds--snippet--inline.cds--copy-btn--animating.cds--copy-btn--fade-in .cds--copy-btn__feedback,.cds--snippet--inline.cds--copy-btn--animating.cds--copy-btn--fade-in:before{animation:cds--show-feedback .11s cubic-bezier(.2,0,.38,.9)}.cds--snippet--inline code{padding:0 .5rem}.cds--snippet--inline.cds--snippet--no-copy{display:inline-block}.cds--snippet--inline.cds--snippet--no-copy:hover{background-color:var(--cds-layer);cursor:auto}.cds--snippet--light.cds--snippet--inline.cds--snippet--no-copy:hover{background-color:var(--cds-layer-hover);cursor:auto}.cds--snippet--single{align-items:center;background-color:var(--cds-layer);block-size:2.5rem;display:flex;font-family:var(--cds-code-01-font-family,\"IBM Plex Mono\",system-ui,-apple-system,BlinkMacSystemFont,\".SFNSText-Regular\",monospace);font-size:var(--cds-code-01-font-size,.75rem);font-weight:var(--cds-code-01-font-weight,400);inline-size:100%;letter-spacing:var(--cds-code-01-letter-spacing,.32px);line-height:var(--cds-code-01-line-height,1.33333);max-inline-size:48rem;padding-inline-end:2.5rem;position:relative}.cds--snippet--single.cds--snippet--no-copy{padding:0}.cds--snippet--single.cds--snippet--no-copy:after{inset-inline-end:1rem}.cds--snippet--single .cds--snippet-container{align-items:center;block-size:100%;display:flex;overflow-x:auto;padding-inline-start:1rem;position:relative}.cds--snippet--single .cds--snippet-container:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--snippet--single .cds--snippet-container:focus{outline-style:dotted}}.cds--snippet--single pre{font-family:var(--cds-code-01-font-family,\"IBM Plex Mono\",system-ui,-apple-system,BlinkMacSystemFont,\".SFNSText-Regular\",monospace);font-size:var(--cds-code-01-font-size,.75rem);font-weight:var(--cds-code-01-font-weight,400);letter-spacing:var(--cds-code-01-letter-spacing,.32px);line-height:var(--cds-code-01-line-height,1.33333);padding-inline-end:2rem}.cds--snippet--inline code,.cds--snippet--single pre{white-space:pre}.cds--snippet--multi{background-color:var(--cds-layer);display:flex;font-family:var(--cds-code-01-font-family,\"IBM Plex Mono\",system-ui,-apple-system,BlinkMacSystemFont,\".SFNSText-Regular\",monospace);font-size:var(--cds-code-01-font-size,.75rem);font-weight:var(--cds-code-01-font-weight,400);inline-size:100%;letter-spacing:var(--cds-code-01-letter-spacing,.32px);line-height:var(--cds-code-01-line-height,1.33333);max-inline-size:48rem;padding:1rem}.cds--snippet--multi .cds--snippet-container{max-block-size:100%;min-block-size:100%;order:1;overflow-y:auto;position:relative;transition:max-height .15s cubic-bezier(.2,0,.38,.9)}.cds--snippet--multi .cds--snippet-container:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--snippet--multi .cds--snippet-container:focus{outline-style:dotted}}.cds--snippet--multi .cds--snippet-container:focus{outline-offset:0}.cds--snippet--multi.cds--snippet--expand .cds--snippet-container{padding-block-end:1rem;transition:max-height .15s cubic-bezier(.2,0,.38,.9)}.cds--snippet--multi.cds--snippet--wraptext pre{white-space:pre-wrap;word-wrap:break-word}.cds--snippet--multi .cds--snippet-container pre{overflow:auto;padding-block-end:1.5rem;padding-inline-end:1.5rem}.cds--snippet--multi.cds--snippet--no-copy .cds--snippet-container pre{padding-inline-end:0}[dir=rtl] .cds--snippet--multi.cds--snippet--has-right-overflow:after{background-image:linear-gradient(to left,transparent,var(--cds-layer))}.cds--snippet--multi .cds--snippet-container pre code{overflow:hidden}.cds--snippet__icon{block-size:1rem;fill:var(--cds-icon-primary,#161616);inline-size:1rem;transition:all 70ms cubic-bezier(.2,0,.38,.9)}.cds--btn>.cds--snippet__icon{margin-block-start:0}.cds--copy-btn html{font-size:100%}.cds--copy-btn body{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--copy-btn code{font-family:IBM Plex Mono,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,monospace}.cds--copy-btn strong{font-weight:600}.cds--copy-btn{align-items:center;background-color:var(--cds-layer);border:none;cursor:pointer;display:flex;justify-content:center;outline:none;overflow:visible;padding:0}.cds--copy-btn:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--copy-btn:focus{outline-style:dotted}}.cds--copy-btn:focus{outline-color:var(--cds-focus,#0f62fe)}.cds--snippet .cds--popover-container{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;inset-block-start:0;inset-inline-end:0;position:absolute}.cds--snippet--inline.cds--btn{block-size:1.25rem;inline-size:auto;max-inline-size:unset;min-block-size:1.25rem;padding-inline:0}.cds--snippet--inline.cds--btn.cds--btn--primary:hover{color:var(--cds-text-primary,#161616)}.cds--snippet.cds--snippet--multi .cds--popover-container{inset-block-start:.5rem;inset-inline-end:.5rem}.cds--snippet--multi .cds--copy-btn{z-index:10}.cds--snippet-btn--expand{align-items:center;background-color:var(--cds-layer);block-size:2rem;border:0;color:var(--cds-text-primary,#161616);display:inline-flex;font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);inset-block-end:0;inset-inline-end:0;letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);padding:.5rem 1rem;position:absolute;z-index:10}.cds--snippet-btn--expand .cds--snippet-btn--text{inset-block-start:-.0625rem;position:relative}.cds--snippet-btn--expand--hide.cds--snippet-btn--expand{display:none}.cds--snippet-btn--expand .cds--icon-chevron--down{fill:var(--cds-icon-primary,#161616);margin-inline-start:.5rem;transform:rotate(0deg);transition:.15s cubic-bezier(.2,0,.38,.9)}.cds--snippet-btn--expand:hover{background:var(--cds-layer-hover);color:var(--cds-text-primary,#161616)}.cds--snippet-btn--expand:active{background-color:var(--cds-layer-active)}.cds--snippet-btn--expand:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--snippet-btn--expand:focus{outline-style:dotted}}.cds--snippet-btn--expand:focus{border-color:transparent}.cds--snippet--expand .cds--snippet-btn--expand .cds--icon-chevron--down{transform:rotate(180deg);transition:transform .3s}.cds--snippet--light,.cds--snippet--light .cds--btn.cds--snippet-btn--expand,.cds--snippet--light .cds--copy-btn,.cds--snippet--light .cds--snippet-button{background-color:var(--cds-layer)}.cds--snippet--light .cds--btn.cds--snippet-btn--expand:hover,.cds--snippet--light .cds--copy-btn:hover,.cds--snippet--light .cds--snippet-button:hover,.cds--snippet--light.cds--snippet--inline:hover{background-color:var(--cds-layer-hover)}.cds--snippet--light .cds--btn.cds--snippet-btn--expand:active,.cds--snippet--light .cds--copy-btn:active,.cds--snippet--light .cds--snippet-button:active,.cds--snippet--light.cds--snippet--inline:active{background-color:var(--cds-layer-active)}.cds--snippet.cds--skeleton .cds--snippet-container{block-size:100%;inline-size:100%}.cds--snippet-button .cds--btn--copy__feedback{inset-block-start:3.175rem;inset-inline:50% auto}.cds--snippet-button .cds--btn--copy__feedback:before{inset-block-start:0}.cds--snippet-button .cds--btn--copy__feedback:after{inset-block-start:-.25rem}.cds--snippet--multi .cds--snippet-button .cds--btn--copy__feedback{inset-block-start:2.675rem}.cds--snippet--inline .cds--btn--copy__feedback{inset-block-start:calc(100% - .25rem);inset-inline:50% auto}.cds--snippet--single .cds--snippet-container{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent);pointer-events:auto}.cds--snippet--multi{position:relative}.cds--snippet--multi .cds--snippet-container{inline-size:100%;-webkit-mask-composite:source-in,xor;mask-composite:intersect;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent),linear-gradient(180deg,#000 calc(100% - 1rem),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent),linear-gradient(180deg,#000 calc(100% - 1rem),transparent);pointer-events:auto}[dir=rtl] .cds--snippet--single .cds--snippet-container{-webkit-mask-image:linear-gradient(270deg,#000 calc(100% - 2rem),transparent);mask-image:linear-gradient(270deg,#000 calc(100% - 2rem),transparent)}[dir=rtl] .cds--snippet--multi .cds--snippet-container{-webkit-mask-image:linear-gradient(270deg,#000 calc(100% - 2rem),transparent),linear-gradient(180deg,#000 calc(100% - 1rem),transparent);mask-image:linear-gradient(270deg,#000 calc(100% - 2rem),transparent),linear-gradient(180deg,#000 calc(100% - 1rem),transparent)}.cds--snippet--multi:focus-within .cds--snippet-container,.cds--snippet--single:focus-within .cds--snippet-container{-webkit-mask-image:none;mask-image:none}.cds--snippet--multi.cds--skeleton{block-size:6.125rem}.cds--snippet--single.cds--skeleton{block-size:3.5rem}.cds--snippet.cds--skeleton span{background:var(--cds-skeleton-background,#e8e8e8);border:none;box-shadow:none;padding:0;pointer-events:none;position:relative}.cds--snippet.cds--skeleton span:active,.cds--snippet.cds--skeleton span:focus,.cds--snippet.cds--skeleton span:hover{border:none;cursor:default;outline:none}.cds--snippet.cds--skeleton span:before{animation:cds--skeleton 3s ease-in-out infinite;background:var(--cds-skeleton-element,#c6c6c6);block-size:100%;content:\"\";inline-size:100%;inset-inline-start:0;position:absolute;will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--snippet.cds--skeleton span:before{animation:none}}@media (forced-colors:active),screen and (-ms-high-contrast:active){.cds--snippet.cds--skeleton span{background:CanvasText}.cds--snippet.cds--skeleton span:before{background:Canvas;forced-color-adjust:none}}.cds--snippet.cds--skeleton span{block-size:1rem;display:block;inline-size:100%;margin-block-start:.5rem}.cds--snippet.cds--skeleton span:first-child{margin:0}.cds--snippet.cds--skeleton span:nth-child(2){inline-size:85%}.cds--snippet.cds--skeleton span:nth-child(3){inline-size:95%}.cds--snippet--single.cds--skeleton .cds--snippet-container{padding-block-end:0}@media (forced-colors:active),screen and (-ms-high-contrast:active){.cds--snippet--inline:focus{color:Highlight;outline:1px solid Highlight}.cds--snippet--multi,.cds--snippet--single{outline:1px solid transparent}}:host(cds-button),:host(cds-modal-footer-button){--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px;display:inline-flex}:host(cds-button) .cds--btn,:host(cds-modal-footer-button) .cds--btn{flex-grow:1;max-inline-size:100%}:host(cds-button-skeleton){--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px;display:inline-flex}:host(cds-button[isExpressive]) ::slotted([slot=icon]),:host(cds-modal-footer-button[isExpressive]) ::slotted([slot=icon]){block-size:1.25rem;inline-size:1.25rem}:host(cds-button[pagination]) .cds--btn,:host(cds-modal-footer-button[pagination]) .cds--btn{border:none;border-inline-start:1px solid var(--cds-border-subtle);padding:0;transition:none}:host(cds-button[pagination]) .cds--btn:focus,:host(cds-modal-footer-button[pagination]) .cds--btn:focus{border-inline-start:0;box-shadow:none;outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}:host(cds-button[pagination]:not([disabled])) .cds--btn,:host(cds-modal-footer-button[pagination]:not([disabled])) .cds--btn{color:var(--cds-icon-primary,#161616)}:host(cds-button[pagination]:not([disabled])) .cds--btn:active,:host(cds-modal-footer-button[pagination]:not([disabled])) .cds--btn:active{background-color:var(--cds-layer-hover)}:host(cds-button[pagination][batch-action]:not([disabled])) .cds--btn,:host(cds-modal-footer-button[pagination][batch-action]:not([disabled])) .cds--btn{padding:calc(.875rem - 3px) 1rem}:host(cds-button[pagination][batch-action]:not([disabled])) .cds--btn:focus,:host(cds-modal-footer-button[pagination][batch-action]:not([disabled])) .cds--btn:focus{outline:.125rem solid var(--cds-layer);outline-offset:-.125rem}:host(cds-button[pagination][batch-action]:not([disabled])) :host(cds-button[pagination][has-main-content]:not([disabled])) ::slotted([slot=icon]),:host(cds-button[pagination][batch-action]:not([disabled])) :host(cds-modal-footer-button[pagination][has-main-content]:not([disabled])) ::slotted([slot=icon]),:host(cds-modal-footer-button[pagination][batch-action]:not([disabled])) :host(cds-button[pagination][has-main-content]:not([disabled])) ::slotted([slot=icon]),:host(cds-modal-footer-button[pagination][batch-action]:not([disabled])) :host(cds-modal-footer-button[pagination][has-main-content]:not([disabled])) ::slotted([slot=icon]){margin-inline-start:.25rem;position:static}:host(cds-button) .cds--btn--icon-only{align-items:center;padding-block-start:0}:host(cds-button) .cds--btn--icon-only.cds--btn--expressive,:host(cds-button) .cds--btn--icon-only.cds--btn--selected{padding:.5rem}:host(cds-button) .cds--btn--ghost:not([disabled]) ::slotted([slot=icon]){fill:var(--cds-icon-primary,#161616)}:host(cds-button[kind=ghost]) .cds--btn--ghost:active,:host(cds-button[kind=ghost]) .cds--btn--ghost:hover{outline:none}:host(cds-button[kind=ghost]) .cds--btn--ghost:not(:focus){box-shadow:none}:host(cds-button[kind=danger-ghost]) .cds--btn--danger-ghost:not(:focus){box-shadow:none}:host(cds-button-set) ::slotted(cds-button),:host(cds-side-panel-button-set) ::slotted(cds-button){inline-size:100%;max-inline-size:12.25rem}:host(cds-button-set) ::slotted(cds-button:not(:first-of-type)),:host(cds-side-panel-button-set) ::slotted(cds-button:not(:first-of-type)){box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0);z-index:1}:host(cds-button-set) ::slotted(cds-button:focus-within),:host(cds-side-panel-button-set) ::slotted(cds-button:focus-within){box-shadow:inherit}:host(cds-button-set) ::slotted(cds-button:not(:first-of-type)[hide-margin]),:host(cds-side-panel-button-set) ::slotted(cds-button:not(:first-of-type)[hide-margin]){box-shadow:inherit}:host(cds-button-set[stacked]) ::slotted(cds-button:not(:first-of-type)){box-shadow:0 -.0625rem 0 0 var(--cds-button-separator,#e0e0e0);z-index:1}:host(cds-button-set[stacked]) ::slotted(cds-button:focus-within){box-shadow:inherit}:host(cds-button-set[stacked]) ::slotted(cds-button:not(:first-of-type)[hide-margin]){box-shadow:inherit}:host(cds-button[data-context=data-table]) .cds--btn{padding-inline:1rem}:host(cds-button[data-context=data-table]) .cds--btn__icon,:host(cds-button[data-context=data-table]):host(cds-button) ::slotted([slot=icon]){position:static;fill:var(--cds-icon-on-color,#fff);margin-inline-start:.5rem}:host(cds-button[data-context=data-table]) .cds--btn__icon .st0,:host(cds-button[data-context=data-table]):host(cds-button) ::slotted([slot=icon]) .st0{fill:none}:host(cds-button.cds--batch-summary__cancel){--divider-opacity:1}:host(cds-button.cds--batch-summary__cancel) button.cds--btn{align-items:center;block-size:100%;display:inline-flex;justify-content:center;margin:0;min-block-size:100%;padding-inline-end:1rem;padding-inline-start:1rem;position:relative}@media (prefers-reduced-motion:reduce){:host(cds-button.cds--batch-summary__cancel) button.cds--btn:before{transition:none}}:host(cds-button.cds--batch-summary__cancel) button.cds--btn:before{background-color:var(--cds-text-on-color,#fff);block-size:1rem;border:none;content:\"\";display:block;inline-size:.0625rem;inset-block-start:.9375rem;inset-inline-start:0;opacity:var(--divider-opacity);position:absolute;transition:opacity .11s cubic-bezier(.2,0,.38,.9)}:host(cds-button.cds--batch-summary__cancel) button.cds--btn:hover:before{opacity:0}:host(cds-button.cds--batch-summary__cancel[size=sm]) button.cds--btn{block-size:2rem;min-block-size:auto;padding-block:.375rem}:host(cds-button.cds--batch-summary__cancel[size=sm]) button.cds--btn:before{inset-block-start:.5rem}:host(cds-button.cds--batch-summary__cancel[size=lg]) button.cds--btn{block-size:3rem;min-block-size:auto}:host(cds-button.cds--batch-summary__cancel[size=lg]) button.cds--btn:before{inset-block-start:.9375rem}:host(c4p-action-set) .c4p--action-set__action-button--ghost{padding-inline-start:0!important}:host(c4p-action-set) ::slotted(cds-button:not(:first-of-type)){box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0);z-index:1}:host(c4p-action-set) ::slotted(cds-button:focus-within),:host(c4p-action-set) ::slotted(cds-button:not(:first-of-type)[hide-margin]){box-shadow:inherit}:host(c4p-action-set) cds-button:not(:first-of-type){box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0);z-index:1}:host(c4p-action-set) cds-button:focus-within,:host(c4p-action-set) cds-button:not(:first-of-type)[hide-margin]{box-shadow:inherit}:host(c4p-action-set[stacked]) ::slotted(cds-button:not(:first-of-type)){box-shadow:0 -.0625rem 0 0 var(--cds-button-separator,#e0e0e0);z-index:1}:host(c4p-action-set[stacked]) ::slotted(cds-button:focus-within),:host(c4p-action-set[stacked]) ::slotted(cds-button:not(:first-of-type)[hide-margin]){box-shadow:inherit}:host(c4p-action-set[stacked]) cds-button:not(:first-of-type){box-shadow:0 -.0625rem 0 0 var(--cds-button-separator,#e0e0e0);z-index:1}:host(c4p-action-set[stacked]) cds-button:focus-within,:host(c4p-action-set[stacked]) cds-button:not(:first-of-type)[hide-margin]{box-shadow:inherit}"]);
|
|
12
|
+
|
|
13
|
+
//#endregion
|
|
14
|
+
export { action_set_default as default };
|
|
15
|
+
//# sourceMappingURL=action-set.scss.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"action-set.scss.js","names":[],"sources":["../../../src/components/action-set/action-set.scss?lit"],"sourcesContent":["/**\n * Copyright IBM Corp. 2026, 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\n@use '@carbon/styles/scss/theme' as *;\n@use '@carbon/styles/scss/spacing' as *;\n@use '@carbon/styles/scss/type';\n@use '@carbon/layout/scss/convert' as *;\n@use '@carbon/styles/scss/config' as carbon-config;\n@use '@carbon/styles/scss/components/button/tokens' as button-tokens;\n@use '@carbon/ibm-products-styles/scss/components/ActionSet/index' as *;\n\n$c4p-prefix: 'c4p';\n$carbon-prefix: 'cds';\n\n$block-class: #{$c4p-prefix}--action-set;\n\n// Import base button styles\n@use '@carbon/web-components/scss/components/button/button';\n\n// Mixin for button separator styles (DRY principle)\n@mixin button-separator($direction: horizontal) {\n $shadow: if(\n $direction == horizontal,\n to-rem(-1px) 0 0 0 button-tokens.$button-separator,\n 0 to-rem(-1px) 0 0 button-tokens.$button-separator\n );\n\n // Slotted buttons\n ::slotted(#{$carbon-prefix}-button:not(:first-of-type)) {\n z-index: 1;\n box-shadow: $shadow;\n }\n\n ::slotted(#{$carbon-prefix}-button:focus-within),\n ::slotted(#{$carbon-prefix}-button:not(:first-of-type)[hide-margin]) {\n box-shadow: inherit;\n }\n\n // Directly rendered buttons (from actions prop)\n #{$carbon-prefix}-button:not(:first-of-type) {\n z-index: 1;\n box-shadow: $shadow;\n }\n\n #{$carbon-prefix}-button:focus-within,\n #{$carbon-prefix}-button:not(:first-of-type)[hide-margin] {\n box-shadow: inherit;\n }\n}\n\n:host(#{$c4p-prefix}-action-set) {\n @extend .#{$block-class} !optional;\n\n // Override padding-inline-start for ghost buttons from ActionSet styles\n .#{$block-class}__action-button--ghost {\n /* stylelint-disable-next-line declaration-no-important */\n padding-inline-start: 0 !important;\n }\n\n // Button separator styles for horizontal layout\n @include button-separator(horizontal);\n}\n\n// Stacked layout styles\n:host(#{$c4p-prefix}-action-set[stacked]) {\n @include button-separator(vertical);\n}\n"],"mappings":""}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*
|
|
4
|
+
* Copyright IBM Corp. 2026
|
|
5
|
+
*
|
|
6
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
7
|
+
* LICENSE file in the root directory of this source tree.
|
|
8
|
+
*/
|
|
9
|
+
import './action-set';
|
|
10
|
+
export type { ActionButton, ButtonSize, ButtonKind } from './action-set';
|
|
11
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/action-set/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,cAAc,CAAC;AAEtB,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -9,10 +9,10 @@ import { prefix } from "../../globals/settings.js";
|
|
|
9
9
|
import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
|
|
10
10
|
import { BigNumberSize } from "./constants.js";
|
|
11
11
|
import big_number_skeleton_default$1 from "./big-number-skeleton.scss.js";
|
|
12
|
+
import { classMap } from "lit/directives/class-map.js";
|
|
12
13
|
import { LitElement, html } from "lit";
|
|
13
14
|
import { property } from "lit/decorators.js";
|
|
14
15
|
import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
|
|
15
|
-
import { classMap } from "lit/directives/class-map.js";
|
|
16
16
|
import "@carbon/web-components/es/components/skeleton-text/index.js";
|
|
17
17
|
import "@carbon/web-components/es/components/skeleton-placeholder/index.js";
|
|
18
18
|
|
|
@@ -11,11 +11,11 @@ import { getSupportedLocale } from "../../globals/js/utils/getSupportedLocale.js
|
|
|
11
11
|
import { BigNumberSize, Characters, DefaultLocale, UNKNOWN } from "./constants.js";
|
|
12
12
|
import "./big-number-skeleton.js";
|
|
13
13
|
import big_number_default$1 from "./big-number.scss.js";
|
|
14
|
+
import { classMap } from "lit/directives/class-map.js";
|
|
14
15
|
import { LitElement, html, nothing } from "lit";
|
|
15
16
|
import { property } from "lit/decorators.js";
|
|
16
17
|
import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
|
|
17
18
|
import { iconLoader } from "@carbon/web-components/es/globals/internal/icon-loader.js";
|
|
18
|
-
import { classMap } from "lit/directives/class-map.js";
|
|
19
19
|
import ArrowUp16 from "@carbon/icons/es/arrow--up/16";
|
|
20
20
|
import ArrowUp20 from "@carbon/icons/es/arrow--up/20";
|
|
21
21
|
import ArrowUp24 from "@carbon/icons/es/arrow--up/24";
|
|
@@ -9,10 +9,10 @@ import { prefix } from "../../globals/settings.js";
|
|
|
9
9
|
import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
|
|
10
10
|
import checklist_default from "./checklist.scss.js";
|
|
11
11
|
import { Kinds } from "./checklist.types.js";
|
|
12
|
+
import { classMap } from "lit/directives/class-map.js";
|
|
12
13
|
import { LitElement, html } from "lit";
|
|
13
14
|
import { property } from "lit/decorators.js";
|
|
14
15
|
import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
|
|
15
|
-
import { classMap } from "lit/directives/class-map.js";
|
|
16
16
|
import CheckmarkOutline16 from "@carbon/icons/es/checkmark--outline/16";
|
|
17
17
|
import CircleDash16 from "@carbon/icons/es/circle-dash/16";
|
|
18
18
|
import Incomplete16 from "@carbon/icons/es/incomplete/16";
|
|
@@ -9,10 +9,10 @@ import { prefix } from "../../globals/settings.js";
|
|
|
9
9
|
import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
|
|
10
10
|
import checklist_default from "./checklist.scss.js";
|
|
11
11
|
import { Kinds, Statuses } from "./checklist.types.js";
|
|
12
|
+
import { classMap } from "lit/directives/class-map.js";
|
|
12
13
|
import { LitElement, html } from "lit";
|
|
13
14
|
import { property } from "lit/decorators.js";
|
|
14
15
|
import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
|
|
15
|
-
import { classMap } from "lit/directives/class-map.js";
|
|
16
16
|
|
|
17
17
|
//#region src/components/checklist/checklist-item.ts
|
|
18
18
|
/**
|
|
@@ -10,12 +10,12 @@ import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers
|
|
|
10
10
|
import checklist_default$1 from "./checklist.scss.js";
|
|
11
11
|
import "./checklist-chart.js";
|
|
12
12
|
import "./checklist-icon.js";
|
|
13
|
+
import { classMap } from "lit/directives/class-map.js";
|
|
13
14
|
import { LitElement, html } from "lit";
|
|
14
15
|
import { property } from "lit/decorators.js";
|
|
15
16
|
import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
|
|
16
17
|
import { iconLoader } from "@carbon/web-components/es/globals/internal/icon-loader.js";
|
|
17
18
|
import "@carbon/web-components/es/components/icon-button/index.js";
|
|
18
|
-
import { classMap } from "lit/directives/class-map.js";
|
|
19
19
|
import "@carbon/web-components/es/components/link/index.js";
|
|
20
20
|
import ChevronIcon16 from "@carbon/icons/es/chevron--up/16";
|
|
21
21
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"coachmark-tagline.d.ts","sourceRoot":"","sources":["../../../../src/components/coachmark/coachmark-tagline/coachmark-tagline.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAQvC,OAAO,uDAAuD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAqBtD,CAAC;gJAWJ,CAAC;
|
|
1
|
+
{"version":3,"file":"coachmark-tagline.d.ts","sourceRoot":"","sources":["../../../../src/components/coachmark/coachmark-tagline/coachmark-tagline.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAQvC,OAAO,uDAAuD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAqBtD,CAAC;gJAWJ,CAAC;4FAOL,CAAA;mJAKQ,CAAC;+FAOS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BA+Cf,CAAC;;;;;;;;;;;;;;;;;;;;;;;uBAwBmgD,CAAC;;;;;;;;;;;;;iCAA4xB,CAAC;kCAAuE,CAAC;sBAA4D,CAAC;;wBAA8F,CAAC;;0BAAkG,CAAC;wBAAkE,CAAC;;;;;;;;oDAAme,CAAC;;;;;;;;;;;;;;;;;yBAA4vB,CAAC;;;2BAAkJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gFAAiiH,CAAC;6BAA8E,CAAC;cAAoD,GAAG;eAAgD,GAAG;;oBAA6E,GAAG;;;;;;;eAA4V,GAAG;gBAAiD,GAAG;;;;;;;;;;;wBAAupC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAAiiO,CAAC;kBAA6F,CAAC;mBAA8F,CAAC;oBAA+F,CAAC;;;;;;;;;;;;;;aAAulC,CAAC;;;qBAA+E,CAAC;;;;;uBAAqS,CAAC;;;;;AArH3okB;;;;;;;;;GASG;AACH,cACM,mBAAoB,SAAQ,wBAA6B;IAC7D;;OAEG;IAEH,oBAAoB,SAAW;IAE/B;;OAEG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,IAAI,UAAS;IAEb,YAAY;IAIZ,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAS/C;;OAEG;IACH,OAAO,CAAC,YAAY;IASpB;;OAEG;IACH,OAAO,CAAC,eAAe;IAYvB;;OAEG;IACH,OAAO,CAAC,qBAAqB;IAY7B,MAAM;IAwBN,MAAM,CAAC,iBAAiB;;;;;MAGtB;IAEF,MAAM,CAAC,MAAM,MAAU;CACxB;AACD,eAAe,mBAAmB,CAAC"}
|
|
@@ -46,7 +46,10 @@ let CDSCoachmarkTagline = class CDSCoachmarkTagline extends HostListenerMixin(Li
|
|
|
46
46
|
}
|
|
47
47
|
firstUpdated() {
|
|
48
48
|
this.classList.add(blockClass);
|
|
49
|
-
|
|
49
|
+
}
|
|
50
|
+
updated(changedProperties) {
|
|
51
|
+
if (changedProperties.has("open")) if (this.open) this.classList.add(`${blockClass}--open`);
|
|
52
|
+
else this.classList.remove(`${blockClass}--open`);
|
|
50
53
|
}
|
|
51
54
|
/**
|
|
52
55
|
* Handles the close button click event.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"coachmark-tagline.js","names":["styles","customElement"],"sources":["../../../../src/components/coachmark/coachmark-tagline/coachmark-tagline.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport styles from './coachmark-tagline.scss?lit';\nimport Close16 from '@carbon/icons/es/close/16.js';\nimport Idea16 from '@carbon/icons/es/idea/16.js';\nimport '@carbon/web-components/es/components/button/button.js';\nimport iconLoader from '@carbon/web-components/es/globals/internal/icon-loader';\n\nconst blockClass = `${prefix}--coachmark-tagline`;\n\n/**\n * DO NOT USE. This component is for the exclusive use\n * of other Onboarding components.\n *\n * Coachmark tagline component.\n *\n * @element c4p-coachmark-tagline\n * @fires c4p-coachmark-tagline-close - Custom event fired when close button is clicked\n * @fires c4p-coachmark-tagline-cta-click - Custom event fired when tagline CTA is clicked\n */\n@customElement(`${prefix}-coachmark-tagline`)\nclass CDSCoachmarkTagline extends HostListenerMixin(LitElement) {\n /**\n * Tooltip text and aria label for the Close button icon.\n */\n @property({ type: String, attribute: 'close-icon-description' })\n closeIconDescription = 'Close';\n\n /**\n * The title of the tagline.\n */\n @property({ type: String })\n title = '';\n\n /**\n * Whether the tagline is open.\n */\n @property({ type: Boolean, reflect: true, attribute: 'open' })\n open = false;\n\n firstUpdated() {\n this.classList.add(blockClass);\n if (
|
|
1
|
+
{"version":3,"file":"coachmark-tagline.js","names":["styles","customElement"],"sources":["../../../../src/components/coachmark/coachmark-tagline/coachmark-tagline.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport styles from './coachmark-tagline.scss?lit';\nimport Close16 from '@carbon/icons/es/close/16.js';\nimport Idea16 from '@carbon/icons/es/idea/16.js';\nimport '@carbon/web-components/es/components/button/button.js';\nimport iconLoader from '@carbon/web-components/es/globals/internal/icon-loader';\n\nconst blockClass = `${prefix}--coachmark-tagline`;\n\n/**\n * DO NOT USE. This component is for the exclusive use\n * of other Onboarding components.\n *\n * Coachmark tagline component.\n *\n * @element c4p-coachmark-tagline\n * @fires c4p-coachmark-tagline-close - Custom event fired when close button is clicked\n * @fires c4p-coachmark-tagline-cta-click - Custom event fired when tagline CTA is clicked\n */\n@customElement(`${prefix}-coachmark-tagline`)\nclass CDSCoachmarkTagline extends HostListenerMixin(LitElement) {\n /**\n * Tooltip text and aria label for the Close button icon.\n */\n @property({ type: String, attribute: 'close-icon-description' })\n closeIconDescription = 'Close';\n\n /**\n * The title of the tagline.\n */\n @property({ type: String })\n title = '';\n\n /**\n * Whether the tagline is open.\n */\n @property({ type: Boolean, reflect: true, attribute: 'open' })\n open = false;\n\n firstUpdated() {\n this.classList.add(blockClass);\n }\n\n updated(changedProperties: Map<string, unknown>) {\n if (changedProperties.has('open')) {\n if (this.open) {\n this.classList.add(`${blockClass}--open`);\n } else {\n this.classList.remove(`${blockClass}--open`);\n }\n }\n }\n /**\n * Handles the close button click event.\n */\n private _handleClose() {\n const closeEvent = new CustomEvent(`${prefix}-coachmark-tagline-close`, {\n bubbles: true,\n composed: true,\n detail: {},\n });\n this.dispatchEvent(closeEvent);\n }\n\n /**\n * Handles the CTA button click event.\n */\n private _handleCtaClick(event: Event) {\n const ctaClickEvent = new CustomEvent(\n `${prefix}-coachmark-tagline-cta-click`,\n {\n bubbles: true,\n composed: true,\n detail: { originalEvent: event },\n }\n );\n this.dispatchEvent(ctaClickEvent);\n }\n\n /**\n * Handles the CTA button double click event.\n */\n private _handleCtaDoubleClick(event: Event) {\n const ctaDoubleClickEvent = new CustomEvent(\n `${prefix}-coachmark-tagline-cta-dblclick`,\n {\n bubbles: true,\n composed: true,\n detail: { originalEvent: event },\n }\n );\n this.dispatchEvent(ctaDoubleClickEvent);\n }\n\n render() {\n return html`\n <button\n class=\"${blockClass}__cta\"\n @click=\"${this._handleCtaClick}\"\n @dblclick=\"${this._handleCtaDoubleClick}\"\n >\n ${iconLoader(Idea16, { slot: 'icon' })} ${this.title}\n </button>\n <div class=\"${blockClass}--close-btn-container\">\n <cds-button\n kind=\"ghost\"\n size=\"sm\"\n tooltip-text=\"${this.closeIconDescription}\"\n has-icon-only\n class=\"${blockClass}--close-btn\"\n @click=\"${this._handleClose}\"\n >\n ${iconLoader(Close16, { slot: 'icon' })}\n </cds-button>\n </div>\n `;\n }\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n static styles = styles;\n}\nexport default CDSCoachmarkTagline;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,aAAa,GAAG,OAAO;;;;;;;;;;;AAY7B,gCACM,4BAA4B,kBAAkB,WAAW,CAAC;;;8BAKvC;eAMf;cAMD;;CAEP,eAAe;AACb,OAAK,UAAU,IAAI,WAAW;;CAGhC,QAAQ,mBAAyC;AAC/C,MAAI,kBAAkB,IAAI,OAAO,CAC/B,KAAI,KAAK,KACP,MAAK,UAAU,IAAI,GAAG,WAAW,QAAQ;MAEzC,MAAK,UAAU,OAAO,GAAG,WAAW,QAAQ;;;;;CAOlD,AAAQ,eAAe;EACrB,MAAM,aAAa,IAAI,YAAY,GAAG,OAAO,2BAA2B;GACtE,SAAS;GACT,UAAU;GACV,QAAQ,EAAE;GACX,CAAC;AACF,OAAK,cAAc,WAAW;;;;;CAMhC,AAAQ,gBAAgB,OAAc;EACpC,MAAM,gBAAgB,IAAI,YACxB,GAAG,OAAO,+BACV;GACE,SAAS;GACT,UAAU;GACV,QAAQ,EAAE,eAAe,OAAO;GACjC,CACF;AACD,OAAK,cAAc,cAAc;;;;;CAMnC,AAAQ,sBAAsB,OAAc;EAC1C,MAAM,sBAAsB,IAAI,YAC9B,GAAG,OAAO,kCACV;GACE,SAAS;GACT,UAAU;GACV,QAAQ,EAAE,eAAe,OAAO;GACjC,CACF;AACD,OAAK,cAAc,oBAAoB;;CAGzC,SAAS;AACP,SAAO,IAAI;;iBAEE,WAAW;kBACV,KAAK,gBAAgB;qBAClB,KAAK,sBAAsB;;UAEtC,WAAW,QAAQ,EAAE,MAAM,QAAQ,CAAC,CAAC,GAAG,KAAK,MAAM;;oBAEzC,WAAW;;;;0BAIL,KAAK,qBAAqB;;mBAEjC,WAAW;oBACV,KAAK,aAAa;;YAE1B,WAAW,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAC;;;;;;2BAMrB;GACzB,GAAG,WAAW;GACd,gBAAgB;GACjB;;;gBAEeA;;;YAnGf,SAAS;CAAE,MAAM;CAAQ,WAAW;CAA0B,CAAC;YAM/D,SAAS,EAAE,MAAM,QAAQ,CAAC;YAM1B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAQ,CAAC;kCAjB/DC,cAAc,GAAG,OAAO,oBAAoB;AA0G7C,gCAAe"}
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
import { css } from "lit";
|
|
9
9
|
|
|
10
10
|
//#region src/components/coachmark/coachmark-tagline/coachmark-tagline.scss?lit
|
|
11
|
-
var coachmark_tagline_default = css([".c4p--coachmark-tagline{background:#6929c4;background-image:linear-gradient(90deg,#001d6c,#6929c4);border-radius:.125rem .125rem 0 0;color:#fff!important;display:grid;grid-template-columns:[cta-col] auto [close-btn-col] 2.5rem;inline-size:18rem;inset-block-end:0;inset-inline-end:1rem;opacity:1;overflow:hidden;position:fixed;transition:opacity .24s cubic-bezier(.2,0,1,.9) .3s;transition-delay:.24s;z-index:1000}@media (prefers-reduced-motion){.c4p--coachmark-tagline{transition:none}}.c4p--coachmark-tagline:before{background:linear-gradient(90deg,#0043ce,#6929c4);content:\"\";inset:0;opacity:0;position:absolute;transition:opacity .24s cubic-bezier(.2,0,1,.9);z-index:-1}@media (prefers-reduced-motion){.c4p--coachmark-tagline:before{transition:none}}.c4p--coachmark-tagline:hover:before{opacity:1}.c4p--coachmark-tagline--is-open{background:#fff;opacity:0}.c4p--coachmark-tagline--is-open c4p--coachmark-tagline__cta{opacity:0}.c4p--coachmark-tagline--is-open c4p--coachmark-tagline--close-btn{display:none}.c4p--coachmark-tagline--is-open:before{background:#fff}.c4p--coachmark-tagline__cta{background:transparent;border:none;color:#fff!important;display:grid;font-size:var(--cds-body-short-01-font-size,.875rem);font-weight:var(--cds-body-short-01-font-weight,400);grid-template-columns:[icon-col] 2rem [body-col] auto;letter-spacing:var(--cds-body-short-01-letter-spacing,.16px);line-height:var(--cds-body-short-01-line-height,1.28572);padding:.5rem 0;text-align:start}.c4p--coachmark-tagline__cta:focus{box-shadow:inset 0 0 0 3px #6929c4,inset 0 0 0 .25rem #fff;outline:1px solid transparent}.c4p--coachmark-tagline__cta:hover{cursor:pointer!important}.c4p--coachmark-tagline__cta .c4p--coachmark-tagline__idea{justify-self:center}.c4p--coachmark-tagline--close-btn-container{block-size:2rem;inline-size:2rem;margin-inline-start:auto}.c4p--coachmark-tagline--close-btn{block-size:2rem;border-color:transparent!important;border-radius:0;color:#fff;inline-size:2rem;margin-inline-start:auto!important;outline:1px solid transparent}.c4p--coachmark-tagline--close-btn:active{background-color:var(--cds-button-secondary-active,#6f6f6f)}.c4p--coachmark-tagline--close-btn:focus{box-shadow:inset 0 0 0 1px var(--cds-background-inverse,#393939),inset 0 0 0 .125rem #fff!important}.c4p--coachmark-tagline--close-btn svg>path{margin:0;fill:#fff!important}.c4p--coachmark-tagline--close-btn:hover{background-color:#7c3dd6!important}.c4p--coachmark-tagline__cta svg{justify-self:center}"]);
|
|
11
|
+
var coachmark_tagline_default = css([".c4p--coachmark-tagline{background:#6929c4;background-image:linear-gradient(90deg,#001d6c,#6929c4);border-radius:.125rem .125rem 0 0;color:#fff!important;display:grid;grid-template-columns:[cta-col] auto [close-btn-col] 2.5rem;inline-size:18rem;inset-block-end:0;inset-inline-end:1rem;opacity:1;overflow:hidden;position:fixed;transition:opacity .24s cubic-bezier(.2,0,1,.9) .3s;transition-delay:.24s;z-index:1000}@media (prefers-reduced-motion){.c4p--coachmark-tagline{transition:none}}.c4p--coachmark-tagline:before{background:linear-gradient(90deg,#0043ce,#6929c4);content:\"\";inset:0;opacity:0;position:absolute;transition:opacity .24s cubic-bezier(.2,0,1,.9);z-index:-1}@media (prefers-reduced-motion){.c4p--coachmark-tagline:before{transition:none}}.c4p--coachmark-tagline:hover:before{opacity:1}.c4p--coachmark-tagline--is-open{background:#fff;opacity:0}.c4p--coachmark-tagline--is-open c4p--coachmark-tagline__cta{opacity:0}.c4p--coachmark-tagline--is-open c4p--coachmark-tagline--close-btn{display:none}.c4p--coachmark-tagline--is-open:before{background:#fff}.c4p--coachmark-tagline__cta{background:transparent;border:none;color:#fff!important;display:grid;font-size:var(--cds-body-short-01-font-size,.875rem);font-weight:var(--cds-body-short-01-font-weight,400);grid-template-columns:[icon-col] 2rem [body-col] auto;letter-spacing:var(--cds-body-short-01-letter-spacing,.16px);line-height:var(--cds-body-short-01-line-height,1.28572);padding:.5rem 0;text-align:start}.c4p--coachmark-tagline__cta:focus{box-shadow:inset 0 0 0 3px #6929c4,inset 0 0 0 .25rem #fff;outline:1px solid transparent}.c4p--coachmark-tagline__cta:hover{cursor:pointer!important}.c4p--coachmark-tagline__cta .c4p--coachmark-tagline__idea{justify-self:center}.c4p--coachmark-tagline--close-btn-container{block-size:2rem;inline-size:2rem;margin-inline-start:auto}.c4p--coachmark-tagline--close-btn{block-size:2rem;border-color:transparent!important;border-radius:0;color:#fff;inline-size:2rem;margin-inline-start:auto!important;outline:1px solid transparent}.c4p--coachmark-tagline--close-btn:active{background-color:var(--cds-button-secondary-active,#6f6f6f)}.c4p--coachmark-tagline--close-btn:focus{box-shadow:inset 0 0 0 1px var(--cds-background-inverse,#393939),inset 0 0 0 .125rem #fff!important}.c4p--coachmark-tagline--close-btn svg>path{margin:0;fill:#fff!important}.c4p--coachmark-tagline--close-btn:hover{background-color:#7c3dd6!important}.c4p--coachmark-tagline--open{background:#fff;opacity:0}.c4p--coachmark-tagline--open .c4p--coachmark-tagline__cta{opacity:0}.c4p--coachmark-tagline--open .c4p--coachmark-tagline--close-btn{display:none}.c4p--coachmark-tagline--open:before{background:#fff}.c4p--coachmark-tagline__cta svg{justify-self:center}"]);
|
|
12
12
|
|
|
13
13
|
//#endregion
|
|
14
14
|
export { coachmark_tagline_default as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"coachmark-tagline.scss.js","names":[],"sources":["../../../../src/components/coachmark/coachmark-tagline/coachmark-tagline.scss?lit"],"sourcesContent":["//\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\n$css--plex: true !default;\n\n@use '@carbon/ibm-products-styles/scss/config';\n@use '@carbon/ibm-products-styles/scss/components/Coachmark/_coachmark-tagline';\n$prefix: config.$pkg-prefix;\n\n$block-class: #{$prefix}--coachmark-tagline;\n\n.#{$block-class} {\n &__cta {\n svg {\n justify-self: center;\n }\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"coachmark-tagline.scss.js","names":[],"sources":["../../../../src/components/coachmark/coachmark-tagline/coachmark-tagline.scss?lit"],"sourcesContent":["//\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\n$css--plex: true !default;\n\n@use '@carbon/ibm-products-styles/scss/config';\n@use '@carbon/ibm-products-styles/scss/components/Coachmark/_coachmark-tagline';\n@use '@carbon/styles/scss/colors' as *;\n$prefix: config.$pkg-prefix;\n\n$block-class: #{$prefix}--coachmark-tagline;\n\n.#{$block-class} {\n &--open {\n background: $white-0;\n opacity: 0;\n\n .#{$block-class}__cta {\n opacity: 0;\n }\n\n .#{$block-class}--close-btn {\n display: none;\n }\n\n &::before {\n background: $white-0;\n }\n }\n\n &__cta {\n svg {\n justify-self: center;\n }\n }\n}\n"],"mappings":""}
|
|
@@ -408,12 +408,16 @@ declare class CDSCoachmark extends CDSCoachmark_base {
|
|
|
408
408
|
* Specify whether a drop shadow should be rendered on the popover.
|
|
409
409
|
*/
|
|
410
410
|
dropShadow?: boolean;
|
|
411
|
+
/**
|
|
412
|
+
* Specify whether a caret should be rendered on the popover. This is intended to use only for coachmark patterns.
|
|
413
|
+
*/
|
|
414
|
+
caret?: boolean;
|
|
411
415
|
private dragCleanup;
|
|
412
416
|
disconnectedCallback(): void;
|
|
413
417
|
private setupDraggable;
|
|
414
418
|
firstUpdated(): void;
|
|
415
419
|
updated(changedProps: Map<string, unknown>): void;
|
|
416
|
-
private
|
|
420
|
+
private handlePopoverClosed;
|
|
417
421
|
render(): import("lit-html").TemplateResult<1>;
|
|
418
422
|
/**
|
|
419
423
|
* The name of the custom event fired when this coachmark is opened.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"coachmark.d.ts","sourceRoot":"","sources":["../../../src/components/coachmark/coachmark.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAOvC,OAAO,uDAAuD,CAAC;AAQ/D,eAAO,MAAM,UAAU,mBAAyB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAcL,CAAC;gJAMtB,CAAC;4FAKD,CAAC;mJAOC,CAAC;+
|
|
1
|
+
{"version":3,"file":"coachmark.d.ts","sourceRoot":"","sources":["../../../src/components/coachmark/coachmark.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAOvC,OAAO,uDAAuD,CAAC;AAQ/D,eAAO,MAAM,UAAU,mBAAyB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAcL,CAAC;gJAMtB,CAAC;4FAKD,CAAC;mJAOC,CAAC;+FAKb,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BAmCe,CAAA;;;;;;;;;;;;;;;;;;;;;;;uBA8EjB,CAAA;;;;;;;;;;;;;iCA4B8B,CAAC;kCACJ,CAAC;sBAG9B,CAAC;;wBAMwB,CAAC;;0BAGN,CAAC;wBAMT,CAAC;;;;;;;;oDACsc,CAAC;;;;;;;;;;;;;;;;;yBAA4vB,CAAC;;;2BAAkJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gFAAiiH,CAAC;6BAA8E,CAAC;cAAoD,GAAG;eAAgD,GAAG;;oBAA6E,GAAG;;;;;;;eAA4V,GAAG;gBAAiD,GAAG;;;;;;;;;;;wBAAupC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAAiiO,CAAC;kBAA6F,CAAC;mBAA8F,CAAC;oBAA+F,CAAC;;;;;;;;;;;;;;aAAulC,CAAC;;;qBAA+E,CAAC;;;;;uBAAqS,CAAC;;;;;AApMn9e;;;;;;GAMG;AACH,cACM,YAAa,SAAQ,iBAA4C;IACrE;;OAEG;IAEH,IAAI,EAAE,OAAO,CAAS;IACtB;;OAEG;IAEH,KAAK,CAAC,EAAE,MAAM,CAAyB;IACvC;;OAEG;IAEH,QAAQ,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACpC;;OAEG;IAEH,QAAQ,CAAC,EAAE,OAAO,CAAS;IAC3B;;OAEG;IAEH,YAAY,CAAC,EAAE,OAAO,CAAS;IAC/B;;OAEG;IAEH,UAAU,CAAC,EAAE,OAAO,CAAS;IAC7B;;OAEG;IAEH,KAAK,CAAC,EAAE,OAAO,CAAS;IAExB,OAAO,CAAC,WAAW,CAA6B;IAEhD,oBAAoB;IAQpB,OAAO,CAAC,cAAc;IAqDtB,YAAY;IAWZ,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IA2B1C,OAAO,CAAC,mBAAmB,CAMzB;IAEF,MAAM;IA+BN;;OAEG;IACH,MAAM,KAAK,SAAS,WAEnB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,YAAY,CAAC"}
|
|
@@ -43,9 +43,10 @@ let CDSCoachmark = class CDSCoachmark extends SignalWatcher(HostListenerMixin(Li
|
|
|
43
43
|
this.floating = false;
|
|
44
44
|
this.highContrast = false;
|
|
45
45
|
this.dropShadow = false;
|
|
46
|
+
this.caret = false;
|
|
46
47
|
this.dragCleanup = null;
|
|
47
|
-
this.
|
|
48
|
-
if (this.
|
|
48
|
+
this.handlePopoverClosed = () => {
|
|
49
|
+
if (this.open) this.open = false;
|
|
49
50
|
};
|
|
50
51
|
}
|
|
51
52
|
disconnectedCallback() {
|
|
@@ -105,18 +106,21 @@ let CDSCoachmark = class CDSCoachmark extends SignalWatcher(HostListenerMixin(Li
|
|
|
105
106
|
}
|
|
106
107
|
}
|
|
107
108
|
render() {
|
|
109
|
+
const caretValue = this.caret !== void 0 ? this.caret : this.floating === true ? false : true;
|
|
108
110
|
return html`
|
|
109
111
|
<cds-popover
|
|
112
|
+
part="popover"
|
|
113
|
+
exportparts="popover-container"
|
|
110
114
|
class="${blockClass}--popover"
|
|
111
115
|
?open=${this.open}
|
|
112
|
-
.caret=${
|
|
116
|
+
.caret=${caretValue}
|
|
113
117
|
?highContrast=${this.highContrast}
|
|
114
118
|
align=${this.align}
|
|
115
119
|
?dropShadow=${this.dropShadow}
|
|
116
|
-
@cds-popover-
|
|
120
|
+
@cds-popover-closed=${this.handlePopoverClosed}
|
|
117
121
|
>
|
|
118
122
|
<slot name="trigger"></slot>
|
|
119
|
-
<cds-popover-content>
|
|
123
|
+
<cds-popover-content part="popover-content" exportparts="content">
|
|
120
124
|
<div class="${blockClass}--wrapper">
|
|
121
125
|
<slot></slot>
|
|
122
126
|
</div>
|
|
@@ -149,6 +153,7 @@ __decorate([property({
|
|
|
149
153
|
})], CDSCoachmark.prototype, "floating", void 0);
|
|
150
154
|
__decorate([property({ reflect: true })], CDSCoachmark.prototype, "highContrast", void 0);
|
|
151
155
|
__decorate([property({ reflect: true })], CDSCoachmark.prototype, "dropShadow", void 0);
|
|
156
|
+
__decorate([property({ reflect: true })], CDSCoachmark.prototype, "caret", void 0);
|
|
152
157
|
CDSCoachmark = __decorate([carbonElement(`${prefix}-coachmark`)], CDSCoachmark);
|
|
153
158
|
var coachmark_default = CDSCoachmark;
|
|
154
159
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"coachmark.js","names":["styles","customElement"],"sources":["../../../src/components/coachmark/coachmark.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 { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport styles from './coachmark.scss?lit';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport '@carbon/web-components/es/components/popover/index.js';\nimport { POPOVER_ALIGNMENT } from '@carbon/web-components/es/components/popover/defs.js';\nimport { makeDraggable } from '../../utilities/makeDraggable/makeDraggable';\nimport {\n resetCoachmarkDetailsSignal,\n updateCoachmarkDetailsSignal,\n} from './coachmark-context';\n\nexport const blockClass = `${prefix}--coachmark`;\n\n/**\n * coachmark main component\n * @element c4p-coachmark\n * @fires c4p-coachmark-opened\n * The custom event fired when the coachmark is opened.\n * This event can be used to perform actions such as focusing elements when the coachmark becomes visible.\n */\n@customElement(`${prefix}-coachmark`)\nclass CDSCoachmark extends SignalWatcher(HostListenerMixin(LitElement)) {\n /**\n * Specifies whether the component is currently open.\n */\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n /**\n * Where to render the Coachmark relative to its target.\n */\n @property({ reflect: true, type: String })\n align?: string = POPOVER_ALIGNMENT.TOP;\n /**\n * Fine tune the position of the target in pixels.\n */\n @property({ type: Object })\n position?: { x: number; y: number };\n /**\n * Specifies whether the component is floating or not.\n */\n @property({ type: Boolean, reflect: true })\n floating?: boolean = false;\n /**\n * Specify whether the component should be rendered on high-contrast.\n */\n @property({ reflect: true })\n highContrast?: boolean = false;\n
|
|
1
|
+
{"version":3,"file":"coachmark.js","names":["styles","customElement"],"sources":["../../../src/components/coachmark/coachmark.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 { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport styles from './coachmark.scss?lit';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport '@carbon/web-components/es/components/popover/index.js';\nimport { POPOVER_ALIGNMENT } from '@carbon/web-components/es/components/popover/defs.js';\nimport { makeDraggable } from '../../utilities/makeDraggable/makeDraggable';\nimport {\n resetCoachmarkDetailsSignal,\n updateCoachmarkDetailsSignal,\n} from './coachmark-context';\n\nexport const blockClass = `${prefix}--coachmark`;\n\n/**\n * coachmark main component\n * @element c4p-coachmark\n * @fires c4p-coachmark-opened\n * The custom event fired when the coachmark is opened.\n * This event can be used to perform actions such as focusing elements when the coachmark becomes visible.\n */\n@customElement(`${prefix}-coachmark`)\nclass CDSCoachmark extends SignalWatcher(HostListenerMixin(LitElement)) {\n /**\n * Specifies whether the component is currently open.\n */\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n /**\n * Where to render the Coachmark relative to its target.\n */\n @property({ reflect: true, type: String })\n align?: string = POPOVER_ALIGNMENT.TOP;\n /**\n * Fine tune the position of the target in pixels.\n */\n @property({ type: Object })\n position?: { x: number; y: number };\n /**\n * Specifies whether the component is floating or not.\n */\n @property({ type: Boolean, reflect: true })\n floating?: boolean = false;\n /**\n * Specify whether the component should be rendered on high-contrast.\n */\n @property({ reflect: true })\n highContrast?: boolean = false;\n /**\n * Specify whether a drop shadow should be rendered on the popover.\n */\n @property({ reflect: true })\n dropShadow?: boolean = false;\n /**\n * Specify whether a caret should be rendered on the popover. This is intended to use only for coachmark patterns.\n */\n @property({ reflect: true })\n caret?: boolean = false;\n\n private dragCleanup: (() => void) | null = null;\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this.dragCleanup) {\n this.dragCleanup();\n }\n resetCoachmarkDetailsSignal();\n }\n\n private setupDraggable() {\n const popover = this.shadowRoot?.querySelector(\n `.${blockClass}--popover`\n ) as HTMLElement;\n const popoverContent = popover.querySelector(\n 'cds-popover-content'\n ) as HTMLElement;\n const wrapper = popoverContent.querySelector(\n `.${blockClass}--wrapper`\n ) as HTMLElement;\n const slot = wrapper.querySelector('slot');\n const assignedElements = slot?.assignedElements({ flatten: true });\n const header = assignedElements?.find(\n (el) => el.tagName.toLowerCase() === `${prefix}-coachmark-header`\n ) as HTMLElement;\n requestAnimationFrame(() => {\n const dragHandle = header.shadowRoot?.querySelector(\n `.${prefix}--coachmark-header-drag-handle`\n ) as HTMLElement;\n\n const draggable = makeDraggable({\n el: popoverContent,\n dragHandle: header,\n focusableDragHandle: dragHandle,\n });\n\n const onDragStart = () => {\n popoverContent.classList.add('is-dragging');\n popoverContent.setAttribute(\n 'aria-label',\n 'Picked up the draggable popoverContent'\n );\n };\n const onDragEnd = () => {\n popoverContent.classList.remove('is-dragging');\n popoverContent.setAttribute(\n 'aria-label',\n 'Draggable popoverContent was dropped'\n );\n };\n\n popoverContent.addEventListener('dragstart', onDragStart);\n popoverContent.addEventListener('dragend', onDragEnd);\n\n // store cleanup\n this.dragCleanup = () => {\n popoverContent.removeEventListener('dragstart', onDragStart);\n popoverContent.removeEventListener('dragend', onDragEnd);\n draggable.cleanup?.();\n };\n });\n }\n\n firstUpdated() {\n if (this.floating) {\n this.classList.add(`${blockClass}--floating`);\n this.setupDraggable();\n updateCoachmarkDetailsSignal({\n name: 'floating',\n detail: this.floating,\n });\n }\n }\n\n updated(changedProps: Map<string, unknown>) {\n if (changedProps.has('position')) {\n const { x = 0, y = 0 } = this.position ?? {};\n if (x !== 0 || y !== 0) {\n this.style.transform = `translate(${x}px, ${y}px)`;\n }\n }\n\n // Dispatch custom events when coachmark opens or closes\n if (changedProps.has('open')) {\n const init = {\n bubbles: true,\n composed: true,\n detail: { open: this.open },\n };\n\n if (this.open) {\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSCoachmark).eventOpen,\n init\n )\n );\n }\n }\n }\n\n private handlePopoverClosed = () => {\n // Sync coachmark's open state when popover closes\n // This ensures the states stay in sync for outside clicks\n if (this.open) {\n this.open = false;\n }\n };\n\n render() {\n // Use explicit caret value if provided, otherwise derive from floating state\n const caretValue =\n this.caret !== undefined\n ? this.caret\n : this.floating === true\n ? false\n : true;\n\n return html`\n <cds-popover\n part=\"popover\"\n exportparts=\"popover-container\"\n class=\"${blockClass}--popover\"\n ?open=${this.open}\n .caret=${caretValue}\n ?highContrast=${this.highContrast}\n align=${this.align}\n ?dropShadow=${this.dropShadow}\n @cds-popover-closed=${this.handlePopoverClosed}\n >\n <slot name=\"trigger\"></slot>\n <cds-popover-content part=\"popover-content\" exportparts=\"content\">\n <div class=\"${blockClass}--wrapper\">\n <slot></slot>\n </div>\n </cds-popover-content>\n </cds-popover>\n `;\n }\n\n /**\n * The name of the custom event fired when this coachmark is opened.\n */\n static get eventOpen() {\n return `${prefix}-coachmark-opened`;\n }\n\n static styles = styles;\n}\n\nexport default CDSCoachmark;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,aAAa,GAAG,OAAO;;;;;;;;AASpC,yBACM,qBAAqB,cAAc,kBAAkB,WAAW,CAAC,CAAC;;;cAKtD;eAKC,kBAAkB;kBAUd;sBAKI;oBAKF;eAKL;qBAEyB;mCAqGP;AAGlC,OAAI,KAAK,KACP,MAAK,OAAO;;;CAvGhB,uBAAuB;AACrB,QAAM,sBAAsB;AAC5B,MAAI,KAAK,YACP,MAAK,aAAa;AAEpB,+BAA6B;;CAG/B,AAAQ,iBAAiB;EAIvB,MAAM,kBAHU,KAAK,YAAY,cAC/B,IAAI,WAAW,WAChB,EAC8B,cAC7B,sBACD;EAMD,MAAM,UALU,eAAe,cAC7B,IAAI,WAAW,WAChB,CACoB,cAAc,OAAO,EACX,iBAAiB,EAAE,SAAS,MAAM,CAAC,GACjC,MAC9B,OAAO,GAAG,QAAQ,aAAa,KAAK,GAAG,OAAO,mBAChD;AACD,8BAA4B;GAC1B,MAAM,aAAa,OAAO,YAAY,cACpC,IAAI,OAAO,gCACZ;GAED,MAAM,YAAY,cAAc;IAC9B,IAAI;IACJ,YAAY;IACZ,qBAAqB;IACtB,CAAC;GAEF,MAAM,oBAAoB;AACxB,mBAAe,UAAU,IAAI,cAAc;AAC3C,mBAAe,aACb,cACA,yCACD;;GAEH,MAAM,kBAAkB;AACtB,mBAAe,UAAU,OAAO,cAAc;AAC9C,mBAAe,aACb,cACA,uCACD;;AAGH,kBAAe,iBAAiB,aAAa,YAAY;AACzD,kBAAe,iBAAiB,WAAW,UAAU;AAGrD,QAAK,oBAAoB;AACvB,mBAAe,oBAAoB,aAAa,YAAY;AAC5D,mBAAe,oBAAoB,WAAW,UAAU;AACxD,cAAU,WAAW;;IAEvB;;CAGJ,eAAe;AACb,MAAI,KAAK,UAAU;AACjB,QAAK,UAAU,IAAI,GAAG,WAAW,YAAY;AAC7C,QAAK,gBAAgB;AACrB,gCAA6B;IAC3B,MAAM;IACN,QAAQ,KAAK;IACd,CAAC;;;CAIN,QAAQ,cAAoC;AAC1C,MAAI,aAAa,IAAI,WAAW,EAAE;GAChC,MAAM,EAAE,IAAI,GAAG,IAAI,MAAM,KAAK,YAAY,EAAE;AAC5C,OAAI,MAAM,KAAK,MAAM,EACnB,MAAK,MAAM,YAAY,aAAa,EAAE,MAAM,EAAE;;AAKlD,MAAI,aAAa,IAAI,OAAO,EAAE;GAC5B,MAAM,OAAO;IACX,SAAS;IACT,UAAU;IACV,QAAQ,EAAE,MAAM,KAAK,MAAM;IAC5B;AAED,OAAI,KAAK,KACP,MAAK,cACH,IAAI,YACD,KAAK,YAAoC,WAC1C,KACD,CACF;;;CAaP,SAAS;EAEP,MAAM,aACJ,KAAK,UAAU,SACX,KAAK,QACL,KAAK,aAAa,OAChB,QACA;AAER,SAAO,IAAI;;;;iBAIE,WAAW;gBACZ,KAAK,KAAK;iBACT,WAAW;wBACJ,KAAK,aAAa;gBAC1B,KAAK,MAAM;sBACL,KAAK,WAAW;8BACR,KAAK,oBAAoB;;;;wBAI/B,WAAW;;;;;;;;;;CAWjC,WAAW,YAAY;AACrB,SAAO,GAAG,OAAO;;;gBAGHA;;;YApLf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAK1C,SAAS;CAAE,SAAS;CAAM,MAAM;CAAQ,CAAC;YAKzC,SAAS,EAAE,MAAM,QAAQ,CAAC;YAK1B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAK1C,SAAS,EAAE,SAAS,MAAM,CAAC;YAK3B,SAAS,EAAE,SAAS,MAAM,CAAC;YAK3B,SAAS,EAAE,SAAS,MAAM,CAAC;2BAnC7BC,cAAc,GAAG,OAAO,YAAY;AA4LrC,wBAAe"}
|