@verisoft/ui-govcz 18.6.4 → 18.7.0

package/src/lib/components/breadcrumb/breadcrumb.component.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { BreadcrumbComponent } from './breadcrumb.component';
-
-describe('BreadcrumbComponent', () => {
-  let component: BreadcrumbComponent;
-  let fixture: ComponentFixture<BreadcrumbComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [BreadcrumbComponent],
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(BreadcrumbComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/breadcrumb/breadcrumb.component.ts

@@ -1,30 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { Component } from '@angular/core';
-import { RouterModule } from '@angular/router';
-import { GovDesignSystemModule } from '@gov-design-system-ce/angular';
-import {
-  BREADCRUMB_COMPONENT_TOKEN,
-  BreadcrumbCoreComponent
-} from '@verisoft/ui-core';
-import { Icons } from '../../icons';
-
-@Component({
-  selector: 'v-breadcrumb',
-  standalone: true,
-  imports: [
-    CommonModule,
-    GovDesignSystemModule,
-    RouterModule
-  ],
-  templateUrl: './breadcrumb.component.html',
-  styleUrl: './breadcrumb.component.scss',
-  providers: [
-    {
-      provide: BREADCRUMB_COMPONENT_TOKEN,
-      useExisting: BreadcrumbComponent
-    },
-  ],
-})
-export class BreadcrumbComponent extends BreadcrumbCoreComponent { 
-  icons = Icons;
-}

package/src/lib/components/button/button.component.html

@@ -1,26 +0,0 @@
-<div class="g-button">
-    <a
-        [routerLink]="routerLink ? routerLink : undefined"
-        [queryParams]="queryParams ? queryParams : undefined"
-    >
-        <gov-button
-            [type]="outlined === true ? 'outlined' : type"
-            [color]="severity | govColor"
-            [disabled]="disabled"
-            [size]="size | govSize"
-            [name]="name"
-            [expanded]="expanded"
-            (gov-click)="handleClick($event)"
-            (click)="handleClick($event)"
-        >
-            @if (icon) {
-                <gov-icon 
-                    [name]="icon"
-                    [slot]="iconPos === 'left' ? 'icon-start' : 'icon-end'"
-                />
-            } @if (label) {
-                {{ label | translate }}
-            }
-        </gov-button>
-    </a>
-</div>

package/src/lib/components/button/button.component.ts

@@ -1,72 +0,0 @@
-import {
-    ChangeDetectionStrategy,
-    Component,
-    EventEmitter,
-    Input,
-    Output,
-} from "@angular/core";
-import { Params, RouterModule } from "@angular/router";
-import { GovDesignSystemModule } from "@gov-design-system-ce/angular";
-import { ButtonEvent, GovButtonCustomEvent } from "@gov-design-system-ce/components";
-import { TranslateModule } from "@ngx-translate/core";
-import {
-    BUTTON_COMPONENT_TOKEN,
-    ButtonCore,
-    IconPositionType,
-    IconPosition,
-    FieldSize,
-    FieldSizeType,
-    ControlSeverity,
-    ControlSeverityType,
-    GovButtonType,
-    GovButtonTypeType,
-} from "@verisoft/ui-core";
-import { GovColorPipe, GovSizePipe } from "../../pipes";
-
-@Component({
-    selector: "v-button",
-    standalone: true,
-    styleUrl: "./button.component.scss",
-    templateUrl: './button.component.html',
-    imports: [
-        GovDesignSystemModule, RouterModule, GovSizePipe, GovColorPipe, TranslateModule
-    ],
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    providers: [
-        {
-            provide: BUTTON_COMPONENT_TOKEN,
-            useExisting: ButtonComponent,
-        }
-    ],
-})
-export class ButtonComponent
-    implements ButtonCore
-{
-    @Input() label: string | undefined;
-    @Input() icon: string | undefined;
-    @Input() badge!: string;
-    @Input() iconPos: IconPositionType = IconPosition.left;
-    @Input() disabled = false;
-    @Input() rounded!: boolean;
-    @Input() outlined!: boolean;
-    @Input() raised!: boolean;
-    @Input() routerLink!: any[];
-    @Input() size: FieldSizeType | undefined = FieldSize.medium;
-    @Input() queryParams!: Params;
-    @Input() severity: ControlSeverityType | undefined = ControlSeverity.primary;
-    @Input() type: GovButtonTypeType = GovButtonType.solid;
-    @Input() expanded = false;
-    @Input() name!: string;
-
-    // eslint-disable-next-line @angular-eslint/no-output-native
-    @Output() click = new EventEmitter<any>();
-
-    handleClick(event: GovButtonCustomEvent<ButtonEvent> | MouseEvent) {
-        if (this.disabled) {
-            event.stopPropagation();
-            return;
-        }
-
-        this.click.emit(event);
-    }
-}

package/src/lib/components/button/index.ts

@@ -1 +0,0 @@
-export * from './button.component';

package/src/lib/components/calendar/calendar.component.html

@@ -1,28 +0,0 @@
-<gov-form-control class="mb-3">
-    @if (label) {
-    <gov-form-label [slot]="labelSlot" [size]="size | govSize">
-        {{ label | translate}}
-    </gov-form-label>
-    }
-    <gov-form-group>
-        <gov-form-input
-            [formControl]="formControl"
-            [attr.input-type]="type"
-            [invalid]="ngControl?.errors ? true : false"
-            [size]="size | govSize"
-            [required]="required"
-            [readonly]="readonly"
-            [attr.disabled]="readonly ? 'true' : 'false'"
-            [name]="name"
-        />
-    </gov-form-group>
-    <v-validation-message [ngControl]="ngControl"></v-validation-message>
-    @if (message) {
-    <gov-form-message 
-        [slot]="messageSlot" 
-        color="neutral"
-        >
-        {{ message }}
-    </gov-form-message>
-    }
-</gov-form-control>

package/src/lib/components/calendar/calendar.component.ts

@@ -1,79 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { ChangeDetectionStrategy, Component, Input, Optional, Self } from '@angular/core';
-import { ControlValueAccessor, NgControl, ReactiveFormsModule } from '@angular/forms';
-import { GovDesignSystemModule } from '@gov-design-system-ce/angular';
-import { TranslateModule } from '@ngx-translate/core';
-import {
-  BaseFormInputComponent,
-  CalendarCore,
-  CALENDAR_COMPONENT_TOKEN,
-  FieldType,
-  FieldSizeType,
-  FieldSize,
-  SlotPosition,
-  SlotPositionType,
-} from '@verisoft/ui-core';
-import { Icons } from '../../icons';
-import { GovSizePipe } from '../../pipes';
-import { ErrorComponent } from '../errors';
-
-@Component({
-  selector: 'v-calendar',
-  standalone: true,
-  imports: [
-    CommonModule,
-    ReactiveFormsModule,
-    GovDesignSystemModule,
-    GovSizePipe,
-    ErrorComponent,
-    TranslateModule
-  ],
-  templateUrl: './calendar.component.html',
-  styleUrl: './calendar.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: CALENDAR_COMPONENT_TOKEN,
-      useExisting: CalendarComponent
-    }
-  ],
-})
-
-export class CalendarComponent
-  extends BaseFormInputComponent
-  implements ControlValueAccessor, CalendarCore
-{
-  @Input() icon!: string;
-
-  @Input() floatLabel: string | undefined;
-
-  @Input() maxDate!: Date;
-
-  @Input() minDate!: Date;
-
-  @Input() header!: string;
-
-  @Input() footer!: string;
-
-  @Input() selectionMode: 'single' | 'multiple' | 'range' | undefined;
-
-  @Input() size: FieldSizeType = FieldSize.medium;
-
-  @Input() errorSlot: SlotPositionType = SlotPosition.bottom;
-
-  @Input() labelSlot: SlotPositionType = SlotPosition.top;
-
-  @Input() messageSlot: SlotPositionType = SlotPosition.bottom;
-
-  @Input() message!: string;
-
-  @Input() name!: string;
-
-  type = FieldType.date;
-
-  icons = Icons;
-
-  constructor(@Optional() @Self() ngControl: NgControl) {
-    super(ngControl);
-  }
-}

package/src/lib/components/calendar/index.ts

@@ -1 +0,0 @@
-export * from './calendar.component';

package/src/lib/components/checkbox/checkbox.component.html

@@ -1,23 +0,0 @@
-<gov-form-control class="mt-3">
-    <gov-form-checkbox 
-        [formControl]="formControl"
-        [size]="size | govSize"
-        [value]="value"
-        [required]="required"
-        [attr.disabled]="disabled ? 'true' : 'false'"
-        [identifier]="id"
-        [indeterminate]="indeterminate"
-        [name]="name"
-        [invalid]="ngControl?.errors"
-        [noLabel]="noLabel"
-        [disabled]="disabled"
-    >   
-        <gov-form-label
-            [size]="size"
-            slot="label"
-        >
-            {{ label ?? '' | translate }}
-        </gov-form-label>
-    </gov-form-checkbox>
-    <v-validation-message [ngControl]="ngControl"></v-validation-message>
-</gov-form-control>

package/src/lib/components/checkbox/checkbox.component.ts

@@ -1,62 +0,0 @@
-import { CommonModule } from "@angular/common";
-import {
-    ChangeDetectionStrategy,
-    Component,
-    Optional,
-    Self,
-    Input,
-} from "@angular/core";
-import { ControlValueAccessor, NgControl, ReactiveFormsModule } from "@angular/forms";
-import { RouterModule } from "@angular/router";
-import { GovDesignSystemModule } from "@gov-design-system-ce/angular";
-import { TranslateModule } from "@ngx-translate/core";
-import {
-    BaseFormInputComponent,
-    CHECKBOX_COMPONENT_TOKEN,
-    CheckboxCore,
-    FieldSize,
-    FieldSizeType,
-} from "@verisoft/ui-core";
-import { v4 as uuidv4 } from 'uuid';
-import { Icons } from "../../icons";
-import { GovSizePipe } from "../../pipes";
-import { ErrorComponent } from "../errors";
-
-@Component({
-    selector: "v-checkbox",
-    standalone: true,
-    styleUrl: "./checkbox.component.scss",
-    templateUrl: './checkbox.component.html',
-    imports: [
-        CommonModule,
-        GovDesignSystemModule,
-        RouterModule,
-        ReactiveFormsModule,
-        GovSizePipe,
-        ErrorComponent,
-        TranslateModule
-    ],
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    providers: [{
-        provide: CHECKBOX_COMPONENT_TOKEN,
-        useExisting: CheckboxComponent,
-    }],
-})
-export class CheckboxComponent
-  extends BaseFormInputComponent
-  implements ControlValueAccessor, CheckboxCore
-{
-    @Input() size: FieldSizeType = FieldSize.medium;
-    @Input() value!: string;
-    @Input() name!: string;
-    @Input() indeterminate = false;
-    @Input() noLabel = false;
-    
-    protected readonly icons = Icons;
-
-    constructor(@Optional() @Self() ngControl: NgControl) {
-        super(ngControl);
-    }
-
-    id = uuidv4();
-}

package/src/lib/components/checkbox/index.ts

@@ -1 +0,0 @@
-export * from './checkbox.component';

package/src/lib/components/confirm-dialog/confirm-dialog.component.html

@@ -1,50 +0,0 @@
-<gov-dialog
-    [open]="visible"
-    [attr.block-close]="data.closable !== undefined ? !data.closable : false"
-    [attr.block-backdrop-close]="data.closable !== undefined ? !data.closable : false" 
-    [style.--dialog-max-width]="data.width"
-    [style.--dialog-max-height]="data.height"
-    role="dialog"
-    accessible-close-label="Close dialog box with more information"
-    (gov-close)="data.cancelButtonFn ? dialogClick(false) : (visible = false)"
->
-    <gov-icon
-        type="components"
-        [name]="data.headerIcon"
-        slot="icon"
-        [color]="data.severity | govColor"
-    />
-    
-    <h2 slot="title">{{ data.title ?? 'Title' }}</h2>
-
-    @if (data && data.innerHTML) {
-    <div [innerHTML]="data.innerHTML"></div>
-    } @else if (data.componentType) {
-    <v-dynamic-component
-        [componentType]="data.componentType"
-        [data]="$any(data.data)"
-    ></v-dynamic-component>
-    }
-
-    <gov-button
-        color="primary"
-        size="m"
-        type="solid"
-        slot="footer"
-        (gov-click)="data.confirmButtonFn ? dialogClick(true) : (visible = false)"
-    >
-        {{ data.confirmButtonText ?? 'Yes'}}
-    </gov-button>
-    
-    <gov-button
-        [ngClass]="!data.showCancelButton ? 'd-none' : ''"
-        color="primary"
-        size="m"
-        type="outlined"
-        slot="footer"
-        [disabled]="!data.showCancelButton"
-        (gov-click)="data.cancelButtonFn ? dialogClick(false) : (visible = false)"
-    >
-        {{ data.cancelButtonText ?? 'No' }}
-    </gov-button>
-</gov-dialog>

package/src/lib/components/confirm-dialog/confirm-dialog.component.scss

@@ -1,4 +0,0 @@
-:host ::ng-deep dialog {
-  max-width: var(--dialog-max-width, 95%); // default 52.5rem
-  max-height: var(--dialog-max-height, 95%); // default 100%
-}

package/src/lib/components/confirm-dialog/confirm-dialog.component.ts

@@ -1,80 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
-import { GovDesignSystemModule } from '@gov-design-system-ce/angular';
-import {
-  CONFIRM_DIALOG_COMPONENT_TOKEN,
-  ConfirmDialogCore,
-  DialogData,
-  DialogService,
-  UnsubscribeComponent,
-} from '@verisoft/ui-core';
-import { takeUntil } from 'rxjs';
-import { GovColorPipe } from '../../pipes';
-import { DynamicComponent } from '../shared-components';
-
-@Component({
-  selector: 'v-confirm-dialog',
-  standalone: true,
-  imports: [
-    CommonModule,
-    GovDesignSystemModule,
-    GovColorPipe,
-    DynamicComponent,
-  ],
-  templateUrl: './confirm-dialog.component.html',
-  styleUrl: './confirm-dialog.component.scss',
-  providers: [
-    {
-      provide: CONFIRM_DIALOG_COMPONENT_TOKEN,
-      useExisting: ConfirmDialogComponent,
-    },
-  ],
-})
-export class ConfirmDialogComponent
-  extends UnsubscribeComponent
-  implements OnInit, ConfirmDialogCore
-{
-  constructor(
-    private readonly dialogService: DialogService,
-    private readonly cdr: ChangeDetectorRef
-  ) {
-    super();
-  }
-
-  visible = false;
-  protected closable = false;
-  data: DialogData = { severity: 'primary', headerIcon: 'info-circle' };
-
-  ngOnInit(): void {
-    this.dialogService.showEvent
-      .pipe(takeUntil(this.destroyed$))
-      .subscribe((x: DialogData) => {
-        this.data = x;
-        this.visible = true;
-        this.cdr.detectChanges();
-      });
-
-    this.dialogService.closeEvent
-      .pipe(takeUntil(this.destroyed$))
-      .subscribe(() => {
-        this.data = {};
-        this.visible = false;
-        this.cdr.detectChanges();
-      })
-  }
-
-  protected dialogClick(confirm: boolean) {
-    const { confirmButtonFn, cancelButtonFn } = this.data;
-
-    if (confirm && confirmButtonFn) {
-      confirmButtonFn();
-    }
-
-    if (!confirm && cancelButtonFn) {
-      cancelButtonFn();
-    }
-
-    this.visible = false;
-    this.cdr.detectChanges();
-  }
-}

package/src/lib/components/dropdown/dropdown-item.component.html

@@ -1,8 +0,0 @@
-<li
-    role="option"
-    class="v-dropdown__item"
-    [attr.aria-selected]="item?.selected"
-    [class.is-active]="item?.selected"
->
-    {{item?.label}}
-</li>

package/src/lib/components/dropdown/dropdown-item.component.ts

@@ -1,18 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  ViewEncapsulation,
-} from '@angular/core';
-import { DropDownItemData } from './dropdown.model';
-
-@Component({
-  selector: 'v-dropdown-item',
-  standalone: true,
-  templateUrl: './dropdown-item.component.html',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  encapsulation: ViewEncapsulation.None,
-})
-export class DropdownItemComponent<T> {
-  @Input() item : DropDownItemData<T> | undefined;
-}

package/src/lib/components/dropdown/dropdown.component.html

@@ -1,90 +0,0 @@
-<div
-  class="v-dropdown mb-3"
-  (keydown)="onKeyDown($event)"
->
-  <gov-form-control [disabled]="this.ngControl?.disabled">
-    <gov-form-label
-      [slot]="label"
-      [ngClass]="labelClasses"
-    >
-      <span [ngClass]="labelClasses">
-        {{ label ?? '' | translate }}
-        @if (tooltip) {
-        <v-tooltip [message]="tooltip | translate" />
-        }
-      </span>
-    </gov-form-label>
-    <div
-      class="gov-form-input"
-      [ngStyle]="forceMinWidth ? {'min-width': '16rem'} : {}"
-      [ngClass]="inputClasses"
-    >
-      <div
-        class="element d-flex gov-form-input-child"
-        [ngClass]="labelClasses"
-        (click)="toggleDropdown()"
-      >
-        <div class="v-dropdown__value flex-grow-1 me-1">{{ selectedItem?.label ?? placeholder }}</div>
-        @if (clearable && ngControl?.enabled && selectedItem !== undefined && selectedItem !== null) {
-          <gov-icon
-            [name]="icons.cross"
-            size="m"
-            class="v-dropdown__clear me-1"
-            color="error"
-            (click)="clearSelection($event)"
-          />
-        }
-        @if (loading) {
-        <div class="v-dropdown__loader">
-          <gov-icon [name]="icons.loader" />
-        </div>
-        }
-        <div class="v-dropdown__trigger">
-          <gov-icon [name]="opened ? icons.chevronUp : icons.chevronDown" />
-        </div>
-      </div>
-    </div>
-    <div class="position-relative">
-      @if (opened) {
-      <div class="v-dropdown__container">
-        @if (showFilter) {
-        <div
-          class="v-dropdown__filter"
-          #filterTextField
-          (keydown)="onKeyDown($event)"
-        >
-          <v-textfield
-            placeholder="Search"
-            [formControl]="filterControl"
-            iconPos="right"
-            [icon]="icons.search"
-          />
-        </div>
-        }
-        @if (!dropdownOptions?.length) {
-        <div class="v-dropdown__no-item">No option was found.</div>
-        } @else {
-        <ul
-          role="listbox"
-          class="v-dropdown__list"
-        >
-          <cdk-virtual-scroll-viewport
-            [itemSize]="30"
-            class="v-dropdown__scroll"
-            (scrolledIndexChange)="onScroll($event)"
-          >
-            <v-dropdown-item
-              *cdkVirtualFor="let option of dropdownOptions;"
-              [item]="option"
-              (click)="selectItem(option, true)"
-            >
-            </v-dropdown-item>
-          </cdk-virtual-scroll-viewport>
-        </ul>
-        }
-      </div>
-      }
-    </div>
-    <v-validation-message [ngControl]="ngControl"></v-validation-message>
-  </gov-form-control>
-</div>