@fundamental-ngx/core 0.33.2 → 0.33.3-rc.3
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/action-bar/package.json +3 -3
- package/action-sheet/esm2020/action-sheet.component.mjs +2 -2
- package/action-sheet/fesm2015/fundamental-ngx-core-action-sheet.mjs +2 -2
- package/action-sheet/fesm2020/fundamental-ngx-core-action-sheet.mjs +2 -2
- package/action-sheet/package.json +3 -3
- package/alert/package.json +3 -3
- package/avatar/package.json +3 -3
- package/avatar-group/package.json +3 -3
- package/bar/package.json +3 -3
- package/breadcrumb/package.json +3 -3
- package/busy-indicator/package.json +3 -3
- package/button/package.json +3 -3
- package/calendar/package.json +3 -3
- package/card/package.json +3 -3
- package/carousel/package.json +3 -3
- package/checkbox/package.json +3 -3
- package/combobox/package.json +3 -3
- package/date-picker/package.json +3 -3
- package/datetime/package.json +3 -3
- package/datetime-picker/package.json +3 -3
- package/dialog/package.json +3 -3
- package/dynamic-page/package.json +3 -3
- package/dynamic-side-content/package.json +3 -3
- package/esm2020/action-sheet/action-sheet.component.mjs +2 -2
- package/esm2020/grid-list/components/grid-list/grid-list.component.mjs +2 -2
- package/esm2020/layout-grid/layout-grid.component.mjs +2 -2
- package/esm2020/list/list.component.mjs +2 -2
- package/esm2020/popover/popover-body/popover-body.component.mjs +2 -2
- package/esm2020/product-switch/product-switch-body/product-switch-body.component.mjs +2 -2
- package/esm2020/resizable-card-layout/resizable-card-layout/resizable-card-item/resizable-card-item.component.mjs +2 -2
- package/esm2020/resizable-card-layout/resizable-card-layout/resizable-card-layout.component.mjs +2 -2
- package/esm2020/tabs/tab-list.component.mjs +2 -2
- package/esm2020/tabs/tab-nav/tab-nav.component.mjs +2 -2
- package/esm2020/tile/tile.component.mjs +2 -2
- package/esm2020/timeline/timeline.component.mjs +2 -2
- package/esm2020/wizard/wizard.component.mjs +2 -2
- package/facets/package.json +3 -3
- package/feed-input/package.json +3 -3
- package/feed-list-item/package.json +3 -3
- package/fesm2015/fundamental-ngx-core-action-sheet.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-grid-list.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-layout-grid.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-list.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-popover.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-product-switch.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-resizable-card-layout.mjs +4 -4
- package/fesm2015/fundamental-ngx-core-tabs.mjs +4 -4
- package/fesm2015/fundamental-ngx-core-tile.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-timeline.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-wizard.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-action-sheet.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-grid-list.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-layout-grid.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-list.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-popover.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-product-switch.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-resizable-card-layout.mjs +4 -4
- package/fesm2020/fundamental-ngx-core-tabs.mjs +4 -4
- package/fesm2020/fundamental-ngx-core-tile.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-timeline.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-wizard.mjs +2 -2
- package/file-uploader/package.json +3 -3
- package/fixed-card-layout/package.json +3 -3
- package/flexible-column-layout/package.json +3 -3
- package/form/package.json +3 -3
- package/formatted-text/package.json +3 -3
- package/grid-list/esm2020/components/grid-list/grid-list.component.mjs +2 -2
- package/grid-list/fesm2015/fundamental-ngx-core-grid-list.mjs +2 -2
- package/grid-list/fesm2020/fundamental-ngx-core-grid-list.mjs +2 -2
- package/grid-list/package.json +3 -3
- package/icon/package.json +3 -3
- package/illustrated-message/package.json +3 -3
- package/infinite-scroll/package.json +3 -3
- package/info-label/package.json +3 -3
- package/inline-help/package.json +3 -3
- package/input-group/package.json +3 -3
- package/layout-grid/esm2020/layout-grid.component.mjs +2 -2
- package/layout-grid/fesm2015/fundamental-ngx-core-layout-grid.mjs +2 -2
- package/layout-grid/fesm2020/fundamental-ngx-core-layout-grid.mjs +2 -2
- package/layout-grid/package.json +3 -3
- package/layout-panel/package.json +3 -3
- package/link/package.json +3 -3
- package/list/esm2020/list.component.mjs +2 -2
- package/list/fesm2015/fundamental-ngx-core-list.mjs +2 -2
- package/list/fesm2020/fundamental-ngx-core-list.mjs +2 -2
- package/list/package.json +3 -3
- package/menu/package.json +3 -3
- package/message-box/package.json +3 -3
- package/message-page/package.json +2 -2
- package/message-strip/package.json +3 -3
- package/message-toast/package.json +3 -3
- package/micro-process-flow/package.json +3 -3
- package/mobile-mode/package.json +3 -3
- package/multi-input/package.json +3 -3
- package/nested-list/package.json +3 -3
- package/notification/package.json +3 -3
- package/object-identifier/package.json +3 -3
- package/object-marker/package.json +3 -3
- package/object-number/package.json +3 -3
- package/object-status/package.json +3 -3
- package/package.json +7 -7
- package/pagination/package.json +3 -3
- package/panel/package.json +3 -3
- package/popover/esm2020/popover-body/popover-body.component.mjs +2 -2
- package/popover/fesm2015/fundamental-ngx-core-popover.mjs +2 -2
- package/popover/fesm2020/fundamental-ngx-core-popover.mjs +2 -2
- package/popover/package.json +3 -3
- package/product-switch/esm2020/product-switch-body/product-switch-body.component.mjs +2 -2
- package/product-switch/fesm2015/fundamental-ngx-core-product-switch.mjs +2 -2
- package/product-switch/fesm2020/fundamental-ngx-core-product-switch.mjs +2 -2
- package/product-switch/package.json +3 -3
- package/progress-indicator/package.json +1 -1
- package/quick-view/package.json +3 -3
- package/radio/package.json +3 -3
- package/rating-indicator/package.json +3 -3
- package/resizable-card-layout/esm2020/resizable-card-layout/resizable-card-item/resizable-card-item.component.mjs +2 -2
- package/resizable-card-layout/esm2020/resizable-card-layout/resizable-card-layout.component.mjs +2 -2
- package/resizable-card-layout/fesm2015/fundamental-ngx-core-resizable-card-layout.mjs +4 -4
- package/resizable-card-layout/fesm2020/fundamental-ngx-core-resizable-card-layout.mjs +4 -4
- package/resizable-card-layout/package.json +3 -3
- package/scroll-spy/package.json +3 -3
- package/scrollbar/package.json +3 -3
- package/segmented-button/package.json +3 -3
- package/select/package.json +3 -3
- package/shared/package.json +3 -3
- package/shellbar/package.json +3 -3
- package/side-navigation/package.json +3 -3
- package/slider/package.json +3 -3
- package/split-button/package.json +3 -3
- package/splitter/package.json +3 -3
- package/status-indicator/package.json +3 -3
- package/step-input/package.json +3 -3
- package/switch/package.json +3 -3
- package/table/package.json +3 -3
- package/tabs/esm2020/tab-list.component.mjs +2 -2
- package/tabs/esm2020/tab-nav/tab-nav.component.mjs +2 -2
- package/tabs/fesm2015/fundamental-ngx-core-tabs.mjs +4 -4
- package/tabs/fesm2020/fundamental-ngx-core-tabs.mjs +4 -4
- package/tabs/package.json +3 -3
- package/tests/package.json +2 -2
- package/text/package.json +3 -3
- package/tile/esm2020/tile.component.mjs +2 -2
- package/tile/fesm2015/fundamental-ngx-core-tile.mjs +2 -2
- package/tile/fesm2020/fundamental-ngx-core-tile.mjs +2 -2
- package/tile/package.json +3 -3
- package/time/package.json +3 -3
- package/time-picker/package.json +3 -3
- package/timeline/esm2020/timeline.component.mjs +2 -2
- package/timeline/fesm2015/fundamental-ngx-core-timeline.mjs +2 -2
- package/timeline/fesm2020/fundamental-ngx-core-timeline.mjs +2 -2
- package/timeline/package.json +3 -3
- package/title/package.json +3 -3
- package/token/package.json +3 -3
- package/toolbar/package.json +3 -3
- package/tree/package.json +3 -3
- package/upload-collection/package.json +3 -3
- package/utils/package.json +6 -6
- package/vertical-navigation/package.json +3 -3
- package/wizard/esm2020/wizard.component.mjs +2 -2
- package/wizard/fesm2015/fundamental-ngx-core-wizard.mjs +2 -2
- package/wizard/fesm2020/fundamental-ngx-core-wizard.mjs +2 -2
- package/wizard/package.json +3 -3
|
@@ -172,10 +172,10 @@ class ProductSwitchBodyComponent {
|
|
|
172
172
|
}
|
|
173
173
|
}
|
|
174
174
|
ProductSwitchBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ProductSwitchBodyComponent, deps: [{ token: i1$1.ViewportRuler }, { token: i2$1.RtlService, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
175
|
-
ProductSwitchBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ProductSwitchBodyComponent, 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 <li\n fd-dnd-item\n *ngFor=\"let product of products\"\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 <i\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [class]=\"product.icon ? 'sap-icon--' + product.icon : ''\"\n ></i>\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n <div *ngIf=\"product.subtitle\" class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n </div>\n </li>\n </ul>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.drag-placeholder{position:absolute;opacity:.3}/*!\n.fd-product-switch\n*/.fd-product-switch{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0}.fd-product-switch:after,.fd-product-switch:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);justify-content:center}.fd-product-switch .fd-button.fd-product-switch__control:after,.fd-product-switch .fd-button.fd-product-switch__control:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control:before{margin-right:0}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]:before{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control.is-hover,.fd-product-switch .fd-button.fd-product-switch__control:hover{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);background-color:#283848;background-color:var(--sapShell_Hover_Background, #283848)}.fd-product-switch .fd-button.fd-product-switch__control.is-hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover[aria-disabled=true],.fd-product-switch .fd-button.fd-product-switch__control:hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover[aria-disabled=true]{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:disabled,.fd-product-switch .fd-button.fd-product-switch__control[aria-disabled=true]{opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-active,.fd-product-switch .fd-button.fd-product-switch__control.is-pressed,.fd-product-switch .fd-button.fd-product-switch__control.is-selected,.fd-product-switch .fd-button.fd-product-switch__control:active,.fd-product-switch .fd-button.fd-product-switch__control[aria-pressed=true],.fd-product-switch .fd-button.fd-product-switch__control[aria-selected=true]{color:#fff;color:var(--sapShell_Active_TextColor, #fff);background-color:#23303e;background-color:var(--sapShell_Active_Background, #23303e)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus,.fd-product-switch .fd-button.fd-product-switch__control:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus.fd-product-switch--toggled,.fd-product-switch .fd-button.fd-product-switch__control:focus.fd-product-switch--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch__list{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;flex-wrap:wrap;width:47rem}.fd-product-switch__list:after,.fd-product-switch__list:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:column;align-items:center;text-align:center;height:7rem;max-width:11.25rem;flex:1 0 25%;padding:.5rem;margin-right:.5rem;margin-bottom:.5rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);box-shadow:none;box-shadow:var(--fdProductSwitch_Shadow, none)}.fd-product-switch__item:after,.fd-product-switch__item:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5);border:none;border:var(--fdProductSwitch_Border, none);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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0);border:none;border:var(--fdProductSwitch_Border, none)}.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__subtitle,.fd-product-switch__item:active .fd-product-switch__title,.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:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon]{color:#fff;color:var(--sapList_Active_TextColor, #fff)}.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:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.selected{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa);border:.125rem solid #0854a0;border:.125rem solid var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected:hover{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-product-switch__item.dragged{background-color:#fff;background-color:var(--sapList_Background, #fff);cursor:grabbing;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:#fff;background-color:var(--sapList_Background, #fff)}.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:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__item.dragged.selected{border:none;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:0}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;font-size:1.5rem;margin-bottom:.5rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:3rem;min-height:3rem;display:flex;justify-content:center;align-items:center}.fd-product-switch__text{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:100%;overflow:hidden;max-height:2.5rem;text-shadow:none;text-shadow:var(--fdProductSwitch_Text_Shadow, none)}.fd-product-switch__text:after,.fd-product-switch__text:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title{font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;max-height:2.5rem;line-height:1.25rem;font-size:.875rem;font-size:var(--sapFontHeader6Size, .875rem);color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a);white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title:last-child{margin-bottom:0;margin-right:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;text-overflow:ellipsis}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{width:1rem;left:9.4rem;z-index:3}.fd-product-switch__subtitle{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem;font-size:.75rem;font-size:var(--sapFontSmallSize, .75rem);color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:-moz-fit-content;width:fit-content;max-height:calc(100vh - 76px);overflow-y:auto;padding:1.5rem .5rem 1rem 1rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem)}.fd-product-switch__body:after,.fd-product-switch__body:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body--col-3 .fd-product-switch__list{width:35.25rem}.fd-product-switch__body--mobile{padding:0;width:100%;max-width:100vw;overflow-x:hidden}.fd-product-switch__body--mobile .fd-product-switch__list{display:flex;flex-direction:column;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;max-width:100%;max-height:5rem;padding:1rem;text-align:left;border-radius:0;border:none;border-bottom:.0625rem solid;flex:auto;border-bottom-color:#d9d9d9;border-bottom-color:var(--sapList_GroupHeaderBorderColor, #d9d9d9)}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{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:#fff;background-color:var(--sapTile_Background, #fff)}.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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:#0854a0;border-bottom-color:var(--sapList_SelectionBorderColor, #0854a0);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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.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:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.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:flex;flex-direction:column;justify-content:space-between;height:100%}.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-bottom:0;margin-right:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon[class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-right:0;margin-left:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{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){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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: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{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem}.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;width:2rem;text-align:right;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{z-index:3;display:none}.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:#fff;color:var(--sapList_Active_TextColor, #fff)}.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}\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% - 0.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)}\n"], directives: [{ type: i2$1.DndListDirective, selector: "[fd-dnd-list]", inputs: ["gridMode", "replaceMode", "items", "draggable"], outputs: ["itemsChange", "itemDropped"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.DndItemDirective, selector: "[fd-dnd-item]", inputs: ["applyDragItemClass", "containerSelector", "stickInPlace", "draggable", "classWhenElementDragged"], outputs: ["moved", "released", "started"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
175
|
+
ProductSwitchBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ProductSwitchBodyComponent, 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 <li\n fd-dnd-item\n *ngFor=\"let product of products\"\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 <i\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [class]=\"product.icon ? 'sap-icon--' + product.icon : ''\"\n ></i>\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n <div *ngIf=\"product.subtitle\" class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n </div>\n </li>\n </ul>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.drag-placeholder{position:absolute;opacity:.3}/*!\n.fd-product-switch\n*/.fd-product-switch{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0}.fd-product-switch:after,.fd-product-switch:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);justify-content:center}.fd-product-switch .fd-button.fd-product-switch__control:after,.fd-product-switch .fd-button.fd-product-switch__control:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control:before{margin-right:0}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]:before{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control.is-hover,.fd-product-switch .fd-button.fd-product-switch__control:hover{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);background-color:#283848;background-color:var(--sapShell_Hover_Background, #283848)}.fd-product-switch .fd-button.fd-product-switch__control.is-hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover[aria-disabled=true],.fd-product-switch .fd-button.fd-product-switch__control:hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover[aria-disabled=true]{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:disabled,.fd-product-switch .fd-button.fd-product-switch__control[aria-disabled=true]{opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-active,.fd-product-switch .fd-button.fd-product-switch__control.is-pressed,.fd-product-switch .fd-button.fd-product-switch__control.is-selected,.fd-product-switch .fd-button.fd-product-switch__control:active,.fd-product-switch .fd-button.fd-product-switch__control[aria-pressed=true],.fd-product-switch .fd-button.fd-product-switch__control[aria-selected=true]{color:#fff;color:var(--sapShell_Active_TextColor, #fff);background-color:#23303e;background-color:var(--sapShell_Active_Background, #23303e)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus,.fd-product-switch .fd-button.fd-product-switch__control:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus.fd-product-switch--toggled,.fd-product-switch .fd-button.fd-product-switch__control:focus.fd-product-switch--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch__list{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;flex-wrap:wrap;width:47rem}.fd-product-switch__list:after,.fd-product-switch__list:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:column;align-items:center;text-align:center;height:7rem;max-width:11.25rem;flex:1 0 25%;padding:.5rem;margin-right:.5rem;margin-bottom:.5rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);box-shadow:none;box-shadow:var(--fdProductSwitch_Shadow, none)}.fd-product-switch__item:after,.fd-product-switch__item:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5);border:none;border:var(--fdProductSwitch_Border, none);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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0);border:none;border:var(--fdProductSwitch_Border, none)}.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__subtitle,.fd-product-switch__item:active .fd-product-switch__title,.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:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon]{color:#fff;color:var(--sapList_Active_TextColor, #fff)}.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:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.selected{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa);border:.125rem solid #0854a0;border:.125rem solid var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected:hover{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-product-switch__item.dragged{background-color:#fff;background-color:var(--sapList_Background, #fff);cursor:grabbing;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:#fff;background-color:var(--sapList_Background, #fff)}.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:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__item.dragged.selected{border:none;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:0}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;font-size:1.5rem;margin-bottom:.5rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:3rem;min-height:3rem;display:flex;justify-content:center;align-items:center}.fd-product-switch__text{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:100%;overflow:hidden;max-height:2.5rem;text-shadow:none;text-shadow:var(--fdProductSwitch_Text_Shadow, none)}.fd-product-switch__text:after,.fd-product-switch__text:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title{font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;max-height:2.5rem;line-height:1.25rem;font-size:.875rem;font-size:var(--sapFontHeader6Size, .875rem);color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a);white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title:last-child{margin-bottom:0;margin-right:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;text-overflow:ellipsis}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{width:1rem;left:9.4rem;z-index:3}.fd-product-switch__subtitle{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem;font-size:.75rem;font-size:var(--sapFontSmallSize, .75rem);color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:-moz-fit-content;width:fit-content;max-height:calc(100vh - 76px);overflow-y:auto;padding:1.5rem .5rem 1rem 1rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem)}.fd-product-switch__body:after,.fd-product-switch__body:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body--col-3 .fd-product-switch__list{width:35.25rem}.fd-product-switch__body--mobile{padding:0;width:100%;max-width:100vw;overflow-x:hidden}.fd-product-switch__body--mobile .fd-product-switch__list{display:flex;flex-direction:column;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;max-width:100%;max-height:5rem;padding:1rem;text-align:left;border-radius:0;border:none;border-bottom:.0625rem solid;flex:auto;border-bottom-color:#d9d9d9;border-bottom-color:var(--sapList_GroupHeaderBorderColor, #d9d9d9)}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{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:#fff;background-color:var(--sapTile_Background, #fff)}.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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:#0854a0;border-bottom-color:var(--sapList_SelectionBorderColor, #0854a0);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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.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:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.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:flex;flex-direction:column;justify-content:space-between;height:100%}.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-bottom:0;margin-right:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon[class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-right:0;margin-left:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{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){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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: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{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem}.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;width:2rem;text-align:right;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{z-index:3;display:none}.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:#fff;color:var(--sapList_Active_TextColor, #fff)}.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}\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)}\n"], directives: [{ type: i2$1.DndListDirective, selector: "[fd-dnd-list]", inputs: ["gridMode", "replaceMode", "items", "draggable"], outputs: ["itemsChange", "itemDropped"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.DndItemDirective, selector: "[fd-dnd-item]", inputs: ["applyDragItemClass", "containerSelector", "stickInPlace", "draggable", "classWhenElementDragged"], outputs: ["moved", "released", "started"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
176
176
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ProductSwitchBodyComponent, decorators: [{
|
|
177
177
|
type: Component,
|
|
178
|
-
args: [{ selector: 'fd-product-switch-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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 <li\n fd-dnd-item\n *ngFor=\"let product of products\"\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 <i\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [class]=\"product.icon ? 'sap-icon--' + product.icon : ''\"\n ></i>\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n <div *ngIf=\"product.subtitle\" class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n </div>\n </li>\n </ul>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.drag-placeholder{position:absolute;opacity:.3}/*!\n.fd-product-switch\n*/.fd-product-switch{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0}.fd-product-switch:after,.fd-product-switch:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);justify-content:center}.fd-product-switch .fd-button.fd-product-switch__control:after,.fd-product-switch .fd-button.fd-product-switch__control:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control:before{margin-right:0}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]:before{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control.is-hover,.fd-product-switch .fd-button.fd-product-switch__control:hover{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);background-color:#283848;background-color:var(--sapShell_Hover_Background, #283848)}.fd-product-switch .fd-button.fd-product-switch__control.is-hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover[aria-disabled=true],.fd-product-switch .fd-button.fd-product-switch__control:hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover[aria-disabled=true]{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:disabled,.fd-product-switch .fd-button.fd-product-switch__control[aria-disabled=true]{opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-active,.fd-product-switch .fd-button.fd-product-switch__control.is-pressed,.fd-product-switch .fd-button.fd-product-switch__control.is-selected,.fd-product-switch .fd-button.fd-product-switch__control:active,.fd-product-switch .fd-button.fd-product-switch__control[aria-pressed=true],.fd-product-switch .fd-button.fd-product-switch__control[aria-selected=true]{color:#fff;color:var(--sapShell_Active_TextColor, #fff);background-color:#23303e;background-color:var(--sapShell_Active_Background, #23303e)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus,.fd-product-switch .fd-button.fd-product-switch__control:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus.fd-product-switch--toggled,.fd-product-switch .fd-button.fd-product-switch__control:focus.fd-product-switch--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch__list{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;flex-wrap:wrap;width:47rem}.fd-product-switch__list:after,.fd-product-switch__list:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:column;align-items:center;text-align:center;height:7rem;max-width:11.25rem;flex:1 0 25%;padding:.5rem;margin-right:.5rem;margin-bottom:.5rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);box-shadow:none;box-shadow:var(--fdProductSwitch_Shadow, none)}.fd-product-switch__item:after,.fd-product-switch__item:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5);border:none;border:var(--fdProductSwitch_Border, none);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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0);border:none;border:var(--fdProductSwitch_Border, none)}.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__subtitle,.fd-product-switch__item:active .fd-product-switch__title,.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:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon]{color:#fff;color:var(--sapList_Active_TextColor, #fff)}.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:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.selected{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa);border:.125rem solid #0854a0;border:.125rem solid var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected:hover{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-product-switch__item.dragged{background-color:#fff;background-color:var(--sapList_Background, #fff);cursor:grabbing;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:#fff;background-color:var(--sapList_Background, #fff)}.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:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__item.dragged.selected{border:none;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:0}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;font-size:1.5rem;margin-bottom:.5rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:3rem;min-height:3rem;display:flex;justify-content:center;align-items:center}.fd-product-switch__text{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:100%;overflow:hidden;max-height:2.5rem;text-shadow:none;text-shadow:var(--fdProductSwitch_Text_Shadow, none)}.fd-product-switch__text:after,.fd-product-switch__text:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title{font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;max-height:2.5rem;line-height:1.25rem;font-size:.875rem;font-size:var(--sapFontHeader6Size, .875rem);color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a);white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title:last-child{margin-bottom:0;margin-right:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;text-overflow:ellipsis}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{width:1rem;left:9.4rem;z-index:3}.fd-product-switch__subtitle{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem;font-size:.75rem;font-size:var(--sapFontSmallSize, .75rem);color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:-moz-fit-content;width:fit-content;max-height:calc(100vh - 76px);overflow-y:auto;padding:1.5rem .5rem 1rem 1rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem)}.fd-product-switch__body:after,.fd-product-switch__body:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body--col-3 .fd-product-switch__list{width:35.25rem}.fd-product-switch__body--mobile{padding:0;width:100%;max-width:100vw;overflow-x:hidden}.fd-product-switch__body--mobile .fd-product-switch__list{display:flex;flex-direction:column;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;max-width:100%;max-height:5rem;padding:1rem;text-align:left;border-radius:0;border:none;border-bottom:.0625rem solid;flex:auto;border-bottom-color:#d9d9d9;border-bottom-color:var(--sapList_GroupHeaderBorderColor, #d9d9d9)}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{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:#fff;background-color:var(--sapTile_Background, #fff)}.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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:#0854a0;border-bottom-color:var(--sapList_SelectionBorderColor, #0854a0);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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.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:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.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:flex;flex-direction:column;justify-content:space-between;height:100%}.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-bottom:0;margin-right:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon[class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-right:0;margin-left:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{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){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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: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{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem}.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;width:2rem;text-align:right;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{z-index:3;display:none}.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:#fff;color:var(--sapList_Active_TextColor, #fff)}.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}\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% - 0.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)}\n"] }]
|
|
178
|
+
args: [{ selector: 'fd-product-switch-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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 <li\n fd-dnd-item\n *ngFor=\"let product of products\"\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 <i\n role=\"presentation\"\n class=\"fd-product-switch__icon\"\n [class]=\"product.icon ? 'sap-icon--' + product.icon : ''\"\n ></i>\n <div class=\"fd-product-switch__text\">\n <div class=\"fd-product-switch__title\">{{ product.title }}</div>\n <div *ngIf=\"product.subtitle\" class=\"fd-product-switch__subtitle\">{{ product.subtitle }}</div>\n </div>\n </li>\n </ul>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.drag-placeholder{position:absolute;opacity:.3}/*!\n.fd-product-switch\n*/.fd-product-switch{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0}.fd-product-switch:after,.fd-product-switch:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);justify-content:center}.fd-product-switch .fd-button.fd-product-switch__control:after,.fd-product-switch .fd-button.fd-product-switch__control:before{box-sizing:inherit;font-size:inherit}.fd-product-switch .fd-button.fd-product-switch__control:before{margin-right:0}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control>[class*=sap-icon]:before{color:inherit}.fd-product-switch .fd-button.fd-product-switch__control.is-hover,.fd-product-switch .fd-button.fd-product-switch__control:hover{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);background-color:#283848;background-color:var(--sapShell_Hover_Background, #283848)}.fd-product-switch .fd-button.fd-product-switch__control.is-hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control.is-hover[aria-disabled=true],.fd-product-switch .fd-button.fd-product-switch__control:hover.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover:disabled,.fd-product-switch .fd-button.fd-product-switch__control:hover[aria-disabled=true]{color:#d1e8ff;color:var(--sapShell_InteractiveTextColor, #d1e8ff);opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-disabled,.fd-product-switch .fd-button.fd-product-switch__control:disabled,.fd-product-switch .fd-button.fd-product-switch__control[aria-disabled=true]{opacity:.4%}.fd-product-switch .fd-button.fd-product-switch__control.is-active,.fd-product-switch .fd-button.fd-product-switch__control.is-pressed,.fd-product-switch .fd-button.fd-product-switch__control.is-selected,.fd-product-switch .fd-button.fd-product-switch__control:active,.fd-product-switch .fd-button.fd-product-switch__control[aria-pressed=true],.fd-product-switch .fd-button.fd-product-switch__control[aria-selected=true]{color:#fff;color:var(--sapShell_Active_TextColor, #fff);background-color:#23303e;background-color:var(--sapShell_Active_Background, #23303e)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus,.fd-product-switch .fd-button.fd-product-switch__control:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch .fd-button.fd-product-switch__control.is-focus.fd-product-switch--toggled,.fd-product-switch .fd-button.fd-product-switch__control:focus.fd-product-switch--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-product-switch__list{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;flex-wrap:wrap;width:47rem}.fd-product-switch__list:after,.fd-product-switch__list:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:column;align-items:center;text-align:center;height:7rem;max-width:11.25rem;flex:1 0 25%;padding:.5rem;margin-right:.5rem;margin-bottom:.5rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);box-shadow:none;box-shadow:var(--fdProductSwitch_Shadow, none)}.fd-product-switch__item:after,.fd-product-switch__item:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__item .fd-product-switch__title:not(:last-child){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fd-product-switch__item .fd-product-switch__title:after,.fd-product-switch__item .fd-product-switch__title:before{background-color:#fff;background-color:var(--sapList_Background, #fff)}.fd-product-switch__item.is-hover,.fd-product-switch__item:hover{background-color:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5);border:none;border:var(--fdProductSwitch_Border, none);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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.fd-product-switch__item.is-active,.fd-product-switch__item:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0);border:none;border:var(--fdProductSwitch_Border, none)}.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__subtitle,.fd-product-switch__item:active .fd-product-switch__title,.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:active .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__item:active .fd-product-switch__icon[class*=sap-icon]{color:#fff;color:var(--sapList_Active_TextColor, #fff)}.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:active .fd-product-switch__title:after,.fd-product-switch__item:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.selected{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa);border:.125rem solid #0854a0;border:.125rem solid var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__item.selected .fd-product-switch__title:after,.fd-product-switch__item.selected .fd-product-switch__title:before{background-color:#e5f0fa;background-color:var(--sapList_SelectionBackgroundColor, #e5f0fa)}.fd-product-switch__item.selected.is-hover,.fd-product-switch__item.selected:hover{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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__title:after,.fd-product-switch__item.selected:hover .fd-product-switch__title:before{background-color:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.fd-product-switch__item.selected.is-active,.fd-product-switch__item.selected:active{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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__title:after,.fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__item.is-focus,.fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-product-switch__item.dragged{background-color:#fff;background-color:var(--sapList_Background, #fff);cursor:grabbing;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged:active,.fd-product-switch__item.dragged:hover{background-color:#fff;background-color:var(--sapList_Background, #fff)}.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:#0854a0;color:var(--sapContent_IconColor, #0854a0)}.fd-product-switch__item.dragged:active .fd-product-switch__title,.fd-product-switch__item.dragged:hover .fd-product-switch__title{color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a)}.fd-product-switch__item.dragged:active .fd-product-switch__subtitle,.fd-product-switch__item.dragged:hover .fd-product-switch__subtitle{color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__item.dragged.selected{border:none;box-shadow:0 0 0 .0625rem #0000006b,0 .625rem 1.875rem #0000004d;box-shadow:var(--sapContent_Shadow2, 0 0 0 .0625rem rgba(0, 0, 0, .42), 0 .625rem 1.875rem 0 rgba(0, 0, 0, .3))}.fd-product-switch__item.dragged.is-hover,.fd-product-switch__item.dragged:hover{outline:0}.fd-product-switch__icon [class*=sap-icon],.fd-product-switch__icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;font-size:1.5rem;margin-bottom:.5rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:3rem;min-height:3rem;display:flex;justify-content:center;align-items:center}.fd-product-switch__text{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:100%;overflow:hidden;max-height:2.5rem;text-shadow:none;text-shadow:var(--fdProductSwitch_Text_Shadow, none)}.fd-product-switch__text:after,.fd-product-switch__text:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title{font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;max-height:2.5rem;line-height:1.25rem;font-size:.875rem;font-size:var(--sapFontHeader6Size, .875rem);color:#32363a;color:var(--sapGroup_TitleTextColor, #32363a);white-space:normal;z-index:1}.fd-product-switch__title:after,.fd-product-switch__title:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__title:last-child{margin-bottom:0;margin-right:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;text-overflow:ellipsis}.fd-product-switch__title:before{left:9.4rem;width:1rem;z-index:2}.fd-product-switch__title:after{width:1rem;left:9.4rem;z-index:3}.fd-product-switch__subtitle{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem;font-size:.75rem;font-size:var(--sapFontSmallSize, .75rem);color:#6a6d70;color:var(--sapContent_LabelColor, #6a6d70)}.fd-product-switch__subtitle:after,.fd-product-switch__subtitle:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:-moz-fit-content;width:fit-content;max-height:calc(100vh - 76px);overflow-y:auto;padding:1.5rem .5rem 1rem 1rem;background-color:#fff;background-color:var(--sapList_Background, #fff);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem)}.fd-product-switch__body:after,.fd-product-switch__body:before{box-sizing:inherit;font-size:inherit}.fd-product-switch__body--col-3 .fd-product-switch__list{width:35.25rem}.fd-product-switch__body--mobile{padding:0;width:100%;max-width:100vw;overflow-x:hidden}.fd-product-switch__body--mobile .fd-product-switch__list{display:flex;flex-direction:column;width:100%}.fd-product-switch__body--mobile .fd-product-switch__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;max-width:100%;max-height:5rem;padding:1rem;text-align:left;border-radius:0;border:none;border-bottom:.0625rem solid;flex:auto;border-bottom-color:#d9d9d9;border-bottom-color:var(--sapList_GroupHeaderBorderColor, #d9d9d9)}.fd-product-switch__body--mobile .fd-product-switch__item:after,.fd-product-switch__body--mobile .fd-product-switch__item:before{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:#fff;background-color:var(--sapTile_Background, #fff)}.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:#f5f5f5;background-color:var(--sapList_Hover_Background, #f5f5f5)}.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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.selected{border-bottom-color:#0854a0;border-bottom-color:var(--sapList_SelectionBorderColor, #0854a0);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:#0854a0;background-color:var(--sapList_SelectionBorderColor, #0854a0)}.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:#d8e9f8;background-color:var(--sapList_Hover_SelectionBackground, #d8e9f8)}.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:active .fd-product-switch__title:after,.fd-product-switch__body--mobile .fd-product-switch__item.selected:active .fd-product-switch__title:before{background-color:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.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.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:#0854a0;background-color:var(--sapList_Active_Background, #0854a0)}.fd-product-switch__body--mobile .fd-product-switch__item.is-focus,.fd-product-switch__body--mobile .fd-product-switch__item:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.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:flex;flex-direction:column;justify-content:space-between;height:100%}.fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-bottom:0;margin-right:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon [class*=sap-icon],.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__icon[class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon [class*=sap-icon],[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__icon[class*=sap-icon]{margin-right:0;margin-left:.75rem}.fd-product-switch__body--mobile[dir=rtl] .fd-product-switch__text,[dir=rtl] .fd-product-switch__body--mobile .fd-product-switch__text{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){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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: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{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25rem}.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;width:2rem;text-align:right;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{z-index:3;display:none}.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:#fff;color:var(--sapList_Active_TextColor, #fff)}.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}\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)}\n"] }]
|
|
179
179
|
}], ctorParameters: function () { return [{ type: i1$1.ViewportRuler }, { type: i2$1.RtlService, decorators: [{
|
|
180
180
|
type: Optional
|
|
181
181
|
}] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { dragAndDropEnabled: [{
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fundamental-ngx/core/product-switch",
|
|
3
|
-
"version": "0.33.
|
|
3
|
+
"version": "0.33.3-rc.3",
|
|
4
4
|
"peerDependencies": {
|
|
5
|
-
"@angular/common": "
|
|
6
|
-
"@angular/core": "
|
|
5
|
+
"@angular/common": "^13,.0.0",
|
|
6
|
+
"@angular/core": "^13,.0.0"
|
|
7
7
|
},
|
|
8
8
|
"dependencies": {
|
|
9
9
|
"tslib": "^2.0.0"
|
package/quick-view/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fundamental-ngx/core/quick-view",
|
|
3
|
-
"version": "0.33.
|
|
3
|
+
"version": "0.33.3-rc.3",
|
|
4
4
|
"peerDependencies": {
|
|
5
|
-
"@angular/common": "
|
|
6
|
-
"@angular/core": "
|
|
5
|
+
"@angular/common": "^13,.0.0",
|
|
6
|
+
"@angular/core": "^13,.0.0"
|
|
7
7
|
},
|
|
8
8
|
"dependencies": {
|
|
9
9
|
"tslib": "^2.0.0"
|
package/radio/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fundamental-ngx/core/radio",
|
|
3
|
-
"version": "0.33.
|
|
3
|
+
"version": "0.33.3-rc.3",
|
|
4
4
|
"peerDependencies": {
|
|
5
|
-
"@angular/common": "
|
|
6
|
-
"@angular/core": "
|
|
5
|
+
"@angular/common": "^13,.0.0",
|
|
6
|
+
"@angular/core": "^13,.0.0"
|
|
7
7
|
},
|
|
8
8
|
"dependencies": {
|
|
9
9
|
"tslib": "^2.0.0"
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fundamental-ngx/core/rating-indicator",
|
|
3
|
-
"version": "0.33.
|
|
3
|
+
"version": "0.33.3-rc.3",
|
|
4
4
|
"peerDependencies": {
|
|
5
|
-
"@angular/common": "
|
|
6
|
-
"@angular/core": "
|
|
5
|
+
"@angular/common": "^13,.0.0",
|
|
6
|
+
"@angular/core": "^13,.0.0"
|
|
7
7
|
},
|
|
8
8
|
"dependencies": {
|
|
9
9
|
"tslib": "^2.0.0"
|
|
@@ -551,10 +551,10 @@ export class ResizableCardItemComponent {
|
|
|
551
551
|
}
|
|
552
552
|
}
|
|
553
553
|
ResizableCardItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ResizableCardItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.RtlService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
554
|
-
ResizableCardItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ResizableCardItemComponent, selector: "fd-resizable-card-item", inputs: { config: "config", itemId: "itemId", title: "title", rank: "rank", cardWidthColSpan: "cardWidthColSpan", cardHeightRowSpan: "cardHeightRowSpan", cardMiniHeaderRowSpan: "cardMiniHeaderRowSpan", cardMiniContentRowSpan: "cardMiniContentRowSpan", resizable: "resizable", left: "left", right: "right", top: "top" }, outputs: { resizing: "resizing", resized: "resized", miniHeaderReached: "miniHeaderReached", miniContentReached: "miniContentReached" }, host: { listeners: { "window:mousemove": "onMouseMove($event)", "document: mouseup": "onMouseUp($event)" }, properties: { "style.left.px": "this.left", "style.right.px": "this.right", "style.top.px": "this.top", "style.z-index": "this.zIndex", "style.position": "this.position", "class.fd-resizable-card-layout__draw-transition": "this.reDrawAnimation" } }, ngImport: i0, template: "<div\n class=\"fd-resizable-card-layout__item\"\n [class.fd-resizable-card-layout__indication-border]=\"showBorder\"\n #resizeCard\n>\n <div\n class=\"fd-resizable-card-layout__item--border-display fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"cardWidth\"\n [style.height.px]=\"cardHeight\"\n (mouseenter)=\"showResizeIcon()\"\n (mouseleave)=\"hideResizeIcon()\"\n >\n <div class=\"fd-resizable-card-layout__card\">\n <ng-content></ng-content>\n\n <ng-container *ngIf=\"showingResizeIcon\">\n <div class=\"fd-resizable-card-layout__icon-wrapper\">\n <div\n class=\"fd-resizable-card-layout__icon\"\n #cornerHandle\n (mousedown)=\"onMouseDown($event, 'both')\"\n ></div>\n </div>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"resizable\">\n <ng-container *ngTemplateOutlet=\"verticalHandleTemplate\"></ng-container>\n <ng-container *ngTemplateOutlet=\"horizontalHandleTemplate\"></ng-container>\n </ng-container>\n </div>\n\n <div\n class=\"fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"resizeIndicationBorderWidth\"\n [style.height.px]=\"cardHeight\"\n ></div>\n</div>\n\n<ng-template #verticalHandleTemplate>\n <div\n #verticalHandle\n class=\"fd-resizable-card-layout__resize--vertical\"\n (mousedown)=\"onMouseDown($event, 'horizontal')\"\n ></div>\n</ng-template>\n\n<ng-template #horizontalHandleTemplate>\n <div\n #horizontalHandle\n class=\"fd-resizable-card-layout__resize--horizontal\"\n (mousedown)=\"onMouseDown($event, 'vertical')\"\n ></div>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% -
|
|
554
|
+
ResizableCardItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ResizableCardItemComponent, selector: "fd-resizable-card-item", inputs: { config: "config", itemId: "itemId", title: "title", rank: "rank", cardWidthColSpan: "cardWidthColSpan", cardHeightRowSpan: "cardHeightRowSpan", cardMiniHeaderRowSpan: "cardMiniHeaderRowSpan", cardMiniContentRowSpan: "cardMiniContentRowSpan", resizable: "resizable", left: "left", right: "right", top: "top" }, outputs: { resizing: "resizing", resized: "resized", miniHeaderReached: "miniHeaderReached", miniContentReached: "miniContentReached" }, host: { listeners: { "window:mousemove": "onMouseMove($event)", "document: mouseup": "onMouseUp($event)" }, properties: { "style.left.px": "this.left", "style.right.px": "this.right", "style.top.px": "this.top", "style.z-index": "this.zIndex", "style.position": "this.position", "class.fd-resizable-card-layout__draw-transition": "this.reDrawAnimation" } }, ngImport: i0, template: "<div\n class=\"fd-resizable-card-layout__item\"\n [class.fd-resizable-card-layout__indication-border]=\"showBorder\"\n #resizeCard\n>\n <div\n class=\"fd-resizable-card-layout__item--border-display fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"cardWidth\"\n [style.height.px]=\"cardHeight\"\n (mouseenter)=\"showResizeIcon()\"\n (mouseleave)=\"hideResizeIcon()\"\n >\n <div class=\"fd-resizable-card-layout__card\">\n <ng-content></ng-content>\n\n <ng-container *ngIf=\"showingResizeIcon\">\n <div class=\"fd-resizable-card-layout__icon-wrapper\">\n <div\n class=\"fd-resizable-card-layout__icon\"\n #cornerHandle\n (mousedown)=\"onMouseDown($event, 'both')\"\n ></div>\n </div>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"resizable\">\n <ng-container *ngTemplateOutlet=\"verticalHandleTemplate\"></ng-container>\n <ng-container *ngTemplateOutlet=\"horizontalHandleTemplate\"></ng-container>\n </ng-container>\n </div>\n\n <div\n class=\"fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"resizeIndicationBorderWidth\"\n [style.height.px]=\"cardHeight\"\n ></div>\n</div>\n\n<ng-template #verticalHandleTemplate>\n <div\n #verticalHandle\n class=\"fd-resizable-card-layout__resize--vertical\"\n (mousedown)=\"onMouseDown($event, 'horizontal')\"\n ></div>\n</ng-template>\n\n<ng-template #horizontalHandleTemplate>\n <div\n #horizontalHandle\n class=\"fd-resizable-card-layout__resize--horizontal\"\n (mousedown)=\"onMouseDown($event, 'vertical')\"\n ></div>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% - .0625rem)}.fd-resizable-card-layout__card:after,.fd-resizable-card-layout__card:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:1rem;height:1rem;position:absolute;bottom:0;right:0;z-index:2;padding:0 .0625rem .0625rem 0}.fd-resizable-card-layout__icon-wrapper:after,.fd-resizable-card-layout__icon-wrapper:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon-wrapper{right:auto;left:0;padding:0 0 .0625rem .0625rem}.fd-resizable-card-layout__icon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;font-family:SAP-icons;font-size:1rem;line-height:1rem;cursor:nwse-resize;position:absolute;bottom:0;right:.0625rem;color:#0854a0;color:var(--sapButton_IconColor, #0854a0);z-index:2}.fd-resizable-card-layout__icon:after,.fd-resizable-card-layout__icon:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon:before{font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none;text-rendering:optimizeLegibility}.fd-resizable-card-layout__icon:before{content:\"\\e24f\"}.fd-resizable-card-layout__icon[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon{transform:rotate(90deg);position:relative;cursor:nesw-resize;padding:0 .0625rem .0625rem .5rem}.fd-resizable-card-layout__icon--vertical,.fd-resizable-card-layout__icon--vertical[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--vertical{cursor:ns-resize}.fd-resizable-card-layout__icon--horizontal,.fd-resizable-card-layout__icon--horizontal[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--horizontal{cursor:ew-resize}.fd-resizable-card-layout__resize--vertical{order:2;z-index:2;width:.0625rem;cursor:ew-resize}.fd-resizable-card-layout__resize--vertical::content{content:\"\";position:absolute}.fd-resizable-card-layout__resize--horizontal{z-index:2;width:calc(100% - .5rem);height:.0625rem;position:absolute;bottom:0;cursor:ns-resize}.fd-resizable-card-layout__indication-border{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;border:.125rem dashed #0854a0;border:.125rem dashed var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-resizable-card-layout__indication-border:after,.fd-resizable-card-layout__indication-border:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout--sm{padding-left:.5rem;padding-right:.5rem}.fd-resizable-card-layout--md,.fd-resizable-card-layout--lg{padding-left:1rem;padding-right:1rem}.fd-resizable-card-layout--xl{padding-left:3rem;padding-right:3rem}.fd-resizable-card-layout__item--resize-transition{transition-duration:.25s;animation-timing-function:ease-in-out}.fd-resizable-card-layout__draw-transition{transition-duration:.5s;animation-timing-function:ease-in}.fd-resizable-card-layout__item--border-display{display:flex}\n"], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
555
555
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ResizableCardItemComponent, decorators: [{
|
|
556
556
|
type: Component,
|
|
557
|
-
args: [{ selector: 'fd-resizable-card-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"fd-resizable-card-layout__item\"\n [class.fd-resizable-card-layout__indication-border]=\"showBorder\"\n #resizeCard\n>\n <div\n class=\"fd-resizable-card-layout__item--border-display fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"cardWidth\"\n [style.height.px]=\"cardHeight\"\n (mouseenter)=\"showResizeIcon()\"\n (mouseleave)=\"hideResizeIcon()\"\n >\n <div class=\"fd-resizable-card-layout__card\">\n <ng-content></ng-content>\n\n <ng-container *ngIf=\"showingResizeIcon\">\n <div class=\"fd-resizable-card-layout__icon-wrapper\">\n <div\n class=\"fd-resizable-card-layout__icon\"\n #cornerHandle\n (mousedown)=\"onMouseDown($event, 'both')\"\n ></div>\n </div>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"resizable\">\n <ng-container *ngTemplateOutlet=\"verticalHandleTemplate\"></ng-container>\n <ng-container *ngTemplateOutlet=\"horizontalHandleTemplate\"></ng-container>\n </ng-container>\n </div>\n\n <div\n class=\"fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"resizeIndicationBorderWidth\"\n [style.height.px]=\"cardHeight\"\n ></div>\n</div>\n\n<ng-template #verticalHandleTemplate>\n <div\n #verticalHandle\n class=\"fd-resizable-card-layout__resize--vertical\"\n (mousedown)=\"onMouseDown($event, 'horizontal')\"\n ></div>\n</ng-template>\n\n<ng-template #horizontalHandleTemplate>\n <div\n #horizontalHandle\n class=\"fd-resizable-card-layout__resize--horizontal\"\n (mousedown)=\"onMouseDown($event, 'vertical')\"\n ></div>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% -
|
|
557
|
+
args: [{ selector: 'fd-resizable-card-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"fd-resizable-card-layout__item\"\n [class.fd-resizable-card-layout__indication-border]=\"showBorder\"\n #resizeCard\n>\n <div\n class=\"fd-resizable-card-layout__item--border-display fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"cardWidth\"\n [style.height.px]=\"cardHeight\"\n (mouseenter)=\"showResizeIcon()\"\n (mouseleave)=\"hideResizeIcon()\"\n >\n <div class=\"fd-resizable-card-layout__card\">\n <ng-content></ng-content>\n\n <ng-container *ngIf=\"showingResizeIcon\">\n <div class=\"fd-resizable-card-layout__icon-wrapper\">\n <div\n class=\"fd-resizable-card-layout__icon\"\n #cornerHandle\n (mousedown)=\"onMouseDown($event, 'both')\"\n ></div>\n </div>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"resizable\">\n <ng-container *ngTemplateOutlet=\"verticalHandleTemplate\"></ng-container>\n <ng-container *ngTemplateOutlet=\"horizontalHandleTemplate\"></ng-container>\n </ng-container>\n </div>\n\n <div\n class=\"fd-resizable-card-layout__item--resize-transition\"\n [style.width.px]=\"resizeIndicationBorderWidth\"\n [style.height.px]=\"cardHeight\"\n ></div>\n</div>\n\n<ng-template #verticalHandleTemplate>\n <div\n #verticalHandle\n class=\"fd-resizable-card-layout__resize--vertical\"\n (mousedown)=\"onMouseDown($event, 'horizontal')\"\n ></div>\n</ng-template>\n\n<ng-template #horizontalHandleTemplate>\n <div\n #horizontalHandle\n class=\"fd-resizable-card-layout__resize--horizontal\"\n (mousedown)=\"onMouseDown($event, 'vertical')\"\n ></div>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% - .0625rem)}.fd-resizable-card-layout__card:after,.fd-resizable-card-layout__card:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:1rem;height:1rem;position:absolute;bottom:0;right:0;z-index:2;padding:0 .0625rem .0625rem 0}.fd-resizable-card-layout__icon-wrapper:after,.fd-resizable-card-layout__icon-wrapper:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon-wrapper{right:auto;left:0;padding:0 0 .0625rem .0625rem}.fd-resizable-card-layout__icon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;font-family:SAP-icons;font-size:1rem;line-height:1rem;cursor:nwse-resize;position:absolute;bottom:0;right:.0625rem;color:#0854a0;color:var(--sapButton_IconColor, #0854a0);z-index:2}.fd-resizable-card-layout__icon:after,.fd-resizable-card-layout__icon:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon:before{font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none;text-rendering:optimizeLegibility}.fd-resizable-card-layout__icon:before{content:\"\\e24f\"}.fd-resizable-card-layout__icon[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon{transform:rotate(90deg);position:relative;cursor:nesw-resize;padding:0 .0625rem .0625rem .5rem}.fd-resizable-card-layout__icon--vertical,.fd-resizable-card-layout__icon--vertical[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--vertical{cursor:ns-resize}.fd-resizable-card-layout__icon--horizontal,.fd-resizable-card-layout__icon--horizontal[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--horizontal{cursor:ew-resize}.fd-resizable-card-layout__resize--vertical{order:2;z-index:2;width:.0625rem;cursor:ew-resize}.fd-resizable-card-layout__resize--vertical::content{content:\"\";position:absolute}.fd-resizable-card-layout__resize--horizontal{z-index:2;width:calc(100% - .5rem);height:.0625rem;position:absolute;bottom:0;cursor:ns-resize}.fd-resizable-card-layout__indication-border{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;border:.125rem dashed #0854a0;border:.125rem dashed var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-resizable-card-layout__indication-border:after,.fd-resizable-card-layout__indication-border:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout--sm{padding-left:.5rem;padding-right:.5rem}.fd-resizable-card-layout--md,.fd-resizable-card-layout--lg{padding-left:1rem;padding-right:1rem}.fd-resizable-card-layout--xl{padding-left:3rem;padding-right:3rem}.fd-resizable-card-layout__item--resize-transition{transition-duration:.25s;animation-timing-function:ease-in-out}.fd-resizable-card-layout__draw-transition{transition-duration:.5s;animation-timing-function:ease-in}.fd-resizable-card-layout__item--border-display{display:flex}\n"] }]
|
|
558
558
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1.RtlService, decorators: [{
|
|
559
559
|
type: Optional
|
|
560
560
|
}] }]; }, propDecorators: { config: [{
|
package/resizable-card-layout/esm2020/resizable-card-layout/resizable-card-layout.component.mjs
CHANGED
|
@@ -494,10 +494,10 @@ export class ResizableCardLayoutComponent {
|
|
|
494
494
|
}
|
|
495
495
|
}
|
|
496
496
|
ResizableCardLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ResizableCardLayoutComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.RtlService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
497
|
-
ResizableCardLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ResizableCardLayoutComponent, selector: "fd-resizable-card-layout", inputs: { layoutConfig: "layoutConfig" }, outputs: { stepChange: "stepChange", resizing: "resizing", resized: "resized", miniHeaderReached: "miniHeaderReached", miniContentReached: "miniContentReached", layoutChange: "layoutChange" }, host: { listeners: { "keydown": "handleKeydown($event)", "window:resize": "onResize()" } }, queries: [{ propertyName: "resizeCardItems", predicate: ResizableCardItemComponent }], ngImport: i0, template: "<div\n #layout\n class=\"fd-resizable-card-layout\"\n [class]=\"'fd-resizable-card-layout--' + layoutSize\"\n [style.width.px]=\"layoutWidth\"\n [style.height.px]=\"layoutHeight\"\n>\n <ng-content></ng-content>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% -
|
|
497
|
+
ResizableCardLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ResizableCardLayoutComponent, selector: "fd-resizable-card-layout", inputs: { layoutConfig: "layoutConfig" }, outputs: { stepChange: "stepChange", resizing: "resizing", resized: "resized", miniHeaderReached: "miniHeaderReached", miniContentReached: "miniContentReached", layoutChange: "layoutChange" }, host: { listeners: { "keydown": "handleKeydown($event)", "window:resize": "onResize()" } }, queries: [{ propertyName: "resizeCardItems", predicate: ResizableCardItemComponent }], ngImport: i0, template: "<div\n #layout\n class=\"fd-resizable-card-layout\"\n [class]=\"'fd-resizable-card-layout--' + layoutSize\"\n [style.width.px]=\"layoutWidth\"\n [style.height.px]=\"layoutHeight\"\n>\n <ng-content></ng-content>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% - .0625rem)}.fd-resizable-card-layout__card:after,.fd-resizable-card-layout__card:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:1rem;height:1rem;position:absolute;bottom:0;right:0;z-index:2;padding:0 .0625rem .0625rem 0}.fd-resizable-card-layout__icon-wrapper:after,.fd-resizable-card-layout__icon-wrapper:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon-wrapper{right:auto;left:0;padding:0 0 .0625rem .0625rem}.fd-resizable-card-layout__icon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;font-family:SAP-icons;font-size:1rem;line-height:1rem;cursor:nwse-resize;position:absolute;bottom:0;right:.0625rem;color:#0854a0;color:var(--sapButton_IconColor, #0854a0);z-index:2}.fd-resizable-card-layout__icon:after,.fd-resizable-card-layout__icon:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon:before{font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none;text-rendering:optimizeLegibility}.fd-resizable-card-layout__icon:before{content:\"\\e24f\"}.fd-resizable-card-layout__icon[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon{transform:rotate(90deg);position:relative;cursor:nesw-resize;padding:0 .0625rem .0625rem .5rem}.fd-resizable-card-layout__icon--vertical,.fd-resizable-card-layout__icon--vertical[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--vertical{cursor:ns-resize}.fd-resizable-card-layout__icon--horizontal,.fd-resizable-card-layout__icon--horizontal[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--horizontal{cursor:ew-resize}.fd-resizable-card-layout__resize--vertical{order:2;z-index:2;width:.0625rem;cursor:ew-resize}.fd-resizable-card-layout__resize--vertical::content{content:\"\";position:absolute}.fd-resizable-card-layout__resize--horizontal{z-index:2;width:calc(100% - .5rem);height:.0625rem;position:absolute;bottom:0;cursor:ns-resize}.fd-resizable-card-layout__indication-border{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;border:.125rem dashed #0854a0;border:.125rem dashed var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-resizable-card-layout__indication-border:after,.fd-resizable-card-layout__indication-border:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout--sm{padding-left:.5rem;padding-right:.5rem}.fd-resizable-card-layout--md,.fd-resizable-card-layout--lg{padding-left:1rem;padding-right:1rem}.fd-resizable-card-layout--xl{padding-left:3rem;padding-right:3rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
498
498
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ResizableCardLayoutComponent, decorators: [{
|
|
499
499
|
type: Component,
|
|
500
|
-
args: [{ selector: 'fd-resizable-card-layout', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n #layout\n class=\"fd-resizable-card-layout\"\n [class]=\"'fd-resizable-card-layout--' + layoutSize\"\n [style.width.px]=\"layoutWidth\"\n [style.height.px]=\"layoutHeight\"\n>\n <ng-content></ng-content>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% -
|
|
500
|
+
args: [{ selector: 'fd-resizable-card-layout', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n #layout\n class=\"fd-resizable-card-layout\"\n [class]=\"'fd-resizable-card-layout--' + layoutSize\"\n [style.width.px]=\"layoutWidth\"\n [style.height.px]=\"layoutHeight\"\n>\n <ng-content></ng-content>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-resizable-card-layout{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;padding-left:.5rem;padding-right:.5rem;margin-top:1rem;position:relative}.fd-resizable-card-layout:after,.fd-resizable-card-layout:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__item{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-direction:row;min-width:20rem;position:relative}.fd-resizable-card-layout__item:after,.fd-resizable-card-layout__item:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__card{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;order:1;flex:1;position:relative;height:calc(100% - .0625rem)}.fd-resizable-card-layout__card:after,.fd-resizable-card-layout__card:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;width:1rem;height:1rem;position:absolute;bottom:0;right:0;z-index:2;padding:0 .0625rem .0625rem 0}.fd-resizable-card-layout__icon-wrapper:after,.fd-resizable-card-layout__icon-wrapper:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon-wrapper[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon-wrapper{right:auto;left:0;padding:0 0 .0625rem .0625rem}.fd-resizable-card-layout__icon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;font-family:SAP-icons;font-size:1rem;line-height:1rem;cursor:nwse-resize;position:absolute;bottom:0;right:.0625rem;color:#0854a0;color:var(--sapButton_IconColor, #0854a0);z-index:2}.fd-resizable-card-layout__icon:after,.fd-resizable-card-layout__icon:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout__icon:before{font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none;text-rendering:optimizeLegibility}.fd-resizable-card-layout__icon:before{content:\"\\e24f\"}.fd-resizable-card-layout__icon[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon{transform:rotate(90deg);position:relative;cursor:nesw-resize;padding:0 .0625rem .0625rem .5rem}.fd-resizable-card-layout__icon--vertical,.fd-resizable-card-layout__icon--vertical[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--vertical{cursor:ns-resize}.fd-resizable-card-layout__icon--horizontal,.fd-resizable-card-layout__icon--horizontal[dir=rtl],[dir=rtl] .fd-resizable-card-layout__icon--horizontal{cursor:ew-resize}.fd-resizable-card-layout__resize--vertical{order:2;z-index:2;width:.0625rem;cursor:ew-resize}.fd-resizable-card-layout__resize--vertical::content{content:\"\";position:absolute}.fd-resizable-card-layout__resize--horizontal{z-index:2;width:calc(100% - .5rem);height:.0625rem;position:absolute;bottom:0;cursor:ns-resize}.fd-resizable-card-layout__indication-border{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;border:.125rem dashed #0854a0;border:.125rem dashed var(--sapContent_DragAndDropActiveColor, #0854a0)}.fd-resizable-card-layout__indication-border:after,.fd-resizable-card-layout__indication-border:before{box-sizing:inherit;font-size:inherit}.fd-resizable-card-layout--sm{padding-left:.5rem;padding-right:.5rem}.fd-resizable-card-layout--md,.fd-resizable-card-layout--lg{padding-left:1rem;padding-right:1rem}.fd-resizable-card-layout--xl{padding-left:3rem;padding-right:3rem}\n"] }]
|
|
501
501
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1.RtlService, decorators: [{
|
|
502
502
|
type: Optional
|
|
503
503
|
}] }]; }, propDecorators: { layoutConfig: [{
|