@fundamental-ngx/platform 0.63.0-rc.20 → 0.63.0-rc.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/fundamental-ngx-platform-form.mjs +8 -6
- package/fesm2022/fundamental-ngx-platform-form.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-platform-icon-tab-bar.mjs +2 -2
- package/fesm2022/fundamental-ngx-platform-icon-tab-bar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-platform-message-popover.mjs +1 -1
- package/fesm2022/fundamental-ngx-platform-message-popover.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-platform-search-field.mjs +1 -1
- package/fesm2022/fundamental-ngx-platform-search-field.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-platform-table.mjs +1 -1
- package/fesm2022/fundamental-ngx-platform-table.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-platform-variant-management.mjs +1 -1
- package/fesm2022/fundamental-ngx-platform-variant-management.mjs.map +1 -1
- package/package.json +4 -4
- package/schematics/ng-add/index.js +1 -1
- package/types/fundamental-ngx-platform-form.d.ts +2 -0
|
@@ -651,7 +651,7 @@ class IconTabBarPopoverComponent extends IconTabBarPopoverBase {
|
|
|
651
651
|
this._defaultLabel = resolveTranslationSignal('platformIconTabBar.moreButton');
|
|
652
652
|
}
|
|
653
653
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IconTabBarPopoverComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
654
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: IconTabBarPopoverComponent, isStandalone: true, selector: "fdp-icon-tab-bar-popover", inputs: { leftSide: "leftSide", label: "label", showItemLabel: "showItemLabel" }, viewQueries: [{ propertyName: "_tabExtraUIElements", predicate: ["tabItem"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-popover placement=\"bottom-end\" [focusAutoCapture]=\"true\" [focusTrapped]=\"true\" #popover>\n <fd-popover-control>\n <button class=\"fd-icon-tab-bar__overflow\" tabindex=\"-1\">\n <span class=\"fd-icon-tab-bar__overflow-text\">{{ label || _defaultLabel() }}</span>\n <fd-icon glyph=\"slim-arrow-down\" role=\"presentation\"></fd-icon>\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"fd-icon-tab-bar\">\n <ul class=\"fd-list fd-list--navigation fd-list--no-border fd-icon-tab-bar__list\" role=\"list\">\n @for (item of extraTabs; track item.uId; let idx = $index) {\n @if (isSeparators) {\n <li tabindex=\"-1\" class=\"fd-icon-tab-bar__icon-separator\">\n <fd-icon glyph=\"process\"></fd-icon>\n </li>\n }\n <li\n class=\"fd-list__item fd-list__item--link fd-icon-tab-bar__list-item\"\n role=\"listitem\"\n [class.fd-icon-tab-bar__list-item--closable]=\"item.closable\"\n [ngClass]=\"item.cssClasses\"\n tabindex=\"-1\"\n >\n <a\n class=\"fd-list__link fd-icon-tab-bar__list-link\"\n #tabItem\n [attr.data-flatIndex]=\"item.flatIndex\"\n tabindex=\"0\"\n (click)=\"_selectItem(item)\"\n (keydown)=\"_keyDownHandler($event, item, idx)\"\n >\n <span class=\"fd-icon-tab-bar__list-item-icon-container\">\n <span class=\"fd-list__icon fd-icon-tab-bar__list-item-icon\">\n <fd-icon [glyph]=\"item.icon | fdkAsyncOrSync\"></fd-icon>\n </span>\n </span>\n @if (showItemLabel && (item.label | fdkAsyncOrSync)) {\n <span class=\"fd-list__title fd-icon-tab-bar__list-item-title\">{{\n item.label | fdkAsyncOrSync\n }}</span>\n }\n @if (item.badge) {\n <span class=\"fd-icon-tab-bar__badge\"></span>\n }\n @if (item.counter | fdkAsyncOrSync; as itemCounter) {\n <span class=\"fd-list__counter fd-icon-tab-bar__list-item-counter\"\n >({{ itemCounter }})\n </span>\n }\n @if (item.color | fdkAsyncOrSync; as itemColor) {\n <div class=\"screenreader-only\">\n {{ colorAssociations()?.[itemColor] || itemColor }}\n </div>\n }\n </a>\n @if (item.closable) {\n <div class=\"fd-icon-tab-bar__button-container\">\n <button\n fd-button\n tabindex=\"-1\"\n class=\"fd-icon-tab-bar__button\"\n fdType=\"transparent\"\n (click)=\"closeTab.emit(item.uId)\"\n >\n <fd-icon glyph=\"decline\"></fd-icon>\n </button>\n </div>\n }\n </li>\n }\n </ul>\n </fd-popover-body>\n</fd-popover>\n", dependencies: [{ kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["onClose"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "pipe", type: AsyncOrSyncPipe, name: "fdkAsyncOrSync" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
654
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: IconTabBarPopoverComponent, isStandalone: true, selector: "fdp-icon-tab-bar-popover", inputs: { leftSide: "leftSide", label: "label", showItemLabel: "showItemLabel" }, viewQueries: [{ propertyName: "_tabExtraUIElements", predicate: ["tabItem"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-popover placement=\"bottom-end\" [focusAutoCapture]=\"true\" [focusTrapped]=\"true\" #popover>\n <fd-popover-control>\n <button class=\"fd-icon-tab-bar__overflow\" tabindex=\"-1\">\n <span class=\"fd-icon-tab-bar__overflow-text\">{{ label || _defaultLabel() }}</span>\n <fd-icon glyph=\"slim-arrow-down\" role=\"presentation\"></fd-icon>\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"fd-icon-tab-bar\">\n <ul class=\"fd-list fd-list--navigation fd-list--no-border fd-icon-tab-bar__list\" role=\"list\">\n @for (item of extraTabs; track item.uId; let idx = $index) {\n @if (isSeparators) {\n <li tabindex=\"-1\" class=\"fd-icon-tab-bar__icon-separator\">\n <fd-icon glyph=\"process\"></fd-icon>\n </li>\n }\n <li\n class=\"fd-list__item fd-list__item--link fd-icon-tab-bar__list-item\"\n role=\"listitem\"\n [class.fd-icon-tab-bar__list-item--closable]=\"item.closable\"\n [ngClass]=\"item.cssClasses\"\n tabindex=\"-1\"\n >\n <a\n class=\"fd-list__link fd-icon-tab-bar__list-link\"\n #tabItem\n [attr.data-flatIndex]=\"item.flatIndex\"\n tabindex=\"0\"\n (click)=\"_selectItem(item)\"\n (keydown)=\"_keyDownHandler($event, item, idx)\"\n >\n <span class=\"fd-icon-tab-bar__list-item-icon-container\">\n <span class=\"fd-list__icon fd-icon-tab-bar__list-item-icon\">\n <fd-icon [glyph]=\"item.icon | fdkAsyncOrSync\"></fd-icon>\n </span>\n </span>\n @if (showItemLabel && (item.label | fdkAsyncOrSync)) {\n <span class=\"fd-list__title fd-icon-tab-bar__list-item-title\">{{\n item.label | fdkAsyncOrSync\n }}</span>\n }\n @if (item.badge) {\n <span class=\"fd-icon-tab-bar__badge\"></span>\n }\n @if (item.counter | fdkAsyncOrSync; as itemCounter) {\n <span class=\"fd-list__counter fd-icon-tab-bar__list-item-counter\"\n >({{ itemCounter }})\n </span>\n }\n @if (item.color | fdkAsyncOrSync; as itemColor) {\n <div class=\"screenreader-only\">\n {{ colorAssociations()?.[itemColor] || itemColor }}\n </div>\n }\n </a>\n @if (item.closable) {\n <div class=\"fd-icon-tab-bar__button-container\">\n <button\n fd-button\n tabindex=\"-1\"\n class=\"fd-icon-tab-bar__button\"\n fdType=\"transparent\"\n (click)=\"closeTab.emit(item.uId)\"\n >\n <fd-icon glyph=\"decline\"></fd-icon>\n </button>\n </div>\n }\n </li>\n }\n </ul>\n </fd-popover-body>\n</fd-popover>\n", dependencies: [{ kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "bodyRole", "bodyAriaLabelledBy", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["onClose"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "pipe", type: AsyncOrSyncPipe, name: "fdkAsyncOrSync" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
655
655
|
}
|
|
656
656
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IconTabBarPopoverComponent, decorators: [{
|
|
657
657
|
type: Component,
|
|
@@ -1475,7 +1475,7 @@ class TextTypePopoverComponent extends IconTabBarPopoverBase {
|
|
|
1475
1475
|
}, []);
|
|
1476
1476
|
}
|
|
1477
1477
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TextTypePopoverComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1478
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: TextTypePopoverComponent, isStandalone: true, selector: "fdp-text-type-popover", inputs: { multiClick: "multiClick", layoutMode: "layoutMode", isExtraItemsMode: "isExtraItemsMode", parentTab: "parentTab", selectedSubItemUid: "selectedSubItemUid", tabindex: "tabindex" }, outputs: { selectedSubItem: "selectedSubItem", selectedItem: "selectedItem" }, viewQueries: [{ propertyName: "_dropdownTrigger", first: true, predicate: ["dropdownTrigger"], descendants: true, read: ElementRef }, { propertyName: "_tabExtraUIElements", predicate: ["tabItem"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (isExtraItemsMode) {\n <fd-popover placement=\"bottom-end\" [focusAutoCapture]=\"true\" [focusTrapped]=\"true\" #popover>\n <fd-popover-control>\n <button class=\"fd-icon-tab-bar__overflow\" tabindex=\"-1\">\n <span class=\"fd-icon-tab-bar__overflow-text\">{{\n ('platformIconTabBar.moreButton' | fdTranslate)()\n }}</span>\n <fd-icon glyph=\"slim-arrow-down\" role=\"presentation\"></fd-icon>\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"fd-icon-tab-bar\">\n <ul\n fdpIconBarDndList\n class=\"fd-list fd-list--navigation fd-list--no-border fd-icon-tab-bar__list\"\n role=\"list\"\n >\n <ng-template [ngTemplateOutletContext]=\"{ level: 1, items: extraTabs }\" [ngTemplateOutlet]=\"subItem\">\n </ng-template>\n </ul>\n </fd-popover-body>\n </fd-popover>\n}\n@if (multiClick) {\n <a\n #dropdownTrigger\n fdp-icon-tab-bar-text-type-tab-item\n [item]=\"parentTab\"\n [attr.aria-selected]=\"_containsSelected\"\n [colorAssociations]=\"colorAssociations()\"\n [layoutMode]=\"layoutMode\"\n [attr.tabindex]=\"tabindex\"\n (click)=\"selectedItem.emit()\"\n >\n </a>\n}\n@if (!isExtraItemsMode && parentTab && parentTab.subItems?.length) {\n <fd-popover\n [class.fd-icon-tab-bar__popover]=\"multiClick\"\n placement=\"bottom-end\"\n [focusAutoCapture]=\"true\"\n [triggers]=\"_popoverTriggers\"\n [focusTrapped]=\"true\"\n #popover\n >\n <fd-popover-control>\n @if (multiClick) {\n <div class=\"fd-icon-tab-bar__button-container\">\n <button fd-button fdType=\"transparent\" tabindex=\"-1\" class=\"fd-icon-tab-bar__button\">\n <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n </button>\n </div>\n } @else {\n <a\n [attr.aria-selected]=\"_containsSelected\"\n class=\"fd-icon-tab-bar__tab\"\n role=\"tab\"\n [attr.tabindex]=\"tabindex\"\n #dropdownTrigger\n >\n <div class=\"fd-icon-tab-bar__tab-container\">\n <span class=\"fd-icon-tab-bar__tag\">{{ parentTab.label }}</span>\n <span class=\"fd-icon-tab-bar__arrow\">\n <fd-icon glyph=\"slim-arrow-down\" role=\"presentation\"></fd-icon>\n </span>\n @if (parentTab.badge) {\n <span class=\"fd-icon-tab-bar__badge\"></span>\n }\n </div>\n </a>\n }\n </fd-popover-control>\n <fd-popover-body class=\"fd-icon-tab-bar\">\n <ul\n fdpIconBarDndList\n class=\"fd-list fd-list--navigation fd-list--no-border fd-icon-tab-bar__list\"\n role=\"list\"\n >\n <ng-container\n [ngTemplateOutletContext]=\"{ level: 1, items: parentTab.subItems }\"\n [ngTemplateOutlet]=\"subItem\"\n ></ng-container>\n </ul>\n </fd-popover-body>\n </fd-popover>\n}\n<ng-template #subItem let-items=\"items\" let-level=\"level\">\n @for (item of items; track item.uId) {\n <li\n [attr.aria-level]=\"level\"\n class=\"fd-list__item fd-list__item--link fd-icon-tab-bar__list-item\"\n [class.fd-icon-tab-bar__list-item--closable]=\"item.closable\"\n [ngClass]=\"item.cssClasses\"\n fdpIconBarDndItem\n [dndItemData]=\"item\"\n role=\"listitem\"\n tabindex=\"-1\"\n >\n <a\n class=\"fd-list__link fd-icon-tab-bar__list-link\"\n tabindex=\"0\"\n #tabItem\n [attr.data-flatIndex]=\"item.flatIndex\"\n [attr.aria-selected]=\"item.uId === selectedSubItemUid\"\n (click)=\"_selectItem(item)\"\n (keydown)=\"_textPopoverKeyDownHandler($event, item)\"\n >\n <span class=\"fd-list__title fd-icon-tab-bar__list-item-title\">{{ item.label }}</span>\n @if (item.badge) {\n <span class=\"fd-icon-tab-bar__badge\"></span>\n }\n @if (item.counter) {\n <span class=\"fd-list__counter fd-icon-tab-bar__list-item-counter\">({{ item.counter }}) </span>\n }\n @if (item.color) {\n <div class=\"screenreader-only\">\n {{ (colorAssociations() && colorAssociations()?.[item.color]) || item.color }}\n </div>\n }\n </a>\n @if (item.closable) {\n <div class=\"fd-icon-tab-bar__button-container\">\n <button\n fd-button\n tabindex=\"-1\"\n class=\"fd-icon-tab-bar__button\"\n fdType=\"transparent\"\n (click)=\"closeTab.emit(item.uId)\"\n >\n <fd-icon glyph=\"decline\"></fd-icon>\n </button>\n </div>\n }\n </li>\n @if (item.subItems?.length) {\n <ng-container\n [ngTemplateOutletContext]=\"{ level: level + 1, items: item.subItems }\"\n [ngTemplateOutlet]=\"subItem\"\n ></ng-container>\n }\n }\n</ng-template>\n", dependencies: [{ kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["onClose"] }, { kind: "directive", type: IconBarDndListDirective, selector: "[fdpIconBarDndList], [fdp-icon-bar-dnd-list]", inputs: ["dndOrientation", "dndAutoScroll"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconBarDndItemDirective, selector: "[fdpIconBarDndItem], [fdp-icon-bar-dnd-item]", inputs: ["dndItemData", "previewClass", "dndHoveredClass", "dndSeparatorClass"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }, { kind: "component", type: IconTabBarTextTypeTabItemComponent, selector: "[fdp-icon-tab-bar-text-type-tab-item]", inputs: ["item", "layoutMode", "colorAssociations"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1478
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: TextTypePopoverComponent, isStandalone: true, selector: "fdp-text-type-popover", inputs: { multiClick: "multiClick", layoutMode: "layoutMode", isExtraItemsMode: "isExtraItemsMode", parentTab: "parentTab", selectedSubItemUid: "selectedSubItemUid", tabindex: "tabindex" }, outputs: { selectedSubItem: "selectedSubItem", selectedItem: "selectedItem" }, viewQueries: [{ propertyName: "_dropdownTrigger", first: true, predicate: ["dropdownTrigger"], descendants: true, read: ElementRef }, { propertyName: "_tabExtraUIElements", predicate: ["tabItem"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (isExtraItemsMode) {\n <fd-popover placement=\"bottom-end\" [focusAutoCapture]=\"true\" [focusTrapped]=\"true\" #popover>\n <fd-popover-control>\n <button class=\"fd-icon-tab-bar__overflow\" tabindex=\"-1\">\n <span class=\"fd-icon-tab-bar__overflow-text\">{{\n ('platformIconTabBar.moreButton' | fdTranslate)()\n }}</span>\n <fd-icon glyph=\"slim-arrow-down\" role=\"presentation\"></fd-icon>\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"fd-icon-tab-bar\">\n <ul\n fdpIconBarDndList\n class=\"fd-list fd-list--navigation fd-list--no-border fd-icon-tab-bar__list\"\n role=\"list\"\n >\n <ng-template [ngTemplateOutletContext]=\"{ level: 1, items: extraTabs }\" [ngTemplateOutlet]=\"subItem\">\n </ng-template>\n </ul>\n </fd-popover-body>\n </fd-popover>\n}\n@if (multiClick) {\n <a\n #dropdownTrigger\n fdp-icon-tab-bar-text-type-tab-item\n [item]=\"parentTab\"\n [attr.aria-selected]=\"_containsSelected\"\n [colorAssociations]=\"colorAssociations()\"\n [layoutMode]=\"layoutMode\"\n [attr.tabindex]=\"tabindex\"\n (click)=\"selectedItem.emit()\"\n >\n </a>\n}\n@if (!isExtraItemsMode && parentTab && parentTab.subItems?.length) {\n <fd-popover\n [class.fd-icon-tab-bar__popover]=\"multiClick\"\n placement=\"bottom-end\"\n [focusAutoCapture]=\"true\"\n [triggers]=\"_popoverTriggers\"\n [focusTrapped]=\"true\"\n #popover\n >\n <fd-popover-control>\n @if (multiClick) {\n <div class=\"fd-icon-tab-bar__button-container\">\n <button fd-button fdType=\"transparent\" tabindex=\"-1\" class=\"fd-icon-tab-bar__button\">\n <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n </button>\n </div>\n } @else {\n <a\n [attr.aria-selected]=\"_containsSelected\"\n class=\"fd-icon-tab-bar__tab\"\n role=\"tab\"\n [attr.tabindex]=\"tabindex\"\n #dropdownTrigger\n >\n <div class=\"fd-icon-tab-bar__tab-container\">\n <span class=\"fd-icon-tab-bar__tag\">{{ parentTab.label }}</span>\n <span class=\"fd-icon-tab-bar__arrow\">\n <fd-icon glyph=\"slim-arrow-down\" role=\"presentation\"></fd-icon>\n </span>\n @if (parentTab.badge) {\n <span class=\"fd-icon-tab-bar__badge\"></span>\n }\n </div>\n </a>\n }\n </fd-popover-control>\n <fd-popover-body class=\"fd-icon-tab-bar\">\n <ul\n fdpIconBarDndList\n class=\"fd-list fd-list--navigation fd-list--no-border fd-icon-tab-bar__list\"\n role=\"list\"\n >\n <ng-container\n [ngTemplateOutletContext]=\"{ level: 1, items: parentTab.subItems }\"\n [ngTemplateOutlet]=\"subItem\"\n ></ng-container>\n </ul>\n </fd-popover-body>\n </fd-popover>\n}\n<ng-template #subItem let-items=\"items\" let-level=\"level\">\n @for (item of items; track item.uId) {\n <li\n [attr.aria-level]=\"level\"\n class=\"fd-list__item fd-list__item--link fd-icon-tab-bar__list-item\"\n [class.fd-icon-tab-bar__list-item--closable]=\"item.closable\"\n [ngClass]=\"item.cssClasses\"\n fdpIconBarDndItem\n [dndItemData]=\"item\"\n role=\"listitem\"\n tabindex=\"-1\"\n >\n <a\n class=\"fd-list__link fd-icon-tab-bar__list-link\"\n tabindex=\"0\"\n #tabItem\n [attr.data-flatIndex]=\"item.flatIndex\"\n [attr.aria-selected]=\"item.uId === selectedSubItemUid\"\n (click)=\"_selectItem(item)\"\n (keydown)=\"_textPopoverKeyDownHandler($event, item)\"\n >\n <span class=\"fd-list__title fd-icon-tab-bar__list-item-title\">{{ item.label }}</span>\n @if (item.badge) {\n <span class=\"fd-icon-tab-bar__badge\"></span>\n }\n @if (item.counter) {\n <span class=\"fd-list__counter fd-icon-tab-bar__list-item-counter\">({{ item.counter }}) </span>\n }\n @if (item.color) {\n <div class=\"screenreader-only\">\n {{ (colorAssociations() && colorAssociations()?.[item.color]) || item.color }}\n </div>\n }\n </a>\n @if (item.closable) {\n <div class=\"fd-icon-tab-bar__button-container\">\n <button\n fd-button\n tabindex=\"-1\"\n class=\"fd-icon-tab-bar__button\"\n fdType=\"transparent\"\n (click)=\"closeTab.emit(item.uId)\"\n >\n <fd-icon glyph=\"decline\"></fd-icon>\n </button>\n </div>\n }\n </li>\n @if (item.subItems?.length) {\n <ng-container\n [ngTemplateOutletContext]=\"{ level: level + 1, items: item.subItems }\"\n [ngTemplateOutlet]=\"subItem\"\n ></ng-container>\n }\n }\n</ng-template>\n", dependencies: [{ kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "bodyRole", "bodyAriaLabelledBy", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["onClose"] }, { kind: "directive", type: IconBarDndListDirective, selector: "[fdpIconBarDndList], [fdp-icon-bar-dnd-list]", inputs: ["dndOrientation", "dndAutoScroll"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconBarDndItemDirective, selector: "[fdpIconBarDndItem], [fdp-icon-bar-dnd-item]", inputs: ["dndItemData", "previewClass", "dndHoveredClass", "dndSeparatorClass"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }, { kind: "component", type: IconTabBarTextTypeTabItemComponent, selector: "[fdp-icon-tab-bar-text-type-tab-item]", inputs: ["item", "layoutMode", "colorAssociations"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1479
1479
|
}
|
|
1480
1480
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TextTypePopoverComponent, decorators: [{
|
|
1481
1481
|
type: Component,
|