Fix broken Storybook: Change ng-template to ng-container for ngIf and rename icon directive (#4816)

* remove added template for ngIf and rename icon directive

* fix regression in product switcher

* fix text color of bulk delete in org vault

* use ng-container for *ngIf
This commit is contained in:
Jake Fink 2023-02-24 11:19:09 -05:00 committed by GitHub
parent 7317661457
commit 84d211fb56
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 14 additions and 11 deletions

View File

@ -62,11 +62,13 @@
<i class="bwi bwi-fw bwi-undo" aria-hidden="true"></i>
{{ "restoreSelected" | i18n }}
</button>
<button bitMenuItem class="tw-text-danger" (click)="bulkDelete()">
<i class="bwi bwi-fw bwi-trash" aria-hidden="true"></i>
{{
(activeFilter.isDeleted ? "permanentlyDeleteSelected" : "deleteSelected") | i18n
}}
<button bitMenuItem (click)="bulkDelete()">
<span class="tw-text-danger">
<i class="bwi bwi-fw bwi-trash" aria-hidden="true"></i>
{{
(activeFilter.isDeleted ? "permanentlyDeleteSelected" : "deleteSelected") | i18n
}}
</span>
</button>
</ng-container>
</bit-menu>

View File

@ -1,5 +1,5 @@
<bit-simple-dialog>
<i bit-dialog-icon class="bwi tw-text-3xl" [class]="iconClasses" aria-hidden="true"></i>
<i bitDialogIcon class="bwi tw-text-3xl" [class]="iconClasses" aria-hidden="true"></i>
<span bitDialogTitle>{{ title }}</span>

View File

@ -3,9 +3,9 @@
@fadeIn
>
<div class="tw-flex tw-flex-col tw-items-center tw-gap-2 tw-px-4 tw-pt-4 tw-text-center">
<ng-template *ngIf="hasIcon; else elseBlock">
<ng-content select="[bit-dialog-icon]"></ng-content>
</ng-template>
<ng-container *ngIf="hasIcon; else elseBlock">
<ng-content select="[bitDialogIcon]"></ng-content>
</ng-container>
<ng-template #elseBlock>
<i class="bwi bwi-exclamation-triangle tw-text-3xl tw-text-warning" aria-hidden="true"></i>
</ng-template>

View File

@ -2,7 +2,7 @@ import { Component, ContentChild, Directive } from "@angular/core";
import { fadeIn } from "../animations";
@Directive({ selector: "[bit-dialog-icon]" })
@Directive({ selector: "[bitDialogIcon]" })
export class IconDirective {}
@Component({

View File

@ -42,7 +42,7 @@ const TemplateWithIcon: Story<SimpleDialogComponent> = (args: SimpleDialogCompon
props: args,
template: `
<bit-simple-dialog>
<i bit-dialog-icon class="bwi bwi-star tw-text-3xl tw-text-success" aria-hidden="true"></i>
<i bitDialogIcon class="bwi bwi-star tw-text-3xl tw-text-success" aria-hidden="true"></i>
<span bitDialogTitle>Premium Subscription Available</span>
<span bitDialogContent> Message Content</span>
<div bitDialogFooter class="tw-flex tw-flex-row tw-gap-2">

View File

@ -5,6 +5,7 @@
[attr.role]="ariaRole"
[attr.aria-label]="ariaLabel"
cdkTrapFocus
[cdkTrapFocusAutoCapture]="ariaRole === 'dialog'"
>
<ng-content></ng-content>
</div>