npm - @carbon/ibm-products-web-components - Versions diffs - 0.45.0 → 0.46.0 - Mend

@carbon/ibm-products-web-components 0.45.0 → 0.46.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (128) hide show

package/es/components/add-select/add-select-selection-summary.scss.js ADDED Viewed

@@ -0,0 +1,14 @@
+/**
+ * Copyright IBM Corp. 2020, 2026
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { css } from "lit";
+//#region src/components/add-select/add-select-selection-summary.scss?lit
+var add_select_selection_summary_default = css([".c4p--add-select__next{position:relative}.c4p--add-select__next,.c4p--add-select__next__body{block-size:100%;display:flex;flex-direction:column;inline-size:100%}.c4p--add-select__next__header{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding-block-end:.5rem;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next__search{margin-block-end:1rem}.c4p--add-select__next__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next__search-input{flex:1}.c4p--add-select__next__global-actions{align-items:flex-end;display:flex}.c4p--add-select__next__sub-header{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__tags{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next__tags-label{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin:0}.c4p--add-select__next__sub-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:1rem}.c4p--add-select__next__content{display:flex;flex:1;flex-direction:column;overflow:auto}.c4p--add-select__next-list{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-list{overflow-block:auto}}.c4p--add-select__next-list:focus{outline:none}.c4p--add-select__next-list-body{display:flex;flex-direction:column}.c4p--add-select__next-list-body--horizontal{align-items:stretch;block-size:100%;flex-direction:row}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-row{border-inline-start:.125rem solid transparent;display:flex;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row:focus:not(:focus-visible){outline:none}.c4p--add-select__next-row--selected{background-color:var(--cds-layer-selected-01,#e0e0e0)}.c4p--add-select__next-row--selected .c4p--add-select__next-row__cell-wrapper{border-block-end-color:var(--cds-border-subtle-selected-01,#c6c6c6)}.c4p--add-select__next-row--disabled{cursor:not-allowed}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__subtitle,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__title{color:var(--cds-text-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__icon svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-link-primary,#0f62fe)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-selected-hover-01,#d1d1d1)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row__cell{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__cell-wrapper{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;justify-content:space-between;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem}.c4p--add-select__next-row__content{align-items:center;align-self:center;display:flex;flex:1}.c4p--add-select__next-row__checkbox{align-self:center;flex:none;margin-inline-end:1rem}.c4p--add-select__next-row__radio{align-self:center}.c4p--add-select__next-row__radio .cds--radio-button__appearance{margin-inline-end:0}.c4p--add-select__next-row__icon{align-items:center;display:flex;margin-inline-end:.5rem}.c4p--add-select__next-row__text{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616);display:block;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)}.c4p--add-select__next-row__subtitle{color:var(--cds-text-secondary,#525252);display:block;font-size:var(--cds-helper-text-01-font-size,.75rem);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333)}.c4p--add-select__next-row__meta{align-items:center;display:flex;margin-inline-start:.5rem}.c4p--add-select__next-row__view-item-panel{margin-inline-start:auto}.c4p--add-select__next-row-item-panel--selected{background-color:var(--cds-layer-hover-01,#e8e8e8);border-inline-start:.125rem solid var(--cds-interactive,#0f62fe)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:none}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}}.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row--skeleton{cursor:default;pointer-events:none}.c4p--add-select__next-row--skeleton:hover{background:none}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-control{background-color:var(--cds-skeleton-element,#c6c6c6);block-size:1rem;border-radius:.125rem;flex:none;inline-size:1rem;margin-inline-end:1rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton{block-size:2rem;border-radius:50%;inline-size:2rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton:before{animation:none;border-radius:50%}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-title{margin-block-end:0}.c4p--add-select__next-column{block-size:100%;border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;flex-direction:column;min-inline-size:300px;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column:last-child{border-inline-end:none}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column:last-child{border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6)}.c4p--add-select__next-column__actions,.c4p--add-select__next-column__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next-column__search-bar{padding-block-end:0;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next-column__search-wrapper{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__search-input{flex:1}.c4p--add-select__next-column__controls{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__filter-button,.c4p--add-select__next-column__sort-button{flex:none}.c4p--add-select__next-column__filter-popover{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper{margin-block-end:.5rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper:last-child{margin-block-end:0}.c4p--add-select__next-column__header{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__select-all .cds--checkbox-label{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__select-all .cds--checkbox-label-text{align-items:center;display:flex;gap:.5rem;margin-inline-start:.5rem}.c4p--add-select__next-column__title-wrapper{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next-column__title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next-column__rows{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-column__rows{overflow-block:auto}}.c4p--add-select__next__breadcrumbs{flex-wrap:wrap}.c4p--add-select__next__breadcrumb-item,.c4p--add-select__next__breadcrumbs{align-items:center;display:flex;gap:.25rem}.c4p--add-select__next__breadcrumb-button{background:none;border:none;color:var(--cds-link-primary,#0f62fe);cursor:pointer;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);padding-block:0;padding-inline:0;text-decoration:none}.c4p--add-select__next__breadcrumb-button:hover{color:var(--cds-link-primary-hover,#0043ce);text-decoration:underline}.c4p--add-select__next__breadcrumb-button:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:.125rem}.c4p--add-select__next__breadcrumb-separator{align-items:center;color:var(--cds-text-secondary,#525252);display:flex}.c4p--add-select__next__breadcrumb-separator svg{fill:currentColor}.c4p--add-select__next__breadcrumb-current{color:var(--cds-text-primary,#161616);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)}.c4p--add-select__next__selection-summary{display:flex;flex-direction:column}.c4p--add-select__next__selection-summary-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;padding-block-end:.5rem;padding-block-start:1.5rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin-inline-end:.5rem}.c4p--add-select__next__selection-summary-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:auto}.c4p--add-select__next__selection-summary-item{background-color:var(--cds-layer-01,#f4f4f4);border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);position:relative}.c4p--add-select__next__selection-summary-item:hover{background-color:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item,.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item:last-child{border-block-end:none;border-block-start:none}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__heading{min-block-size:unset;padding-block:.75rem;padding-inline-end:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between;padding-block:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-content{padding-block-end:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__selection-summary-item-selected-item{flex:1}.c4p--add-select__next__selection-summary-item-title{color:var(--cds-text-primary,#161616);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)}.c4p--add-select__next__selection-summary-item-subtitle{color:var(--cds-text-secondary,#525252);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)}.c4p--add-select__next__selection-summary-item-entry{margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-header{color:var(--cds-text-secondary,#525252);font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333);margin-block-end:.5rem}.c4p--add-select__next__selection-summary-item-body{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);margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-remove-button-container{align-items:center;display:inline-flex;justify-content:center;padding-inline-start:.5rem}.c4p--add-select__next__selection-summary-item--accordion .c4p--add-select__next__selection-summary-item-remove-button-container{inset-block-start:50%;inset-inline-end:1rem;padding-inline-start:0;position:absolute;transform:translateY(-50%)}.c4p--add-select__next__selection-summary-item-remove-button{opacity:0;transition:opacity 70ms cubic-bezier(.2,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next__selection-summary-item-remove-button{transition:none}}.c4p--add-select__next__selection-summary-item:focus-within .c4p--add-select__next__selection-summary-item-remove-button,.c4p--add-select__next__selection-summary-item:hover .c4p--add-select__next__selection-summary-item-remove-button{opacity:1}.c4p--add-select__next__selection-summary-item-content{margin-block-start:0}.c4p--add-select__next__selection-summary .cds--accordion__arrow{transform:rotate(90deg)}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__arrow{transform:rotate(-90deg)}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__arrow{margin-block:0;margin-inline-end:0;margin-inline-start:1rem}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__title{margin-inline-end:0;margin-inline-start:.5rem;padding-inline-end:2rem}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__content{margin-block-start:0;padding-block:1rem;padding-inline:1rem}@keyframes add-select-item-panel-entrance{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes add-select-item-panel-exit{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}@keyframes add-select-item-panel-entrance-reduced{0%{opacity:0}to{opacity:1}}@keyframes add-select-item-panel-exit-reduced{0%{opacity:1}to{opacity:0}}.c4p--add-select__next__item-summary-panel{block-size:100%;display:none;inline-size:100%;transform:translateX(0);transition-behavior:allow-discrete;transition-duration:.15s;transition-property:display,opacity,transform}.c4p--add-select__next__item-summary-panel--open{animation:add-select-item-panel-entrance .15s cubic-bezier(0,0,.38,.9) forwards;display:flex;flex-direction:column}@starting-style{.c4p--add-select__next__item-summary-panel--open{opacity:0;transform:translateX(100%)}}@media (prefers-reduced-motion){.c4p--add-select__next__item-summary-panel--open{animation:add-select-item-panel-entrance-reduced .15s cubic-bezier(0,0,.38,.9) forwards}@starting-style{.c4p--add-select__next__item-summary-panel--open{opacity:0;transform:translateX(0)}}}.c4p--add-select__next__item-summary-panel-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;gap:.5rem;justify-content:space-between;padding-block-end:.5rem;padding-block-start:2rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375)}.c4p--add-select__next__item-summary-panel-body{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-entry{margin-block-end:1rem}.c4p--add-select__next__item-summary-panel-entry-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__item-summary-panel-entry-body{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)}:host(c4p-add-select-selection-summary){display:block}:host(c4p-add-select-selection-summary) .c4p--add-select__next__selection-summary{block-size:100%;display:flex;flex-direction:column}:host(c4p-add-select-selection-summary) .c4p--add-select__next__selection-summary-header{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;gap:.5rem;padding:.75rem 1rem}:host(c4p-add-select-selection-summary) .c4p--add-select__next__selection-summary-title{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572);margin:0;margin-inline-end:.5rem}:host(c4p-add-select-selection-summary) .c4p--add-select__next__selection-summary-header-actions{align-items:center;display:flex;gap:.25rem;margin-inline-start:auto}:host(c4p-add-select-selection-summary) .c4p--add-select__next__selection-summary-body{flex:1;overflow:auto}@supports (overflow-block:auto){:host(c4p-add-select-selection-summary) .c4p--add-select__next__selection-summary-body{overflow-block:auto}}"]);
+//#endregion
+export { add_select_selection_summary_default as default };
+//# sourceMappingURL=add-select-selection-summary.scss.js.map

package/es/components/add-select/add-select-selection-summary.scss.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"add-select-selection-summary.scss.js","names":[],"sources":["../../../src/components/add-select/add-select-selection-summary.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/styles/scss/theme' as *;\n@use '@carbon/styles/scss/spacing' as *;\n@use '@carbon/styles/scss/type';\n\n$prefix: 'c4p';\n\n@use '@carbon/ibm-products-styles/scss/components/AddSelect/add-select_next'\n as *;\n\n:host(#{$prefix}-add-select-selection-summary) {\n display: block;\n\n .#{$block-class__next}__selection-summary {\n display: flex;\n flex-direction: column;\n block-size: 100%;\n }\n\n .#{$block-class__next}__selection-summary-header {\n display: flex;\n align-items: center;\n padding: $spacing-04 $spacing-05;\n border-block-end: 1px solid $border-subtle-01;\n gap: $spacing-03;\n }\n\n .#{$block-class__next}__selection-summary-title {\n @include type.type-style('heading-compact-01');\n\n margin: 0;\n color: $text-primary;\n margin-inline-end: $spacing-03;\n }\n\n .#{$block-class__next}__selection-summary-header-actions {\n display: flex;\n align-items: center;\n gap: $spacing-02;\n margin-inline-start: auto;\n }\n\n .#{$block-class__next}__selection-summary-body {\n overflow: auto;\n flex: 1;\n @supports (overflow-block: auto) {\n overflow-block: auto;\n }\n }\n}\n"],"mappings":""}

package/es/components/add-select/add-select.scss.js CHANGED Viewed

@@ -7,7 +7,7 @@
 import { css } from "lit";
 //#region src/components/add-select/add-select.scss?lit
-var add_select_default = css([".c4p--add-select__next{position:relative}.c4p--add-select__next,.c4p--add-select__next__body{block-size:100%;display:flex;flex-direction:column;inline-size:100%}.c4p--add-select__next__header{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding-block-end:.5rem;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next__search{margin-block-end:1rem}.c4p--add-select__next__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next__search-input{flex:1}.c4p--add-select__next__global-actions{align-items:flex-end;display:flex}.c4p--add-select__next__sub-header{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__tags{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next__tags-label{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin:0}.c4p--add-select__next__sub-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:1rem}.c4p--add-select__next__content{display:flex;flex:1;flex-direction:column;overflow:auto}.c4p--add-select__next-list{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-list{overflow-block:auto}}.c4p--add-select__next-list:focus{outline:none}.c4p--add-select__next-list-body{display:flex;flex-direction:column}.c4p--add-select__next-list-body--horizontal{align-items:stretch;block-size:100%;flex-direction:row}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-row{border-inline-start:.125rem solid transparent;display:flex;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row:focus:not(:focus-visible){outline:none}.c4p--add-select__next-row--selected{background-color:var(--cds-layer-selected-01,#e0e0e0)}.c4p--add-select__next-row--selected .c4p--add-select__next-row__cell-wrapper{border-block-end-color:var(--cds-border-subtle-selected-01,#c6c6c6)}.c4p--add-select__next-row--disabled{cursor:not-allowed}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__subtitle,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__title{color:var(--cds-text-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__icon svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-link-primary,#0f62fe)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-selected-hover-01,#d1d1d1)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row__cell{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__cell-wrapper{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;justify-content:space-between;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem}.c4p--add-select__next-row__content{align-items:center;align-self:center;display:flex;flex:1}.c4p--add-select__next-row__checkbox{align-self:center;flex:none;margin-inline-end:1rem}.c4p--add-select__next-row__radio{align-self:center}.c4p--add-select__next-row__radio .cds--radio-button__appearance{margin-inline-end:0}.c4p--add-select__next-row__icon{align-items:center;display:flex;margin-inline-end:.5rem}.c4p--add-select__next-row__text{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616);display:block;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)}.c4p--add-select__next-row__subtitle{color:var(--cds-text-secondary,#525252);display:block;font-size:var(--cds-helper-text-01-font-size,.75rem);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333)}.c4p--add-select__next-row__meta{align-items:center;display:flex;margin-inline-start:.5rem}.c4p--add-select__next-row__view-item-panel{margin-inline-start:auto}.c4p--add-select__next-row-item-panel--selected{background-color:var(--cds-layer-hover-01,#e8e8e8);border-inline-start:.125rem solid var(--cds-interactive,#0f62fe)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:none}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}}.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row--skeleton{cursor:default;pointer-events:none}.c4p--add-select__next-row--skeleton:hover{background:none}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-control{background-color:var(--cds-skeleton-element,#c6c6c6);block-size:1rem;border-radius:.125rem;flex:none;inline-size:1rem;margin-inline-end:1rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton{block-size:2rem;border-radius:50%;inline-size:2rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton:before{animation:none;border-radius:50%}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-title{margin-block-end:0}.c4p--add-select__next-column{block-size:100%;border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;flex-direction:column;min-inline-size:300px;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column:last-child{border-inline-end:none}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column:last-child{border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6)}.c4p--add-select__next-column__actions,.c4p--add-select__next-column__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next-column__search-bar{padding-block-end:0;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next-column__search-wrapper{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__search-input{flex:1}.c4p--add-select__next-column__controls{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__filter-button,.c4p--add-select__next-column__sort-button{flex:none}.c4p--add-select__next-column__filter-popover{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper{margin-block-end:.5rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper:last-child{margin-block-end:0}.c4p--add-select__next-column__header{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__select-all .cds--checkbox-label{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__select-all .cds--checkbox-label-text{align-items:center;display:flex;gap:.5rem;margin-inline-start:.5rem}.c4p--add-select__next-column__title-wrapper{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next-column__title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next-column__rows{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-column__rows{overflow-block:auto}}.c4p--add-select__next__breadcrumbs{flex-wrap:wrap}.c4p--add-select__next__breadcrumb-item,.c4p--add-select__next__breadcrumbs{align-items:center;display:flex;gap:.25rem}.c4p--add-select__next__breadcrumb-button{background:none;border:none;color:var(--cds-link-primary,#0f62fe);cursor:pointer;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);padding-block:0;padding-inline:0;text-decoration:none}.c4p--add-select__next__breadcrumb-button:hover{color:var(--cds-link-primary-hover,#0043ce);text-decoration:underline}.c4p--add-select__next__breadcrumb-button:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:.125rem}.c4p--add-select__next__breadcrumb-separator{align-items:center;color:var(--cds-text-secondary,#525252);display:flex}.c4p--add-select__next__breadcrumb-separator svg{fill:currentColor}.c4p--add-select__next__breadcrumb-current{color:var(--cds-text-primary,#161616);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)}.c4p--add-select__next__selection-summary{display:flex;flex-direction:column}.c4p--add-select__next__selection-summary-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;padding-block-end:.5rem;padding-block-start:1.5rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin-inline-end:.5rem}.c4p--add-select__next__selection-summary-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:auto}.c4p--add-select__next__selection-summary-item-default{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding-block:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item-default-title{color:var(--cds-text-primary,#161616);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)}.c4p--add-select__next__selection-summary-item-default-subtitle{color:var(--cds-text-secondary,#525252);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)}.c4p--add-select__next__selection-summary-item{background-color:var(--cds-layer-01,#f4f4f4);border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);position:relative}.c4p--add-select__next__selection-summary-item:hover{background-color:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item,.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item:last-child{border-block-end:none;border-block-start:none}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__heading{min-block-size:unset;padding-block:.75rem;padding-inline-end:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between;padding-block:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-content{padding-block-end:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__selection-summary-item-selected-item{flex:1}.c4p--add-select__next__selection-summary-item-title{color:var(--cds-text-primary,#161616);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)}.c4p--add-select__next__selection-summary-item-subtitle{color:var(--cds-text-secondary,#525252);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)}.c4p--add-select__next__selection-summary-item-entry{margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-header{color:var(--cds-text-secondary,#525252);font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333);margin-block-end:.5rem}.c4p--add-select__next__selection-summary-item-body{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);margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-remove-button-container{align-items:center;display:inline-flex;justify-content:center;padding-inline-start:.5rem}.c4p--add-select__next__selection-summary-item--accordion .c4p--add-select__next__selection-summary-item-remove-button-container{inset-block-start:50%;inset-inline-end:1rem;padding-inline-start:0;position:absolute;transform:translateY(-50%)}.c4p--add-select__next__selection-summary-item-remove-button{opacity:0;transition:opacity 70ms cubic-bezier(.2,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next__selection-summary-item-remove-button{transition:none}}.c4p--add-select__next__selection-summary-item:focus-within .c4p--add-select__next__selection-summary-item-remove-button,.c4p--add-select__next__selection-summary-item:hover .c4p--add-select__next__selection-summary-item-remove-button{opacity:1}.c4p--add-select__next__selection-summary-item-content{margin-block-start:0}.c4p--add-select__next__selection-summary .cds--accordion__arrow{transform:rotate(90deg)}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__arrow{transform:rotate(-90deg)}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__arrow{margin-block:0;margin-inline-end:0;margin-inline-start:1rem}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__title{margin-inline-end:0;margin-inline-start:.5rem;padding-inline-end:2rem}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__content{margin-block-start:0;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;gap:.5rem;justify-content:space-between;padding-block-end:.5rem;padding-block-start:2rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375)}.c4p--add-select__next__item-summary-panel-body{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-entry{margin-block-end:1rem}.c4p--add-select__next__item-summary-panel-entry-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__item-summary-panel-entry-body{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)}:host(c4p-add-select){display:block}:host(c4p-add-select) .c4p--add-select__next{block-size:100%;display:flex;flex-direction:column;inline-size:100%;position:relative}"]);
+var add_select_default = css([".c4p--add-select__next{position:relative}.c4p--add-select__next,.c4p--add-select__next__body{block-size:100%;display:flex;flex-direction:column;inline-size:100%}.c4p--add-select__next__header{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding-block-end:.5rem;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next__search{margin-block-end:1rem}.c4p--add-select__next__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next__search-input{flex:1}.c4p--add-select__next__global-actions{align-items:flex-end;display:flex}.c4p--add-select__next__sub-header{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__tags{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next__tags-label{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin:0}.c4p--add-select__next__sub-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:1rem}.c4p--add-select__next__content{display:flex;flex:1;flex-direction:column;overflow:auto}.c4p--add-select__next-list{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-list{overflow-block:auto}}.c4p--add-select__next-list:focus{outline:none}.c4p--add-select__next-list-body{display:flex;flex-direction:column}.c4p--add-select__next-list-body--horizontal{align-items:stretch;block-size:100%;flex-direction:row}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-row{border-inline-start:.125rem solid transparent;display:flex;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row:focus:not(:focus-visible){outline:none}.c4p--add-select__next-row--selected{background-color:var(--cds-layer-selected-01,#e0e0e0)}.c4p--add-select__next-row--selected .c4p--add-select__next-row__cell-wrapper{border-block-end-color:var(--cds-border-subtle-selected-01,#c6c6c6)}.c4p--add-select__next-row--disabled{cursor:not-allowed}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__subtitle,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__title{color:var(--cds-text-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__icon svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-link-primary,#0f62fe)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-selected-hover-01,#d1d1d1)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row__cell{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__cell-wrapper{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;justify-content:space-between;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem}.c4p--add-select__next-row__content{align-items:center;align-self:center;display:flex;flex:1}.c4p--add-select__next-row__checkbox{align-self:center;flex:none;margin-inline-end:1rem}.c4p--add-select__next-row__radio{align-self:center}.c4p--add-select__next-row__radio .cds--radio-button__appearance{margin-inline-end:0}.c4p--add-select__next-row__icon{align-items:center;display:flex;margin-inline-end:.5rem}.c4p--add-select__next-row__text{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616);display:block;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)}.c4p--add-select__next-row__subtitle{color:var(--cds-text-secondary,#525252);display:block;font-size:var(--cds-helper-text-01-font-size,.75rem);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333)}.c4p--add-select__next-row__meta{align-items:center;display:flex;margin-inline-start:.5rem}.c4p--add-select__next-row__view-item-panel{margin-inline-start:auto}.c4p--add-select__next-row-item-panel--selected{background-color:var(--cds-layer-hover-01,#e8e8e8);border-inline-start:.125rem solid var(--cds-interactive,#0f62fe)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:none}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}}.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row--skeleton{cursor:default;pointer-events:none}.c4p--add-select__next-row--skeleton:hover{background:none}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-control{background-color:var(--cds-skeleton-element,#c6c6c6);block-size:1rem;border-radius:.125rem;flex:none;inline-size:1rem;margin-inline-end:1rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton{block-size:2rem;border-radius:50%;inline-size:2rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton:before{animation:none;border-radius:50%}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-title{margin-block-end:0}.c4p--add-select__next-column{block-size:100%;border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;flex-direction:column;min-inline-size:300px;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column:last-child{border-inline-end:none}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column:last-child{border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6)}.c4p--add-select__next-column__actions,.c4p--add-select__next-column__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next-column__search-bar{padding-block-end:0;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next-column__search-wrapper{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__search-input{flex:1}.c4p--add-select__next-column__controls{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__filter-button,.c4p--add-select__next-column__sort-button{flex:none}.c4p--add-select__next-column__filter-popover{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper{margin-block-end:.5rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper:last-child{margin-block-end:0}.c4p--add-select__next-column__header{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__select-all .cds--checkbox-label{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__select-all .cds--checkbox-label-text{align-items:center;display:flex;gap:.5rem;margin-inline-start:.5rem}.c4p--add-select__next-column__title-wrapper{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next-column__title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next-column__rows{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-column__rows{overflow-block:auto}}.c4p--add-select__next__breadcrumbs{flex-wrap:wrap}.c4p--add-select__next__breadcrumb-item,.c4p--add-select__next__breadcrumbs{align-items:center;display:flex;gap:.25rem}.c4p--add-select__next__breadcrumb-button{background:none;border:none;color:var(--cds-link-primary,#0f62fe);cursor:pointer;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);padding-block:0;padding-inline:0;text-decoration:none}.c4p--add-select__next__breadcrumb-button:hover{color:var(--cds-link-primary-hover,#0043ce);text-decoration:underline}.c4p--add-select__next__breadcrumb-button:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:.125rem}.c4p--add-select__next__breadcrumb-separator{align-items:center;color:var(--cds-text-secondary,#525252);display:flex}.c4p--add-select__next__breadcrumb-separator svg{fill:currentColor}.c4p--add-select__next__breadcrumb-current{color:var(--cds-text-primary,#161616);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)}.c4p--add-select__next__selection-summary{display:flex;flex-direction:column}.c4p--add-select__next__selection-summary-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;padding-block-end:.5rem;padding-block-start:1.5rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin-inline-end:.5rem}.c4p--add-select__next__selection-summary-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:auto}.c4p--add-select__next__selection-summary-item{background-color:var(--cds-layer-01,#f4f4f4);border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);position:relative}.c4p--add-select__next__selection-summary-item:hover{background-color:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item,.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item:last-child{border-block-end:none;border-block-start:none}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__heading{min-block-size:unset;padding-block:.75rem;padding-inline-end:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between;padding-block:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-content{padding-block-end:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__selection-summary-item-selected-item{flex:1}.c4p--add-select__next__selection-summary-item-title{color:var(--cds-text-primary,#161616);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)}.c4p--add-select__next__selection-summary-item-subtitle{color:var(--cds-text-secondary,#525252);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)}.c4p--add-select__next__selection-summary-item-entry{margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-header{color:var(--cds-text-secondary,#525252);font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333);margin-block-end:.5rem}.c4p--add-select__next__selection-summary-item-body{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);margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-remove-button-container{align-items:center;display:inline-flex;justify-content:center;padding-inline-start:.5rem}.c4p--add-select__next__selection-summary-item--accordion .c4p--add-select__next__selection-summary-item-remove-button-container{inset-block-start:50%;inset-inline-end:1rem;padding-inline-start:0;position:absolute;transform:translateY(-50%)}.c4p--add-select__next__selection-summary-item-remove-button{opacity:0;transition:opacity 70ms cubic-bezier(.2,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next__selection-summary-item-remove-button{transition:none}}.c4p--add-select__next__selection-summary-item:focus-within .c4p--add-select__next__selection-summary-item-remove-button,.c4p--add-select__next__selection-summary-item:hover .c4p--add-select__next__selection-summary-item-remove-button{opacity:1}.c4p--add-select__next__selection-summary-item-content{margin-block-start:0}.c4p--add-select__next__selection-summary .cds--accordion__arrow{transform:rotate(90deg)}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__arrow{transform:rotate(-90deg)}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__arrow{margin-block:0;margin-inline-end:0;margin-inline-start:1rem}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__title{margin-inline-end:0;margin-inline-start:.5rem;padding-inline-end:2rem}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__content{margin-block-start:0;padding-block:1rem;padding-inline:1rem}@keyframes add-select-item-panel-entrance{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes add-select-item-panel-exit{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}@keyframes add-select-item-panel-entrance-reduced{0%{opacity:0}to{opacity:1}}@keyframes add-select-item-panel-exit-reduced{0%{opacity:1}to{opacity:0}}.c4p--add-select__next__item-summary-panel{block-size:100%;display:none;inline-size:100%;transform:translateX(0);transition-behavior:allow-discrete;transition-duration:.15s;transition-property:display,opacity,transform}.c4p--add-select__next__item-summary-panel--open{animation:add-select-item-panel-entrance .15s cubic-bezier(0,0,.38,.9) forwards;display:flex;flex-direction:column}@starting-style{.c4p--add-select__next__item-summary-panel--open{opacity:0;transform:translateX(100%)}}@media (prefers-reduced-motion){.c4p--add-select__next__item-summary-panel--open{animation:add-select-item-panel-entrance-reduced .15s cubic-bezier(0,0,.38,.9) forwards}@starting-style{.c4p--add-select__next__item-summary-panel--open{opacity:0;transform:translateX(0)}}}.c4p--add-select__next__item-summary-panel-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;gap:.5rem;justify-content:space-between;padding-block-end:.5rem;padding-block-start:2rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375)}.c4p--add-select__next__item-summary-panel-body{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-entry{margin-block-end:1rem}.c4p--add-select__next__item-summary-panel-entry-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__item-summary-panel-entry-body{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)}:host(c4p-add-select){display:block}:host(c4p-add-select) .c4p--add-select__next{block-size:100%;display:flex;flex-direction:column;inline-size:100%;position:relative}"]);
 //#endregion
 export { add_select_default as default };

package/es/components/add-select/index.d.ts CHANGED Viewed

@@ -8,6 +8,9 @@
  */
 import './add-select';
 import './add-select-body';
+import './add-select-column';
 import './add-select-row';
-import './add-select-content';
+import './add-select-selection-summary';
+import './add-select-selection-summary-item';
+import './add-select-item-panel';
 //# sourceMappingURL=index.d.ts.map

package/es/components/add-select/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/add-select/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,cAAc,CAAC;AACtB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,kBAAkB,CAAC;AAC1B,OAAO,~~sBAAsB~~,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/add-select/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,cAAc,CAAC;AACtB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,qBAAqB,CAAC;AAC7B,OAAO,kBAAkB,CAAC;AAC1B,OAAO,gCAAgC,CAAC;AACxC,OAAO,qCAAqC,CAAC;AAC7C,OAAO,yBAAyB,CAAC"}

package/es/components/add-select/index.js CHANGED Viewed

@@ -6,6 +6,9 @@
  */
 import "./add-select-body.js";
-import "./add-select-content.js";
+import "./add-select-column.js";
+import "./add-select-item-panel.js";
 import "./add-select-row.js";
+import "./add-select-selection-summary-item.js";
+import "./add-select-selection-summary.js";
 import "./add-select.js";

package/es/components/coachmark/coachmark-header.js CHANGED Viewed

@@ -13,7 +13,7 @@ import { LitElement, html, nothing } from "lit";
 import { property } from "lit/decorators.js";
 import HostListenerMixin from "@carbon/web-components/es/globals/mixins/host-listener.js";
 import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
-import Close from "@carbon/icons/es/close/16";
+import Close16 from "@carbon/icons/es/close/16";
 import { SignalWatcher } from "@lit-labs/signals";
 import iconLoader from "@carbon/web-components/es/globals/internal/icon-loader";
 import "@carbon/web-components/es/components/button/index";
@@ -78,7 +78,7 @@ let CDSCoachmarkHeader = class CDSCoachmarkHeader extends SignalWatcher(HostList
         tooltip-text="${this.closeIconDescription}"
         @click=${this._handleClick}
       >
-        ${iconLoader(Close, {
+        ${iconLoader(Close16, {
 			slot: "icon",
 			class: `c4p--coachmark-header-close-icon`
 		})}

package/es/components/coachmark/coachmark-header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"coachmark-header.js","names":["styles","customElement"],"sources":["../../../src/components/coachmark/coachmark-header.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 /\nimport { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport '@carbon/web-components/es/components/button/index';\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-header.scss?lit';\nimport Close from '@carbon/icons/es/close/16';\nimport Draggable from '@carbon/icons/es/draggable/16';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport {\n coachmarkDetailsSignal,\n updateCoachmarkDetailsSignal,\n} from './coachmark-context';\nimport iconLoader from '@carbon/web-components/es/globals/internal/icon-loader';\n\n/\n coachmark-header for content header section\n * @element c4p-coachmark-header\n /\n@customElement(`${prefix}-coachmark-header`)\nclass CDSCoachmarkHeader extends SignalWatcher(HostListenerMixin(LitElement)) {\n /\n Tooltip text and aria label for the Close button icon.\n /\n @property({ reflect: true })\n closeIconDescription?: string = '';\n\n /\n Tooltip text and aria label for the Drag button icon.\n */\n @property({ reflect: true })\n dragIconDescription?: string = '';\n\n private _handleClick = (event: Event) => {\n event.stopPropagation();\n\n const coachmark = this.closest(`${prefix}-coachmark`) as HTMLElement \| null;\n if (coachmark) {\n coachmark.dispatchEvent(\n new CustomEvent(`${prefix}-coachmark-request-close`, {\n bubbles: true,\n composed: true,\n cancelable: true,\n detail: { source: 'header-close-button' },\n })\n );\n\n (coachmark as any).open = false;\n }\n\n updateCoachmarkDetailsSignal({\n name: 'open',\n detail: false,\n });\n };\n\n render() {\n const { floating } = coachmarkDetailsSignal.get();\n return html`\n ${floating\n ? html`\n <cds-button\n kind=\"ghost\"\n size=\"sm\"\n class=\"${prefix}--coachmark-header-drag-handle\"\n tooltip-text=\"${this.dragIconDescription}\"\n >\n ${iconLoader(Draggable, {\n slot: 'icon',\n class: `${prefix}--coachmark-header-drag-icon`,\n })}\n </cds-button>\n `\n : nothing}\n <slot name=\"header\"></slot>\n <cds-button\n kind=\"ghost\"\n size=\"sm\"\n class=\"${prefix}--coachmark-header-close-button\"\n tooltip-text=\"${this.closeIconDescription}\"\n @click=${this._handleClick}\n >\n ${iconLoader(Close, {\n slot: 'icon',\n class: `${prefix}--coachmark-header-close-icon`,\n })}\n </cds-button>\n `;\n }\n static styles = styles;\n}\n\nexport default CDSCoachmarkHeader;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,qBAAA,MACM,2BAA2B,cAAc,kBAAkB,WAAW,CAAC,CAAC;;;8BAK5C;6BAMD;uBAEP,UAAiB;AACvC,SAAM,iBAAiB;GAEvB,MAAM,YAAY,KAAK,QAAQ,gBAAsB;AACrD,OAAI,WAAW;AACb,cAAU,cACR,IAAI,YAAY,+BAAqC;KACnD,SAAS;KACT,UAAU;KACV,YAAY;KACZ,QAAQ,EAAE,QAAQ,uBAAuB;KAC1C,CAAC,CACH;AAEA,cAAkB,OAAO;;AAG5B,gCAA6B;IAC3B,MAAM;IACN,QAAQ;IACT,CAAC;;;CAGJ,SAAS;EACP,MAAM,EAAE,aAAa,uBAAuB,KAAK;AACjD,SAAO,IAAI;QACP,WACE,IAAI;;;;6BAIgB;8BACA,KAAK,oBAAoB;;gBAEvC,WAAW,WAAW;GACtB,MAAM;GACN,OAAO;GACR,CAAC,CAAC;;cAGP,QAAQ;;;;;uBAKM;wBACA,KAAK,qBAAqB;iBACjC,KAAK,aAAa;;UAEzB,~~WAAW~~,~~OAAO~~;GAClB,MAAM;GACN,OAAO;GACR,CAAC,CAAC;;;;;~~gBAIOA~~;;;YAjEf,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,mBAAA,WAAA,wBAAA,KAAA,EAAA;YAM3B,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,mBAAA,WAAA,uBAAA,KAAA,EAAA;iCAX7BC,cAAc,uBAA6B,CAAA,EAAA,mBAAA;AAyE5C,IAAA,2BAAe"}
1	+ {"version":3,"file":"coachmark-header.js","names":["Close","styles","customElement"],"sources":["../../../src/components/coachmark/coachmark-header.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 /\nimport { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport '@carbon/web-components/es/components/button/index';\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-header.scss?lit';\nimport Close from '@carbon/icons/es/close/16';\nimport Draggable from '@carbon/icons/es/draggable/16';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport {\n coachmarkDetailsSignal,\n updateCoachmarkDetailsSignal,\n} from './coachmark-context';\nimport iconLoader from '@carbon/web-components/es/globals/internal/icon-loader';\n\n/\n coachmark-header for content header section\n * @element c4p-coachmark-header\n /\n@customElement(`${prefix}-coachmark-header`)\nclass CDSCoachmarkHeader extends SignalWatcher(HostListenerMixin(LitElement)) {\n /\n Tooltip text and aria label for the Close button icon.\n /\n @property({ reflect: true })\n closeIconDescription?: string = '';\n\n /\n Tooltip text and aria label for the Drag button icon.\n */\n @property({ reflect: true })\n dragIconDescription?: string = '';\n\n private _handleClick = (event: Event) => {\n event.stopPropagation();\n\n const coachmark = this.closest(`${prefix}-coachmark`) as HTMLElement \| null;\n if (coachmark) {\n coachmark.dispatchEvent(\n new CustomEvent(`${prefix}-coachmark-request-close`, {\n bubbles: true,\n composed: true,\n cancelable: true,\n detail: { source: 'header-close-button' },\n })\n );\n\n (coachmark as any).open = false;\n }\n\n updateCoachmarkDetailsSignal({\n name: 'open',\n detail: false,\n });\n };\n\n render() {\n const { floating } = coachmarkDetailsSignal.get();\n return html`\n ${floating\n ? html`\n <cds-button\n kind=\"ghost\"\n size=\"sm\"\n class=\"${prefix}--coachmark-header-drag-handle\"\n tooltip-text=\"${this.dragIconDescription}\"\n >\n ${iconLoader(Draggable, {\n slot: 'icon',\n class: `${prefix}--coachmark-header-drag-icon`,\n })}\n </cds-button>\n `\n : nothing}\n <slot name=\"header\"></slot>\n <cds-button\n kind=\"ghost\"\n size=\"sm\"\n class=\"${prefix}--coachmark-header-close-button\"\n tooltip-text=\"${this.closeIconDescription}\"\n @click=${this._handleClick}\n >\n ${iconLoader(Close, {\n slot: 'icon',\n class: `${prefix}--coachmark-header-close-icon`,\n })}\n </cds-button>\n `;\n }\n static styles = styles;\n}\n\nexport default CDSCoachmarkHeader;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAA,qBAAA,MACM,2BAA2B,cAAc,kBAAkB,WAAW,CAAC,CAAC;;;8BAK5C;6BAMD;uBAEP,UAAiB;AACvC,SAAM,iBAAiB;GAEvB,MAAM,YAAY,KAAK,QAAQ,gBAAsB;AACrD,OAAI,WAAW;AACb,cAAU,cACR,IAAI,YAAY,+BAAqC;KACnD,SAAS;KACT,UAAU;KACV,YAAY;KACZ,QAAQ,EAAE,QAAQ,uBAAuB;KAC1C,CAAC,CACH;AAEA,cAAkB,OAAO;;AAG5B,gCAA6B;IAC3B,MAAM;IACN,QAAQ;IACT,CAAC;;;CAGJ,SAAS;EACP,MAAM,EAAE,aAAa,uBAAuB,KAAK;AACjD,SAAO,IAAI;QACP,WACE,IAAI;;;;6BAIgB;8BACA,KAAK,oBAAoB;;gBAEvC,WAAW,WAAW;GACtB,MAAM;GACN,OAAO;GACR,CAAC,CAAC;;cAGP,QAAQ;;;;;uBAKM;wBACA,KAAK,qBAAqB;iBACjC,KAAK,aAAa;;UAEzB,WAAWA,SAAO;GAClB,MAAM;GACN,OAAO;GACR,CAAC,CAAC;;;;;gBAIOC;;;YAjEf,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,mBAAA,WAAA,wBAAA,KAAA,EAAA;YAM3B,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,mBAAA,WAAA,uBAAA,KAAA,EAAA;iCAX7BC,cAAc,uBAA6B,CAAA,EAAA,mBAAA;AAyE5C,IAAA,2BAAe"}

package/es/components/edit-in-place/edit-in-place.js CHANGED Viewed

@@ -12,7 +12,7 @@ import { classMap } from "lit/directives/class-map.js";
 import { LitElement, html } from "lit";
 import { property, query, state } from "lit/decorators.js";
 import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
-import Close from "@carbon/icons/es/close/16";
+import Close16 from "@carbon/icons/es/close/16";
 import { iconLoader } from "@carbon/web-components/es/globals/internal/icon-loader.js";
 import "@carbon/web-components/es/components/icon-button/index.js";
 import "@carbon/web-components/es/components/tooltip/index.js";
@@ -310,7 +310,7 @@ let C4PEditInPlace = class C4PEditInPlace extends LitElement {
           ?disabled=${!this._canCancel}
           @click=${() => this._handleCancel(false)}
         >
-          ${iconLoader(Close, { slot: "icon" })}
+          ${iconLoader(Close16, { slot: "icon" })}
           <span slot="tooltip-content">${this.cancelLabel}</span>
         </cds-icon-button>
         <cds-icon-button

package/es/components/edit-in-place/edit-in-place.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"edit-in-place.js","names":["Close16","styles","customElement"],"sources":["../../../src/components/edit-in-place/edit-in-place.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, state, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { prefix, carbonPrefix } from '../../globals/settings';\nimport styles from './edit-in-place.scss?lit';\nimport '@carbon/web-components/es/components/icon-button/index.js';\nimport '@carbon/web-components/es/components/tooltip/index.js';\nimport Edit16 from '@carbon/icons/es/edit/16';\nimport EditOff16 from '@carbon/icons/es/edit--off/16';\nimport Checkmark16 from '@carbon/icons/es/checkmark/16';\nimport Close16 from '@carbon/icons/es/close/16';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16';\nimport { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';\nimport { EDIT_IN_PLACE_SIZE, TOOLTIP_ALIGNMENT } from './defs';\n\nconst blockClass = `${prefix}--edit-in-place`;\n\nexport type EditInPlaceSize = `${EDIT_IN_PLACE_SIZE}`;\nexport type TooltipAlignment = `${TOOLTIP_ALIGNMENT}`;\n\n/\n EditInPlace component for inline text editing.\n \n @element c4p-edit-in-place\n * @csspart input - The input element\n * @csspart actions - The button container\n * @csspart invalid-text - The error message container\n * @fires c4p-edit-in-place-change - Fired when the input value changes\n * @fires c4p-edit-in-place-save - Fired when the save button is clicked or Enter is pressed\n * @fires c4p-edit-in-place-cancel - Fired when the cancel button is clicked or Escape is pressed\n * @fires c4p-edit-in-place-blur - Fired when the input loses focus (if onBlur handler is used)\n /\n@customElement(`${prefix}-edit-in-place`)\nclass C4PEditInPlace extends LitElement {\n /\n Label for the cancel button\n /\n @property({ type: String, attribute: 'cancel-label' })\n cancelLabel = 'Cancel';\n\n /\n By default the edit icon is shown on hover only. Set to true to always show it.\n /\n @property({ type: Boolean, attribute: 'edit-always-visible' })\n editAlwaysVisible = false;\n\n /\n Label for the edit button\n /\n @property({ type: String, attribute: 'edit-label' })\n editLabel = 'Edit';\n\n /\n Specify a custom id for the input\n /\n @property({ type: String })\n id = '';\n\n /\n Causes the text entry field to inherit typography settings from the container\n /\n @property({ type: Boolean, attribute: 'inherit-typography' })\n inheritTypography = false;\n\n /\n Determines if the input is invalid\n /\n @property({ type: Boolean })\n invalid = false;\n\n /\n Text that is displayed if the input is invalid\n /\n @property({ type: String, attribute: 'invalid-text' })\n invalidText = '';\n\n /\n Text that will be read by a screen reader when visiting this control\n /\n @property({ type: String, attribute: 'label-text' })\n labelText = '';\n\n /\n Placeholder text for the input\n /\n @property({ type: String })\n placeholder = '';\n\n /\n Determines if the input is in readOnly mode\n /\n @property({ type: Boolean, attribute: 'read-only' })\n readOnly = false;\n\n /\n Label for the edit off button that displays when in read only mode\n /\n @property({ type: String, attribute: 'read-only-label' })\n readOnlyLabel = 'Edit off';\n\n /\n Text for the toggletip that displays when in read only mode\n /\n @property({ type: String, attribute: 'read-only-toggletip-text' })\n readOnlyToggleTipText = 'This field is read-only and cannot be edited';\n\n /\n Label for the save button\n /\n @property({ type: String, attribute: 'save-label' })\n saveLabel = 'Save';\n\n /\n Vertical size of control\n /\n @property({ type: String })\n size: EditInPlaceSize = 'sm';\n\n /\n Alignment for the toggletip that displays when in read only mode\n /\n @property({ type: String, attribute: 'toggletip-alignment' })\n toggleTipAlignment: TooltipAlignment = 'bottom';\n\n /\n Tooltip alignment for buttons\n /\n @property({ type: String, attribute: 'tooltip-alignment' })\n tooltipAlignment: TooltipAlignment = 'top';\n\n /\n Current value of the input (controlled mode)\n /\n @property({ type: String })\n value = '';\n\n /\n Default value for uncontrolled mode\n /\n @property({ type: String, attribute: 'default-value' })\n defaultValue = '';\n\n /\n Internal state for focused mode\n /\n @state()\n private _focused = false;\n\n /\n Internal value for managing state\n /\n @state()\n private _internalValue = '';\n\n /\n Internal state for initial value (when entering edit mode)\n /\n @state()\n private _initialValue = '';\n\n /\n Internal state to track if input has been modified\n /\n @state()\n private _dirtyInput = false;\n\n /\n Flag to track if we're handling escape key\n /\n private _escaping = false;\n\n /\n Flag to track if we're clicking within the component\n /\n private _clickingWithin = false;\n\n /\n Reference to the input element\n /\n @query('input')\n private _inputElement!: HTMLInputElement;\n\n /\n Bound handler for document clicks (for cleanup)\n /\n private _boundHandleDocumentClick: ((e: MouseEvent) => void) \| null = null;\n\n /\n Check if value has changed from initial\n /\n private get _hasValueChanged(): boolean {\n return this._internalValue.trim() !== this._initialValue.trim();\n }\n\n /\n Check if we can save (value changed and not invalid)\n /\n private get _canSave(): boolean {\n return this._hasValueChanged && !this.invalid;\n }\n\n /\n Check if we can cancel (value has changed)\n /\n private get _canCancel(): boolean {\n return this._hasValueChanged;\n }\n\n /\n Handle input change\n /\n private _handleChange(e: Event) {\n const input = e.target as HTMLInputElement;\n if (!this._dirtyInput) {\n this._dirtyInput = true;\n }\n\n this._internalValue = input.value;\n\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._internalValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-change`, init));\n }\n\n /\n Handle focus\n /\n private _handleFocus(e: FocusEvent) {\n const relatedTarget = e.relatedTarget as Node;\n if (!this.contains(relatedTarget)) {\n requestAnimationFrame(() => {\n this._inputElement?.focus();\n });\n }\n this._focused = true;\n }\n\n /\n Handle save\n /\n private _handleSave(exitEditMode = false) {\n this._initialValue = this._internalValue;\n this._dirtyInput = false;\n\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._internalValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-save`, init));\n\n if (exitEditMode) {\n this._focused = false;\n } else {\n requestAnimationFrame(() => {\n this._inputElement?.focus();\n });\n }\n }\n\n /\n Handle cancel\n /\n private _handleCancel(exitEditMode = false) {\n this._dirtyInput = false;\n this._internalValue = this._initialValue;\n\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._initialValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-cancel`, init));\n\n if (exitEditMode) {\n this._focused = false;\n } else {\n requestAnimationFrame(() => {\n if (this._inputElement) {\n this._inputElement.focus();\n const length = this._inputElement.value.length;\n this._inputElement.setSelectionRange(length, length);\n }\n });\n }\n }\n\n /\n Handle blur\n /\n private _handleBlur(e: FocusEvent) {\n const relatedTarget = e.relatedTarget as Node;\n const clickedWithin = this._clickingWithin;\n const targetingChild = this.contains(relatedTarget);\n\n // Reset clicking flag if we clicked within\n if (clickedWithin) {\n this._clickingWithin = false;\n // If focus is staying within, don't exit edit mode\n if (targetingChild) {\n return;\n }\n }\n\n // If tabbing to a button within, allow it\n if (!clickedWithin && targetingChild) {\n return;\n }\n\n // Default behavior: auto-save or auto-cancel\n if (this._escaping) {\n return;\n }\n\n if (this._canSave) {\n this._handleSave(true);\n } else {\n this._handleCancel(true);\n }\n\n // Dispatch blur event\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._initialValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-blur`, init));\n }\n\n /\n Handle keyboard events\n /\n private _handleKeyDown(e: KeyboardEvent) {\n switch (e.key) {\n case 'Escape':\n this._escaping = true;\n this._inputElement?.blur();\n this._handleCancel(false);\n this._escaping = false;\n break;\n case 'Enter':\n this._escaping = true;\n this._inputElement?.blur();\n if (this._canSave) {\n this._handleSave(false);\n }\n this._escaping = false;\n break;\n case 'Tab':\n // When tabbing from input, check if we're going outside the component\n // If shift+tab, we're going backwards (let it handle naturally)\n // If tab forward and no changes, we should exit edit mode\n if (!e.shiftKey && !this._hasValueChanged) {\n // Exit edit mode when tabbing out without changes\n this._handleCancel(true);\n }\n break;\n default:\n break;\n }\n }\n\n /\n Handle toolbar mousedown to track button clicks\n * Uses composedPath() to properly handle Shadow DOM boundaries\n /\n private _handleToolbarMouseDown(e: MouseEvent) {\n const path = e.composedPath();\n const foundButton = path.find(\n (el) =>\n el instanceof HTMLElement &&\n (el.tagName === 'BUTTON' \|\| el.tagName === 'CDS-ICON-BUTTON')\n ) as HTMLElement \| undefined;\n\n if (foundButton) {\n this._clickingWithin = true;\n\n // For disabled buttons, prevent default to stop blur\n const isDisabled =\n foundButton.hasAttribute('disabled') \|\|\n foundButton.getAttribute('aria-disabled') === 'true';\n if (isDisabled) {\n e.preventDefault();\n }\n }\n }\n\n /\n Handle keydown on save button to exit edit mode on Tab\n /\n private _handleSaveButtonKeyDown(e: KeyboardEvent) {\n if (e.key === 'Tab' && !e.shiftKey) {\n // Tab forward from save button - exit edit mode\n this._focused = false;\n this._inputElement?.blur();\n }\n }\n\n /\n Handle clicks outside the component\n /\n private _handleDocumentClick(e: MouseEvent) {\n // Only handle if we're in focused mode\n if (!this._focused) {\n return;\n }\n\n // Check if click is outside the component\n const path = e.composedPath();\n const clickedInside = path.includes(this);\n\n if (!clickedInside) {\n // Click was outside - exit edit mode\n if (this._canSave) {\n this._handleSave(true);\n } else {\n this._handleCancel(true);\n }\n }\n }\n\n /\n Initialize component\n /\n connectedCallback() {\n super.connectedCallback();\n this._internalValue = this.value \|\| this.defaultValue;\n this._initialValue = this._internalValue;\n\n // Set up document click listener\n this._boundHandleDocumentClick = this._handleDocumentClick.bind(this);\n document.addEventListener('click', this._boundHandleDocumentClick, true);\n }\n\n /\n Cleanup component state when removed from DOM\n /\n disconnectedCallback() {\n super.disconnectedCallback();\n this._escaping = false;\n this._clickingWithin = false;\n this._focused = false;\n\n // Clean up document click listener\n if (this._boundHandleDocumentClick) {\n document.removeEventListener(\n 'click',\n this._boundHandleDocumentClick,\n true\n );\n this._boundHandleDocumentClick = null;\n }\n }\n\n /\n Render the input element\n /\n private _renderInput() {\n const inputClasses = {\n [`${blockClass}__text-input`]: true,\n [`${carbonPrefix}--text-input`]: true,\n [`${carbonPrefix}--text-input--${this.size}`]: true,\n };\n\n const inputElement = html`\n <input\n id=${this.id}\n class=${classMap(inputClasses)}\n type=\"text\"\n part=\"input\"\n placeholder=${this.placeholder}\n .value=${this._internalValue}\n @input=${this._handleChange}\n @focus=${this._handleFocus}\n @keydown=${this._handleKeyDown}\n aria-label=${this.labelText}\n aria-invalid=${this.invalid ? 'true' : 'false'}\n ?readonly=${this.readOnly}\n />\n `;\n\n if (this.readOnly) {\n return html`\n <cds-tooltip\n align=${this.toggleTipAlignment}\n class=\"${blockClass}__toggletip-wrapper\"\n >\n ${inputElement}\n <cds-tooltip-content\n >${this.readOnlyToggleTipText}</cds-tooltip-content\n >\n </cds-tooltip>\n `;\n }\n\n return inputElement;\n }\n\n /\n Render action buttons\n */\n private _renderActions() {\n if (this.readOnly) {\n return html`\n <cds-icon-button\n class=\"${blockClass}__btn-readonly\"\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n @click=${this._handleFocus}\n >\n ${iconLoader(EditOff16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.readOnlyLabel}</span>\n </cds-icon-button>\n `;\n }\n\n if (this._focused) {\n return html`\n <cds-icon-button\n class=\"${blockClass}__btn ${blockClass}__btn-cancel\"\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n ?disabled=${!this._canCancel}\n @click=${() => this._handleCancel(false)}\n >\n ${iconLoader(Close16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.cancelLabel}</span>\n </cds-icon-button>\n <cds-icon-button\n class=\"${blockClass}__btn ${blockClass}__btn-save\"\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n ?disabled=${!this._canSave}\n @click=${() => this._handleSave(false)}\n @keydown=${this._handleSaveButtonKeyDown}\n >\n ${iconLoader(Checkmark16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.saveLabel}</span>\n </cds-icon-button>\n `;\n }\n\n const editBtnClasses = {\n [`${blockClass}__btn`]: true,\n [`${blockClass}__btn-edit`]: true,\n [`${blockClass}__btn-edit--always-visible`]: this.editAlwaysVisible,\n };\n\n return html`\n <cds-icon-button\n class=${classMap(editBtnClasses)}\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n @click=${this._handleFocus}\n >\n ${iconLoader(Edit16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.editLabel}</span>\n </cds-icon-button>\n `;\n }\n\n render() {\n const containerClasses = {\n [`${blockClass}__container`]: true,\n [`${blockClass}--${this.size}`]: true,\n [`${blockClass}--focused`]: this._focused,\n [`${blockClass}--invalid`]: this.invalid,\n [`${blockClass}--inherit-type`]: this.inheritTypography,\n [`${blockClass}--readonly`]: this.readOnly,\n };\n\n return html`\n <div class=${classMap(containerClasses)} @blur=${this._handleBlur}>\n ${this._renderInput()}\n <div\n class=\"${blockClass}__toolbar\"\n part=\"actions\"\n @mousedown=${this._handleToolbarMouseDown}\n >\n ${this.invalid\n ? iconLoader(WarningFilled16, {\n class: `${blockClass}__warning-icon`,\n })\n : ''}\n ${this._renderActions()}\n </div>\n </div>\n ${this.invalid\n ? html`<p class=\"${blockClass}__warning-text\" part=\"invalid-text\">\n ${this.invalidText}\n </p>`\n : ''}\n `;\n }\n\n static styles = styles;\n}\n\nexport default C4PEditInPlace;\n"],"mappings":"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"}
1	+ {"version":3,"file":"edit-in-place.js","names":["styles","customElement"],"sources":["../../../src/components/edit-in-place/edit-in-place.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, state, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { prefix, carbonPrefix } from '../../globals/settings';\nimport styles from './edit-in-place.scss?lit';\nimport '@carbon/web-components/es/components/icon-button/index.js';\nimport '@carbon/web-components/es/components/tooltip/index.js';\nimport Edit16 from '@carbon/icons/es/edit/16';\nimport EditOff16 from '@carbon/icons/es/edit--off/16';\nimport Checkmark16 from '@carbon/icons/es/checkmark/16';\nimport Close16 from '@carbon/icons/es/close/16';\nimport WarningFilled16 from '@carbon/icons/es/warning--filled/16';\nimport { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';\nimport { EDIT_IN_PLACE_SIZE, TOOLTIP_ALIGNMENT } from './defs';\n\nconst blockClass = `${prefix}--edit-in-place`;\n\nexport type EditInPlaceSize = `${EDIT_IN_PLACE_SIZE}`;\nexport type TooltipAlignment = `${TOOLTIP_ALIGNMENT}`;\n\n/\n EditInPlace component for inline text editing.\n \n @element c4p-edit-in-place\n * @csspart input - The input element\n * @csspart actions - The button container\n * @csspart invalid-text - The error message container\n * @fires c4p-edit-in-place-change - Fired when the input value changes\n * @fires c4p-edit-in-place-save - Fired when the save button is clicked or Enter is pressed\n * @fires c4p-edit-in-place-cancel - Fired when the cancel button is clicked or Escape is pressed\n * @fires c4p-edit-in-place-blur - Fired when the input loses focus (if onBlur handler is used)\n /\n@customElement(`${prefix}-edit-in-place`)\nclass C4PEditInPlace extends LitElement {\n /\n Label for the cancel button\n /\n @property({ type: String, attribute: 'cancel-label' })\n cancelLabel = 'Cancel';\n\n /\n By default the edit icon is shown on hover only. Set to true to always show it.\n /\n @property({ type: Boolean, attribute: 'edit-always-visible' })\n editAlwaysVisible = false;\n\n /\n Label for the edit button\n /\n @property({ type: String, attribute: 'edit-label' })\n editLabel = 'Edit';\n\n /\n Specify a custom id for the input\n /\n @property({ type: String })\n id = '';\n\n /\n Causes the text entry field to inherit typography settings from the container\n /\n @property({ type: Boolean, attribute: 'inherit-typography' })\n inheritTypography = false;\n\n /\n Determines if the input is invalid\n /\n @property({ type: Boolean })\n invalid = false;\n\n /\n Text that is displayed if the input is invalid\n /\n @property({ type: String, attribute: 'invalid-text' })\n invalidText = '';\n\n /\n Text that will be read by a screen reader when visiting this control\n /\n @property({ type: String, attribute: 'label-text' })\n labelText = '';\n\n /\n Placeholder text for the input\n /\n @property({ type: String })\n placeholder = '';\n\n /\n Determines if the input is in readOnly mode\n /\n @property({ type: Boolean, attribute: 'read-only' })\n readOnly = false;\n\n /\n Label for the edit off button that displays when in read only mode\n /\n @property({ type: String, attribute: 'read-only-label' })\n readOnlyLabel = 'Edit off';\n\n /\n Text for the toggletip that displays when in read only mode\n /\n @property({ type: String, attribute: 'read-only-toggletip-text' })\n readOnlyToggleTipText = 'This field is read-only and cannot be edited';\n\n /\n Label for the save button\n /\n @property({ type: String, attribute: 'save-label' })\n saveLabel = 'Save';\n\n /\n Vertical size of control\n /\n @property({ type: String })\n size: EditInPlaceSize = 'sm';\n\n /\n Alignment for the toggletip that displays when in read only mode\n /\n @property({ type: String, attribute: 'toggletip-alignment' })\n toggleTipAlignment: TooltipAlignment = 'bottom';\n\n /\n Tooltip alignment for buttons\n /\n @property({ type: String, attribute: 'tooltip-alignment' })\n tooltipAlignment: TooltipAlignment = 'top';\n\n /\n Current value of the input (controlled mode)\n /\n @property({ type: String })\n value = '';\n\n /\n Default value for uncontrolled mode\n /\n @property({ type: String, attribute: 'default-value' })\n defaultValue = '';\n\n /\n Internal state for focused mode\n /\n @state()\n private _focused = false;\n\n /\n Internal value for managing state\n /\n @state()\n private _internalValue = '';\n\n /\n Internal state for initial value (when entering edit mode)\n /\n @state()\n private _initialValue = '';\n\n /\n Internal state to track if input has been modified\n /\n @state()\n private _dirtyInput = false;\n\n /\n Flag to track if we're handling escape key\n /\n private _escaping = false;\n\n /\n Flag to track if we're clicking within the component\n /\n private _clickingWithin = false;\n\n /\n Reference to the input element\n /\n @query('input')\n private _inputElement!: HTMLInputElement;\n\n /\n Bound handler for document clicks (for cleanup)\n /\n private _boundHandleDocumentClick: ((e: MouseEvent) => void) \| null = null;\n\n /\n Check if value has changed from initial\n /\n private get _hasValueChanged(): boolean {\n return this._internalValue.trim() !== this._initialValue.trim();\n }\n\n /\n Check if we can save (value changed and not invalid)\n /\n private get _canSave(): boolean {\n return this._hasValueChanged && !this.invalid;\n }\n\n /\n Check if we can cancel (value has changed)\n /\n private get _canCancel(): boolean {\n return this._hasValueChanged;\n }\n\n /\n Handle input change\n /\n private _handleChange(e: Event) {\n const input = e.target as HTMLInputElement;\n if (!this._dirtyInput) {\n this._dirtyInput = true;\n }\n\n this._internalValue = input.value;\n\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._internalValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-change`, init));\n }\n\n /\n Handle focus\n /\n private _handleFocus(e: FocusEvent) {\n const relatedTarget = e.relatedTarget as Node;\n if (!this.contains(relatedTarget)) {\n requestAnimationFrame(() => {\n this._inputElement?.focus();\n });\n }\n this._focused = true;\n }\n\n /\n Handle save\n /\n private _handleSave(exitEditMode = false) {\n this._initialValue = this._internalValue;\n this._dirtyInput = false;\n\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._internalValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-save`, init));\n\n if (exitEditMode) {\n this._focused = false;\n } else {\n requestAnimationFrame(() => {\n this._inputElement?.focus();\n });\n }\n }\n\n /\n Handle cancel\n /\n private _handleCancel(exitEditMode = false) {\n this._dirtyInput = false;\n this._internalValue = this._initialValue;\n\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._initialValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-cancel`, init));\n\n if (exitEditMode) {\n this._focused = false;\n } else {\n requestAnimationFrame(() => {\n if (this._inputElement) {\n this._inputElement.focus();\n const length = this._inputElement.value.length;\n this._inputElement.setSelectionRange(length, length);\n }\n });\n }\n }\n\n /\n Handle blur\n /\n private _handleBlur(e: FocusEvent) {\n const relatedTarget = e.relatedTarget as Node;\n const clickedWithin = this._clickingWithin;\n const targetingChild = this.contains(relatedTarget);\n\n // Reset clicking flag if we clicked within\n if (clickedWithin) {\n this._clickingWithin = false;\n // If focus is staying within, don't exit edit mode\n if (targetingChild) {\n return;\n }\n }\n\n // If tabbing to a button within, allow it\n if (!clickedWithin && targetingChild) {\n return;\n }\n\n // Default behavior: auto-save or auto-cancel\n if (this._escaping) {\n return;\n }\n\n if (this._canSave) {\n this._handleSave(true);\n } else {\n this._handleCancel(true);\n }\n\n // Dispatch blur event\n const init = {\n bubbles: true,\n composed: true,\n detail: { value: this._initialValue },\n };\n this.dispatchEvent(new CustomEvent(`${prefix}-edit-in-place-blur`, init));\n }\n\n /\n Handle keyboard events\n /\n private _handleKeyDown(e: KeyboardEvent) {\n switch (e.key) {\n case 'Escape':\n this._escaping = true;\n this._inputElement?.blur();\n this._handleCancel(false);\n this._escaping = false;\n break;\n case 'Enter':\n this._escaping = true;\n this._inputElement?.blur();\n if (this._canSave) {\n this._handleSave(false);\n }\n this._escaping = false;\n break;\n case 'Tab':\n // When tabbing from input, check if we're going outside the component\n // If shift+tab, we're going backwards (let it handle naturally)\n // If tab forward and no changes, we should exit edit mode\n if (!e.shiftKey && !this._hasValueChanged) {\n // Exit edit mode when tabbing out without changes\n this._handleCancel(true);\n }\n break;\n default:\n break;\n }\n }\n\n /\n Handle toolbar mousedown to track button clicks\n * Uses composedPath() to properly handle Shadow DOM boundaries\n /\n private _handleToolbarMouseDown(e: MouseEvent) {\n const path = e.composedPath();\n const foundButton = path.find(\n (el) =>\n el instanceof HTMLElement &&\n (el.tagName === 'BUTTON' \|\| el.tagName === 'CDS-ICON-BUTTON')\n ) as HTMLElement \| undefined;\n\n if (foundButton) {\n this._clickingWithin = true;\n\n // For disabled buttons, prevent default to stop blur\n const isDisabled =\n foundButton.hasAttribute('disabled') \|\|\n foundButton.getAttribute('aria-disabled') === 'true';\n if (isDisabled) {\n e.preventDefault();\n }\n }\n }\n\n /\n Handle keydown on save button to exit edit mode on Tab\n /\n private _handleSaveButtonKeyDown(e: KeyboardEvent) {\n if (e.key === 'Tab' && !e.shiftKey) {\n // Tab forward from save button - exit edit mode\n this._focused = false;\n this._inputElement?.blur();\n }\n }\n\n /\n Handle clicks outside the component\n /\n private _handleDocumentClick(e: MouseEvent) {\n // Only handle if we're in focused mode\n if (!this._focused) {\n return;\n }\n\n // Check if click is outside the component\n const path = e.composedPath();\n const clickedInside = path.includes(this);\n\n if (!clickedInside) {\n // Click was outside - exit edit mode\n if (this._canSave) {\n this._handleSave(true);\n } else {\n this._handleCancel(true);\n }\n }\n }\n\n /\n Initialize component\n /\n connectedCallback() {\n super.connectedCallback();\n this._internalValue = this.value \|\| this.defaultValue;\n this._initialValue = this._internalValue;\n\n // Set up document click listener\n this._boundHandleDocumentClick = this._handleDocumentClick.bind(this);\n document.addEventListener('click', this._boundHandleDocumentClick, true);\n }\n\n /\n Cleanup component state when removed from DOM\n /\n disconnectedCallback() {\n super.disconnectedCallback();\n this._escaping = false;\n this._clickingWithin = false;\n this._focused = false;\n\n // Clean up document click listener\n if (this._boundHandleDocumentClick) {\n document.removeEventListener(\n 'click',\n this._boundHandleDocumentClick,\n true\n );\n this._boundHandleDocumentClick = null;\n }\n }\n\n /\n Render the input element\n /\n private _renderInput() {\n const inputClasses = {\n [`${blockClass}__text-input`]: true,\n [`${carbonPrefix}--text-input`]: true,\n [`${carbonPrefix}--text-input--${this.size}`]: true,\n };\n\n const inputElement = html`\n <input\n id=${this.id}\n class=${classMap(inputClasses)}\n type=\"text\"\n part=\"input\"\n placeholder=${this.placeholder}\n .value=${this._internalValue}\n @input=${this._handleChange}\n @focus=${this._handleFocus}\n @keydown=${this._handleKeyDown}\n aria-label=${this.labelText}\n aria-invalid=${this.invalid ? 'true' : 'false'}\n ?readonly=${this.readOnly}\n />\n `;\n\n if (this.readOnly) {\n return html`\n <cds-tooltip\n align=${this.toggleTipAlignment}\n class=\"${blockClass}__toggletip-wrapper\"\n >\n ${inputElement}\n <cds-tooltip-content\n >${this.readOnlyToggleTipText}</cds-tooltip-content\n >\n </cds-tooltip>\n `;\n }\n\n return inputElement;\n }\n\n /\n Render action buttons\n */\n private _renderActions() {\n if (this.readOnly) {\n return html`\n <cds-icon-button\n class=\"${blockClass}__btn-readonly\"\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n @click=${this._handleFocus}\n >\n ${iconLoader(EditOff16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.readOnlyLabel}</span>\n </cds-icon-button>\n `;\n }\n\n if (this._focused) {\n return html`\n <cds-icon-button\n class=\"${blockClass}__btn ${blockClass}__btn-cancel\"\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n ?disabled=${!this._canCancel}\n @click=${() => this._handleCancel(false)}\n >\n ${iconLoader(Close16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.cancelLabel}</span>\n </cds-icon-button>\n <cds-icon-button\n class=\"${blockClass}__btn ${blockClass}__btn-save\"\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n ?disabled=${!this._canSave}\n @click=${() => this._handleSave(false)}\n @keydown=${this._handleSaveButtonKeyDown}\n >\n ${iconLoader(Checkmark16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.saveLabel}</span>\n </cds-icon-button>\n `;\n }\n\n const editBtnClasses = {\n [`${blockClass}__btn`]: true,\n [`${blockClass}__btn-edit`]: true,\n [`${blockClass}__btn-edit--always-visible`]: this.editAlwaysVisible,\n };\n\n return html`\n <cds-icon-button\n class=${classMap(editBtnClasses)}\n size=${this.size}\n align=${this.tooltipAlignment}\n kind=\"ghost\"\n @click=${this._handleFocus}\n >\n ${iconLoader(Edit16, { slot: 'icon' })}\n <span slot=\"tooltip-content\">${this.editLabel}</span>\n </cds-icon-button>\n `;\n }\n\n render() {\n const containerClasses = {\n [`${blockClass}__container`]: true,\n [`${blockClass}--${this.size}`]: true,\n [`${blockClass}--focused`]: this._focused,\n [`${blockClass}--invalid`]: this.invalid,\n [`${blockClass}--inherit-type`]: this.inheritTypography,\n [`${blockClass}--readonly`]: this.readOnly,\n };\n\n return html`\n <div class=${classMap(containerClasses)} @blur=${this._handleBlur}>\n ${this._renderInput()}\n <div\n class=\"${blockClass}__toolbar\"\n part=\"actions\"\n @mousedown=${this._handleToolbarMouseDown}\n >\n ${this.invalid\n ? iconLoader(WarningFilled16, {\n class: `${blockClass}__warning-icon`,\n })\n : ''}\n ${this._renderActions()}\n </div>\n </div>\n ${this.invalid\n ? html`<p class=\"${blockClass}__warning-text\" part=\"invalid-text\">\n ${this.invalidText}\n </p>`\n : ''}\n `;\n }\n\n static styles = styles;\n}\n\nexport default C4PEditInPlace;\n"],"mappings":"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"}

package/es/components/guide-banner/guide-banner.js CHANGED Viewed

@@ -14,7 +14,7 @@ import { property } from "lit/decorators.js";
 import "@carbon/web-components/es/components/button/index.js";
 import HostListenerMixin from "@carbon/web-components/es/globals/mixins/host-listener.js";
 import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
-import Close from "@carbon/icons/es/close/16";
+import Close16 from "@carbon/icons/es/close/16";
 import { iconLoader } from "@carbon/web-components/es/globals/internal/icon-loader.js";
 import Idea20 from "@carbon/icons/es/idea/20";
 //#region src/components/guide-banner/guide-banner.ts
@@ -102,7 +102,7 @@ let CDSGuideBanner = class CDSGuideBanner extends HostListenerMixin(LitElement)
             size="md"
             @click="${this._handleClose}"
           >
-            ${iconLoader(Close, { slot: "icon" })}
+            ${iconLoader(Close16, { slot: "icon" })}
           </cds-button>
         </div>
         <details ?open=${this.open}>

package/es/components/guide-banner/guide-banner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"guide-banner.js","names":["~~Close16","~~styles","customElement"],"sources":["../../../src/components/guide-banner/guide-banner.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, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport styles from './guide-banner.scss?lit';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport '@carbon/web-components/es/components/button/index.js';\nimport Close16 from '@carbon/icons/es/close/16';\nimport Idea20 from '@carbon/icons/es/idea/20';\nimport { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';\n\nexport const blockClass = `${prefix}--guidebanner`;\nconst blockEvent = `${prefix}-guidebanner`;\n\n/\n GuideBanner.\n \n @element c4p-guide-banner\n * @csspart guide-banner\n * @fires c4p-guide-banner-toggle Custom event fired when banner is opened\n * @fires c4p-guide-banner-close Custom event fired when banner is closed\n * */\n\n@customElement(`${prefix}-guide-banner`)\nclass CDSGuideBanner extends HostListenerMixin(LitElement) {\n @property({ type: String, reflect: true })\n collapseText?: string = '';\n\n @property({ type: String, reflect: true })\n expandText?: string = '';\n\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n\n @property({ type: String, reflect: true })\n titleText?: string = '';\n\n static get eventToggle() {\n return `${blockEvent}-toggle`;\n }\n\n static get eventOnClose() {\n return `${blockEvent}-close`;\n }\n\n private _handleClose() {\n const init = {\n bubbles: true,\n composed: true,\n detail: {},\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSGuideBanner).eventOnClose,\n init\n )\n );\n }\n\n private _handleToggle() {\n this.open = !this.open;\n const init = {\n bubbles: true,\n composed: true,\n detail: {\n open: this.open,\n },\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSGuideBanner).eventToggle,\n init\n )\n );\n }\n\n private _getTitle() {\n if (this.titleText) {\n return html`<div class=\"${blockClass}__title\">${this.titleText}</div>`;\n }\n return nothing;\n }\n\n private _getButton() {\n const buttonText = this.open ? this.collapseText : this.expandText;\n return html`<cds-button\n kind=\"ghost\"\n size=\"md\"\n class=\"${blockClass}__toggle-button\"\n @click=${this._handleToggle}\n >\n ${buttonText}\n </cds-button>`;\n }\n\n render() {\n const classes = classMap({\n [`${blockClass}`]: true,\n [`${blockClass}__collapsible-collapsed`]: !this.open,\n });\n return html`\n <div class=\"${classes}\">\n <div class=\"${blockClass}__header\">\n <div class=\"${blockClass}__icon-idea\">\n <slot name=\"icon\">\n ${iconLoader(Idea20, {\n slot: 'icon',\n })}\n </slot>\n </div>\n ${this._getTitle()}\n <slot name=\"header\"></slot>\n <cds-button\n align=\"bottom-end\"\n class=\"${blockClass}__close-button\"\n kind=\"ghost\"\n size=\"md\"\n @click=\"${this._handleClose}\"\n >\n ${iconLoader(Close16, { slot: 'icon' })}\n </cds-button>\n </div>\n <details ?open=${this.open}>\n <slot name=\"body\"></slot>\n <summary\n tabindex=\"-1\"\n @click=${(evt: MouseEvent) => {\n evt.preventDefault();\n }}\n >\n <div class=\"${blockClass}__navigation\">\n <slot name=\"footer\">${this._getButton()}</slot>\n </div>\n </summary>\n </details>\n </div>\n `;\n }\n\n static styles = styles;\n}\n\nexport default CDSGuideBanner;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAa,aAAa;AAC1B,MAAM,aAAa;;;;;;;;;AAWnB,IAAA,iBAAA,MACM,uBAAuB,kBAAkB,WAAW,CAAC;;;sBAEjC;oBAGF;cAGN;mBAGK;;CAErB,WAAW,cAAc;AACvB,SAAO,GAAG,WAAW;;CAGvB,WAAW,eAAe;AACxB,SAAO,GAAG,WAAW;;CAGvB,eAAuB;AAMrB,OAAK,cACH,IAAI,YACD,KAAK,YAAsC,cAC5C;GAPF,SAAS;GACT,UAAU;GACV,QAAQ,EAAE;GAKJ,CACL,CACF;;CAGH,gBAAwB;AACtB,OAAK,OAAO,CAAC,KAAK;EAClB,MAAM,OAAO;GACX,SAAS;GACT,UAAU;GACV,QAAQ,EACN,MAAM,KAAK,MACZ;GACF;AACD,OAAK,cACH,IAAI,YACD,KAAK,YAAsC,aAC5C,KACD,CACF;;CAGH,YAAoB;AAClB,MAAI,KAAK,UACP,QAAO,IAAI,eAAe,WAAW,WAAW,KAAK,UAAU;AAEjE,SAAO;;CAGT,aAAqB;EACnB,MAAM,aAAa,KAAK,OAAO,KAAK,eAAe,KAAK;AACxD,SAAO,IAAI;;;eAGA,WAAW;eACX,KAAK,cAAc;;QAE1B,WAAW;;;CAIjB,SAAS;AAKP,SAAO,IAAI;oBAJK,SAAS;IACtB,GAAG,eAAe;IAClB,GAAG,WAAW,2BAA2B,CAAC,KAAK;GACjD,CAEsB,CAAC;sBACN,WAAW;wBACT,WAAW;;gBAEnB,WAAW,QAAQ,EACnB,MAAM,QACP,CAAC,CAAC;;;YAGL,KAAK,WAAW,CAAC;;;;qBAIR,WAAW;;;sBAGV,KAAK,aAAa;;cAE1B,~~WAAWA~~,~~OAAS~~,EAAE,MAAM,QAAQ,CAAC,CAAC;;;yBAG3B,KAAK,KAAK;;;;sBAIb,QAAoB;AAC5B,OAAI,gBAAgB;IACpB;;0BAEY,WAAW;oCACD,KAAK,YAAY,CAAC;;;;;;;;~~gBAQpCC~~;;;YAlHf,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,gBAAA,KAAA,EAAA;YAGzC,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,cAAA,KAAA,EAAA;YAGzC,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,QAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,aAAA,KAAA,EAAA;6BAX3CC,cAAc,mBAAyB,CAAA,EAAA,eAAA;AAuHxC,IAAA,uBAAe"}
1	+ {"version":3,"file":"guide-banner.js","names":["styles","customElement"],"sources":["../../../src/components/guide-banner/guide-banner.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, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport styles from './guide-banner.scss?lit';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport '@carbon/web-components/es/components/button/index.js';\nimport Close16 from '@carbon/icons/es/close/16';\nimport Idea20 from '@carbon/icons/es/idea/20';\nimport { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';\n\nexport const blockClass = `${prefix}--guidebanner`;\nconst blockEvent = `${prefix}-guidebanner`;\n\n/\n GuideBanner.\n \n @element c4p-guide-banner\n * @csspart guide-banner\n * @fires c4p-guide-banner-toggle Custom event fired when banner is opened\n * @fires c4p-guide-banner-close Custom event fired when banner is closed\n * */\n\n@customElement(`${prefix}-guide-banner`)\nclass CDSGuideBanner extends HostListenerMixin(LitElement) {\n @property({ type: String, reflect: true })\n collapseText?: string = '';\n\n @property({ type: String, reflect: true })\n expandText?: string = '';\n\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n\n @property({ type: String, reflect: true })\n titleText?: string = '';\n\n static get eventToggle() {\n return `${blockEvent}-toggle`;\n }\n\n static get eventOnClose() {\n return `${blockEvent}-close`;\n }\n\n private _handleClose() {\n const init = {\n bubbles: true,\n composed: true,\n detail: {},\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSGuideBanner).eventOnClose,\n init\n )\n );\n }\n\n private _handleToggle() {\n this.open = !this.open;\n const init = {\n bubbles: true,\n composed: true,\n detail: {\n open: this.open,\n },\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSGuideBanner).eventToggle,\n init\n )\n );\n }\n\n private _getTitle() {\n if (this.titleText) {\n return html`<div class=\"${blockClass}__title\">${this.titleText}</div>`;\n }\n return nothing;\n }\n\n private _getButton() {\n const buttonText = this.open ? this.collapseText : this.expandText;\n return html`<cds-button\n kind=\"ghost\"\n size=\"md\"\n class=\"${blockClass}__toggle-button\"\n @click=${this._handleToggle}\n >\n ${buttonText}\n </cds-button>`;\n }\n\n render() {\n const classes = classMap({\n [`${blockClass}`]: true,\n [`${blockClass}__collapsible-collapsed`]: !this.open,\n });\n return html`\n <div class=\"${classes}\">\n <div class=\"${blockClass}__header\">\n <div class=\"${blockClass}__icon-idea\">\n <slot name=\"icon\">\n ${iconLoader(Idea20, {\n slot: 'icon',\n })}\n </slot>\n </div>\n ${this._getTitle()}\n <slot name=\"header\"></slot>\n <cds-button\n align=\"bottom-end\"\n class=\"${blockClass}__close-button\"\n kind=\"ghost\"\n size=\"md\"\n @click=\"${this._handleClose}\"\n >\n ${iconLoader(Close16, { slot: 'icon' })}\n </cds-button>\n </div>\n <details ?open=${this.open}>\n <slot name=\"body\"></slot>\n <summary\n tabindex=\"-1\"\n @click=${(evt: MouseEvent) => {\n evt.preventDefault();\n }}\n >\n <div class=\"${blockClass}__navigation\">\n <slot name=\"footer\">${this._getButton()}</slot>\n </div>\n </summary>\n </details>\n </div>\n `;\n }\n\n static styles = styles;\n}\n\nexport default CDSGuideBanner;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAa,aAAa;AAC1B,MAAM,aAAa;;;;;;;;;AAWnB,IAAA,iBAAA,MACM,uBAAuB,kBAAkB,WAAW,CAAC;;;sBAEjC;oBAGF;cAGN;mBAGK;;CAErB,WAAW,cAAc;AACvB,SAAO,GAAG,WAAW;;CAGvB,WAAW,eAAe;AACxB,SAAO,GAAG,WAAW;;CAGvB,eAAuB;AAMrB,OAAK,cACH,IAAI,YACD,KAAK,YAAsC,cAC5C;GAPF,SAAS;GACT,UAAU;GACV,QAAQ,EAAE;GAKJ,CACL,CACF;;CAGH,gBAAwB;AACtB,OAAK,OAAO,CAAC,KAAK;EAClB,MAAM,OAAO;GACX,SAAS;GACT,UAAU;GACV,QAAQ,EACN,MAAM,KAAK,MACZ;GACF;AACD,OAAK,cACH,IAAI,YACD,KAAK,YAAsC,aAC5C,KACD,CACF;;CAGH,YAAoB;AAClB,MAAI,KAAK,UACP,QAAO,IAAI,eAAe,WAAW,WAAW,KAAK,UAAU;AAEjE,SAAO;;CAGT,aAAqB;EACnB,MAAM,aAAa,KAAK,OAAO,KAAK,eAAe,KAAK;AACxD,SAAO,IAAI;;;eAGA,WAAW;eACX,KAAK,cAAc;;QAE1B,WAAW;;;CAIjB,SAAS;AAKP,SAAO,IAAI;oBAJK,SAAS;IACtB,GAAG,eAAe;IAClB,GAAG,WAAW,2BAA2B,CAAC,KAAK;GACjD,CAEsB,CAAC;sBACN,WAAW;wBACT,WAAW;;gBAEnB,WAAW,QAAQ,EACnB,MAAM,QACP,CAAC,CAAC;;;YAGL,KAAK,WAAW,CAAC;;;;qBAIR,WAAW;;;sBAGV,KAAK,aAAa;;cAE1B,WAAW,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAC;;;yBAG3B,KAAK,KAAK;;;;sBAIb,QAAoB;AAC5B,OAAI,gBAAgB;IACpB;;0BAEY,WAAW;oCACD,KAAK,YAAY,CAAC;;;;;;;;gBAQpCA;;;YAlHf,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,gBAAA,KAAA,EAAA;YAGzC,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,cAAA,KAAA,EAAA;YAGzC,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,QAAA,KAAA,EAAA;YAG1C,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,eAAA,WAAA,aAAA,KAAA,EAAA;6BAX3CC,cAAc,mBAAyB,CAAA,EAAA,eAAA;AAuHxC,IAAA,uBAAe"}

package/es/components/notification-panel/notification.js CHANGED Viewed

@@ -16,7 +16,7 @@ import "@carbon/web-components/es/components/button/index.js";
 import HostListenerMixin from "@carbon/web-components/es/globals/mixins/host-listener.js";
 import { selectorTabbable } from "@carbon/web-components/es/globals/settings.js";
 import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
-import Close from "@carbon/icons/es/close/16";
+import Close16 from "@carbon/icons/es/close/16";
 import { iconLoader } from "@carbon/web-components/es/globals/internal/icon-loader.js";
 import WarningAltFilled16 from "@carbon/icons/es/warning--alt--filled/16";
 import { consume } from "@lit/context";
@@ -84,7 +84,7 @@ let CDSNotification = class CDSNotification extends HostListenerMixin(LitElement
         class="${blockClass}__dismiss-single-button"
         @click=${dismissSingleNotification}
       >
-        ${iconLoader(Close, { slot: "icon" })}
+        ${iconLoader(Close16, { slot: "icon" })}
       </cds-button>
     `;
 	}

package/es/components/notification-panel/notification.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"notification.js","names":["~~Close16","~~styles","customElement"],"sources":["../../../src/components/notification-panel/notification.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2023, 2024\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 { selectorTabbable } from '@carbon/web-components/es/globals/settings.js';\nimport { dateTimeFormat } from '@carbon/utilities';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { consume } from '@lit/context';\nimport { dateTimeLocaleContext } from './date-time-context';\nimport styles from './notification.scss?lit';\nimport '@carbon/web-components/es/components/button/index.js';\nimport Close16 from '@carbon/icons/es/close/16';\nimport ErrorFilled16 from '@carbon/icons/es/error--filled/16';\nimport CheckmarkFilled16 from '@carbon/icons/es/checkmark--filled/16';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16';\nimport InformationSquareFilled16 from '@carbon/icons/es/information--square--filled/16';\nimport { getSupportedLocale } from '../../globals/js/utils/getSupportedLocale';\nimport { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';\n\nconst blockClass = `${prefix}--notifications-panel__notification`;\nconst DefaultLocale = 'en-US';\ntype DateTimeStyles = 'long' \| 'short' \| 'narrow';\nconst dateTimeStyle = 'long' as DateTimeStyles;\n/\n Notification.\n * @element c4p-notification\n * @slot title - The Title for the notification.\n * @slot description - The description for the notification.\n * @csspart dialog The dialog.\n * The custom event is fired when a notification is clicked or when the Enter key is pressed on it.\n * @fires c4p-notification-dismiss - The custom event is fired when the notification is closed by a user gesture.\n /\n@customElement(`${prefix}-notification`)\nclass CDSNotification extends HostListenerMixin(LitElement) {\n /\n Sets the type of notification to display: 'error', 'warning', 'success', or 'informational'\n /\n @property({ reflect: true })\n type?: 'error' \| 'warning' \| 'success' \| 'informational';\n /\n Sets the timestamp for the notification, typically used to indicate when it was received\n /\n @property()\n timestamp?: Date;\n\n @consume({ context: dateTimeLocaleContext, subscribe: true })\n dateTimeLocale: string \| undefined = undefined;\n\n private _handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n this.click();\n }\n };\n\n connectedCallback() {\n super.connectedCallback();\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n if (!this.hasAttribute('tabindex')) {\n this.setAttribute('tabindex', '0');\n }\n this.addEventListener('keydown', this._handleKeyDown);\n }\n render() {\n const {\n type,\n timestamp,\n dateTimeLocale,\n _dismissSingleNotification: dismissSingleNotification,\n _fetchIcon: fetchIcon,\n } = this;\n const supportedLocale = getSupportedLocale(dateTimeLocale, DefaultLocale);\n const icon = fetchIcon(type);\n return html`\n ${icon}\n <div class=\"${blockClass}-content\">\n <p class=\"${blockClass}-time-label\">\n ${dateTimeFormat.relative.format(timestamp as Date, {\n locale: supportedLocale as string,\n style: dateTimeStyle,\n })}\n </p>\n <slot name=\"title\"></slot>\n <div class=\"${blockClass}-description\">\n <slot name=\"description\"></slot>\n </div>\n </div>\n <cds-button\n tooltip-text=\"\"\n align=\"left\"\n kind=\"ghost\"\n size=\"sm\"\n class=\"${blockClass}__dismiss-single-button\"\n @click=${dismissSingleNotification}\n >\n ${iconLoader(Close16, { slot: 'icon' })}\n </cds-button>\n `;\n }\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('keydown', this._handleKeyDown);\n }\n /\n Handles user-initiated dismiss request of the Notification.\n \n @param event The event that triggered the click.\n /\n private _dismissSingleNotification(event: Event) {\n const triggeredBy = event.target;\n event.preventDefault();\n event.stopPropagation();\n const init = {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: {\n triggeredBy,\n },\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSNotification).notificationDismiss,\n init\n )\n );\n }\n\n private _fetchIcon(type) {\n let icon;\n switch (type) {\n case 'error':\n icon = iconLoader(ErrorFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-error`,\n });\n break;\n case 'success':\n icon = iconLoader(CheckmarkFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-success`,\n });\n break;\n case 'warning':\n icon = iconLoader(WarningAltFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-warning`,\n });\n break;\n case 'informational':\n icon = iconLoader(InformationSquareFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-informational`,\n });\n break;\n default:\n icon = null;\n }\n return icon;\n }\n\n /\n A selector selecting tabbable nodes.\n /\n static get selectorTabbable() {\n return selectorTabbable;\n }\n\n /\n The custom event is fired when the notification is closed by a user gesture.\n */\n static get notificationDismiss() {\n return `${prefix}-notification-dismiss`;\n }\n static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default CDSNotification;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAM,aAAa;AACnB,MAAM,gBAAgB;AAEtB,MAAM,gBAAgB;;;;;;;;;;AAUtB,IAAA,kBAAA,MACM,wBAAwB,kBAAkB,WAAW,CAAC;;;wBAarB,KAAA;yBAEX,MAAqB;AAC7C,OAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,IACjC,MAAK,OAAO;;;CAIhB,oBAAoB;AAClB,QAAM,mBAAmB;AACzB,MAAI,CAAC,KAAK,aAAa,OAAO,CAC5B,MAAK,aAAa,QAAQ,SAAS;AAErC,MAAI,CAAC,KAAK,aAAa,WAAW,CAChC,MAAK,aAAa,YAAY,IAAI;AAEpC,OAAK,iBAAiB,WAAW,KAAK,eAAe;;CAEvD,SAAS;EACP,MAAM,EACJ,MACA,WACA,gBACA,4BAA4B,2BAC5B,YAAY,cACV;EACJ,MAAM,kBAAkB,mBAAmB,gBAAgB,cAAc;AAEzE,SAAO,IAAI;QADE,UAAU,KAEf,CAAC;oBACO,WAAW;oBACX,WAAW;YACnB,eAAe,SAAS,OAAO,WAAmB;GAClD,QAAQ;GACR,OAAO;GACR,CAAC,CAAC;;;sBAGS,WAAW;;;;;;;;;iBAShB,WAAW;iBACX,0BAA0B;;UAEjC,~~WAAWA~~,~~OAAS~~,EAAE,MAAM,QAAQ,CAAC,CAAC;;;;CAI9C,uBAAuB;AACrB,QAAM,sBAAsB;AAC5B,OAAK,oBAAoB,WAAW,KAAK,eAAe;;;;;;;CAO1D,2BAAmC,OAAc;EAC/C,MAAM,cAAc,MAAM;AAC1B,QAAM,gBAAgB;AACtB,QAAM,iBAAiB;EACvB,MAAM,OAAO;GACX,SAAS;GACT,YAAY;GACZ,UAAU;GACV,QAAQ,EACN,aACD;GACF;AACD,OAAK,cACH,IAAI,YACD,KAAK,YAAuC,qBAC7C,KACD,CACF;;CAGH,WAAmB,MAAM;EACvB,IAAI;AACJ,UAAQ,MAAR;GACE,KAAK;AACH,WAAO,WAAW,eAAe,EAC/B,OAAO,GAAG,WAAW,eAAe,WAAW,qBAChD,CAAC;AACF;GACF,KAAK;AACH,WAAO,WAAW,mBAAmB,EACnC,OAAO,GAAG,WAAW,eAAe,WAAW,uBAChD,CAAC;AACF;GACF,KAAK;AACH,WAAO,WAAW,oBAAoB,EACpC,OAAO,GAAG,WAAW,eAAe,WAAW,uBAChD,CAAC;AACF;GACF,KAAK;AACH,WAAO,WAAW,2BAA2B,EAC3C,OAAO,GAAG,WAAW,eAAe,WAAW,6BAChD,CAAC;AACF;GACF,QACE,QAAO;;AAEX,SAAO;;;;;CAMT,WAAW,mBAAmB;AAC5B,SAAO;;;;;CAMT,WAAW,sBAAsB;AAC/B,SAAO;;;~~gBAEOC~~;;;YAtIf,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,QAAA,KAAA,EAAA;YAK3B,UAAU,CAAA,EAAA,gBAAA,WAAA,aAAA,KAAA,EAAA;YAGV,QAAQ;CAAE,SAAS;CAAuB,WAAW;CAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,kBAAA,KAAA,EAAA;8BAb9DC,cAAc,mBAAyB,CAAA,EAAA,gBAAA;AA8IxC,IAAA,uBAAe"}
1	+ {"version":3,"file":"notification.js","names":["styles","customElement"],"sources":["../../../src/components/notification-panel/notification.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2023, 2024\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 { selectorTabbable } from '@carbon/web-components/es/globals/settings.js';\nimport { dateTimeFormat } from '@carbon/utilities';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { consume } from '@lit/context';\nimport { dateTimeLocaleContext } from './date-time-context';\nimport styles from './notification.scss?lit';\nimport '@carbon/web-components/es/components/button/index.js';\nimport Close16 from '@carbon/icons/es/close/16';\nimport ErrorFilled16 from '@carbon/icons/es/error--filled/16';\nimport CheckmarkFilled16 from '@carbon/icons/es/checkmark--filled/16';\nimport WarningAltFilled16 from '@carbon/icons/es/warning--alt--filled/16';\nimport InformationSquareFilled16 from '@carbon/icons/es/information--square--filled/16';\nimport { getSupportedLocale } from '../../globals/js/utils/getSupportedLocale';\nimport { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';\n\nconst blockClass = `${prefix}--notifications-panel__notification`;\nconst DefaultLocale = 'en-US';\ntype DateTimeStyles = 'long' \| 'short' \| 'narrow';\nconst dateTimeStyle = 'long' as DateTimeStyles;\n/\n Notification.\n * @element c4p-notification\n * @slot title - The Title for the notification.\n * @slot description - The description for the notification.\n * @csspart dialog The dialog.\n * The custom event is fired when a notification is clicked or when the Enter key is pressed on it.\n * @fires c4p-notification-dismiss - The custom event is fired when the notification is closed by a user gesture.\n /\n@customElement(`${prefix}-notification`)\nclass CDSNotification extends HostListenerMixin(LitElement) {\n /\n Sets the type of notification to display: 'error', 'warning', 'success', or 'informational'\n /\n @property({ reflect: true })\n type?: 'error' \| 'warning' \| 'success' \| 'informational';\n /\n Sets the timestamp for the notification, typically used to indicate when it was received\n /\n @property()\n timestamp?: Date;\n\n @consume({ context: dateTimeLocaleContext, subscribe: true })\n dateTimeLocale: string \| undefined = undefined;\n\n private _handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n this.click();\n }\n };\n\n connectedCallback() {\n super.connectedCallback();\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n if (!this.hasAttribute('tabindex')) {\n this.setAttribute('tabindex', '0');\n }\n this.addEventListener('keydown', this._handleKeyDown);\n }\n render() {\n const {\n type,\n timestamp,\n dateTimeLocale,\n _dismissSingleNotification: dismissSingleNotification,\n _fetchIcon: fetchIcon,\n } = this;\n const supportedLocale = getSupportedLocale(dateTimeLocale, DefaultLocale);\n const icon = fetchIcon(type);\n return html`\n ${icon}\n <div class=\"${blockClass}-content\">\n <p class=\"${blockClass}-time-label\">\n ${dateTimeFormat.relative.format(timestamp as Date, {\n locale: supportedLocale as string,\n style: dateTimeStyle,\n })}\n </p>\n <slot name=\"title\"></slot>\n <div class=\"${blockClass}-description\">\n <slot name=\"description\"></slot>\n </div>\n </div>\n <cds-button\n tooltip-text=\"\"\n align=\"left\"\n kind=\"ghost\"\n size=\"sm\"\n class=\"${blockClass}__dismiss-single-button\"\n @click=${dismissSingleNotification}\n >\n ${iconLoader(Close16, { slot: 'icon' })}\n </cds-button>\n `;\n }\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('keydown', this._handleKeyDown);\n }\n /\n Handles user-initiated dismiss request of the Notification.\n \n @param event The event that triggered the click.\n /\n private _dismissSingleNotification(event: Event) {\n const triggeredBy = event.target;\n event.preventDefault();\n event.stopPropagation();\n const init = {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: {\n triggeredBy,\n },\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSNotification).notificationDismiss,\n init\n )\n );\n }\n\n private _fetchIcon(type) {\n let icon;\n switch (type) {\n case 'error':\n icon = iconLoader(ErrorFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-error`,\n });\n break;\n case 'success':\n icon = iconLoader(CheckmarkFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-success`,\n });\n break;\n case 'warning':\n icon = iconLoader(WarningAltFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-warning`,\n });\n break;\n case 'informational':\n icon = iconLoader(InformationSquareFilled16, {\n class: `${blockClass}-status-icon ${blockClass}-status-icon-informational`,\n });\n break;\n default:\n icon = null;\n }\n return icon;\n }\n\n /\n A selector selecting tabbable nodes.\n /\n static get selectorTabbable() {\n return selectorTabbable;\n }\n\n /\n The custom event is fired when the notification is closed by a user gesture.\n */\n static get notificationDismiss() {\n return `${prefix}-notification-dismiss`;\n }\n static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default CDSNotification;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAM,aAAa;AACnB,MAAM,gBAAgB;AAEtB,MAAM,gBAAgB;;;;;;;;;;AAUtB,IAAA,kBAAA,MACM,wBAAwB,kBAAkB,WAAW,CAAC;;;wBAarB,KAAA;yBAEX,MAAqB;AAC7C,OAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,IACjC,MAAK,OAAO;;;CAIhB,oBAAoB;AAClB,QAAM,mBAAmB;AACzB,MAAI,CAAC,KAAK,aAAa,OAAO,CAC5B,MAAK,aAAa,QAAQ,SAAS;AAErC,MAAI,CAAC,KAAK,aAAa,WAAW,CAChC,MAAK,aAAa,YAAY,IAAI;AAEpC,OAAK,iBAAiB,WAAW,KAAK,eAAe;;CAEvD,SAAS;EACP,MAAM,EACJ,MACA,WACA,gBACA,4BAA4B,2BAC5B,YAAY,cACV;EACJ,MAAM,kBAAkB,mBAAmB,gBAAgB,cAAc;AAEzE,SAAO,IAAI;QADE,UAAU,KAEf,CAAC;oBACO,WAAW;oBACX,WAAW;YACnB,eAAe,SAAS,OAAO,WAAmB;GAClD,QAAQ;GACR,OAAO;GACR,CAAC,CAAC;;;sBAGS,WAAW;;;;;;;;;iBAShB,WAAW;iBACX,0BAA0B;;UAEjC,WAAW,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAC;;;;CAI9C,uBAAuB;AACrB,QAAM,sBAAsB;AAC5B,OAAK,oBAAoB,WAAW,KAAK,eAAe;;;;;;;CAO1D,2BAAmC,OAAc;EAC/C,MAAM,cAAc,MAAM;AAC1B,QAAM,gBAAgB;AACtB,QAAM,iBAAiB;EACvB,MAAM,OAAO;GACX,SAAS;GACT,YAAY;GACZ,UAAU;GACV,QAAQ,EACN,aACD;GACF;AACD,OAAK,cACH,IAAI,YACD,KAAK,YAAuC,qBAC7C,KACD,CACF;;CAGH,WAAmB,MAAM;EACvB,IAAI;AACJ,UAAQ,MAAR;GACE,KAAK;AACH,WAAO,WAAW,eAAe,EAC/B,OAAO,GAAG,WAAW,eAAe,WAAW,qBAChD,CAAC;AACF;GACF,KAAK;AACH,WAAO,WAAW,mBAAmB,EACnC,OAAO,GAAG,WAAW,eAAe,WAAW,uBAChD,CAAC;AACF;GACF,KAAK;AACH,WAAO,WAAW,oBAAoB,EACpC,OAAO,GAAG,WAAW,eAAe,WAAW,uBAChD,CAAC;AACF;GACF,KAAK;AACH,WAAO,WAAW,2BAA2B,EAC3C,OAAO,GAAG,WAAW,eAAe,WAAW,6BAChD,CAAC;AACF;GACF,QACE,QAAO;;AAEX,SAAO;;;;;CAMT,WAAW,mBAAmB;AAC5B,SAAO;;;;;CAMT,WAAW,sBAAsB;AAC/B,SAAO;;;gBAEOA;;;YAtIf,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,QAAA,KAAA,EAAA;YAK3B,UAAU,CAAA,EAAA,gBAAA,WAAA,aAAA,KAAA,EAAA;YAGV,QAAQ;CAAE,SAAS;CAAuB,WAAW;CAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,kBAAA,KAAA,EAAA;8BAb9DC,cAAc,mBAAyB,CAAA,EAAA,gBAAA;AA8IxC,IAAA,uBAAe"}

package/es/components/side-panel/side-panel.js CHANGED Viewed

@@ -18,7 +18,7 @@ import HostListenerMixin from "@carbon/web-components/es/globals/mixins/host-lis
 import { selectorTabbable } from "@carbon/web-components/es/globals/settings.js";
 import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
 import ArrowLeft16 from "@carbon/icons/es/arrow--left/16";
-import Close from "@carbon/icons/es/close/16";
+import Close16 from "@carbon/icons/es/close/16";
 import { iconLoader } from "@carbon/web-components/es/globals/internal/icon-loader.js";
 import { moderate02 } from "@carbon/motion";
 import "@carbon/web-components/es/components/icon-button/index.js";
@@ -470,7 +470,7 @@ let CDSSidePanel = class CDSSidePanel extends HostListenerMixin(LitElement) {
                 class=${`${blockClass}__close-button`}
                 @click=${this._handleCloseClick}
               >
-                ${iconLoader(Close, { slot: "icon" })}
+                ${iconLoader(Close16, { slot: "icon" })}
                 <span slot="tooltip-content"> ${closeIconDescription} </span>
               </cds-icon-button>` : ""}
         </div>