@fundamental-ngx/core 0.62.2-rc.8 → 0.62.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/fundamental-ngx-core-action-bar.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-action-sheet.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-avatar-group.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-avatar.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-bar.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-breadcrumb.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-busy-indicator.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-button.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-calendar.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-card.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-carousel.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-checkbox.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-combobox.mjs +2 -8
- package/fesm2022/fundamental-ngx-core-combobox.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-dialog.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-dynamic-page.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-dynamic-side-content.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-facets.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-feed-input.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-feed-list-item.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-file-uploader.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-fixed-card-layout.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-flexible-column-layout.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-form.mjs +16 -16
- package/fesm2022/fundamental-ngx-core-form.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-generic-tag.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-grid-list.mjs +22 -6
- package/fesm2022/fundamental-ngx-core-grid-list.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-icon.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-info-label.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-input-group.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-layout-grid.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-layout-panel.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-link.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-list.mjs +4 -4
- package/fesm2022/fundamental-ngx-core-message-box.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-message-page.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-message-strip.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-message-toast.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-micro-process-flow.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-multi-combobox.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-notification.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-object-attribute.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-object-identifier.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-object-marker.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-object-status.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-pagination.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-panel.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-popover.mjs +8 -5
- package/fesm2022/fundamental-ngx-core-popover.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-product-switch.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-progress-indicator.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-quick-view.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-radio.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-rating-indicator.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-resizable-card-layout.mjs +4 -4
- package/fesm2022/fundamental-ngx-core-segmented-button.mjs +3 -3
- package/fesm2022/fundamental-ngx-core-segmented-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-select.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-settings.mjs +4 -4
- package/fesm2022/fundamental-ngx-core-shellbar.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-side-navigation.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-skeleton.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-slider.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-split-button.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-status-indicator.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-step-input.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-switch.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-switch.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-table.mjs +4 -4
- package/fesm2022/fundamental-ngx-core-tabs.mjs +4 -4
- package/fesm2022/fundamental-ngx-core-text.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-tile.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-time.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-title.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-token.mjs +4 -4
- package/fesm2022/fundamental-ngx-core-toolbar.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-tree.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-upload-collection.mjs +2 -2
- package/fesm2022/fundamental-ngx-core-vertical-navigation.mjs +4 -4
- package/fesm2022/fundamental-ngx-core-wizard.mjs +2 -2
- package/package.json +4 -4
- package/types/fundamental-ngx-core-grid-list.d.ts +10 -1
- package/types/fundamental-ngx-core-popover.d.ts +1 -1
|
@@ -166,11 +166,11 @@ class ProductSwitchBodyComponent {
|
|
|
166
166
|
}
|
|
167
167
|
}
|
|
168
168
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ProductSwitchBodyComponent, deps: [{ token: i1.ViewportRuler }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
169
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: ProductSwitchBodyComponent, isStandalone: true, selector: "fd-product-switch-body", inputs: { dragAndDropEnabled: "dragAndDropEnabled", products: "products", forceListMode: "forceListMode" }, outputs: { productsChange: "productsChange", itemClicked: "itemClicked" }, ngImport: i0, template: "<div\n class=\"fd-product-switch__body\"\n [class.fd-product-switch__body--col-3]=\"_isSmallMode() && !_isListMode()\"\n [class.fd-product-switch__body--mobile]=\"_isListMode()\"\n>\n <ul\n fd-dnd-list\n class=\"fd-product-switch__list\"\n [items]=\"products\"\n [gridMode]=\"!_isListMode()\"\n (itemDropped)=\"_productSwitchItemsChangeHandle($event)\"\n >\n @for (product of products; track product) {\n <li\n fd-dnd-item\n tabindex=\"0\"\n class=\"fd-product-switch__item\"\n [class.selected]=\"product.selected\"\n (keydown)=\"_keyDownHandle($event)\"\n (click)=\"_itemClick(product, $event)\"\n [draggable]=\"!product.disabledDragAndDrop && dragAndDropEnabled\"\n [stickInPlace]=\"!!product.stickToPosition\"\n >\n @if (product.avatar) {\n <fd-avatar\n size=\"s\"\n [glyph]=\"product.avatar.glyph ?? null\"\n [label]=\"product.avatar.label ?? null\"\n [circle]=\"!!product.avatar.circle\"\n [image]=\"product.avatar.image ?? null\"\n [contain]=\"!!product.avatar.contain\"\n [transparent]=\"!!product.avatar.transparent\"\n [placeholder]=\"!!product.avatar.placeholder\"\n [tile]=\"!!product.avatar.tile\"\n [colorAccent]=\"product.avatar.colorAccent\"\n [colorIndication]=\"product.avatar.colorIndication\"\n [border]=\"!!product.avatar.border\"\n [alterIcon]=\"product.avatar.alterIcon ?? null\"\n [backupImage]=\"product.avatar.backupImage ?? null\"\n [ariaLabel]=\"product.avatar.ariaLabel ?? null\"\n >\n </fd-avatar>\n } @else {\n <fd-icon\n [font]=\"product.font || FD_DEFAULT_ICON_FONT_FAMILY\"\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [glyph]=\"product.icon\"\n ></fd-icon>\n }\n\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n @if (product.subtitle) {\n <div class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n }\n </div>\n </li>\n }\n </ul>\n</div>\n", styles: [".drag-placeholder{opacity:.3;position:absolute}.fd-product-switch{--fdProduct_Switch_Item_Border_Color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-product-switch:after,.fd-product-switch:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__list{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:.5rem;width:46.5rem}.fd-product-switch__list:after,.fd-product-switch__list:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:7rem;max-width:11.25rem;text-align:center;-webkit-box-flex:1;background-color:var(--sapList_Background);border:.125rem solid var(--fdProduct_Switch_Item_Border_Color);border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--fdProductSwitch_Shadow);box-shadow:var(--fdProductSwitch_Shadow);-ms-flex:1 0 25%;flex:1 0 25%;padding-block:.5rem;padding-inline:.5rem}.fd-product-switch__item:after,.fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapList_Background)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:var(--sapList_Hover_Background);cursor:pointer}.fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{--fdProduct_Switch_Item_Border_Color:var(--sapList_Active_Background);background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-active.is-focus,.fd-product-switch__item.is-active:focus,.fd-product-switch__item:active.is-focus,.fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__item.is-active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__item.is-active .fd-product-switch__title,.fd-product-switch__item:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__subtitle,.fd-product-switch__item:active .fd-product-switch__title{color:var(--sapList_Active_TextColor)}.fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__item.is-active:hover .fd-product-switch__title:after,.fd-product-switch__item.is-active:hover .fd-product-switch__title:before,.fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before,.fd-product-switch__item:active.is-hover .fd-product-switch__title:after,.fd-product-switch__item:active.is-hover .fd-product-switch__title:before,.fd-product-switch__item:active:hover .fd-product-switch__title:after,.fd-product-switch__item:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.selected{--fdProduct_Switch_Item_Border_Color:var(--sapList_SelectionBorderColor)}.fd-product-switch__item.selected,.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBackgroundColor)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__item.selected:hover,.fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__item.selected:active,.fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__item.dragged{-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2);cursor:-webkit-grabbing;cursor:grabbing}.fd-product-switch__item.dragged,.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:var(--sapList_Background)}.fd-product-switch__item.dragged:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon[class*=sap-icon]{color:var(--sapContent_IconColor)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:var(--sapGroup_TitleTextColor)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:var(--sapContent_LabelColor)}.fd-product-switch__item.dragged.selected{border:none;-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2)}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:none}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;color:var(--sapContent_IconColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;font-size:1.5rem;line-height:1;min-height:3rem;min-width:3rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-product-switch__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:2.5rem;overflow:hidden;padding-block:0;padding-inline:0;text-shadow:var(--fdProductSwitch_Text_Shadow);width:100%}.fd-product-switch__text:after,.fd-product-switch__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;max-height:2.5rem;padding-block:0;padding-inline:0;white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title.is-last-child,.fd-product-switch__title:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{left:9.4rem;width:1rem;z-index:3}.fd-product-switch__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_LabelColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body{background-color:var(--sapList_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:calc(100vh - 76px);overflow-y:auto;padding-block:0;padding-block:1.5rem;padding-inline:0;padding-inline:1rem;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fd-product-switch__body:after,.fd-product-switch__body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body.is-focus,.fd-product-switch__body:focus{outline:none;z-index:5}.fd-product-switch__body::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-product-switch__body::-webkit-scrollbar-corner,.fd-product-switch__body::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb{background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb:active,.fd-product-switch__body::-webkit-scrollbar-thumb:hover{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-product-switch__body--col-3 .fd-product-switch__list{width:34.75rem}.fd-product-switch__body--mobile{border-radius:0;max-width:100vw;overflow-x:hidden;padding-block:0;padding-inline:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;border:none;border-radius:0;-ms-flex-direction:row;flex-direction:row;gap:.75rem;max-height:5rem;max-width:100%;padding-block:1rem;padding-inline:1rem;text-align:left;-webkit-box-flex:1;border-bottom:.0625rem solid var(--sapList_GroupHeaderBorderColor);-ms-flex:auto;flex:auto}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapTile_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item.is-active:focus,.fd-product-switch__body--mobile .fd-product-switch__item:active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:var(--sapList_SelectionBorderColor);-webkit-box-shadow:none;box-shadow:none}.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{left:21.7rem;width:1rem;z-index:2}.fd-product-switch__body--mobile .fd-product-switch__text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;height:100%;justify-content:space-between}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child),[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):after{display:none}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):before{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__title:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{right:21.8rem;width:2rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle{line-height:1.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:before{right:21.8rem;text-align:right;width:2rem;z-index:2}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:after{display:none;z-index:3}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item:active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__subtitle{color:var(--sapList_Active_TextColor)}.fd-product-switch__list{position:relative}.fd-product-switch__item.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-product-switch__body--mobile .fd-product-switch__item.cdk-drag-dragging{outline:none;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-dnd-item{position:relative}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:before,.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:after{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__icon{color:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item:active,.fd-dnd-item.fd-dnd-on-drag.selected{background-color:#fff;background-color:var(--sapList_Background, #fff)}[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__title,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__subtitle{text-align:right}.fd-product-switch__item{--fdProduct_Switch_Item_Border_Color: transparent;gap:.5rem}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{margin-block-end:0}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__item{gap:.75rem}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-inline:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/product-switch.css:\n (*!\n * Fundamental Library Styles v0.41.5\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n", ".cdk-drag-dragging{z-index:15;background-color:#fff;background-color:var(--sapList_Background, #fff);opacity:.8;transition:box-shadow .2s cubic-bezier(0,0,.2,1);box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.fd-replace-indicator{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;border-width:.125rem;border-style:solid;background-color:transparent;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor)}.fd-replace-indicator:before{content:\"\";display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:#0854a0;background-color:var(--sapContent_DragAndDropActiveColor, #0854a0);opacity:.5}.cdk-drag{cursor:grab}.cdk-drag.cdk-drag-dragging{cursor:grabbing}.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.cdk-drag-disabled{cursor:default}.fd-dnd-placeholder{top:0;left:0;position:absolute;opacity:.3;z-index:-1}.fd-dnd-item{position:relative;cursor:grab}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15;cursor:grabbing}.drop-area__line{z-index:9999;position:absolute;background:#0854a0;background:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--vertical{top:0;height:calc(100% - .5rem);width:2px}.drop-area__line--vertical.after{right:.2rem}.drop-area__line--vertical.before{left:-.3rem}.drop-area__line--vertical:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:-.2rem;top:-.5rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--horizontal{left:0;width:100%;height:2px}.drop-area__line--horizontal.before{top:0}.drop-area__line--horizontal.after{bottom:0}.drop-area__line--horizontal:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:0;top:-.2rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-dnd-list{position:relative}\n"], dependencies: [{ kind: "directive", type: DndItemDirective, selector: "[fdkDndItem], [fd-dnd-item]", inputs: ["fdkDndItem", "applyDragItemClass", "containerSelector", "stickInPlace", "draggable", "classWhenElementDragged"], outputs: ["moved", "released", "started"] }, { kind: "directive", type: DndListDirective, selector: "[fdkDndList], [fd-dnd-list]", inputs: ["gridMode", "dropMode", "threshold", "items", "draggable", "dropPredicate", "dragoverPredicate"], outputs: ["dropPredicateCalculating", "itemsChange", "itemDropped", "dropCancelled"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }, { kind: "component", type: AvatarComponent, selector: "fd-avatar", inputs: ["id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
169
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: ProductSwitchBodyComponent, isStandalone: true, selector: "fd-product-switch-body", inputs: { dragAndDropEnabled: "dragAndDropEnabled", products: "products", forceListMode: "forceListMode" }, outputs: { productsChange: "productsChange", itemClicked: "itemClicked" }, ngImport: i0, template: "<div\n class=\"fd-product-switch__body\"\n [class.fd-product-switch__body--col-3]=\"_isSmallMode() && !_isListMode()\"\n [class.fd-product-switch__body--mobile]=\"_isListMode()\"\n>\n <ul\n fd-dnd-list\n class=\"fd-product-switch__list\"\n [items]=\"products\"\n [gridMode]=\"!_isListMode()\"\n (itemDropped)=\"_productSwitchItemsChangeHandle($event)\"\n >\n @for (product of products; track product) {\n <li\n fd-dnd-item\n tabindex=\"0\"\n class=\"fd-product-switch__item\"\n [class.selected]=\"product.selected\"\n (keydown)=\"_keyDownHandle($event)\"\n (click)=\"_itemClick(product, $event)\"\n [draggable]=\"!product.disabledDragAndDrop && dragAndDropEnabled\"\n [stickInPlace]=\"!!product.stickToPosition\"\n >\n @if (product.avatar) {\n <fd-avatar\n size=\"s\"\n [glyph]=\"product.avatar.glyph ?? null\"\n [label]=\"product.avatar.label ?? null\"\n [circle]=\"!!product.avatar.circle\"\n [image]=\"product.avatar.image ?? null\"\n [contain]=\"!!product.avatar.contain\"\n [transparent]=\"!!product.avatar.transparent\"\n [placeholder]=\"!!product.avatar.placeholder\"\n [tile]=\"!!product.avatar.tile\"\n [colorAccent]=\"product.avatar.colorAccent\"\n [colorIndication]=\"product.avatar.colorIndication\"\n [border]=\"!!product.avatar.border\"\n [alterIcon]=\"product.avatar.alterIcon ?? null\"\n [backupImage]=\"product.avatar.backupImage ?? null\"\n [ariaLabel]=\"product.avatar.ariaLabel ?? null\"\n >\n </fd-avatar>\n } @else {\n <fd-icon\n [font]=\"product.font || FD_DEFAULT_ICON_FONT_FAMILY\"\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [glyph]=\"product.icon\"\n ></fd-icon>\n }\n\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n @if (product.subtitle) {\n <div class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n }\n </div>\n </li>\n }\n </ul>\n</div>\n", styles: [".drag-placeholder{opacity:.3;position:absolute}.fd-product-switch{--fdProduct_Switch_Item_Border_Color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-product-switch:after,.fd-product-switch:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__list{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:.5rem;width:46.5rem}.fd-product-switch__list:after,.fd-product-switch__list:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:7rem;max-width:11.25rem;text-align:center;-webkit-box-flex:1;background-color:var(--sapList_Background);border:.125rem solid var(--fdProduct_Switch_Item_Border_Color);border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--fdProductSwitch_Shadow);box-shadow:var(--fdProductSwitch_Shadow);-ms-flex:1 0 25%;flex:1 0 25%;padding-block:.5rem;padding-inline:.5rem}.fd-product-switch__item:after,.fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapList_Background)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:var(--sapList_Hover_Background);cursor:pointer}.fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{--fdProduct_Switch_Item_Border_Color:var(--sapList_Active_Background);background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-active.is-focus,.fd-product-switch__item.is-active:focus,.fd-product-switch__item:active.is-focus,.fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__item.is-active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__item.is-active .fd-product-switch__title,.fd-product-switch__item:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__subtitle,.fd-product-switch__item:active .fd-product-switch__title{color:var(--sapList_Active_TextColor)}.fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__item.is-active:hover .fd-product-switch__title:after,.fd-product-switch__item.is-active:hover .fd-product-switch__title:before,.fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before,.fd-product-switch__item:active.is-hover .fd-product-switch__title:after,.fd-product-switch__item:active.is-hover .fd-product-switch__title:before,.fd-product-switch__item:active:hover .fd-product-switch__title:after,.fd-product-switch__item:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.selected{--fdProduct_Switch_Item_Border_Color:var(--sapList_SelectionBorderColor)}.fd-product-switch__item.selected,.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBackgroundColor)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__item.selected:hover,.fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__item.selected:active,.fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__item.dragged{-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2);cursor:-webkit-grabbing;cursor:grabbing}.fd-product-switch__item.dragged,.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:var(--sapList_Background)}.fd-product-switch__item.dragged:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon[class*=sap-icon]{color:var(--sapContent_IconColor)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:var(--sapGroup_TitleTextColor)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:var(--sapContent_LabelColor)}.fd-product-switch__item.dragged.selected{border:none;-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2)}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:none}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;color:var(--sapContent_IconColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;font-size:1.5rem;line-height:1;min-height:3rem;min-width:3rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-product-switch__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:2.5rem;overflow:hidden;padding-block:0;padding-inline:0;text-shadow:var(--fdProductSwitch_Text_Shadow);width:100%}.fd-product-switch__text:after,.fd-product-switch__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;max-height:2.5rem;padding-block:0;padding-inline:0;white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title.is-last-child,.fd-product-switch__title:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{left:9.4rem;width:1rem;z-index:3}.fd-product-switch__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_LabelColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body{background-color:var(--sapList_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:calc(100vh - 76px);overflow-y:auto;padding-block:0;padding-block:1.5rem;padding-inline:0;padding-inline:1rem;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fd-product-switch__body:after,.fd-product-switch__body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body.is-focus,.fd-product-switch__body:focus{outline:none;z-index:5}.fd-product-switch__body::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-product-switch__body::-webkit-scrollbar-corner,.fd-product-switch__body::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb{background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb:active,.fd-product-switch__body::-webkit-scrollbar-thumb:hover{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-product-switch__body--col-3 .fd-product-switch__list{width:34.75rem}.fd-product-switch__body--mobile{border-radius:0;max-width:100vw;overflow-x:hidden;padding-block:0;padding-inline:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;border:none;border-radius:0;-ms-flex-direction:row;flex-direction:row;gap:.75rem;max-height:5rem;max-width:100%;padding-block:1rem;padding-inline:1rem;text-align:left;-webkit-box-flex:1;border-bottom:.0625rem solid var(--sapList_GroupHeaderBorderColor);-ms-flex:auto;flex:auto}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapTile_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item.is-active:focus,.fd-product-switch__body--mobile .fd-product-switch__item:active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:var(--sapList_SelectionBorderColor);-webkit-box-shadow:none;box-shadow:none}.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{left:21.7rem;width:1rem;z-index:2}.fd-product-switch__body--mobile .fd-product-switch__text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;height:100%;justify-content:space-between}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child),[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):after{display:none}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):before{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__title:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{right:21.8rem;width:2rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle{line-height:1.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:before{right:21.8rem;text-align:right;width:2rem;z-index:2}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:after{display:none;z-index:3}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item:active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__subtitle{color:var(--sapList_Active_TextColor)}.fd-product-switch__list{position:relative}.fd-product-switch__item.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-product-switch__body--mobile .fd-product-switch__item.cdk-drag-dragging{outline:none;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-dnd-item{position:relative}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:before,.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:after{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__icon{color:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item:active,.fd-dnd-item.fd-dnd-on-drag.selected{background-color:#fff;background-color:var(--sapList_Background, #fff)}[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__title,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__subtitle{text-align:right}.fd-product-switch__item{--fdProduct_Switch_Item_Border_Color: transparent;gap:.5rem}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{margin-block-end:0}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__item{gap:.75rem}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-inline:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/product-switch.css:\n (*!\n * Fundamental Library Styles v0.41.6\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n", ".cdk-drag-dragging{z-index:15;background-color:#fff;background-color:var(--sapList_Background, #fff);opacity:.8;transition:box-shadow .2s cubic-bezier(0,0,.2,1);box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.fd-replace-indicator{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;border-width:.125rem;border-style:solid;background-color:transparent;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor)}.fd-replace-indicator:before{content:\"\";display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:#0854a0;background-color:var(--sapContent_DragAndDropActiveColor, #0854a0);opacity:.5}.cdk-drag{cursor:grab}.cdk-drag.cdk-drag-dragging{cursor:grabbing}.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.cdk-drag-disabled{cursor:default}.fd-dnd-placeholder{top:0;left:0;position:absolute;opacity:.3;z-index:-1}.fd-dnd-item{position:relative;cursor:grab}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15;cursor:grabbing}.drop-area__line{z-index:9999;position:absolute;background:#0854a0;background:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--vertical{top:0;height:calc(100% - .5rem);width:2px}.drop-area__line--vertical.after{right:.2rem}.drop-area__line--vertical.before{left:-.3rem}.drop-area__line--vertical:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:-.2rem;top:-.5rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--horizontal{left:0;width:100%;height:2px}.drop-area__line--horizontal.before{top:0}.drop-area__line--horizontal.after{bottom:0}.drop-area__line--horizontal:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:0;top:-.2rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-dnd-list{position:relative}\n"], dependencies: [{ kind: "directive", type: DndItemDirective, selector: "[fdkDndItem], [fd-dnd-item]", inputs: ["fdkDndItem", "applyDragItemClass", "containerSelector", "stickInPlace", "draggable", "classWhenElementDragged"], outputs: ["moved", "released", "started"] }, { kind: "directive", type: DndListDirective, selector: "[fdkDndList], [fd-dnd-list]", inputs: ["gridMode", "dropMode", "threshold", "items", "draggable", "dropPredicate", "dragoverPredicate"], outputs: ["dropPredicateCalculating", "itemsChange", "itemDropped", "dropCancelled"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }, { kind: "component", type: AvatarComponent, selector: "fd-avatar", inputs: ["id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
170
170
|
}
|
|
171
171
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ProductSwitchBodyComponent, decorators: [{
|
|
172
172
|
type: Component,
|
|
173
|
-
args: [{ selector: 'fd-product-switch-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [DndItemDirective, DndListDirective, IconComponent, AvatarComponent], template: "<div\n class=\"fd-product-switch__body\"\n [class.fd-product-switch__body--col-3]=\"_isSmallMode() && !_isListMode()\"\n [class.fd-product-switch__body--mobile]=\"_isListMode()\"\n>\n <ul\n fd-dnd-list\n class=\"fd-product-switch__list\"\n [items]=\"products\"\n [gridMode]=\"!_isListMode()\"\n (itemDropped)=\"_productSwitchItemsChangeHandle($event)\"\n >\n @for (product of products; track product) {\n <li\n fd-dnd-item\n tabindex=\"0\"\n class=\"fd-product-switch__item\"\n [class.selected]=\"product.selected\"\n (keydown)=\"_keyDownHandle($event)\"\n (click)=\"_itemClick(product, $event)\"\n [draggable]=\"!product.disabledDragAndDrop && dragAndDropEnabled\"\n [stickInPlace]=\"!!product.stickToPosition\"\n >\n @if (product.avatar) {\n <fd-avatar\n size=\"s\"\n [glyph]=\"product.avatar.glyph ?? null\"\n [label]=\"product.avatar.label ?? null\"\n [circle]=\"!!product.avatar.circle\"\n [image]=\"product.avatar.image ?? null\"\n [contain]=\"!!product.avatar.contain\"\n [transparent]=\"!!product.avatar.transparent\"\n [placeholder]=\"!!product.avatar.placeholder\"\n [tile]=\"!!product.avatar.tile\"\n [colorAccent]=\"product.avatar.colorAccent\"\n [colorIndication]=\"product.avatar.colorIndication\"\n [border]=\"!!product.avatar.border\"\n [alterIcon]=\"product.avatar.alterIcon ?? null\"\n [backupImage]=\"product.avatar.backupImage ?? null\"\n [ariaLabel]=\"product.avatar.ariaLabel ?? null\"\n >\n </fd-avatar>\n } @else {\n <fd-icon\n [font]=\"product.font || FD_DEFAULT_ICON_FONT_FAMILY\"\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [glyph]=\"product.icon\"\n ></fd-icon>\n }\n\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n @if (product.subtitle) {\n <div class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n }\n </div>\n </li>\n }\n </ul>\n</div>\n", styles: [".drag-placeholder{opacity:.3;position:absolute}.fd-product-switch{--fdProduct_Switch_Item_Border_Color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-product-switch:after,.fd-product-switch:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__list{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:.5rem;width:46.5rem}.fd-product-switch__list:after,.fd-product-switch__list:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:7rem;max-width:11.25rem;text-align:center;-webkit-box-flex:1;background-color:var(--sapList_Background);border:.125rem solid var(--fdProduct_Switch_Item_Border_Color);border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--fdProductSwitch_Shadow);box-shadow:var(--fdProductSwitch_Shadow);-ms-flex:1 0 25%;flex:1 0 25%;padding-block:.5rem;padding-inline:.5rem}.fd-product-switch__item:after,.fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapList_Background)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:var(--sapList_Hover_Background);cursor:pointer}.fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{--fdProduct_Switch_Item_Border_Color:var(--sapList_Active_Background);background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-active.is-focus,.fd-product-switch__item.is-active:focus,.fd-product-switch__item:active.is-focus,.fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__item.is-active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__item.is-active .fd-product-switch__title,.fd-product-switch__item:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__subtitle,.fd-product-switch__item:active .fd-product-switch__title{color:var(--sapList_Active_TextColor)}.fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__item.is-active:hover .fd-product-switch__title:after,.fd-product-switch__item.is-active:hover .fd-product-switch__title:before,.fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before,.fd-product-switch__item:active.is-hover .fd-product-switch__title:after,.fd-product-switch__item:active.is-hover .fd-product-switch__title:before,.fd-product-switch__item:active:hover .fd-product-switch__title:after,.fd-product-switch__item:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.selected{--fdProduct_Switch_Item_Border_Color:var(--sapList_SelectionBorderColor)}.fd-product-switch__item.selected,.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBackgroundColor)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__item.selected:hover,.fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__item.selected:active,.fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__item.dragged{-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2);cursor:-webkit-grabbing;cursor:grabbing}.fd-product-switch__item.dragged,.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:var(--sapList_Background)}.fd-product-switch__item.dragged:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon[class*=sap-icon]{color:var(--sapContent_IconColor)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:var(--sapGroup_TitleTextColor)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:var(--sapContent_LabelColor)}.fd-product-switch__item.dragged.selected{border:none;-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2)}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:none}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;color:var(--sapContent_IconColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;font-size:1.5rem;line-height:1;min-height:3rem;min-width:3rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-product-switch__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:2.5rem;overflow:hidden;padding-block:0;padding-inline:0;text-shadow:var(--fdProductSwitch_Text_Shadow);width:100%}.fd-product-switch__text:after,.fd-product-switch__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;max-height:2.5rem;padding-block:0;padding-inline:0;white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title.is-last-child,.fd-product-switch__title:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{left:9.4rem;width:1rem;z-index:3}.fd-product-switch__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_LabelColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body{background-color:var(--sapList_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:calc(100vh - 76px);overflow-y:auto;padding-block:0;padding-block:1.5rem;padding-inline:0;padding-inline:1rem;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fd-product-switch__body:after,.fd-product-switch__body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body.is-focus,.fd-product-switch__body:focus{outline:none;z-index:5}.fd-product-switch__body::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-product-switch__body::-webkit-scrollbar-corner,.fd-product-switch__body::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb{background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb:active,.fd-product-switch__body::-webkit-scrollbar-thumb:hover{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-product-switch__body--col-3 .fd-product-switch__list{width:34.75rem}.fd-product-switch__body--mobile{border-radius:0;max-width:100vw;overflow-x:hidden;padding-block:0;padding-inline:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;border:none;border-radius:0;-ms-flex-direction:row;flex-direction:row;gap:.75rem;max-height:5rem;max-width:100%;padding-block:1rem;padding-inline:1rem;text-align:left;-webkit-box-flex:1;border-bottom:.0625rem solid var(--sapList_GroupHeaderBorderColor);-ms-flex:auto;flex:auto}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapTile_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item.is-active:focus,.fd-product-switch__body--mobile .fd-product-switch__item:active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:var(--sapList_SelectionBorderColor);-webkit-box-shadow:none;box-shadow:none}.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{left:21.7rem;width:1rem;z-index:2}.fd-product-switch__body--mobile .fd-product-switch__text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;height:100%;justify-content:space-between}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child),[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):after{display:none}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):before{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__title:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{right:21.8rem;width:2rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle{line-height:1.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:before{right:21.8rem;text-align:right;width:2rem;z-index:2}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:after{display:none;z-index:3}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item:active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__subtitle{color:var(--sapList_Active_TextColor)}.fd-product-switch__list{position:relative}.fd-product-switch__item.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-product-switch__body--mobile .fd-product-switch__item.cdk-drag-dragging{outline:none;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-dnd-item{position:relative}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:before,.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:after{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__icon{color:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item:active,.fd-dnd-item.fd-dnd-on-drag.selected{background-color:#fff;background-color:var(--sapList_Background, #fff)}[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__title,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__subtitle{text-align:right}.fd-product-switch__item{--fdProduct_Switch_Item_Border_Color: transparent;gap:.5rem}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{margin-block-end:0}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__item{gap:.75rem}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-inline:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/product-switch.css:\n (*!\n * Fundamental Library Styles v0.41.5\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n", ".cdk-drag-dragging{z-index:15;background-color:#fff;background-color:var(--sapList_Background, #fff);opacity:.8;transition:box-shadow .2s cubic-bezier(0,0,.2,1);box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.fd-replace-indicator{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;border-width:.125rem;border-style:solid;background-color:transparent;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor)}.fd-replace-indicator:before{content:\"\";display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:#0854a0;background-color:var(--sapContent_DragAndDropActiveColor, #0854a0);opacity:.5}.cdk-drag{cursor:grab}.cdk-drag.cdk-drag-dragging{cursor:grabbing}.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.cdk-drag-disabled{cursor:default}.fd-dnd-placeholder{top:0;left:0;position:absolute;opacity:.3;z-index:-1}.fd-dnd-item{position:relative;cursor:grab}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15;cursor:grabbing}.drop-area__line{z-index:9999;position:absolute;background:#0854a0;background:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--vertical{top:0;height:calc(100% - .5rem);width:2px}.drop-area__line--vertical.after{right:.2rem}.drop-area__line--vertical.before{left:-.3rem}.drop-area__line--vertical:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:-.2rem;top:-.5rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--horizontal{left:0;width:100%;height:2px}.drop-area__line--horizontal.before{top:0}.drop-area__line--horizontal.after{bottom:0}.drop-area__line--horizontal:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:0;top:-.2rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-dnd-list{position:relative}\n"] }]
|
|
173
|
+
args: [{ selector: 'fd-product-switch-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [DndItemDirective, DndListDirective, IconComponent, AvatarComponent], template: "<div\n class=\"fd-product-switch__body\"\n [class.fd-product-switch__body--col-3]=\"_isSmallMode() && !_isListMode()\"\n [class.fd-product-switch__body--mobile]=\"_isListMode()\"\n>\n <ul\n fd-dnd-list\n class=\"fd-product-switch__list\"\n [items]=\"products\"\n [gridMode]=\"!_isListMode()\"\n (itemDropped)=\"_productSwitchItemsChangeHandle($event)\"\n >\n @for (product of products; track product) {\n <li\n fd-dnd-item\n tabindex=\"0\"\n class=\"fd-product-switch__item\"\n [class.selected]=\"product.selected\"\n (keydown)=\"_keyDownHandle($event)\"\n (click)=\"_itemClick(product, $event)\"\n [draggable]=\"!product.disabledDragAndDrop && dragAndDropEnabled\"\n [stickInPlace]=\"!!product.stickToPosition\"\n >\n @if (product.avatar) {\n <fd-avatar\n size=\"s\"\n [glyph]=\"product.avatar.glyph ?? null\"\n [label]=\"product.avatar.label ?? null\"\n [circle]=\"!!product.avatar.circle\"\n [image]=\"product.avatar.image ?? null\"\n [contain]=\"!!product.avatar.contain\"\n [transparent]=\"!!product.avatar.transparent\"\n [placeholder]=\"!!product.avatar.placeholder\"\n [tile]=\"!!product.avatar.tile\"\n [colorAccent]=\"product.avatar.colorAccent\"\n [colorIndication]=\"product.avatar.colorIndication\"\n [border]=\"!!product.avatar.border\"\n [alterIcon]=\"product.avatar.alterIcon ?? null\"\n [backupImage]=\"product.avatar.backupImage ?? null\"\n [ariaLabel]=\"product.avatar.ariaLabel ?? null\"\n >\n </fd-avatar>\n } @else {\n <fd-icon\n [font]=\"product.font || FD_DEFAULT_ICON_FONT_FAMILY\"\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [glyph]=\"product.icon\"\n ></fd-icon>\n }\n\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n @if (product.subtitle) {\n <div class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n }\n </div>\n </li>\n }\n </ul>\n</div>\n", styles: [".drag-placeholder{opacity:.3;position:absolute}.fd-product-switch{--fdProduct_Switch_Item_Border_Color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-product-switch:after,.fd-product-switch:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__list{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:.5rem;width:46.5rem}.fd-product-switch__list:after,.fd-product-switch__list:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:7rem;max-width:11.25rem;text-align:center;-webkit-box-flex:1;background-color:var(--sapList_Background);border:.125rem solid var(--fdProduct_Switch_Item_Border_Color);border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--fdProductSwitch_Shadow);box-shadow:var(--fdProductSwitch_Shadow);-ms-flex:1 0 25%;flex:1 0 25%;padding-block:.5rem;padding-inline:.5rem}.fd-product-switch__item:after,.fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapList_Background)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:var(--sapList_Hover_Background);cursor:pointer}.fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{--fdProduct_Switch_Item_Border_Color:var(--sapList_Active_Background);background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-active.is-focus,.fd-product-switch__item.is-active:focus,.fd-product-switch__item:active.is-focus,.fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__item.is-active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__item.is-active .fd-product-switch__title,.fd-product-switch__item:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__subtitle,.fd-product-switch__item:active .fd-product-switch__title{color:var(--sapList_Active_TextColor)}.fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__item.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__item.is-active:hover .fd-product-switch__title:after,.fd-product-switch__item.is-active:hover .fd-product-switch__title:before,.fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before,.fd-product-switch__item:active.is-hover .fd-product-switch__title:after,.fd-product-switch__item:active.is-hover .fd-product-switch__title:before,.fd-product-switch__item:active:hover .fd-product-switch__title:after,.fd-product-switch__item:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.selected{--fdProduct_Switch_Item_Border_Color:var(--sapList_SelectionBorderColor)}.fd-product-switch__item.selected,.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBackgroundColor)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__item.selected:hover,.fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__item.selected:active,.fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__item.dragged{-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2);cursor:-webkit-grabbing;cursor:grabbing}.fd-product-switch__item.dragged,.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:var(--sapList_Background)}.fd-product-switch__item.dragged:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:active .fd-product-switch__icon[class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item.dragged:hover .fd-product-switch__icon[class*=sap-icon]{color:var(--sapContent_IconColor)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:var(--sapGroup_TitleTextColor)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:var(--sapContent_LabelColor)}.fd-product-switch__item.dragged.selected{border:none;-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2)}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:none}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;color:var(--sapContent_IconColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;font-size:1.5rem;line-height:1;min-height:3rem;min-width:3rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-product-switch__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:2.5rem;overflow:hidden;padding-block:0;padding-inline:0;text-shadow:var(--fdProductSwitch_Text_Shadow);width:100%}.fd-product-switch__text:after,.fd-product-switch__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;max-height:2.5rem;padding-block:0;padding-inline:0;white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__title.is-last-child,.fd-product-switch__title:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{left:9.4rem;width:1rem;z-index:3}.fd-product-switch__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_LabelColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body{background-color:var(--sapList_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:calc(100vh - 76px);overflow-y:auto;padding-block:0;padding-block:1.5rem;padding-inline:0;padding-inline:1rem;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fd-product-switch__body:after,.fd-product-switch__body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body.is-focus,.fd-product-switch__body:focus{outline:none;z-index:5}.fd-product-switch__body::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-product-switch__body::-webkit-scrollbar-corner,.fd-product-switch__body::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb{background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-product-switch__body::-webkit-scrollbar-thumb:active,.fd-product-switch__body::-webkit-scrollbar-thumb:hover{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color);box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-product-switch__body--col-3 .fd-product-switch__list{width:34.75rem}.fd-product-switch__body--mobile{border-radius:0;max-width:100vw;overflow-x:hidden;padding-block:0;padding-inline:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;border:none;border-radius:0;-ms-flex-direction:row;flex-direction:row;gap:.75rem;max-height:5rem;max-width:100%;padding-block:1rem;padding-inline:1rem;text-align:left;-webkit-box-flex:1;border-bottom:.0625rem solid var(--sapList_GroupHeaderBorderColor);-ms-flex:auto;flex:auto}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{background-color:var(--sapTile_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.is-active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item.is-active:focus,.fd-product-switch__body--mobile .fd-product-switch__item:active.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:active:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-color:var(--sapContent_ContrastFocusColor);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:var(--sapList_SelectionBorderColor);-webkit-box-shadow:none;box-shadow:none}.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected .fd-product-switch__title:before{background-color:var(--sapList_SelectionBorderColor)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:var(--sapList_Hover_SelectionBackground)}.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected.is-active:hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active.is-hover .fd-product-switch__title:before,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active:hover .fd-product-switch__title:before{background-color:var(--sapList_Active_Background)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{left:21.7rem;width:1rem;z-index:2}.fd-product-switch__body--mobile .fd-product-switch__text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;height:100%;justify-content:space-between}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child),[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):after{display:none}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text .fd-product-switch__title:not(:last-child):before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text .fd-product-switch__title:not(:last-child):before{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__title:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__title:before{right:21.8rem;width:2rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle{line-height:1.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:before,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:before{right:21.8rem;text-align:right;width:2rem;z-index:2}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item .fd-product-switch__subtitle:after,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item .fd-product-switch__subtitle:after{display:none;z-index:3}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item.is-active .fd-product-switch__subtitle,.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__item:active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item.is-active .fd-product-switch__subtitle,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__item:active .fd-product-switch__subtitle{color:var(--sapList_Active_TextColor)}.fd-product-switch__list{position:relative}.fd-product-switch__item.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-product-switch__body--mobile .fd-product-switch__item.cdk-drag-dragging{outline:none;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.fd-dnd-item{position:relative}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:before,.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title:after{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__icon{color:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-dnd-item.fd-dnd-on-drag.fd-product-switch__item:active,.fd-dnd-item.fd-dnd-on-drag.selected{background-color:#fff;background-color:var(--sapList_Background, #fff)}[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__title,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__subtitle{text-align:right}.fd-product-switch__item{--fdProduct_Switch_Item_Border_Color: transparent;gap:.5rem}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{margin-block-end:0}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__item{gap:.75rem}.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-inline:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/product-switch.css:\n (*!\n * Fundamental Library Styles v0.41.6\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n", ".cdk-drag-dragging{z-index:15;background-color:#fff;background-color:var(--sapList_Background, #fff);opacity:.8;transition:box-shadow .2s cubic-bezier(0,0,.2,1);box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f}.fd-replace-indicator{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;border-width:.125rem;border-style:solid;background-color:transparent;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor)}.fd-replace-indicator:before{content:\"\";display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:#0854a0;background-color:var(--sapContent_DragAndDropActiveColor, #0854a0);opacity:.5}.cdk-drag{cursor:grab}.cdk-drag.cdk-drag-dragging{cursor:grabbing}.cdk-drag-dragging{outline:none;cursor:grabbing;box-shadow:0 0 0 .0625rem #00000026,0 .625rem 1.875rem #0000004d}.cdk-drag-disabled{cursor:default}.fd-dnd-placeholder{top:0;left:0;position:absolute;opacity:.3;z-index:-1}.fd-dnd-item{position:relative;cursor:grab}.fd-dnd-item.fd-dnd-on-drag{background-color:#fff;background-color:var(--sapList_Background, #fff);z-index:15;cursor:grabbing}.drop-area__line{z-index:9999;position:absolute;background:#0854a0;background:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--vertical{top:0;height:calc(100% - .5rem);width:2px}.drop-area__line--vertical.after{right:.2rem}.drop-area__line--vertical.before{left:-.3rem}.drop-area__line--vertical:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:-.2rem;top:-.5rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.drop-area__line--horizontal{left:0;width:100%;height:2px}.drop-area__line--horizontal.before{top:0}.drop-area__line--horizontal.after{bottom:0}.drop-area__line--horizontal:before{background-color:#fff;background-color:var(--sapList_Background, #fff);content:\"\";position:absolute;left:0;top:-.2rem;border-radius:50%;width:.5rem;height:.5rem;border-width:.125rem;border-style:solid;border-color:#0854a0;border-color:var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-dnd-list{position:relative}\n"] }]
|
|
174
174
|
}], ctorParameters: () => [{ type: i1.ViewportRuler }, { type: i0.ChangeDetectorRef }], propDecorators: { dragAndDropEnabled: [{
|
|
175
175
|
type: Input
|
|
176
176
|
}], products: [{
|
|
@@ -61,11 +61,11 @@ class ProgressIndicatorComponent {
|
|
|
61
61
|
this._cdRef.detectChanges();
|
|
62
62
|
}
|
|
63
63
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ProgressIndicatorComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
64
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: ProgressIndicatorComponent, isStandalone: true, selector: "fd-progress-indicator", inputs: { valueText: "valueText", unit: "unit", valueMin: "valueMin", valueMax: "valueMax", valueNow: "valueNow", state: "state", animate: "animate" }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"fd-progress-indicator\"\n tabindex=\"-1\"\n role=\"progressbar\"\n [attr.aria-valuemin]=\"valueMin\"\n [attr.aria-valuenow]=\"valueNow\"\n [attr.aria-valuemax]=\"valueMax\"\n [attr.aria-valuetext]=\"valueText\"\n [attr.aria-label]=\"valueText\"\n [class]=\"state ? 'fd-progress-indicator--' + state : ''\"\n>\n @if (!hasPopover) {\n @if (_progressBarWidth >= 0) {\n <div class=\"fd-progress-indicator__container\">\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </div>\n }\n } @else {\n <fd-popover\n [style.width.%]=\"100\"\n [noArrow]=\"false\"\n placement=\"bottom\"\n fillControlMode=\"equal\"\n #popover\n class=\"fd-progress-indicator__container\"\n >\n @if (_progressBarWidth >= 0) {\n <fd-popover-control>\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </fd-popover-control>\n }\n <fd-popover-body>\n <div class=\"fd-popover__wrapper\">\n <div class=\"fd-progress-indicator__overflow\">\n <span>{{ valueText }}</span>\n <span class=\"fd-progress-indicator__overflow-close\" (click)=\"popover.close()\">\n <fd-icon glyph=\"decline\"></fd-icon>\n </span>\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n }\n</div>\n<ng-template #indicatorContainer>\n @if (_progressBarWidth > 0) {\n <div\n class=\"fd-progress-indicator__progress-bar\"\n [class.fd-progress-indicator__progress-bar--animated]=\"animate\"\n [style.min-width.%]=\"_progressBarWidth\"\n [style.width.%]=\"_progressBarWidth\"\n >\n @if (_progressBarWidth > 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n }\n <div class=\"fd-progress-indicator__remaining\" [style.min-width]=\"0\">\n @if (_progressBarWidth <= 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n</ng-template>\n<ng-template #progressBarLabel>\n @if (state) {\n <span class=\"fd-progress-indicator__icon\"></span>\n }\n @if (!valueText) {\n <span class=\"fd-progress-indicator__label\"> {{ valueNow }}% </span>\n } @else {\n <span class=\"fd-progress-indicator__label\">\n {{ valueText }}\n </span>\n }\n</ng-template>\n", styles: [".fd-progress-indicator{--rootMarginBlock:.5rem;--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Neutral);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Neutral,transparent);--progressBarBorderRightColor:var(--fdProgress_Indicator_Border_Right_Color,var(--progressBarBorderColor));--containerBackground:var(--fdProgress_Indicator_Container_Background_Neutral,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Neutral,var(--sapField_BorderColor));--iconDisplay:none;--iconContent:\"\";--labelMarginStart:var(--fdProgress_Indicator_Label_Margin_Start);--labelMarginEnd:var(--fdProgress_Indicator_Label_Margin_End);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdProgress_Indicator_Height);line-height:normal;margin-block:0;margin-block:var(--rootMarginBlock);margin-inline:0;padding-block:0;padding-block:var(--fdProgress_Indicator_Container_Margin_Block);padding-inline:0;padding-inline:var(--fdProgress_Indicator_Container_Margin_Inline);width:100%}.fd-progress-indicator:after,.fd-progress-indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator.fd-popover{cursor:pointer;margin-block:var(--rootMarginBlock);margin-inline:0}.fd-progress-indicator--mobile{--rootMarginBlock:.875rem}.fd-progress-indicator--display{--rootMarginBlock:0}.fd-progress-indicator--display.fd-popover{margin-block:0;margin-inline:0}.fd-progress-indicator--informative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Informative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Informative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Informative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Informative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Informative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Informative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--positive{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Positive);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Positive,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Positive,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Positive,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Positive);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Positive,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--negative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Negative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Negative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Negative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Negative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Negative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Negative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--critical{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Critical);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Critical,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Critical,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Critical,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Critical);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Critical,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator .fd-progress-indicator__container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;background:var(--containerBackground);border:.0625rem solid var(--containerBorderColor);border-radius:.5rem;-ms-flex-direction:row;flex-direction:row;height:var(--fdProgress_Indicator_Container_Height);min-height:var(--fdProgress_Indicator_Container_Height);min-width:4rem;overflow:var(--fdProgress_Indicator_Container_Overflow);position:var(--fdProgress_Indicator_Container_Position,static);width:var(--fdProgress_Indicator_Container_Width)}.fd-progress-indicator .fd-progress-indicator__container:after,.fd-progress-indicator .fd-progress-indicator__container:before{background-color:var(--progressBarBackground);border-radius:50%;-webkit-box-sizing:inherit;box-sizing:inherit;content:\"\";display:var(--fdProgress_Indicator_Progress_Bar_Boundary_Display,none);font-size:inherit;height:.25rem;position:absolute;top:0;width:.25rem}.fd-progress-indicator .fd-progress-indicator__container:before{left:0}.fd-progress-indicator .fd-progress-indicator__container:after{right:0}.fd-progress-indicator[aria-valuenow=\"0\"] .fd-progress-indicator__progress-bar{border:none}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{right:var(--fdProgress_Indicator_Progress_Bar_Position_Left);width:auto!important}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar[dir=rtl],.fd-progress-indicator__progress-bar,[dir=rtl] .fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{left:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator__progress-bar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;background:var(--progressBarBackground);border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-radius:var(--fdProgress_Indicator_Progress_Bar_Border_Radius);border-right:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);bottom:var(--fdProgress_Indicator_Progress_Bar_Position_Bottom);height:var(--fdProgress_Indicator_Progress_Bar_Height);justify-content:flex-end;margin-block:var(--fdProgress_Indicator_Progress_Bar_Margin_Block);margin-inline:0}.fd-progress-indicator__progress-bar:after,.fd-progress-indicator__progress-bar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__progress-bar .fd-progress-indicator__label{color:var(--fdProgress_Indicator_Label_Color_Contrast)}.fd-progress-indicator__progress-bar[dir=rtl],[dir=rtl] .fd-progress-indicator__progress-bar{border-right:none;border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-left:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);left:auto;right:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator .fd-progress-indicator__remaining{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:static}.fd-progress-indicator .fd-progress-indicator__remaining:after,.fd-progress-indicator .fd-progress-indicator__remaining:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator .fd-progress-indicator__remaining.fd-popover__control{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;min-width:0}.fd-progress-indicator__icon{bottom:-.625rem;display:var(--iconDisplay);margin-inline:var(--fdProgress_Indicator_Label_Margin_Start) var(--fdProgress_Icon_Space_Before_Label);position:var(--fdProgress_Indicator_Icon_Position,static);right:-1.25rem}.fd-progress-indicator__icon[dir=rtl],[dir=rtl] .fd-progress-indicator__icon{left:-1.25rem;right:auto}.fd-progress-indicator__icon:before{color:var(--iconColor);content:var(--iconContent);font-family:SAP-icons;font-size:var(--fdProgress_Indicator_Icon_Font_Size);vertical-align:middle}.fd-progress-indicator__icon+.fd-progress-indicator__label{-webkit-margin-start:0;margin-inline-start:0}.fd-progress-indicator__label{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdProgress_Indicator_Label_Color);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdProgress_Indicator_Label_Font_Size);font-weight:400;forced-color-adjust:none;left:0;line-height:normal;margin-block:0;margin-inline:0;margin-inline:var(--labelMarginStart) var(--labelMarginEnd);max-width:100%;overflow:hidden;padding-block:0;padding-inline:0;position:var(--fdProgress_Indicator_Label_Position,static);text-overflow:ellipsis;top:-1.25rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fd-progress-indicator__label:after,.fd-progress-indicator__label:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__label[dir=rtl],[dir=rtl] .fd-progress-indicator__label{left:auto;right:0}.fd-progress-indicator__overflow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:.25rem;padding-inline:0;padding-inline:.5rem 0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;max-width:95vw;overflow:hidden;white-space:normal}.fd-progress-indicator__overflow:after,.fd-progress-indicator__overflow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:transparent;cursor:pointer;height:1.375rem;max-height:1.375rem;max-width:1.4375rem;min-height:1.375rem;min-width:1.4375rem;text-align:center;width:1.4375rem}.fd-progress-indicator__overflow-close:after,.fd-progress-indicator__overflow-close:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close.is-focus,.fd-progress-indicator__overflow-close:focus{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);z-index:5}.fd-progress-indicator__overflow-close [class*=sap-icon]{color:var(--sapContent_IconColor);font-size:var(--sapFontSmallSize)}.fd-progress-indicator__progress-bar--animated{-webkit-transition:min-width .5s ease-in-out,width .5s ease-in-out;-moz-transition:min-width .5s ease-in-out,width .5s ease-in-out;-o-transition:min-width .5s ease-in-out,width .5s ease-in-out;transition:min-width .5s ease-in-out,width .5s ease-in-out}.fd-progress-indicator__container .fd-popover__control{width:100%}\n/*! Bundled license information:\n\nfundamental-styles/dist/progress-indicator.css:\n (*!\n * Fundamental Library Styles v0.41.5\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["onClose"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
64
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: ProgressIndicatorComponent, isStandalone: true, selector: "fd-progress-indicator", inputs: { valueText: "valueText", unit: "unit", valueMin: "valueMin", valueMax: "valueMax", valueNow: "valueNow", state: "state", animate: "animate" }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"fd-progress-indicator\"\n tabindex=\"-1\"\n role=\"progressbar\"\n [attr.aria-valuemin]=\"valueMin\"\n [attr.aria-valuenow]=\"valueNow\"\n [attr.aria-valuemax]=\"valueMax\"\n [attr.aria-valuetext]=\"valueText\"\n [attr.aria-label]=\"valueText\"\n [class]=\"state ? 'fd-progress-indicator--' + state : ''\"\n>\n @if (!hasPopover) {\n @if (_progressBarWidth >= 0) {\n <div class=\"fd-progress-indicator__container\">\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </div>\n }\n } @else {\n <fd-popover\n [style.width.%]=\"100\"\n [noArrow]=\"false\"\n placement=\"bottom\"\n fillControlMode=\"equal\"\n #popover\n class=\"fd-progress-indicator__container\"\n >\n @if (_progressBarWidth >= 0) {\n <fd-popover-control>\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </fd-popover-control>\n }\n <fd-popover-body>\n <div class=\"fd-popover__wrapper\">\n <div class=\"fd-progress-indicator__overflow\">\n <span>{{ valueText }}</span>\n <span class=\"fd-progress-indicator__overflow-close\" (click)=\"popover.close()\">\n <fd-icon glyph=\"decline\"></fd-icon>\n </span>\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n }\n</div>\n<ng-template #indicatorContainer>\n @if (_progressBarWidth > 0) {\n <div\n class=\"fd-progress-indicator__progress-bar\"\n [class.fd-progress-indicator__progress-bar--animated]=\"animate\"\n [style.min-width.%]=\"_progressBarWidth\"\n [style.width.%]=\"_progressBarWidth\"\n >\n @if (_progressBarWidth > 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n }\n <div class=\"fd-progress-indicator__remaining\" [style.min-width]=\"0\">\n @if (_progressBarWidth <= 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n</ng-template>\n<ng-template #progressBarLabel>\n @if (state) {\n <span class=\"fd-progress-indicator__icon\"></span>\n }\n @if (!valueText) {\n <span class=\"fd-progress-indicator__label\"> {{ valueNow }}% </span>\n } @else {\n <span class=\"fd-progress-indicator__label\">\n {{ valueText }}\n </span>\n }\n</ng-template>\n", styles: [".fd-progress-indicator{--rootMarginBlock:.5rem;--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Neutral);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Neutral,transparent);--progressBarBorderRightColor:var(--fdProgress_Indicator_Border_Right_Color,var(--progressBarBorderColor));--containerBackground:var(--fdProgress_Indicator_Container_Background_Neutral,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Neutral,var(--sapField_BorderColor));--iconDisplay:none;--iconContent:\"\";--labelMarginStart:var(--fdProgress_Indicator_Label_Margin_Start);--labelMarginEnd:var(--fdProgress_Indicator_Label_Margin_End);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdProgress_Indicator_Height);line-height:normal;margin-block:0;margin-block:var(--rootMarginBlock);margin-inline:0;padding-block:0;padding-block:var(--fdProgress_Indicator_Container_Margin_Block);padding-inline:0;padding-inline:var(--fdProgress_Indicator_Container_Margin_Inline);width:100%}.fd-progress-indicator:after,.fd-progress-indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator.fd-popover{cursor:pointer;margin-block:var(--rootMarginBlock);margin-inline:0}.fd-progress-indicator--mobile{--rootMarginBlock:.875rem}.fd-progress-indicator--display{--rootMarginBlock:0}.fd-progress-indicator--display.fd-popover{margin-block:0;margin-inline:0}.fd-progress-indicator--informative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Informative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Informative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Informative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Informative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Informative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Informative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--positive{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Positive);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Positive,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Positive,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Positive,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Positive);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Positive,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--negative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Negative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Negative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Negative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Negative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Negative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Negative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--critical{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Critical);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Critical,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Critical,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Critical,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Critical);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Critical,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator .fd-progress-indicator__container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;background:var(--containerBackground);border:.0625rem solid var(--containerBorderColor);border-radius:.5rem;-ms-flex-direction:row;flex-direction:row;height:var(--fdProgress_Indicator_Container_Height);min-height:var(--fdProgress_Indicator_Container_Height);min-width:4rem;overflow:var(--fdProgress_Indicator_Container_Overflow);position:var(--fdProgress_Indicator_Container_Position,static);width:var(--fdProgress_Indicator_Container_Width)}.fd-progress-indicator .fd-progress-indicator__container:after,.fd-progress-indicator .fd-progress-indicator__container:before{background-color:var(--progressBarBackground);border-radius:50%;-webkit-box-sizing:inherit;box-sizing:inherit;content:\"\";display:var(--fdProgress_Indicator_Progress_Bar_Boundary_Display,none);font-size:inherit;height:.25rem;position:absolute;top:0;width:.25rem}.fd-progress-indicator .fd-progress-indicator__container:before{left:0}.fd-progress-indicator .fd-progress-indicator__container:after{right:0}.fd-progress-indicator[aria-valuenow=\"0\"] .fd-progress-indicator__progress-bar{border:none}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{right:var(--fdProgress_Indicator_Progress_Bar_Position_Left);width:auto!important}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar[dir=rtl],.fd-progress-indicator__progress-bar,[dir=rtl] .fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{left:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator__progress-bar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;background:var(--progressBarBackground);border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-radius:var(--fdProgress_Indicator_Progress_Bar_Border_Radius);border-right:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);bottom:var(--fdProgress_Indicator_Progress_Bar_Position_Bottom);height:var(--fdProgress_Indicator_Progress_Bar_Height);justify-content:flex-end;margin-block:var(--fdProgress_Indicator_Progress_Bar_Margin_Block);margin-inline:0}.fd-progress-indicator__progress-bar:after,.fd-progress-indicator__progress-bar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__progress-bar .fd-progress-indicator__label{color:var(--fdProgress_Indicator_Label_Color_Contrast)}.fd-progress-indicator__progress-bar[dir=rtl],[dir=rtl] .fd-progress-indicator__progress-bar{border-right:none;border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-left:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);left:auto;right:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator .fd-progress-indicator__remaining{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:static}.fd-progress-indicator .fd-progress-indicator__remaining:after,.fd-progress-indicator .fd-progress-indicator__remaining:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator .fd-progress-indicator__remaining.fd-popover__control{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;min-width:0}.fd-progress-indicator__icon{bottom:-.625rem;display:var(--iconDisplay);margin-inline:var(--fdProgress_Indicator_Label_Margin_Start) var(--fdProgress_Icon_Space_Before_Label);position:var(--fdProgress_Indicator_Icon_Position,static);right:-1.25rem}.fd-progress-indicator__icon[dir=rtl],[dir=rtl] .fd-progress-indicator__icon{left:-1.25rem;right:auto}.fd-progress-indicator__icon:before{color:var(--iconColor);content:var(--iconContent);font-family:SAP-icons;font-size:var(--fdProgress_Indicator_Icon_Font_Size);vertical-align:middle}.fd-progress-indicator__icon+.fd-progress-indicator__label{-webkit-margin-start:0;margin-inline-start:0}.fd-progress-indicator__label{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdProgress_Indicator_Label_Color);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdProgress_Indicator_Label_Font_Size);font-weight:400;forced-color-adjust:none;left:0;line-height:normal;margin-block:0;margin-inline:0;margin-inline:var(--labelMarginStart) var(--labelMarginEnd);max-width:100%;overflow:hidden;padding-block:0;padding-inline:0;position:var(--fdProgress_Indicator_Label_Position,static);text-overflow:ellipsis;top:-1.25rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fd-progress-indicator__label:after,.fd-progress-indicator__label:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__label[dir=rtl],[dir=rtl] .fd-progress-indicator__label{left:auto;right:0}.fd-progress-indicator__overflow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:.25rem;padding-inline:0;padding-inline:.5rem 0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;max-width:95vw;overflow:hidden;white-space:normal}.fd-progress-indicator__overflow:after,.fd-progress-indicator__overflow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:transparent;cursor:pointer;height:1.375rem;max-height:1.375rem;max-width:1.4375rem;min-height:1.375rem;min-width:1.4375rem;text-align:center;width:1.4375rem}.fd-progress-indicator__overflow-close:after,.fd-progress-indicator__overflow-close:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close.is-focus,.fd-progress-indicator__overflow-close:focus{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);z-index:5}.fd-progress-indicator__overflow-close [class*=sap-icon]{color:var(--sapContent_IconColor);font-size:var(--sapFontSmallSize)}.fd-progress-indicator__progress-bar--animated{-webkit-transition:min-width .5s ease-in-out,width .5s ease-in-out;-moz-transition:min-width .5s ease-in-out,width .5s ease-in-out;-o-transition:min-width .5s ease-in-out,width .5s ease-in-out;transition:min-width .5s ease-in-out,width .5s ease-in-out}.fd-progress-indicator__container .fd-popover__control{width:100%}\n/*! Bundled license information:\n\nfundamental-styles/dist/progress-indicator.css:\n (*!\n * Fundamental Library Styles v0.41.6\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["onClose"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
65
65
|
}
|
|
66
66
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ProgressIndicatorComponent, decorators: [{
|
|
67
67
|
type: Component,
|
|
68
|
-
args: [{ selector: 'fd-progress-indicator', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, PopoverComponent, PopoverControlComponent, PopoverBodyComponent, IconComponent], template: "<div\n class=\"fd-progress-indicator\"\n tabindex=\"-1\"\n role=\"progressbar\"\n [attr.aria-valuemin]=\"valueMin\"\n [attr.aria-valuenow]=\"valueNow\"\n [attr.aria-valuemax]=\"valueMax\"\n [attr.aria-valuetext]=\"valueText\"\n [attr.aria-label]=\"valueText\"\n [class]=\"state ? 'fd-progress-indicator--' + state : ''\"\n>\n @if (!hasPopover) {\n @if (_progressBarWidth >= 0) {\n <div class=\"fd-progress-indicator__container\">\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </div>\n }\n } @else {\n <fd-popover\n [style.width.%]=\"100\"\n [noArrow]=\"false\"\n placement=\"bottom\"\n fillControlMode=\"equal\"\n #popover\n class=\"fd-progress-indicator__container\"\n >\n @if (_progressBarWidth >= 0) {\n <fd-popover-control>\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </fd-popover-control>\n }\n <fd-popover-body>\n <div class=\"fd-popover__wrapper\">\n <div class=\"fd-progress-indicator__overflow\">\n <span>{{ valueText }}</span>\n <span class=\"fd-progress-indicator__overflow-close\" (click)=\"popover.close()\">\n <fd-icon glyph=\"decline\"></fd-icon>\n </span>\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n }\n</div>\n<ng-template #indicatorContainer>\n @if (_progressBarWidth > 0) {\n <div\n class=\"fd-progress-indicator__progress-bar\"\n [class.fd-progress-indicator__progress-bar--animated]=\"animate\"\n [style.min-width.%]=\"_progressBarWidth\"\n [style.width.%]=\"_progressBarWidth\"\n >\n @if (_progressBarWidth > 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n }\n <div class=\"fd-progress-indicator__remaining\" [style.min-width]=\"0\">\n @if (_progressBarWidth <= 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n</ng-template>\n<ng-template #progressBarLabel>\n @if (state) {\n <span class=\"fd-progress-indicator__icon\"></span>\n }\n @if (!valueText) {\n <span class=\"fd-progress-indicator__label\"> {{ valueNow }}% </span>\n } @else {\n <span class=\"fd-progress-indicator__label\">\n {{ valueText }}\n </span>\n }\n</ng-template>\n", styles: [".fd-progress-indicator{--rootMarginBlock:.5rem;--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Neutral);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Neutral,transparent);--progressBarBorderRightColor:var(--fdProgress_Indicator_Border_Right_Color,var(--progressBarBorderColor));--containerBackground:var(--fdProgress_Indicator_Container_Background_Neutral,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Neutral,var(--sapField_BorderColor));--iconDisplay:none;--iconContent:\"\";--labelMarginStart:var(--fdProgress_Indicator_Label_Margin_Start);--labelMarginEnd:var(--fdProgress_Indicator_Label_Margin_End);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdProgress_Indicator_Height);line-height:normal;margin-block:0;margin-block:var(--rootMarginBlock);margin-inline:0;padding-block:0;padding-block:var(--fdProgress_Indicator_Container_Margin_Block);padding-inline:0;padding-inline:var(--fdProgress_Indicator_Container_Margin_Inline);width:100%}.fd-progress-indicator:after,.fd-progress-indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator.fd-popover{cursor:pointer;margin-block:var(--rootMarginBlock);margin-inline:0}.fd-progress-indicator--mobile{--rootMarginBlock:.875rem}.fd-progress-indicator--display{--rootMarginBlock:0}.fd-progress-indicator--display.fd-popover{margin-block:0;margin-inline:0}.fd-progress-indicator--informative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Informative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Informative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Informative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Informative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Informative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Informative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--positive{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Positive);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Positive,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Positive,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Positive,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Positive);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Positive,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--negative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Negative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Negative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Negative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Negative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Negative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Negative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--critical{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Critical);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Critical,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Critical,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Critical,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Critical);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Critical,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator .fd-progress-indicator__container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;background:var(--containerBackground);border:.0625rem solid var(--containerBorderColor);border-radius:.5rem;-ms-flex-direction:row;flex-direction:row;height:var(--fdProgress_Indicator_Container_Height);min-height:var(--fdProgress_Indicator_Container_Height);min-width:4rem;overflow:var(--fdProgress_Indicator_Container_Overflow);position:var(--fdProgress_Indicator_Container_Position,static);width:var(--fdProgress_Indicator_Container_Width)}.fd-progress-indicator .fd-progress-indicator__container:after,.fd-progress-indicator .fd-progress-indicator__container:before{background-color:var(--progressBarBackground);border-radius:50%;-webkit-box-sizing:inherit;box-sizing:inherit;content:\"\";display:var(--fdProgress_Indicator_Progress_Bar_Boundary_Display,none);font-size:inherit;height:.25rem;position:absolute;top:0;width:.25rem}.fd-progress-indicator .fd-progress-indicator__container:before{left:0}.fd-progress-indicator .fd-progress-indicator__container:after{right:0}.fd-progress-indicator[aria-valuenow=\"0\"] .fd-progress-indicator__progress-bar{border:none}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{right:var(--fdProgress_Indicator_Progress_Bar_Position_Left);width:auto!important}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar[dir=rtl],.fd-progress-indicator__progress-bar,[dir=rtl] .fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{left:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator__progress-bar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;background:var(--progressBarBackground);border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-radius:var(--fdProgress_Indicator_Progress_Bar_Border_Radius);border-right:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);bottom:var(--fdProgress_Indicator_Progress_Bar_Position_Bottom);height:var(--fdProgress_Indicator_Progress_Bar_Height);justify-content:flex-end;margin-block:var(--fdProgress_Indicator_Progress_Bar_Margin_Block);margin-inline:0}.fd-progress-indicator__progress-bar:after,.fd-progress-indicator__progress-bar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__progress-bar .fd-progress-indicator__label{color:var(--fdProgress_Indicator_Label_Color_Contrast)}.fd-progress-indicator__progress-bar[dir=rtl],[dir=rtl] .fd-progress-indicator__progress-bar{border-right:none;border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-left:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);left:auto;right:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator .fd-progress-indicator__remaining{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:static}.fd-progress-indicator .fd-progress-indicator__remaining:after,.fd-progress-indicator .fd-progress-indicator__remaining:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator .fd-progress-indicator__remaining.fd-popover__control{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;min-width:0}.fd-progress-indicator__icon{bottom:-.625rem;display:var(--iconDisplay);margin-inline:var(--fdProgress_Indicator_Label_Margin_Start) var(--fdProgress_Icon_Space_Before_Label);position:var(--fdProgress_Indicator_Icon_Position,static);right:-1.25rem}.fd-progress-indicator__icon[dir=rtl],[dir=rtl] .fd-progress-indicator__icon{left:-1.25rem;right:auto}.fd-progress-indicator__icon:before{color:var(--iconColor);content:var(--iconContent);font-family:SAP-icons;font-size:var(--fdProgress_Indicator_Icon_Font_Size);vertical-align:middle}.fd-progress-indicator__icon+.fd-progress-indicator__label{-webkit-margin-start:0;margin-inline-start:0}.fd-progress-indicator__label{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdProgress_Indicator_Label_Color);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdProgress_Indicator_Label_Font_Size);font-weight:400;forced-color-adjust:none;left:0;line-height:normal;margin-block:0;margin-inline:0;margin-inline:var(--labelMarginStart) var(--labelMarginEnd);max-width:100%;overflow:hidden;padding-block:0;padding-inline:0;position:var(--fdProgress_Indicator_Label_Position,static);text-overflow:ellipsis;top:-1.25rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fd-progress-indicator__label:after,.fd-progress-indicator__label:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__label[dir=rtl],[dir=rtl] .fd-progress-indicator__label{left:auto;right:0}.fd-progress-indicator__overflow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:.25rem;padding-inline:0;padding-inline:.5rem 0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;max-width:95vw;overflow:hidden;white-space:normal}.fd-progress-indicator__overflow:after,.fd-progress-indicator__overflow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:transparent;cursor:pointer;height:1.375rem;max-height:1.375rem;max-width:1.4375rem;min-height:1.375rem;min-width:1.4375rem;text-align:center;width:1.4375rem}.fd-progress-indicator__overflow-close:after,.fd-progress-indicator__overflow-close:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close.is-focus,.fd-progress-indicator__overflow-close:focus{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);z-index:5}.fd-progress-indicator__overflow-close [class*=sap-icon]{color:var(--sapContent_IconColor);font-size:var(--sapFontSmallSize)}.fd-progress-indicator__progress-bar--animated{-webkit-transition:min-width .5s ease-in-out,width .5s ease-in-out;-moz-transition:min-width .5s ease-in-out,width .5s ease-in-out;-o-transition:min-width .5s ease-in-out,width .5s ease-in-out;transition:min-width .5s ease-in-out,width .5s ease-in-out}.fd-progress-indicator__container .fd-popover__control{width:100%}\n/*! Bundled license information:\n\nfundamental-styles/dist/progress-indicator.css:\n (*!\n * Fundamental Library Styles v0.41.5\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"] }]
|
|
68
|
+
args: [{ selector: 'fd-progress-indicator', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, PopoverComponent, PopoverControlComponent, PopoverBodyComponent, IconComponent], template: "<div\n class=\"fd-progress-indicator\"\n tabindex=\"-1\"\n role=\"progressbar\"\n [attr.aria-valuemin]=\"valueMin\"\n [attr.aria-valuenow]=\"valueNow\"\n [attr.aria-valuemax]=\"valueMax\"\n [attr.aria-valuetext]=\"valueText\"\n [attr.aria-label]=\"valueText\"\n [class]=\"state ? 'fd-progress-indicator--' + state : ''\"\n>\n @if (!hasPopover) {\n @if (_progressBarWidth >= 0) {\n <div class=\"fd-progress-indicator__container\">\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </div>\n }\n } @else {\n <fd-popover\n [style.width.%]=\"100\"\n [noArrow]=\"false\"\n placement=\"bottom\"\n fillControlMode=\"equal\"\n #popover\n class=\"fd-progress-indicator__container\"\n >\n @if (_progressBarWidth >= 0) {\n <fd-popover-control>\n <ng-template [ngTemplateOutlet]=\"indicatorContainer\"></ng-template>\n </fd-popover-control>\n }\n <fd-popover-body>\n <div class=\"fd-popover__wrapper\">\n <div class=\"fd-progress-indicator__overflow\">\n <span>{{ valueText }}</span>\n <span class=\"fd-progress-indicator__overflow-close\" (click)=\"popover.close()\">\n <fd-icon glyph=\"decline\"></fd-icon>\n </span>\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n }\n</div>\n<ng-template #indicatorContainer>\n @if (_progressBarWidth > 0) {\n <div\n class=\"fd-progress-indicator__progress-bar\"\n [class.fd-progress-indicator__progress-bar--animated]=\"animate\"\n [style.min-width.%]=\"_progressBarWidth\"\n [style.width.%]=\"_progressBarWidth\"\n >\n @if (_progressBarWidth > 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n }\n <div class=\"fd-progress-indicator__remaining\" [style.min-width]=\"0\">\n @if (_progressBarWidth <= 50) {\n <ng-template [ngTemplateOutlet]=\"progressBarLabel\"></ng-template>\n }\n </div>\n</ng-template>\n<ng-template #progressBarLabel>\n @if (state) {\n <span class=\"fd-progress-indicator__icon\"></span>\n }\n @if (!valueText) {\n <span class=\"fd-progress-indicator__label\"> {{ valueNow }}% </span>\n } @else {\n <span class=\"fd-progress-indicator__label\">\n {{ valueText }}\n </span>\n }\n</ng-template>\n", styles: [".fd-progress-indicator{--rootMarginBlock:.5rem;--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Neutral);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Neutral,transparent);--progressBarBorderRightColor:var(--fdProgress_Indicator_Border_Right_Color,var(--progressBarBorderColor));--containerBackground:var(--fdProgress_Indicator_Container_Background_Neutral,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Neutral,var(--sapField_BorderColor));--iconDisplay:none;--iconContent:\"\";--labelMarginStart:var(--fdProgress_Indicator_Label_Margin_Start);--labelMarginEnd:var(--fdProgress_Indicator_Label_Margin_End);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdProgress_Indicator_Height);line-height:normal;margin-block:0;margin-block:var(--rootMarginBlock);margin-inline:0;padding-block:0;padding-block:var(--fdProgress_Indicator_Container_Margin_Block);padding-inline:0;padding-inline:var(--fdProgress_Indicator_Container_Margin_Inline);width:100%}.fd-progress-indicator:after,.fd-progress-indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator.fd-popover{cursor:pointer;margin-block:var(--rootMarginBlock);margin-inline:0}.fd-progress-indicator--mobile{--rootMarginBlock:.875rem}.fd-progress-indicator--display{--rootMarginBlock:0}.fd-progress-indicator--display.fd-popover{margin-block:0;margin-inline:0}.fd-progress-indicator--informative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Informative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Informative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Informative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Informative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Informative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Informative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--positive{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Positive);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Positive,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Positive,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Positive,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Positive);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Positive,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--negative{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Negative);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Negative,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Negative,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Negative,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Negative);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Negative,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator--critical{--progressBarBackground:var(--fdProgress_Indicator_Background_Color_Critical);--progressBarBorderColor:var(--fdProgress_Indicator_Progress_Bar_Border_Color_Critical,transparent);--containerBackground:var(--fdProgress_Indicator_Container_Background_Critical,var(--sapField_Background));--containerBorderColor:var(--fdProgress_Indicator_Container_Border_Critical,var(--sapField_BorderColor));--iconContent:var(--fdProgress_Icon_Critical);--iconDisplay:inline;--iconColor:var(--fdProgress_Icon_Color_Critical,var(--fdProgress_Indicator_Label_Color));--labelMarginStart:0}.fd-progress-indicator .fd-progress-indicator__container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;background:var(--containerBackground);border:.0625rem solid var(--containerBorderColor);border-radius:.5rem;-ms-flex-direction:row;flex-direction:row;height:var(--fdProgress_Indicator_Container_Height);min-height:var(--fdProgress_Indicator_Container_Height);min-width:4rem;overflow:var(--fdProgress_Indicator_Container_Overflow);position:var(--fdProgress_Indicator_Container_Position,static);width:var(--fdProgress_Indicator_Container_Width)}.fd-progress-indicator .fd-progress-indicator__container:after,.fd-progress-indicator .fd-progress-indicator__container:before{background-color:var(--progressBarBackground);border-radius:50%;-webkit-box-sizing:inherit;box-sizing:inherit;content:\"\";display:var(--fdProgress_Indicator_Progress_Bar_Boundary_Display,none);font-size:inherit;height:.25rem;position:absolute;top:0;width:.25rem}.fd-progress-indicator .fd-progress-indicator__container:before{left:0}.fd-progress-indicator .fd-progress-indicator__container:after{right:0}.fd-progress-indicator[aria-valuenow=\"0\"] .fd-progress-indicator__progress-bar{border:none}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{right:var(--fdProgress_Indicator_Progress_Bar_Position_Left);width:auto!important}.fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar[dir=rtl],.fd-progress-indicator__progress-bar,[dir=rtl] .fd-progress-indicator[aria-valuenow=\"100\"] .fd-progress-indicator__progress-bar{left:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator__progress-bar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;background:var(--progressBarBackground);border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-radius:var(--fdProgress_Indicator_Progress_Bar_Border_Radius);border-right:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);bottom:var(--fdProgress_Indicator_Progress_Bar_Position_Bottom);height:var(--fdProgress_Indicator_Progress_Bar_Height);justify-content:flex-end;margin-block:var(--fdProgress_Indicator_Progress_Bar_Margin_Block);margin-inline:0}.fd-progress-indicator__progress-bar:after,.fd-progress-indicator__progress-bar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__progress-bar .fd-progress-indicator__label{color:var(--fdProgress_Indicator_Label_Color_Contrast)}.fd-progress-indicator__progress-bar[dir=rtl],[dir=rtl] .fd-progress-indicator__progress-bar{border-right:none;border:var(--fdProgress_Indicator_Progress_Bar_Border) var(--progressBarBorderColor);border-left:var(--fdProgress_Indicator_Border_Right) var(--progressBarBorderRightColor);left:auto;right:var(--fdProgress_Indicator_Progress_Bar_Position_Left)}.fd-progress-indicator .fd-progress-indicator__remaining{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:static}.fd-progress-indicator .fd-progress-indicator__remaining:after,.fd-progress-indicator .fd-progress-indicator__remaining:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator .fd-progress-indicator__remaining.fd-popover__control{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;min-width:0}.fd-progress-indicator__icon{bottom:-.625rem;display:var(--iconDisplay);margin-inline:var(--fdProgress_Indicator_Label_Margin_Start) var(--fdProgress_Icon_Space_Before_Label);position:var(--fdProgress_Indicator_Icon_Position,static);right:-1.25rem}.fd-progress-indicator__icon[dir=rtl],[dir=rtl] .fd-progress-indicator__icon{left:-1.25rem;right:auto}.fd-progress-indicator__icon:before{color:var(--iconColor);content:var(--iconContent);font-family:SAP-icons;font-size:var(--fdProgress_Indicator_Icon_Font_Size);vertical-align:middle}.fd-progress-indicator__icon+.fd-progress-indicator__label{-webkit-margin-start:0;margin-inline-start:0}.fd-progress-indicator__label{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdProgress_Indicator_Label_Color);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdProgress_Indicator_Label_Font_Size);font-weight:400;forced-color-adjust:none;left:0;line-height:normal;margin-block:0;margin-inline:0;margin-inline:var(--labelMarginStart) var(--labelMarginEnd);max-width:100%;overflow:hidden;padding-block:0;padding-inline:0;position:var(--fdProgress_Indicator_Label_Position,static);text-overflow:ellipsis;top:-1.25rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fd-progress-indicator__label:after,.fd-progress-indicator__label:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__label[dir=rtl],[dir=rtl] .fd-progress-indicator__label{left:auto;right:0}.fd-progress-indicator__overflow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:.25rem;padding-inline:0;padding-inline:.5rem 0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;max-width:95vw;overflow:hidden;white-space:normal}.fd-progress-indicator__overflow:after,.fd-progress-indicator__overflow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:transparent;cursor:pointer;height:1.375rem;max-height:1.375rem;max-width:1.4375rem;min-height:1.375rem;min-width:1.4375rem;text-align:center;width:1.4375rem}.fd-progress-indicator__overflow-close:after,.fd-progress-indicator__overflow-close:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-progress-indicator__overflow-close.is-focus,.fd-progress-indicator__overflow-close:focus{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);z-index:5}.fd-progress-indicator__overflow-close [class*=sap-icon]{color:var(--sapContent_IconColor);font-size:var(--sapFontSmallSize)}.fd-progress-indicator__progress-bar--animated{-webkit-transition:min-width .5s ease-in-out,width .5s ease-in-out;-moz-transition:min-width .5s ease-in-out,width .5s ease-in-out;-o-transition:min-width .5s ease-in-out,width .5s ease-in-out;transition:min-width .5s ease-in-out,width .5s ease-in-out}.fd-progress-indicator__container .fd-popover__control{width:100%}\n/*! Bundled license information:\n\nfundamental-styles/dist/progress-indicator.css:\n (*!\n * Fundamental Library Styles v0.41.6\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"] }]
|
|
69
69
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { valueText: [{
|
|
70
70
|
type: Input
|
|
71
71
|
}], unit: [{
|
|
@@ -198,11 +198,11 @@ class QuickViewComponent {
|
|
|
198
198
|
this.id = 'fd-quick-view-' + quickViewUniqueId++;
|
|
199
199
|
}
|
|
200
200
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: QuickViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
201
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: QuickViewComponent, isStandalone: true, selector: "fd-quick-view", inputs: { id: "id" }, ngImport: i0, template: "<div class=\"fd-quick-view\" [id]=\"id\">\n <ng-content select=\"fd-quick-view-title\"></ng-content>\n\n <div class=\"fd-quick-view__content\">\n <ng-content select=\"fd-quick-view-subheader\"></ng-content>\n <ng-content select=\"fd-quick-view-group\"></ng-content>\n </div>\n</div>\n", styles: [".fd-form-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-form-group:after,.fd-form-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-form-group--with-spacing{gap:.625rem}.fd-form-group__header{border:0;-webkit-box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapGroup_TitleBackground);border-bottom:var(--sapGroup_TitleBorderWidth) solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;min-height:var(--sapElement_LineHeight);padding-inline:var(--fdFormGroupPaddingInline,1rem);width:100%}.fd-form-group__header:after,.fd-form-group__header:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header--no-padding{--fdFormGroupPaddingInline:0}.fd-form-group__header--no-border{border-bottom:none}.fd-form-group__header-text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapGroup_Title_FontSize);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header-text--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:inherit;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;min-width:20rem;padding-block:0;padding-inline:0}.fd-quick-view:after,.fd-quick-view:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content{background-color:var(--sapGroup_ContentBackground);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem}.fd-quick-view__content:after,.fd-quick-view__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content .fd-form-item{gap:.25rem}.fd-quick-view__content .fd-bar{padding-block:0;padding-inline:0}.fd-quick-view__content .fd-bar--header-with-subheader{height:auto;-webkit-padding-after:.75rem;padding-block-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-avatar{-webkit-margin-end:.75rem;margin-inline-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__left,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__middle,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__right{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-quick-view__subheader-text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.25rem;-webkit-box-pack:center;-ms-flex-pack:center;height:100%;justify-content:center;max-width:100%;min-width:0}.fd-quick-view__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTile_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-quick-view__subtitle:after,.fd-quick-view__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__subtitle--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view .fd-input:not(input){border:none;height:auto;padding-block:0;padding-inline:0}.fd-dialog__body .fd-quick-view__content{padding-block:0}.fd-quick-view .fd-form-item{-webkit-padding-before:.75rem;padding-block-start:.75rem}.fd-quick-view .fd-form-item .fd-link{-ms-flex-item-align:start;align-self:flex-start}.fd-quick-view .fd-form-group__header+.fd-form-item{-webkit-padding-before:0;padding-block-start:0}.fd-quick-view .fd-title .fd-link{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.fd-popover__body .fd-quick-view__content{border-radius:var(--sapElement_BorderCornerRadius)}.fd-quick-view fd-quick-view-group-title+fd-quick-view-group-item .fd-form-item{padding-block-start:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/quick-view.css:\n (*!\n * Fundamental Library Styles v0.41.
|
|
201
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: QuickViewComponent, isStandalone: true, selector: "fd-quick-view", inputs: { id: "id" }, ngImport: i0, template: "<div class=\"fd-quick-view\" [id]=\"id\">\n <ng-content select=\"fd-quick-view-title\"></ng-content>\n\n <div class=\"fd-quick-view__content\">\n <ng-content select=\"fd-quick-view-subheader\"></ng-content>\n <ng-content select=\"fd-quick-view-group\"></ng-content>\n </div>\n</div>\n", styles: [".fd-form-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-form-group:after,.fd-form-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-form-group--with-spacing{gap:.625rem}.fd-form-group__header{border:0;-webkit-box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapGroup_TitleBackground);border-bottom:var(--sapGroup_TitleBorderWidth) solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;min-height:var(--sapElement_LineHeight);padding-inline:var(--fdFormGroupPaddingInline,1rem);width:100%}.fd-form-group__header:after,.fd-form-group__header:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header--no-padding{--fdFormGroupPaddingInline:0}.fd-form-group__header--no-border{border-bottom:none}.fd-form-group__header-text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapGroup_Title_FontSize);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header-text--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:inherit;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;min-width:20rem;padding-block:0;padding-inline:0}.fd-quick-view:after,.fd-quick-view:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content{background-color:var(--sapGroup_ContentBackground);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem}.fd-quick-view__content:after,.fd-quick-view__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content .fd-form-item{gap:.25rem}.fd-quick-view__content .fd-bar{padding-block:0;padding-inline:0}.fd-quick-view__content .fd-bar--header-with-subheader{height:auto;-webkit-padding-after:.75rem;padding-block-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-avatar{-webkit-margin-end:.75rem;margin-inline-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__left,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__middle,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__right{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-quick-view__subheader-text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.25rem;-webkit-box-pack:center;-ms-flex-pack:center;height:100%;justify-content:center;max-width:100%;min-width:0}.fd-quick-view__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTile_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-quick-view__subtitle:after,.fd-quick-view__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__subtitle--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view .fd-input:not(input){border:none;height:auto;padding-block:0;padding-inline:0}.fd-dialog__body .fd-quick-view__content{padding-block:0}.fd-quick-view .fd-form-item{-webkit-padding-before:.75rem;padding-block-start:.75rem}.fd-quick-view .fd-form-item .fd-link{-ms-flex-item-align:start;align-self:flex-start}.fd-quick-view .fd-form-group__header+.fd-form-item{-webkit-padding-before:0;padding-block-start:0}.fd-quick-view .fd-title .fd-link{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.fd-popover__body .fd-quick-view__content{border-radius:var(--sapElement_BorderCornerRadius)}.fd-quick-view fd-quick-view-group-title+fd-quick-view-group-item .fd-form-item{padding-block-start:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/quick-view.css:\n (*!\n * Fundamental Library Styles v0.41.6\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
202
202
|
}
|
|
203
203
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: QuickViewComponent, decorators: [{
|
|
204
204
|
type: Component,
|
|
205
|
-
args: [{ selector: 'fd-quick-view', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"fd-quick-view\" [id]=\"id\">\n <ng-content select=\"fd-quick-view-title\"></ng-content>\n\n <div class=\"fd-quick-view__content\">\n <ng-content select=\"fd-quick-view-subheader\"></ng-content>\n <ng-content select=\"fd-quick-view-group\"></ng-content>\n </div>\n</div>\n", styles: [".fd-form-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-form-group:after,.fd-form-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-form-group--with-spacing{gap:.625rem}.fd-form-group__header{border:0;-webkit-box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapGroup_TitleBackground);border-bottom:var(--sapGroup_TitleBorderWidth) solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;min-height:var(--sapElement_LineHeight);padding-inline:var(--fdFormGroupPaddingInline,1rem);width:100%}.fd-form-group__header:after,.fd-form-group__header:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header--no-padding{--fdFormGroupPaddingInline:0}.fd-form-group__header--no-border{border-bottom:none}.fd-form-group__header-text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapGroup_Title_FontSize);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header-text--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:inherit;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;min-width:20rem;padding-block:0;padding-inline:0}.fd-quick-view:after,.fd-quick-view:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content{background-color:var(--sapGroup_ContentBackground);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem}.fd-quick-view__content:after,.fd-quick-view__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content .fd-form-item{gap:.25rem}.fd-quick-view__content .fd-bar{padding-block:0;padding-inline:0}.fd-quick-view__content .fd-bar--header-with-subheader{height:auto;-webkit-padding-after:.75rem;padding-block-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-avatar{-webkit-margin-end:.75rem;margin-inline-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__left,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__middle,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__right{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-quick-view__subheader-text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.25rem;-webkit-box-pack:center;-ms-flex-pack:center;height:100%;justify-content:center;max-width:100%;min-width:0}.fd-quick-view__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTile_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-quick-view__subtitle:after,.fd-quick-view__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__subtitle--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view .fd-input:not(input){border:none;height:auto;padding-block:0;padding-inline:0}.fd-dialog__body .fd-quick-view__content{padding-block:0}.fd-quick-view .fd-form-item{-webkit-padding-before:.75rem;padding-block-start:.75rem}.fd-quick-view .fd-form-item .fd-link{-ms-flex-item-align:start;align-self:flex-start}.fd-quick-view .fd-form-group__header+.fd-form-item{-webkit-padding-before:0;padding-block-start:0}.fd-quick-view .fd-title .fd-link{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.fd-popover__body .fd-quick-view__content{border-radius:var(--sapElement_BorderCornerRadius)}.fd-quick-view fd-quick-view-group-title+fd-quick-view-group-item .fd-form-item{padding-block-start:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/quick-view.css:\n (*!\n * Fundamental Library Styles v0.41.
|
|
205
|
+
args: [{ selector: 'fd-quick-view', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"fd-quick-view\" [id]=\"id\">\n <ng-content select=\"fd-quick-view-title\"></ng-content>\n\n <div class=\"fd-quick-view__content\">\n <ng-content select=\"fd-quick-view-subheader\"></ng-content>\n <ng-content select=\"fd-quick-view-group\"></ng-content>\n </div>\n</div>\n", styles: [".fd-form-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-form-group:after,.fd-form-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-form-group--with-spacing{gap:.625rem}.fd-form-group__header{border:0;-webkit-box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapGroup_TitleBackground);border-bottom:var(--sapGroup_TitleBorderWidth) solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;min-height:var(--sapElement_LineHeight);padding-inline:var(--fdFormGroupPaddingInline,1rem);width:100%}.fd-form-group__header:after,.fd-form-group__header:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header--no-padding{--fdFormGroupPaddingInline:0}.fd-form-group__header--no-border{border-bottom:none}.fd-form-group__header-text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapGroup_Title_FontSize);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-form-group__header-text--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:inherit;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;min-width:20rem;padding-block:0;padding-inline:0}.fd-quick-view:after,.fd-quick-view:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content{background-color:var(--sapGroup_ContentBackground);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem}.fd-quick-view__content:after,.fd-quick-view__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__content .fd-form-item{gap:.25rem}.fd-quick-view__content .fd-bar{padding-block:0;padding-inline:0}.fd-quick-view__content .fd-bar--header-with-subheader{height:auto;-webkit-padding-after:.75rem;padding-block-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-avatar{-webkit-margin-end:.75rem;margin-inline-end:.75rem}.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__left,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__middle,.fd-quick-view__content .fd-bar--header-with-subheader .fd-bar__right{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fd-quick-view__subheader-text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:.25rem;-webkit-box-pack:center;-ms-flex-pack:center;height:100%;justify-content:center;max-width:100%;min-width:0}.fd-quick-view__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTile_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-quick-view__subtitle:after,.fd-quick-view__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-quick-view__subtitle--wrap{overflow:visible;text-overflow:clip;white-space:normal}.fd-quick-view .fd-input:not(input){border:none;height:auto;padding-block:0;padding-inline:0}.fd-dialog__body .fd-quick-view__content{padding-block:0}.fd-quick-view .fd-form-item{-webkit-padding-before:.75rem;padding-block-start:.75rem}.fd-quick-view .fd-form-item .fd-link{-ms-flex-item-align:start;align-self:flex-start}.fd-quick-view .fd-form-group__header+.fd-form-item{-webkit-padding-before:0;padding-block-start:0}.fd-quick-view .fd-title .fd-link{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.fd-popover__body .fd-quick-view__content{border-radius:var(--sapElement_BorderCornerRadius)}.fd-quick-view fd-quick-view-group-title+fd-quick-view-group-item .fd-form-item{padding-block-start:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/quick-view.css:\n (*!\n * Fundamental Library Styles v0.41.6\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"] }]
|
|
206
206
|
}], propDecorators: { id: [{
|
|
207
207
|
type: Input
|
|
208
208
|
}] } });
|