@clr/angular 5.4.1 → 5.5.3

package/bundles/clr-angular.umd.js

@@ -1363,7 +1363,8 @@
         singleSelectionAriaLabel: 'Single selection header',
         singleActionableAriaLabel: 'Single actionable header',
         detailExpandableAriaLabel: 'Toggle more row content',
-        datagridFilterAriaLabel: 'Toggle column filter',
+        datagridFilterAriaLabel: 'Filter dialog',
+        datagridFilterDialogAriaLabel: 'Toggle column filter',
         columnSeparatorAriaLabel: 'Column resize handle',
         columnSeparatorDescription: 'Not necessary to use this button',
         // Alert
@@ -3123,11 +3124,19 @@
             if (!this.container) {
                 return;
             }
-            if (invalid && this.displayedContent === false) {
-                this.container.createEmbeddedView(this.template, { error: this.control.getError(this.error) });
-                this.displayedContent = true;
+            if (invalid) {
+                if (this.displayedContent === false) {
+                    this.embeddedViewRef = this.container.createEmbeddedView(this.template, {
+                        error: this.control.getError(this.error),
+                    });
+                    this.displayedContent = true;
+                }
+                else if (this.embeddedViewRef && this.embeddedViewRef.context) {
+                    // if view is already rendered, update the error object to keep it in sync
+                    this.embeddedViewRef.context.error = this.control.getError(this.error);
+                }
             }
-            else if (!invalid) {
+            else {
                 this.container.clear();
                 this.displayedContent = false;
             }
@@ -10764,7 +10773,7 @@
                     selector: 'clr-dg-filter',
                     // We register this component as a CustomFilter, for the parent column to detect it.
                     providers: [{ provide: CustomFilter, useExisting: ClrDatagridFilter }, UNIQUE_ID_PROVIDER],
-                    template: "\n    <button\n      class=\"datagrid-filter-toggle\"\n      type=\"button\"\n      #anchor\n      [attr.aria-label]=\"commonStrings.keys.datagridFilterAriaLabel\"\n      [attr.aria-expanded]=\"ariaExpanded\"\n      [attr.aria-controls]=\"popoverId\"\n      clrPopoverAnchor\n      clrPopoverOpenCloseButton\n      [class.datagrid-filter-open]=\"open\"\n      [class.datagrid-filtered]=\"active\"\n    >\n      <cds-icon\n        [attr.status]=\"active ? 'info' : null\"\n        [attr.shape]=\"active ? 'filter-grid-circle' : 'filter-grid'\"\n        solid\n      ></cds-icon>\n    </button>\n\n    <div\n      class=\"datagrid-filter\"\n      [id]=\"popoverId\"\n      clrFocusTrap\n      *clrPopoverContent=\"open; at: smartPosition; outsideClickToClose: true; scrollToClose: true\"\n    >\n      <div class=\"datagrid-filter-close-wrapper\">\n        <button type=\"button\" class=\"close\" clrPopoverCloseButton>\n          <cds-icon shape=\"window-close\" [attr.title]=\"commonStrings.keys.close\"></cds-icon>\n        </button>\n      </div>\n\n      <ng-content></ng-content>\n    </div>\n  "
+                    template: "\n    <button\n      class=\"datagrid-filter-toggle\"\n      type=\"button\"\n      #anchor\n      [attr.aria-label]=\"commonStrings.keys.datagridFilterAriaLabel\"\n      [attr.aria-expanded]=\"ariaExpanded\"\n      [attr.aria-controls]=\"popoverId\"\n      clrPopoverAnchor\n      clrPopoverOpenCloseButton\n      [class.datagrid-filter-open]=\"open\"\n      [class.datagrid-filtered]=\"active\"\n    >\n      <cds-icon\n        [attr.status]=\"active ? 'info' : null\"\n        [attr.shape]=\"active ? 'filter-grid-circle' : 'filter-grid'\"\n        solid\n      ></cds-icon>\n    </button>\n\n    <div\n      class=\"datagrid-filter\"\n      [id]=\"popoverId\"\n      clrFocusTrap\n      *clrPopoverContent=\"open; at: smartPosition; outsideClickToClose: true; scrollToClose: true\"\n      role=\"dialog\"\n      [attr.aria-label]=\"commonStrings.keys.datagridFilterDialogAriaLabel\"\n    >\n      <div class=\"datagrid-filter-close-wrapper\">\n        <button type=\"button\" class=\"close\" clrPopoverCloseButton>\n          <cds-icon shape=\"window-close\" [attr.title]=\"commonStrings.keys.close\"></cds-icon>\n        </button>\n      </div>\n\n      <ng-content></ng-content>\n    </div>\n  "
                 },] }
     ];
     ClrDatagridFilter.ctorParameters = function () { return [
@@ -12543,6 +12552,12 @@
                     _this.focusOnClose();
                 }
             }), this.signpostIdService.id.subscribe(function (idChange) { return (_this.ariaControl = idChange); }));
+            this.addDefaultAriaLabel(this.el.nativeElement);
+        };
+        ClrSignpostTrigger.prototype.addDefaultAriaLabel = function (el) {
+            if (!el.hasAttribute('aria-label')) {
+                el.setAttribute('aria-label', this.commonStrings.keys.signpostToggle);
+            }
         };
         ClrSignpostTrigger.prototype.focusOnClose = function () {
             if (!i1.isPlatformBrowser(this.platformId)) {
@@ -12572,7 +12587,6 @@
                     selector: '[clrSignpostTrigger]',
                     host: {
                         class: 'signpost-trigger',
-                        '[attr.aria-label]': 'commonStrings.keys.signpostToggle',
                         '[attr.aria-expanded]': 'ariaExpanded',
                         '[attr.aria-controls]': 'ariaControl',
                         '[class.active]': 'isOpen',
@@ -13899,7 +13913,7 @@
                     /**
                      * Reopen updated row or close it
                      */
-                    row ? _this.detailService.open(row.item, row.detailButton) : _this.detailService.close();
+                    row ? _this.detailService.open(row.item, row.detailButton.nativeElement) : _this.detailService.close();
                 }
             }));
         };