@verisoft/ui-govcz 18.5.0 → 18.6.0

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

@@ -1,85 +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 { 
-  BaseFormInputComponent,
-  FieldType,
-  PASSWORD_COMPONENT_TOKEN,
-  PasswordCore,
-  SlotPosition,
-  SlotPositionType,
-  IconPosition,
-  IconPositionType,
-  FieldSize,
-  FieldSizeType,
-  PasswordStrength,
-} from '@verisoft/ui-core';
-import zxcvbn from 'zxcvbn';
-import { Icons } from '../../icons';
-import { GovSizePipe } from '../../pipes';
-import { ErrorComponent } from '../errors';
-
-@Component({
-  selector: 'v-password',
-  standalone: true,
-  imports: [
-    CommonModule,
-    ReactiveFormsModule,
-    GovDesignSystemModule,
-    GovSizePipe,
-    ErrorComponent,
-  ],
-  templateUrl: './password.component.html',
-  styleUrl: './password.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: PASSWORD_COMPONENT_TOKEN,
-      useExisting: PasswordComponent
-    }
-  ],
-})
-
-export class PasswordComponent 
-  extends BaseFormInputComponent
-  implements ControlValueAccessor, PasswordCore 
-{
-  @Input() toggleMask = true;
-  @Input() feedback = false;
-  @Input() labelSlot: SlotPositionType = SlotPosition.top;
-  @Input() requiredStrength: PasswordStrength = PasswordStrength.None;
-  @Input() message!: string;
-  @Input() name! : string;
-  @Input() role! : string;
-  @Input() icon!: string;
-  @Input() iconPos: IconPositionType = IconPosition.right;
-  @Input() size: FieldSizeType | undefined = FieldSize.medium;
-  @Input() messageSlot: SlotPositionType = SlotPosition.bottom;
-
-  icons = Icons;
-  passwordStrength: PasswordStrength = PasswordStrength.None;
-  type = FieldType.password;
-
-  constructor(@Optional() @Self() ngControl: NgControl) {
-    super(ngControl);
-  }
-
-  valueChange(value: string) {
-    if (!value) {
-      this.passwordStrength = 0;
-      return;
-    }
-
-    const result = zxcvbn(value);
-    this.passwordStrength = result.score;
-
-    if (!this.formControl) {
-      return;
-    }
-
-    if (result.score < this.requiredStrength) {
-      this.formControl.setErrors({passwordLowStrength: true}, {emitEvent: false})
-    }
-  }
-}

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

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

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

@@ -1,23 +0,0 @@
-<gov-form-control>
-  <gov-form-radio-group [formControl]="formControl">
-    @if (items) { @for(item of items; track item) {
-    <gov-form-radio
-      [size]="size | govSize"
-      [value]="item.value"
-      [required]="required"
-      [identifier]="item.id"
-      [name]="radioGroupName"
-      [invalid]="ngControl?.errors"
-      [disabled]="formControl.disabled"
-    >
-      <gov-form-label
-        [size]="size | govSize"
-        slot="label"
-      >
-        {{ label }}
-      </gov-form-label>
-    </gov-form-radio>
-    } }
-  </gov-form-radio-group>
-  <v-validation-message [ngControl]="ngControl"></v-validation-message>
-</gov-form-control>

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

@@ -1,58 +0,0 @@
-import { CommonModule } from '@angular/common';
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  Optional,
-  Self,
-} from '@angular/core';
-import {
-  ControlValueAccessor,
-  NgControl,
-  ReactiveFormsModule,
-} from '@angular/forms';
-import { RouterModule } from '@angular/router';
-import { GovDesignSystemModule } from '@gov-design-system-ce/angular';
-import {
-  BaseFormInputComponent,
-  FieldSize,
-  FieldSizeType,
-  RADIOBUTTON_COMPONENT_TOKEN,
-  RadiobuttonCore,
-  RadioButtonItem,
-} from '@verisoft/ui-core';
-import { Icons } from '../../icons';
-import { GovSizePipe } from '../../pipes';
-import { ErrorComponent } from '../errors';
-
-@Component({
-  selector: "v-radiobutton",
-  standalone: true,
-  styleUrl: "./radiobutton.component.scss",
-  templateUrl: './radiobutton.component.html',
-  imports: [
-    CommonModule, GovDesignSystemModule, RouterModule, ReactiveFormsModule, GovSizePipe, ErrorComponent
-  ],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: RADIOBUTTON_COMPONENT_TOKEN,
-      useExisting: RadioButtonComponent,
-    },
-  ],
-})
-
-export class RadioButtonComponent<T>
-  extends BaseFormInputComponent
-  implements ControlValueAccessor, RadiobuttonCore<T>
-{
-  @Input() radioGroupName = Math.random().toString();
-  @Input() items: RadioButtonItem<T>[] = [];
-  @Input() size: FieldSizeType = FieldSize.medium;
-
-  icons = Icons;
-
-  constructor(@Optional() @Self() ngControl: NgControl) {
-    super(ngControl);
-  }
-}

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

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

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

@@ -1,23 +0,0 @@
-<gov-form-control>
-    <gov-form-group>
-        <gov-form-search color="neutral">
-            <gov-form-input 
-                [placeholder]="placeholder"
-                [size]="size | govSize"
-                slot="input"
-                (gov-input)="setValue($event)"
-            />
-            <gov-button
-                [size]="size | govSize"
-                color="primary"
-                type="solid"
-                slot="button"
-                (gov-click)="search()"
-            >
-                <gov-icon
-                    [name]="icons.search"
-                />
-            </gov-button>
-        </gov-form-search>
-    </gov-form-group>
-</gov-form-control>

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

@@ -1,47 +0,0 @@
-import { CommonModule } from '@angular/common';
-import {
-    ChangeDetectionStrategy,
-    Component,
-    EventEmitter,
-    Input,
-    Output,
-} from '@angular/core';
-import { ReactiveFormsModule } from '@angular/forms';
-import { GovDesignSystemModule } from '@gov-design-system-ce/angular';
-import { FieldSizeType, FieldSize } from '@verisoft/ui-core';
-import { Icons } from '../../icons';
-import { GovSizePipe } from '../../pipes';
-
-@Component({
-    selector: 'v-search',
-    standalone: true,
-    imports: [
-    CommonModule,
-    GovDesignSystemModule,
-    GovSizePipe,
-    ReactiveFormsModule,
-],
-    templateUrl: './search.component.html',
-    styleUrl: './search.component.scss',
-    changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class SearchComponent {
-
-    @Input() placeholder!: string;
-
-    @Input() size: FieldSizeType = FieldSize.medium;
-
-    @Output() searchTerm = new EventEmitter<string>();
-
-    value!: string;
-
-    icons = Icons
-
-    setValue(event: any) {
-        this.value = event.detail.value;
-    }
-
-    search() {
-        this.searchTerm.emit(this.value);
-    }
-}

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

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

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

@@ -1,26 +0,0 @@
-<gov-accordion>
-    <gov-accordion-item 
-        [size]="size | govSize"
-        [identifier]="identifier"
-        [open]="open"
-    >
-        @if (icon) {
-            <gov-icon
-                [name]="icons.chevronDown"
-            />
-        } @if (title) {
-            <h2 slot="label">{{ title | translate }}</h2>
-        } @if (badge) {
-            <gov-badge 
-                inverse="true"
-                size="s"
-                [slot]="badgeSlot"
-            >
-                {{ badge }}
-            </gov-badge>
-        } @if (annotation) {
-            <p slot="annotation">{{ annotation | translate }}</p>
-        }
-        <ng-content></ng-content>
-    </gov-accordion-item>
-</gov-accordion>

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

@@ -1,57 +0,0 @@
-import { CommonModule } from '@angular/common';
-import {
-    ChangeDetectionStrategy,
-    Component,
-    Input,
-    NO_ERRORS_SCHEMA,
-} from '@angular/core';
-import { GovDesignSystemModule } from '@gov-design-system-ce/angular';
-import { TranslateModule } from '@ngx-translate/core';
-import {
-    FieldSizeType,
-    FieldSize,
-    SECTION_COMPONENT_TOKEN,
-    SectionCore,
-} from '@verisoft/ui-core';
-import { Icons } from '../../icons';
-import { GovSizePipe } from '../../pipes';
-
-@Component({
-    selector: 'v-section',
-    standalone: true,
-    imports: [
-        CommonModule,
-        GovDesignSystemModule,
-        GovSizePipe,
-        TranslateModule,
-    ],
-    templateUrl: './section.component.html',
-    styleUrl: './section.component.scss',
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    providers: [
-        {
-            provide: SECTION_COMPONENT_TOKEN,
-            useExisting: SectionComponent,
-        },
-    ],
-    schemas: [
-        NO_ERRORS_SCHEMA
-    ],
-})
-export class SectionComponent
-    implements SectionCore
-{
-    @Input() title!: string;
-    @Input() badge!: string;
-    @Input() showContent = false;
-    @Input() backgroundColor!: string;
-    @Input() annotation!: string;
-    @Input() identifier!: string;
-    @Input() icon!: string;
-    @Input() iconType!: string;
-    @Input() size: FieldSizeType = FieldSize.medium;
-    @Input() badgeSlot: 'prefix' | 'sufix' = 'sufix';
-    @Input() open = false;
-
-    icons = Icons;
-}

package/src/lib/components/shared-components/action-button-group/action-button-group.component.html

@@ -1,27 +0,0 @@
-<div
-  class="v-action-button-group align-items-center justify-content-center justify-content-md-end"
->
-  <div class="v-action-button-group__actions d-flex gap-2">
-    @for (action of visibleActions; track action) {
-    <v-action-button
-      [disabled]="action.disabled"
-      [icon]="action.icon"
-      [id]="action.id"
-      [outlined]="action.outlined"
-      [raised]="action.raised"
-      [toolTip]="action.toolTip || action.label"
-      [severity]="action.severity"
-      [size]="action.size"
-      (click)="fireClick(action, $event)"
-    ></v-action-button>
-    } @if (actions.length > visibleActions.length) {
-    <v-button
-      (click)="menu.toggle($event)"
-      [label]="label"
-      [iconPos]="menuIconPos"
-      [icon]="menuIcon"
-    />
-    }
-  </div>
-</div>
-<p-menu #menu [model]="menuItems" [popup]="true" appendTo="body" />

package/src/lib/components/shared-components/action-button-group/action-button-group.component.spec.ts

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

package/src/lib/components/shared-components/action-button-group/action-button-group.component.ts

@@ -1,114 +0,0 @@
-import {
-  AfterContentInit,
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  ContentChildren,
-  Input,
-  QueryList,
-} from '@angular/core';
-import {
-  ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-  ActionButton,
-  ActionButtonGroupCore,
-  IconPositionType,
-  queryListChanged,
-  ScreenSizeService,
-  UnsubscribeComponent,
-} from '@verisoft/ui-core';
-import { MenuItem } from 'primeng/api';
-import { MenuModule } from 'primeng/menu';
-import {
-  combineLatestWith,
-  takeUntil,
-} from 'rxjs';
-import { Icons } from '../../../icons';
-import { ButtonComponent } from '../../button';
-import { ActionButtonComponent } from './components/action-button/action-button.component';
-
-@Component({
-  selector: 'v-action-button-group',
-  standalone: true,
-  imports: [MenuModule, ButtonComponent, ActionButtonComponent],
-  templateUrl: './action-button-group.component.html',
-  styleUrl: './action-button-group.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-      useExisting: ActionButtonGroupComponent,
-    },
-  ],
-})
-export class ActionButtonGroupComponent
-  extends UnsubscribeComponent
-  implements AfterContentInit, ActionButtonGroupCore
-{
-  @ContentChildren(ActionButtonComponent)
-  actions!: QueryList<ActionButtonComponent>;
-
-  @Input() maxItems = 3;
-
-  @Input() maxItemsMobile = 0;
-
-  @Input() items: ActionButton[] = [];
-
-  @Input() menuIconPos: IconPositionType = 'right';
-
-  @Input() menuIcon = Icons.action;
-
-  @Input() label?: string;
-
-  @Input() icon?: string;
-
-  icons = Icons;
-  allItems: ActionButton[] = [];
-  visibleActions: ActionButton[] = [];
-  menuItems: MenuItem[] = [];
-
-  constructor(
-    private readonly changeDetectorRef: ChangeDetectorRef,
-    readonly screenSizeService: ScreenSizeService
-  ) {
-    super();
-  }
-
-  ngAfterContentInit(): void {
-    this.subscribeItemChange();
-  }
-
-  fireClick(item: ActionButton, event: MouseEvent) {
-    event.stopPropagation();
-    item.click.emit();
-  }
-
-  private subscribeItemChange(): void {
-    const screenResize$ = this.screenSizeService.isMobileBlock;
-
-    const actions$ = queryListChanged(this.actions);
-
-    screenResize$
-      .pipe(takeUntil(this.destroyed$), combineLatestWith(actions$))
-      .subscribe(([isMobile, actions]) => {
-        this.computeItems(actions, isMobile);
-      });
-  }
-
-  private computeItems(actions: ActionButton[], isMobile: boolean) {
-    const allItems = [...(this.items ?? []), ...actions];
-    const maxItems = isMobile ? this.maxItemsMobile : this.maxItems;
-    this.visibleActions = allItems.slice(0, maxItems);
-    this.menuItems = allItems.slice(maxItems).map(this.convertToMenuItem);
-    this.changeDetectorRef.detectChanges();
-  }
-
-  private convertToMenuItem(item: ActionButton): MenuItem {
-    return {
-      label: item.label,
-      icon: item.icon,
-      command: () => {
-        item.click.emit();
-      },
-    };
-  }
-}

package/src/lib/components/shared-components/action-button-group/components/action-button/action-button.component.html

@@ -1,11 +0,0 @@
-<v-button
-  [label]="label"
-  [disabled]="disabled"
-  [icon]="icon"
-  [pTooltip]="toolTip"
-  [outlined]="outlined"
-  tooltipPosition="bottom"
-  [size]="size"
-  [severity]="severity"
-  (click)="handleClick($event)"
-></v-button>

package/src/lib/components/shared-components/action-button-group/components/action-button/action-button.component.spec.ts

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

package/src/lib/components/shared-components/action-button-group/components/action-button/action-button.component.ts

@@ -1,71 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  EventEmitter,
-  inject,
-  Input,
-  OnChanges,
-  Output,
-  SimpleChanges,
-} from '@angular/core';
-import {
-  ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-  ActionButton,
-  ActionButtonGroupCore,
-  ControlSeverityType,
-  FieldSizeType,
-} from '@verisoft/ui-core';
-import { TooltipModule } from 'primeng/tooltip';
-import { Observable, Subject } from 'rxjs';
-import { Icons } from '../../../../../icons';
-import { ButtonComponent } from '../../../../button';
-
-@Component({
-  selector: 'v-action-button',
-  standalone: true,
-  imports: [ButtonComponent, TooltipModule],
-  templateUrl: './action-button.component.html',
-  styleUrl: './action-button.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class ActionButtonComponent implements ActionButton, OnChanges {
-  @Input() disabled = false;
-  @Input() toolTip?: string;
-  @Input() id?: string;
-  @Input() icon?: string;
-  @Input() outlined = false;
-  @Input() raised = false;
-  @Input() severity?: ControlSeverityType;
-  @Input() label?: string;
-  @Input() size?: FieldSizeType;
-  // eslint-disable-next-line @angular-eslint/no-output-native
-  @Output() click = new EventEmitter<MouseEvent>();
-
-  icons = Icons
-
-  private propertyChangeSubject = new Subject();
-
-  propertyChanged: Observable<unknown> =
-    this.propertyChangeSubject.asObservable();
-
-  buttonGroup: ActionButtonGroupCore | null = inject<ActionButtonGroupCore>(
-    ACTION_BUTTON_GROUP_COMPONENT_TOKEN,
-    {
-      optional: true,
-    }
-  );
-
-  ngOnChanges(changes: SimpleChanges): void {
-    const isValueChange = Object.keys(changes).some(
-      (x) => !changes[x].firstChange
-    );
-    if (isValueChange) {
-      this.propertyChangeSubject.next(null);
-    }
-  }
-
-  handleClick(event: MouseEvent) {
-    event.stopPropagation();
-    this.click.emit(event);
-  }
-}