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

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

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

package/mat-timepicker/src/timepicker-dialog/timepicker-dialog.component.ts

@@ -1,176 +0,0 @@
-import { MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
-import {
-  Component,
-  EventEmitter,
-  Output,
-  Inject,
-  DoCheck,
-} from '@angular/core';
-import { ClockViewType, IAllowed24HourMap } from '../interfaces-and-types';
-import { twoDigits, convertHoursForMode } from '../util';
-import { Subject } from 'rxjs';
-import { ThemePalette } from '@angular/material/core';
-
-@Component({
-  selector: 'mat-timepicker-dialog',
-  templateUrl: './timepicker-dialog.component.html',
-  styleUrls: ['./timepicker-dialog.component.scss'],
-})
-export class MatTimepickerComponentDialogComponent implements DoCheck {
-  twoDigits = twoDigits;
-
-  @Output() changeEvent: EventEmitter<any> = new EventEmitter<any>();
-  @Output() okClickEvent: EventEmitter<any> = new EventEmitter<any>();
-  @Output() cancelClickEvent: EventEmitter<any> = new EventEmitter<any>();
-
-  allowed24HourMap!: IAllowed24HourMap;
-
-  invalidSelection = false;
-
-  okLabel: string = '';
-  cancelLabel: string = '';
-
-  set value(value: any) {
-    value = value || this.minDate || this.maxDate || new Date();
-    this.hours = value.getHours();
-    this.minutes = value.getMinutes();
-    this._value = value;
-  }
-
-  get value() {
-    return this._value;
-  }
-
-  viewType: ClockViewType = 'hours';
-
-  minutes: any;
-  color: ThemePalette = 'primary';
-  isPm = false;
-  skipMinuteAutoSwitch = false;
-  autoSwitchID: any;
-  editHoursClicked = false;
-  isClosing = false;
-
-  minDate!: Date;
-  maxDate!: Date;
-
-  // tslint:disable-next-line:variable-name
-  _formattedHour: any;
-  // tslint:disable-next-line:variable-name
-  _hours: any;
-  // tslint:disable-next-line:variable-name
-  _value?: Date;
-
-  set hours(value: any) {
-    this._hours = value;
-    this._formattedHour = convertHoursForMode(this.hours).hour;
-  }
-
-  get hours() {
-    return this._hours;
-  }
-
-  get formattedHours() {
-    return this._formattedHour;
-  }
-
-  bindData(data: any) {
-    this.okLabel = data.okLabel;
-    this.cancelLabel = data.cancelLabel;
-    this.color = data.color;
-    this.minDate = data.minDate;
-    this.maxDate = data.maxDate;
-    this.allowed24HourMap = data.allowed24HourMap;
-  }
-
-  constructor(
-    @Inject(MAT_DIALOG_DATA) public data: any,
-    public dialog: MatDialog,
-  ) {
-    this.isPm = data.isPm;
-    this.bindData(data);
-    // keep this always at the bottom
-    this.value = data.value;
-  }
-
-  timepickerInput!: any;
-
-  ngDoCheck() {
-    this.bindData(this.data);
-  }
-
-  handleClockChange({
-    value,
-    type,
-  }: {
-    value: number;
-    type: 'minutes' | 'hours';
-  }) {
-    if ((type && type === 'hours') || (!type && this.viewType === 'hours')) {
-      this.hours = value;
-    } else if (
-      (type && type === 'minutes') ||
-      (!type && this.viewType === 'minutes')
-    ) {
-      this.minutes = value;
-    }
-
-    const newValue = new Date();
-    const hours = this.hours;
-    // newValue.setFullYear(0);
-    // newValue.setMonth(0);
-    // newValue.setDate(0);
-    newValue.setHours(hours);
-    newValue.setMinutes(this.minutes);
-    newValue.setSeconds(0);
-    newValue.setMilliseconds(0);
-    this.value = newValue;
-    this.changeEvent.emit(newValue);
-  }
-
-  handleUnavailableSelection() {
-    clearTimeout(this.autoSwitchID);
-  }
-
-  handleClockChangeDone(e: Event) {
-    e.preventDefault(); // prevent mouseUp after touchEnd
-
-    if (this.viewType === 'hours' && !this.skipMinuteAutoSwitch) {
-      this.autoSwitchID = setTimeout(() => {
-        this.editMinutes();
-        this.autoSwitchID = null;
-      }, 300);
-    }
-  }
-
-  editHours() {
-    this.viewType = 'hours';
-    this.editHoursClicked = true;
-    setTimeout(() => {
-      this.editHoursClicked = false;
-    }, 0);
-  }
-
-  editMinutes() {
-    this.viewType = 'minutes';
-  }
-
-  invalidSelectionHandler(value: boolean) {
-    this.invalidSelection = value;
-  }
-
-  okClickHandler() {
-    this.okClickEvent.emit();
-  }
-
-  cancelClickHandler() {
-    this.cancelClickEvent.emit();
-  }
-
-  closedStream!: EventEmitter<void>;
-  disabled!: boolean;
-  id!: string;
-  opened!: boolean;
-  openedStream!: EventEmitter<void>;
-  stateChanges!: Subject<void>;
-}

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

@@ -1,15 +0,0 @@
-<button
-  #button
-  mat-icon-button
-  type="button"
-  [title]="ariaLabel"
-  [attr.aria-haspopup]="timepicker ? 'dialog' : null"
-  [attr.aria-label]="ariaLabel"
-  [attr.tabindex]="disabled ? -1 : tabIndex"
-  [disabled]="disabled"
-  [disableRipple]="disableRipple"
->
-  <mat-icon>schedule</mat-icon>
-
-  <ng-content select="[mattimepickerToggleIcon]"></ng-content>
-</button>

package/mat-timepicker/src/timepicker-toggle/timepicker-toggle.component.ts

@@ -1,140 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';
-import {
-  AfterContentInit,
-  Attribute,
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  Directive,
-  Input,
-  OnChanges,
-  OnDestroy,
-  SimpleChanges,
-  ViewEncapsulation,
-} from '@angular/core';
-import { merge, Observable, of as observableOf, Subscription } from 'rxjs';
-import { OnemrvaMatTimepickerComponent } from '../onemrva-mat-timepicker.component';
-
-/** Can be used to override the icon of a `matDatepickerToggle`. */
-@Directive({
-  selector: '[matDatepickerToggleIcon]',
-})
-export class MatTimepickerToggleIconDirective {}
-
-@Component({
-  selector: 'mat-timepicker-toggle',
-  templateUrl: 'timepicker-toggle.component.html',
-  styleUrls: ['timepicker-toggle.component.scss'],
-  // eslint-disable-next-line
-  host: {
-    class: 'mat-timepicker-toggle',
-    '[attr.tabindex]': 'null',
-    '[class.mat-timepicker-toggle-active]': 'timepicker && timepicker.opened',
-    '[class.mat-accent]': 'timepicker && timepicker.color === "accent"',
-    '[class.mat-warn]': 'timepicker && timepicker.color === "warn"',
-    // Used by the test harness to tie this toggle to its timepicker.
-    '[attr.data-mat-calendar]': 'timepicker ? timepicker.id : null',
-    // Bind the `click` on the host, rather than the inner `button`, so that we can call
-    // `stopPropagation` on it without affecting the user's `click` handlers. We need to stop
-    // it so that the input doesn't get focused automatically by the form field (See #21836).
-    '(click)': '_open($event)',
-  },
-  exportAs: 'matDatepickerToggle',
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-// eslint-disable-next-line  @angular-eslint/component-class-suffix
-export class MatTimePickerToggle
-  implements AfterContentInit, OnChanges, OnDestroy
-{
-  private _stateChanges = Subscription.EMPTY;
-
-  /** Datepicker instance that the button will toggle. */
-  // eslint-disable-next-line @angular-eslint/no-input-rename
-  @Input('for') timepicker!: OnemrvaMatTimepickerComponent;
-
-  /** Tabindex for the toggle. */
-  @Input() tabIndex: number | null;
-
-  /** Screenreader label for the button. */
-  @Input() ariaLabel: string = '';
-
-  /** Whether the toggle button is disabled. */
-  @Input()
-  get disabled(): boolean {
-    if (this._disabled === undefined && this.timepicker) {
-      return this.timepicker.timepickerInput.disabled;
-    }
-    return !!this._disabled;
-  }
-
-  set disabled(value: BooleanInput) {
-    this._disabled = coerceBooleanProperty(value);
-  }
-
-  private _disabled: boolean = false;
-
-  /** Whether ripples on the toggle should be disabled. */
-  @Input() disableRipple: boolean = false;
-
-  /** Underlying button element. */
-  //@ViewChild('button') _button: MatButton;
-
-  constructor(
-    private _changeDetectorRef: ChangeDetectorRef,
-    @Attribute('tabindex') defaultTabIndex: string,
-  ) {
-    const parsedTabIndex = Number(defaultTabIndex);
-    this.tabIndex =
-      parsedTabIndex || parsedTabIndex === 0 ? parsedTabIndex : null;
-  }
-
-  ngOnChanges(changes: SimpleChanges) {
-    if (changes['timepicker']) {
-      this._watchStateChanges();
-    }
-  }
-
-  ngOnDestroy() {
-    this._stateChanges.unsubscribe();
-  }
-
-  ngAfterContentInit() {
-    this._watchStateChanges();
-  }
-
-  _open(event: Event): void {
-    if (this.timepicker && !this.disabled) {
-      this.timepicker.open();
-      event.stopPropagation();
-    }
-  }
-
-  private _watchStateChanges() {
-    const datepickerStateChanged = this.timepicker
-      ? this.timepicker.stateChanges
-      : observableOf();
-    const inputStateChanged =
-      this.timepicker && this.timepicker.timepickerInput
-        ? this.timepicker.timepickerInput.stateChanges
-        : observableOf();
-    const datepickerToggled = this.timepicker
-      ? merge(this.timepicker.openedStream, this.timepicker.closedStream)
-      : observableOf();
-
-    this._stateChanges.unsubscribe();
-    this._stateChanges = merge(
-      datepickerStateChanged as Observable<void>,
-      inputStateChanged,
-      datepickerToggled,
-    ).subscribe(() => this._changeDetectorRef.markForCheck());
-  }
-}