@onemrvapublic/design-system 1.0.0-beta.4 → 1.0.0-develop.1

package/mat-table-of-content/src/onemrva-mat-table-of-content.directive.ts

@@ -1,67 +0,0 @@
-import {
-  OnInit,
-  Directive,
-  Input,
-  HostBinding,
-  AfterViewInit,
-  ChangeDetectorRef,
-} from '@angular/core';
-import { OnemrvaMatTableOfContentService } from './onemrva-mat-table-of-content.service';
-import { OnemrvaMatTocAnchor } from './onemrva-mat-toc-anchor.model';
-import { TranslateService } from '@ngx-translate/core';
-
-/**
- * For accessibility purpose, aria-label and will be displayed
- */
-
-@Directive({
-  selector: '[onemrvaMatToc]',
-  standalone: true,
-})
-export class OnemrvaMatTableOfContentDirective
-  implements OnInit, AfterViewInit
-{
-  @Input()
-  onemrvaMatToc!: OnemrvaMatTocAnchor;
-
-  @HostBinding('attr.role')
-  role: string = '';
-
-  @HostBinding('attr.class')
-  clazz: string = 'onemrva-mat-toc-anchor';
-
-  @HostBinding('attr.aria-label')
-  get ariaLabel() {
-    return this.translateService.instant(this.onemrvaMatToc?.titleKey);
-  }
-
-  @Input()
-  hiddenInToc = false;
-
-  @HostBinding('attr.href')
-  get href() {
-    if (
-      this.onemrvaMatToc &&
-      this.onemrvaMatToc.path &&
-      this.onemrvaMatToc.path[0] !== '#'
-    )
-      return '#' + this.onemrvaMatToc?.path;
-    return this.onemrvaMatToc?.path;
-  }
-
-  constructor(
-    private tocService: OnemrvaMatTableOfContentService,
-    private cd: ChangeDetectorRef,
-    private translateService: TranslateService,
-  ) {}
-
-  ngOnInit(): void {
-    this.tocService.addAnchor({ ...this.onemrvaMatToc, directive: this });
-
-    // console.log('   HWK this.hidden', this.hidden);
-  }
-
-  ngAfterViewInit(): void {
-    this.cd.detectChanges();
-  }
-}

package/mat-table-of-content/src/onemrva-mat-table-of-content.service.ts

@@ -1,51 +0,0 @@
-import { Injectable } from '@angular/core';
-import { BehaviorSubject, Observable } from 'rxjs';
-import {
-  OnemrvaMatTocAnchor,
-  OnemrvaMatToc,
-  OnemrvaMatTocAnchorLevel,
-} from './onemrva-mat-toc-anchor.model';
-
-@Injectable()
-export class OnemrvaMatTableOfContentService {
-  private _toc: OnemrvaMatToc = {};
-  private _toc$: BehaviorSubject<OnemrvaMatToc> = new BehaviorSubject({});
-  toc$: Observable<OnemrvaMatToc> = this._toc$.asObservable();
-
-  addAnchor(anchor: OnemrvaMatTocAnchor) {
-    if (!anchor.level) {
-      anchor.level = OnemrvaMatTocAnchorLevel.SECTION;
-    }
-
-    if (!this._toc[anchor.tocName])
-      this._toc = { ...this._toc, [anchor.tocName]: [anchor] };
-    else if (
-      this._toc[anchor.tocName].findIndex(a => anchor.path === a.path) < 0
-    ) {
-      let idx = -1;
-      if (anchor.order) {
-        idx = this._toc[anchor.tocName].findIndex(
-          a => a.order && anchor.order! < a.order,
-        );
-      }
-
-      const newToc = [...this._toc[anchor.tocName]];
-      if (idx >= 0) {
-        newToc.splice(idx, 0, anchor);
-      } else {
-        newToc.push(anchor);
-      }
-      this._toc = {
-        ...this._toc,
-        [anchor.tocName]: newToc,
-      };
-    }
-
-    this._toc$.next(this._toc);
-  }
-
-  resetToc() {
-    this._toc = {};
-    this._toc$.next(this._toc);
-  }
-}

package/mat-table-of-content/src/onemrva-mat-toc-anchor.model.ts

@@ -1,24 +0,0 @@
-export enum OnemrvaMatTocAnchorStatus {
-  CHECKMARK,
-  WARNING,
-}
-
-export enum OnemrvaMatTocAnchorLevel {
-  SECTION,
-  SUBSECTION,
-}
-
-export interface OnemrvaMatTocAnchor {
-  tocName: string;
-  titleKey: string;
-  path: string;
-  order?: number; // You can manually set the order of your links
-  status?: OnemrvaMatTocAnchorStatus; // checkmarck add a checkmark icon at the end of the line. Warning adds an exclamation mark
-  level?: OnemrvaMatTocAnchorLevel; // Section level by default
-  hidden?: boolean;
-  directive?: any;
-}
-
-export interface OnemrvaMatToc {
-  [tocName: string]: OnemrvaMatTocAnchor[];
-}

package/mat-task-list/index.ts

@@ -1,5 +0,0 @@
-export * from './src/onemrva-mat-task-list.module';
-export * from './src/onemrva-mat-task-list.component';
-export * from './src/onemrva-mat-task-title.component';
-export * from './src/onemrva-mat-task-content.component';
-export * from './src/onemrva-mat-task.component';

package/mat-task-list/ng-package.json

@@ -1,6 +0,0 @@
-{
-  "$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-  "lib": {
-    "entryFile": "index.ts"
-  }
-}

package/mat-task-list/src/onemrva-mat-task-content.component.ts

@@ -1,11 +0,0 @@
-import { Component, Input, TemplateRef, ViewChild } from '@angular/core';
-
-@Component({
-  selector: 'onemrva-mat-task-content',
-  templateUrl: './onemrva-mat-task-content.html',
-})
-export class OnemrvaMatTaskContentComponent {
-  @Input() customNgClass: any;
-
-  @ViewChild(TemplateRef) template?: TemplateRef<any>;
-}

package/mat-task-list/src/onemrva-mat-task-content.html

@@ -1,5 +0,0 @@
-<ng-template>
-  <div class="onemrva-mat-task-content" [ngClass]="customNgClass">
-    <ng-content></ng-content>
-  </div>
-</ng-template>

package/mat-task-list/src/onemrva-mat-task-list.component.html

@@ -1 +0,0 @@
-<ng-content></ng-content>

package/mat-task-list/src/onemrva-mat-task-list.component.ts

@@ -1,39 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  ContentChildren,
-  HostBinding,
-  Input,
-  QueryList,
-} from '@angular/core';
-import { OnemrvaMatTaskComponent } from './onemrva-mat-task.component';
-
-let NEXT_ID = 0;
-
-@Component({
-  selector: 'onemrva-mat-task-list',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  templateUrl: './onemrva-mat-task-list.component.html',
-})
-export class OnemrvaMatTaskListComponent implements AfterViewInit {
-  @HostBinding('attr.id')
-  @Input()
-  public id = `onemrva-mat-task-list-${NEXT_ID++}`;
-
-  @HostBinding('attr.data-cy')
-  @Input()
-  data_cy: string = 'onemrva-mat-task-list';
-
-  @ContentChildren(OnemrvaMatTaskComponent, {
-    descendants: true,
-  })
-  _tasks?: QueryList<OnemrvaMatTaskComponent>;
-
-  constructor(private cd: ChangeDetectorRef) {}
-
-  ngAfterViewInit() {
-    this.cd.detectChanges();
-  }
-}

package/mat-task-list/src/onemrva-mat-task-list.module.ts

@@ -1,31 +0,0 @@
-import { NgModule } from '@angular/core';
-import { OnemrvaMatTaskListComponent } from './onemrva-mat-task-list.component';
-import { OnemrvaMatTaskTitleComponent } from './onemrva-mat-task-title.component';
-import { OnemrvaMatTaskContentComponent } from './onemrva-mat-task-content.component';
-import { CommonModule } from '@angular/common';
-import { OnemrvaMatTaskComponent } from './onemrva-mat-task.component';
-import { MatIconModule } from '@angular/material/icon';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { ReactiveFormsModule } from '@angular/forms';
-
-@NgModule({
-  declarations: [
-    OnemrvaMatTaskListComponent,
-    OnemrvaMatTaskTitleComponent,
-    OnemrvaMatTaskContentComponent,
-    OnemrvaMatTaskComponent,
-  ],
-  imports: [
-    CommonModule,
-    MatIconModule,
-    MatCheckboxModule,
-    ReactiveFormsModule,
-  ],
-  exports: [
-    OnemrvaMatTaskListComponent,
-    OnemrvaMatTaskTitleComponent,
-    OnemrvaMatTaskContentComponent,
-    OnemrvaMatTaskComponent,
-  ],
-})
-export class OnemrvaMatTaskListModule {}

package/mat-task-list/src/onemrva-mat-task-title.component.ts

@@ -1,24 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  Input,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-
-@Component({
-  selector: 'onemrva-mat-task-title',
-  templateUrl: './onemrva-mat-task-title.html',
-})
-export class OnemrvaMatTaskTitleComponent implements AfterViewInit {
-  @Input() customNgClass: any;
-
-  @ViewChild(TemplateRef) template?: TemplateRef<any>;
-
-  constructor(private cd: ChangeDetectorRef) {}
-
-  ngAfterViewInit() {
-    this.cd.detectChanges();
-  }
-}

package/mat-task-list/src/onemrva-mat-task-title.html

@@ -1,5 +0,0 @@
-<ng-template>
-  <div class="onemrva-mat-task-title" [ngClass]="customNgClass">
-    <ng-content></ng-content>
-  </div>
-</ng-template>

package/mat-task-list/src/onemrva-mat-task.component.html

@@ -1,23 +0,0 @@
-<div class="onemrva-mat-task-icon">
-  <ng-container *ngIf="icon !== undefined">
-    <span class="bubble"
-      ><mat-icon>{{ icon }}</mat-icon></span
-    >
-  </ng-container>
-  <ng-container *ngIf="form !== undefined">
-    <mat-checkbox
-      [disabled]="true"
-      [formControl]="form"
-      [aria-label]="arialLabel"
-    ></mat-checkbox>
-  </ng-container>
-  <ng-container *ngIf="bubble !== undefined">
-    <span class="bubble">{{ bubble }}</span>
-  </ng-container>
-</div>
-<ng-container *ngIf="title?.template as tpl">
-  <ng-container *ngTemplateOutlet="tpl"></ng-container>
-</ng-container>
-<ng-container *ngIf="content?.template as tpl">
-  <ng-container *ngTemplateOutlet="tpl"></ng-container>
-</ng-container>

package/mat-task-list/src/onemrva-mat-task.component.ts

@@ -1,121 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  ContentChild,
-  HostBinding,
-  Input,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-import { OnemrvaMatTaskTitleComponent } from './onemrva-mat-task-title.component';
-import { OnemrvaMatTaskContentComponent } from './onemrva-mat-task-content.component';
-import { OnemrvaMatColor } from '@onemrvapublic/design-system/utils';
-import { FormControl } from '@angular/forms';
-
-@Component({
-  selector: 'onemrva-mat-task',
-  templateUrl: './onemrva-mat-task.component.html',
-  styleUrls: ['onemrva-mat-task.component.scss'],
-})
-export class OnemrvaMatTaskComponent implements AfterViewInit {
-  @Input() customNgClass: any;
-
-  @Input() icon: string | undefined;
-  @Input() form: FormControl | undefined;
-  @Input() bubble: string | undefined;
-  @Input() arialLabel: string = 'select';
-
-  /** @hidden @internal */
-  @HostBinding('class.mat-disabled')
-  @Input()
-  disabled: boolean = false;
-
-  @HostBinding('attr.aria-disabled')
-  public get showAriaDisabled(): boolean {
-    return this.disabled;
-  }
-
-  @ViewChild(TemplateRef) template!: TemplateRef<any>;
-
-  @ContentChild(OnemrvaMatTaskTitleComponent)
-  title?: OnemrvaMatTaskTitleComponent;
-  @ContentChild(OnemrvaMatTaskContentComponent)
-  content?: OnemrvaMatTaskContentComponent;
-
-  constructor(private cd: ChangeDetectorRef) {}
-
-  ngAfterViewInit() {
-    if (this.disabled) {
-      this.form?.disable();
-    }
-    //this.customNgClass = this.customNgClass.merge(['onemrva-mat-task']);
-    this.cd.detectChanges();
-  }
-
-  /**
-   * @hidden
-   * @internal
-   */
-  private _color: OnemrvaMatColor = OnemrvaMatColor.NONE;
-
-  /**
-   *
-   * @param value
-   */
-  public set color(value: OnemrvaMatColor) {
-    this._color = value;
-  }
-
-  /** @hidden @internal */
-  @HostBinding('class.mat-accent')
-  public get _colorAccent(): boolean {
-    return this.color === OnemrvaMatColor.ACCENT;
-  }
-
-  /** @hidden @internal */
-  @HostBinding('class.mat-primary')
-  public get _isPrimary(): boolean {
-    return this.color === OnemrvaMatColor.PRIMARY;
-  }
-  /** @hidden @internal */
-  @HostBinding('class.mat-accent')
-  public get _isAccent(): boolean {
-    return this.color === OnemrvaMatColor.ACCENT;
-  }
-  /** @hidden @internal */
-  @HostBinding('class.mat-error')
-  public get _isError(): boolean {
-    return this.color === OnemrvaMatColor.ERROR;
-  }
-  /** @hidden @internal */
-  @HostBinding('class.mat-warn')
-  public get _isWarn(): boolean {
-    return this.color === OnemrvaMatColor.WARN;
-  }
-  /** @hidden @internal */
-  @HostBinding('class.mat-success')
-  public get _isSuccess(): boolean {
-    return this.color === OnemrvaMatColor.SUCCESS;
-  }
-  /** @hidden @internal */
-  @HostBinding('class.mat-info')
-  public get _isInfo(): boolean {
-    return this.color === OnemrvaMatColor.INFO;
-  }
-  /** @hidden @internal */
-  @HostBinding('class.mat-grayscale')
-  public get _isGrayscale(): boolean {
-    return this.color === OnemrvaMatColor.GRAYSCALE;
-  }
-
-  @Input()
-  public get color(): OnemrvaMatColor {
-    return this._color;
-  }
-
-  public matColor() {
-    if (this.color === OnemrvaMatColor.NONE) return '';
-    return `mat-${this.color}`;
-  }
-}

package/mat-timepicker/index.ts

@@ -1,6 +0,0 @@
-export * from './src/onemrva-mat-timepicker.module';
-export * from './src/onemrva-mat-timepicker.component';
-export * from './src/timepicker-toggle/timepicker-toggle.component';
-export * from './src/timepicker-dialog/timepicker-dialog.component';
-export * from './src/clock/clock.component';
-export * from './src/timepicker.directive';

package/mat-timepicker/ng-package.json

@@ -1,6 +0,0 @@
-{
-  "$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-  "lib": {
-    "entryFile": "index.ts"
-  }
-}

package/mat-timepicker/src/clock/clock.component.html

@@ -1,109 +0,0 @@
-<div class="root">
-  <div
-    class="circle"
-    (touchmove)="handleTouchMove($event)"
-    (mousemove)="handleMouseMove($event)"
-    (touchstart)="disableAnimatedPointer()"
-    (mousedown)="disableAnimatedPointer()"
-    (touchend)="handleTouchEnd($event)"
-    (mouseup)="enableAnimatedPointer()"
-    (click)="handleClick($event)"
-  >
-    <div
-      class="pointer-container"
-      [ngClass]="{
-        'small-pointer':
-          viewType === 'hours' && (formattedValue === 0 || formattedValue > 12),
-        'animated-pointer': !touching
-      }"
-      [style.transform]="'rotate(' + angle + 'deg)'"
-    >
-      <button
-        aria-disabled="true"
-        mat-mini-fab
-        [color]="color"
-        class="inner-dot"
-        aria-label="Inner Dot"
-      ></button>
-      <mat-toolbar [color]="color" class="pointer">
-        <button
-          mat-mini-fab
-          [color]="color"
-          class="outer-dot"
-          aria-label="Outer dot"
-          [ngClass]="{
-            'outer-dot-odd': viewType === 'minutes' && formattedValue % 5 !== 0
-          }"
-        >
-          <ng-container
-            *ngIf="viewType === 'minutes' && formattedValue % 5 !== 0"
-            >·</ng-container
-          >
-        </button>
-      </mat-toolbar>
-    </div>
-    <ng-container *ngFor="let digit of minuteDots">
-      <button
-        mat-mini-fab
-        class="number minute-dot"
-        [ngClass]="{
-          selected:
-            formattedValue === digit.display ||
-            (digit.display === 0 && formattedValue === 0),
-          disabled: !isAvailable(digit.display === 60 ? 0 : digit.display)
-        }"
-        [style.transform]="
-          'translate(' + digit.translateX + 'px, ' + digit.translateY + 'px)'
-        "
-      >
-        <ng-container *ngIf="digit.display % 5 !== 0">·</ng-container>
-      </button>
-    </ng-container>
-    <ng-container *ngFor="let digit of numbers">
-      <button
-        mat-mini-fab
-        [color]="color"
-        class="number"
-        [ngClass]="{
-          selected:
-            formattedValue === digit.display ||
-            (digit.display === 60 && formattedValue === 0),
-          disabled: !isAvailable(digit.display === 60 ? 0 : digit.display)
-        }"
-        [style.transform]="
-          'translate(' + digit.translateX + 'px, ' + digit.translateY + 'px)'
-        "
-      >
-        <ng-template #hoursTemplate>{{ digit.display }}</ng-template>
-        <ng-template #minutesTemplate>{{
-          digit.display === 60 ? '00' : digit.display
-        }}</ng-template>
-        <ng-container
-          *ngIf="
-            viewType === 'minutes';
-            then minutesTemplate;
-            else hoursTemplate
-          "
-        ></ng-container>
-      </button>
-    </ng-container>
-    <ng-container *ngFor="let digit of secondaryNumbers">
-      <button
-        mat-mini-fab
-        [color]="color"
-        class="number small-number"
-        [ngClass]="{
-          selected:
-            formattedValue === digit.display ||
-            (digit.display === 24 && formattedValue === 0),
-          disabled: !isAvailable(digit.display === 24 ? 0 : digit.display)
-        }"
-        [style.transform]="
-          'translate(' + digit.translateX + 'px, ' + digit.translateY + 'px)'
-        "
-      >
-        {{ digit.display === 24 ? '00' : digit.display }}
-      </button>
-    </ng-container>
-  </div>
-</div>

package/mat-timepicker/src/clock/clock.component.spec.ts

@@ -1,38 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ClockComponent } from './clock.component';
-import { MatToolbarModule } from '@angular/material/toolbar';
-import { MatButtonModule } from '@angular/material/button';
-import { MatDialogModule } from '@angular/material/dialog';
-import { CommonModule } from '@angular/common';
-import { MatIconModule } from '@angular/material/icon';
-import { MatInputModule } from '@angular/material/input';
-
-describe('ClockComponent', () => {
-  let component: ClockComponent;
-  let fixture: ComponentFixture<ClockComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ClockComponent],
-      imports: [
-        CommonModule,
-        MatDialogModule,
-        MatButtonModule,
-        MatToolbarModule,
-        MatIconModule,
-        MatInputModule,
-      ],
-    }).compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ClockComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});