@verisoft/ui-govcz 21.0.3 → 21.0.5

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.
@@ -0,0 +1,3 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-box" viewBox="0 0 16 16">
2
+ <path d="M8.186 1.113a.5.5 0 0 0-.372 0L1.846 3.5 8 5.961 14.154 3.5zM15 4.239l-6.5 2.6v7.922l6.5-2.6V4.24zM7.5 14.762V6.838L1 4.239v7.923zM7.443.184a1.5 1.5 0 0 1 1.114 0l7.129 2.852A.5.5 0 0 1 16 3.5v8.662a1 1 0 0 1-.629.928l-7.185 2.874a.5.5 0 0 1-.372 0L.63 13.09a1 1 0 0 1-.63-.928V3.5a.5.5 0 0 1 .314-.464z"/>
3
+ </svg>
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, Pipe, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, EventEmitter, Output, Input, inject, Optional, Self, input, SimpleChange, Injectable, ChangeDetectorRef, Injector, ViewContainerRef, ViewChild, HostListener, ViewEncapsulation, NO_ERRORS_SCHEMA, output, ContentChild, ContentChildren, NgModule, Inject, signal, Directive, forwardRef, InjectionToken } from '@angular/core';
2
+ import { Component, Pipe, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, EventEmitter, Output, Input, inject, Optional, Self, input, SimpleChange, Injectable, ChangeDetectorRef, Injector, ViewContainerRef, ViewChild, ElementRef, HostListener, ViewEncapsulation, NO_ERRORS_SCHEMA, output, ContentChild, ContentChildren, NgModule, Inject, signal, Directive, forwardRef, InjectionToken } from '@angular/core';
3
3
  import * as i1 from '@angular/router';
4
4
  import { RouterModule, Router, ActivatedRoute, NavigationEnd, RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router';
5
5
  import * as i2 from '@gov-design-system-ce/angular';
@@ -61,7 +61,8 @@ const Icons = {
61
61
  file: 'file',
62
62
  folder: 'folder',
63
63
  arrowCounterclockwise: 'arrow-counterclockwise',
64
- eye: 'eye'
64
+ eye: 'eye',
65
+ box: 'box',
65
66
  };
66
67
 
67
68
  class BreadcrumbComponent extends BreadcrumbCoreComponent {
@@ -638,6 +639,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
638
639
  class ConfirmDialogComponent extends UnsubscribeComponent {
639
640
  dialogService = inject(DialogService);
640
641
  cdr = inject(ChangeDetectorRef);
642
+ cancelButton;
643
+ confirmButton;
641
644
  visible = false;
642
645
  closable = false;
643
646
  data = { severity: 'primary', headerIcon: 'info-circle' };
@@ -648,6 +651,9 @@ class ConfirmDialogComponent extends UnsubscribeComponent {
648
651
  this.data = x;
649
652
  this.visible = true;
650
653
  this.cdr.detectChanges();
654
+ setTimeout(() => {
655
+ this.setInitialFocus();
656
+ }, 100);
651
657
  });
652
658
  this.dialogService.closeEvent
653
659
  .pipe(takeUntil(this.destroyed$))
@@ -657,6 +663,18 @@ class ConfirmDialogComponent extends UnsubscribeComponent {
657
663
  this.cdr.detectChanges();
658
664
  });
659
665
  }
666
+ setInitialFocus() {
667
+ if (this.data.showCancelButton && this.cancelButton?.nativeElement) {
668
+ const buttonElement = this.cancelButton.nativeElement.querySelector('button')
669
+ || this.cancelButton.nativeElement;
670
+ buttonElement.focus();
671
+ }
672
+ else if (this.confirmButton?.nativeElement) {
673
+ const buttonElement = this.confirmButton.nativeElement.querySelector('button')
674
+ || this.confirmButton.nativeElement;
675
+ buttonElement.focus();
676
+ }
677
+ }
660
678
  onKeyDown(event) {
661
679
  if (!this.visible)
662
680
  return;
@@ -683,7 +701,7 @@ class ConfirmDialogComponent extends UnsubscribeComponent {
683
701
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ConfirmDialogComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
684
702
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ConfirmDialogComponent, isStandalone: true, selector: "v-confirm-dialog", host: { listeners: { "document:keydown": "onKeyDown($event)" }, properties: { "attr.tabindex": "visible ? \"0\" : null" } }, providers: [
685
703
  { provide: CONFIRM_DIALOG_COMPONENT_TOKEN, useExisting: ConfirmDialogComponent },
686
- ], usesInheritance: true, ngImport: i0, template: "<gov-dialog\n [open]=\"visible\"\n [attr.block-close]=\"data.closable !== undefined ? !data.closable : false\"\n [attr.block-backdrop-close]=\"data.closable !== undefined ? !data.closable : false\" \n [style.--dialog-max-width]=\"data.width\"\n [style.--dialog-max-height]=\"data.height\"\n role=\"dialog\"\n accessible-close-label=\"Close dialog box with more information\"\n (gov-close)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n>\n <gov-icon\n type=\"components\"\n [name]=\"data.headerIcon\"\n slot=\"icon\"\n [color]=\"data.severity | govColor\"\n />\n \n <h2 slot=\"title\">{{ data.title ?? 'Title' }}</h2>\n\n @if (data && data.innerHTML) {\n <div [innerHTML]=\"data.innerHTML\"></div>\n } @else if (data.componentType) {\n <v-dynamic-component\n [componentType]=\"data.componentType\"\n [data]=\"$any(data.data)\"\n ></v-dynamic-component>\n }\n\n <gov-button\n color=\"primary\"\n size=\"m\"\n type=\"solid\"\n slot=\"footer\"\n (gov-click)=\"data.confirmButtonFn ? dialogClick(true) : (visible = false)\"\n >\n {{ data.confirmButtonText ?? 'Yes'}}\n </gov-button>\n \n <gov-button\n [ngClass]=\"!data.showCancelButton ? 'd-none' : ''\"\n color=\"primary\"\n size=\"m\"\n type=\"outlined\"\n slot=\"footer\"\n [disabled]=\"!data.showCancelButton\"\n (gov-click)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n >\n {{ data.cancelButtonText ?? 'No' }}\n </gov-button>\n</gov-dialog>\n", styles: [":host ::ng-deep dialog{max-width:var(--dialog-max-width, 95%);max-height:var(--dialog-max-height, 95%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: GovDesignSystemModule }, { kind: "component", type: i2.GovButton, selector: "gov-button", inputs: ["color", "disabled", "download", "expanded", "expandedMobile", "focusable", "href", "hreflang", "identifier", "loading", "name", "nativeType", "referrerpolicy", "rel", "size", "target", "type"] }, { kind: "component", type: i2.GovDialog, selector: "gov-dialog", inputs: ["accessibleCloseLabel", "accessibleCloseLabelledBy", "accessibleDescribedBy", "accessibleLabelledBy", "blockBackdropClose", "blockClose", "labelTag", "open", "role"] }, { kind: "component", type: i2.GovIcon, selector: "gov-icon", inputs: ["color", "name", "size", "type"] }, { kind: "component", type: DynamicComponent, selector: "v-dynamic-component", inputs: ["componentType", "data"] }, { kind: "pipe", type: GovColorPipe, name: "govColor" }] });
704
+ ], viewQueries: [{ propertyName: "cancelButton", first: true, predicate: ["cancelButton"], descendants: true, read: ElementRef }, { propertyName: "confirmButton", first: true, predicate: ["confirmButton"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<gov-dialog\n [open]=\"visible\"\n [attr.block-close]=\"data.closable !== undefined ? !data.closable : false\"\n [attr.block-backdrop-close]=\"data.closable !== undefined ? !data.closable : false\" \n [style.--dialog-max-width]=\"data.width\"\n [style.--dialog-max-height]=\"data.height\"\n role=\"dialog\"\n accessible-close-label=\"Close dialog box with more information\"\n (gov-close)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n>\n <gov-icon\n type=\"components\"\n [name]=\"data.headerIcon\"\n slot=\"icon\"\n [color]=\"data.severity | govColor\"\n />\n \n <h2 slot=\"title\">{{ data.title ?? 'Title' }}</h2>\n\n @if (data && data.innerHTML) {\n <div [innerHTML]=\"data.innerHTML\"></div>\n } @else if (data.componentType) {\n <v-dynamic-component\n [componentType]=\"data.componentType\"\n [data]=\"$any(data.data)\"\n ></v-dynamic-component>\n }\n\n <gov-button\n #confirmButton\n color=\"primary\"\n size=\"m\"\n type=\"solid\"\n slot=\"footer\"\n (gov-click)=\"data.confirmButtonFn ? dialogClick(true) : (visible = false)\"\n >\n {{ data.confirmButtonText ?? 'Yes'}}\n </gov-button>\n \n <gov-button\n #cancelButton\n [ngClass]=\"!data.showCancelButton ? 'd-none' : ''\"\n color=\"primary\"\n size=\"m\"\n type=\"outlined\"\n slot=\"footer\"\n [disabled]=\"!data.showCancelButton\"\n (gov-click)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n >\n {{ data.cancelButtonText ?? 'No' }}\n </gov-button>\n</gov-dialog>", styles: [":host ::ng-deep dialog{max-width:var(--dialog-max-width, 95%);max-height:var(--dialog-max-height, 95%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: GovDesignSystemModule }, { kind: "component", type: i2.GovButton, selector: "gov-button", inputs: ["color", "disabled", "download", "expanded", "expandedMobile", "focusable", "href", "hreflang", "identifier", "loading", "name", "nativeType", "referrerpolicy", "rel", "size", "target", "type"] }, { kind: "component", type: i2.GovDialog, selector: "gov-dialog", inputs: ["accessibleCloseLabel", "accessibleCloseLabelledBy", "accessibleDescribedBy", "accessibleLabelledBy", "blockBackdropClose", "blockClose", "labelTag", "open", "role"] }, { kind: "component", type: i2.GovIcon, selector: "gov-icon", inputs: ["color", "name", "size", "type"] }, { kind: "component", type: DynamicComponent, selector: "v-dynamic-component", inputs: ["componentType", "data"] }, { kind: "pipe", type: GovColorPipe, name: "govColor" }] });
687
705
  }
688
706
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
689
707
  type: Component,
@@ -692,8 +710,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
692
710
  ], host: {
693
711
  '(document:keydown)': 'onKeyDown($event)',
694
712
  '[attr.tabindex]': 'visible ? "0" : null',
695
- }, template: "<gov-dialog\n [open]=\"visible\"\n [attr.block-close]=\"data.closable !== undefined ? !data.closable : false\"\n [attr.block-backdrop-close]=\"data.closable !== undefined ? !data.closable : false\" \n [style.--dialog-max-width]=\"data.width\"\n [style.--dialog-max-height]=\"data.height\"\n role=\"dialog\"\n accessible-close-label=\"Close dialog box with more information\"\n (gov-close)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n>\n <gov-icon\n type=\"components\"\n [name]=\"data.headerIcon\"\n slot=\"icon\"\n [color]=\"data.severity | govColor\"\n />\n \n <h2 slot=\"title\">{{ data.title ?? 'Title' }}</h2>\n\n @if (data && data.innerHTML) {\n <div [innerHTML]=\"data.innerHTML\"></div>\n } @else if (data.componentType) {\n <v-dynamic-component\n [componentType]=\"data.componentType\"\n [data]=\"$any(data.data)\"\n ></v-dynamic-component>\n }\n\n <gov-button\n color=\"primary\"\n size=\"m\"\n type=\"solid\"\n slot=\"footer\"\n (gov-click)=\"data.confirmButtonFn ? dialogClick(true) : (visible = false)\"\n >\n {{ data.confirmButtonText ?? 'Yes'}}\n </gov-button>\n \n <gov-button\n [ngClass]=\"!data.showCancelButton ? 'd-none' : ''\"\n color=\"primary\"\n size=\"m\"\n type=\"outlined\"\n slot=\"footer\"\n [disabled]=\"!data.showCancelButton\"\n (gov-click)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n >\n {{ data.cancelButtonText ?? 'No' }}\n </gov-button>\n</gov-dialog>\n", styles: [":host ::ng-deep dialog{max-width:var(--dialog-max-width, 95%);max-height:var(--dialog-max-height, 95%)}\n"] }]
696
- }], propDecorators: { onKeyDown: [{
713
+ }, template: "<gov-dialog\n [open]=\"visible\"\n [attr.block-close]=\"data.closable !== undefined ? !data.closable : false\"\n [attr.block-backdrop-close]=\"data.closable !== undefined ? !data.closable : false\" \n [style.--dialog-max-width]=\"data.width\"\n [style.--dialog-max-height]=\"data.height\"\n role=\"dialog\"\n accessible-close-label=\"Close dialog box with more information\"\n (gov-close)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n>\n <gov-icon\n type=\"components\"\n [name]=\"data.headerIcon\"\n slot=\"icon\"\n [color]=\"data.severity | govColor\"\n />\n \n <h2 slot=\"title\">{{ data.title ?? 'Title' }}</h2>\n\n @if (data && data.innerHTML) {\n <div [innerHTML]=\"data.innerHTML\"></div>\n } @else if (data.componentType) {\n <v-dynamic-component\n [componentType]=\"data.componentType\"\n [data]=\"$any(data.data)\"\n ></v-dynamic-component>\n }\n\n <gov-button\n #confirmButton\n color=\"primary\"\n size=\"m\"\n type=\"solid\"\n slot=\"footer\"\n (gov-click)=\"data.confirmButtonFn ? dialogClick(true) : (visible = false)\"\n >\n {{ data.confirmButtonText ?? 'Yes'}}\n </gov-button>\n \n <gov-button\n #cancelButton\n [ngClass]=\"!data.showCancelButton ? 'd-none' : ''\"\n color=\"primary\"\n size=\"m\"\n type=\"outlined\"\n slot=\"footer\"\n [disabled]=\"!data.showCancelButton\"\n (gov-click)=\"data.cancelButtonFn ? dialogClick(false) : (visible = false)\"\n >\n {{ data.cancelButtonText ?? 'No' }}\n </gov-button>\n</gov-dialog>", styles: [":host ::ng-deep dialog{max-width:var(--dialog-max-width, 95%);max-height:var(--dialog-max-height, 95%)}\n"] }]
714
+ }], propDecorators: { cancelButton: [{
715
+ type: ViewChild,
716
+ args: ['cancelButton', { read: ElementRef }]
717
+ }], confirmButton: [{
718
+ type: ViewChild,
719
+ args: ['confirmButton', { read: ElementRef }]
720
+ }], onKeyDown: [{
697
721
  type: HostListener,
698
722
  args: ['document:keydown', ['$event']]
699
723
  }] } });