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

package/mat-timepicker/src/timepicker.directive.ts

@@ -1,596 +0,0 @@
-import {
-  ControlValueAccessor,
-  NgForm,
-  NgControl,
-  FormGroupDirective,
-  FormControl,
-  Validators,
-} from '@angular/forms';
-import {
-  Directive,
-  OnInit,
-  EventEmitter,
-  Input,
-  ElementRef,
-  OnChanges,
-  Renderer2,
-  Optional,
-  NgZone,
-  HostBinding,
-  Self,
-  Output,
-  HostListener,
-} from '@angular/core';
-import {
-  MatFormFieldControl,
-  MatFormField,
-} from '@angular/material/form-field';
-import { IAllowed24HourMap } from './interfaces-and-types';
-import { twoDigits, isAllowed, isDateInRange, isTimeInRange } from './util';
-import { Subject, Subscription } from 'rxjs';
-import { FocusMonitor } from '@angular/cdk/a11y';
-import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import { ErrorStateMatcher } from '@angular/material/core';
-import { Platform } from '@angular/cdk/platform';
-import { OnemrvaMatTimepickerComponent } from './onemrva-mat-timepicker.component';
-
-@Directive({
-  selector: 'input[matTimepicker]',
-  providers: [
-    { provide: MatFormFieldControl, useExisting: MatTimepickerDirective },
-  ],
-  // eslint-disable-next-line
-  host: {
-    // tslint:disable-next-line:object-literal-key-quotes
-    class: 'mat-input-element mat-form-field-autofill-control',
-    '[class.mat-input-server]': '_isServer',
-    // Native input properties that are overwritten by Angular inputs need to be synced with
-    // the native input element. Otherwise property bindings for those don't work.
-    '[attr.id]': 'id',
-    '[attr.placeholder]': 'placeholder',
-    '[disabled]': 'disabled',
-    '[required]': 'required',
-    '[attr.readonly]': 'readonly || null',
-    '[attr.aria-invalid]': 'errorState',
-    '[attr.aria-required]': 'required.toString()',
-  },
-  exportAs: 'matTimepicker',
-})
-export class MatTimepickerDirective
-  implements OnInit, OnChanges, ControlValueAccessor, MatFormFieldControl<any>
-{
-  static nextId = 0;
-
-  /** Whether the component is being rendered on the server. */
-  // tslint:disable-next-line:variable-name
-  readonly _isServer: boolean;
-  private _closedSubscription = Subscription.EMPTY;
-
-  /** The datepicker that this input is associated with. */
-  @Input()
-  set matTimepicker(timepicker: OnemrvaMatTimepickerComponent) {
-    if (timepicker) {
-      this._timepicker = timepicker;
-      this._timepicker.setTimepickerInput(this);
-      this._closedSubscription = timepicker.closedStream.subscribe(() =>
-        this._onTouched(),
-      );
-      //this._registerModel(datepicker.registerInput(this));
-    }
-  }
-
-  _timepicker!: OnemrvaMatTimepickerComponent;
-
-  // tslint:disable-next-line:variable-name
-  _errorState = false;
-  get errorState() {
-    const oldState = this._errorState;
-    const parent = this._parentFormGroup || this._parentForm;
-    const control = this.ngControl
-      ? (this.ngControl.control as FormControl)
-      : null;
-    const newState = this.errorStateMatcher
-      ? this.errorStateMatcher.isErrorState(control, parent)
-      : oldState;
-
-    if (newState !== oldState) {
-      this._errorState = newState;
-      this.stateChanges.next();
-    }
-
-    return newState;
-  }
-
-  _onTouched = () => {};
-
-  @Input()
-  get disabled(): boolean {
-    if (this.ngControl && this.ngControl.disabled !== null) {
-      return this.ngControl.disabled;
-    }
-    return this._disabled;
-  }
-
-  set disabled(value: boolean) {
-    this._disabled = coerceBooleanProperty(value);
-
-    // Browsers may not fire the blur event if the input is disabled too quickly.
-    // Reset from here to ensure that the element doesn't become stuck.
-    if (this.focused) {
-      this.focused = false;
-      this.stateChanges.next();
-    }
-  }
-
-  // tslint:disable-next-line:variable-name
-  protected _disabled = false;
-
-  @Input() get id(): string {
-    return this._id;
-  }
-
-  set id(value: string) {
-    this._id = value || this._uid;
-  }
-
-  // tslint:disable-next-line:variable-name
-  protected _id: string = '0';
-
-  @Input() get readonly(): boolean {
-    return this._readonly;
-  }
-
-  set readonly(value: boolean) {
-    this._readonly = coerceBooleanProperty(value);
-  }
-
-  // tslint:disable-next-line:variable-name
-  private _readonly = false;
-
-  private isAlive: Subject<any> = new Subject<any>();
-  stateChanges = new Subject<void>();
-
-  // tslint:disable-next-line:variable-name
-  protected _uid = `mat-input-${MatTimepickerDirective.nextId++}`;
-
-  @HostBinding('class.floating') get shouldLabelFloat() {
-    return this.focused || !this.empty;
-  }
-
-  @HostBinding('attr.aria-describedby') describedBy = '';
-
-  @Input() errorStateMatcher: ErrorStateMatcher;
-
-  @Input() get required() {
-    if (this.ngControl?.control) {
-      return this.ngControl.control.hasValidator(Validators.required);
-    }
-    return this._required;
-  }
-
-  set required(req) {
-    this._required = coerceBooleanProperty(req);
-    this.stateChanges.next();
-  }
-
-  // tslint:disable-next-line:variable-name
-  private _required = false;
-
-  @Input() get placeholder() {
-    return this._placeholder;
-  }
-
-  set placeholder(plh) {
-    this._placeholder = plh;
-    this.stateChanges.next();
-  }
-
-  // tslint:disable-next-line:variable-name
-  private _placeholder: string = '';
-
-  focused = false;
-  private pattern: RegExp = new RegExp('[0-2]?[0-9]:[0-6]?[0-9]');
-
-  private allowed24HourMap: IAllowed24HourMap = this.generateAllowedMap();
-
-  private isInputFocused = false;
-
-  /** Override the label of the ok button. */
-  @Input() okLabel = 'Ok';
-  /** Override the label of the cancel button. */
-  @Input() cancelLabel = 'Cancel';
-
-  /** Sets the clock mode, 12-hour or 24-hour clocks are supported. */
-  @Input() color = 'primary';
-  @Input() disableDialogOpenOnClick = false;
-  @Input() strict = true;
-
-  controlType = 'angular-material-timepicker';
-
-  private listeners: (() => void)[] = [];
-
-  @Input() minDate!: Date;
-  @Input() maxDate!: Date;
-
-  // tslint:disable-next-line:variable-name
-  private _isPm: boolean = false;
-  // tslint:disable-next-line:variable-name
-  private _value: Date | null = null;
-  // tslint:disable-next-line:variable-name
-  private _formattedValueString: string = '';
-
-  // tslint:disable-next-line:variable-name
-  private _skipValueChangeEmission = true;
-
-  @Input() set value(value: Date | null) {
-    if (value === this._value) {
-      return;
-    }
-    this._value = value;
-    if (!value) {
-      this._formattedValueString = '';
-      this.setInputElementValue(value);
-      this.currentValue = value ?? new Date();
-      return;
-    }
-
-    this._formattedValueString = `${twoDigits(value.getHours())}:${twoDigits(
-      value.getMinutes(),
-    )}`;
-
-    if (!this.isInputFocused) {
-      this.setInputElementValue(this.formattedValueString);
-    }
-    this.currentValue = value;
-    this.stateChanges.next();
-
-    if (this._skipValueChangeEmission) {
-      return;
-    }
-    this.timeChange.emit(this.currentValue);
-
-    if (this.onChangeFn) this.onChangeFn(this.value);
-  }
-
-  get value() {
-    return this._value;
-  }
-
-  get empty() {
-    return !(this.currentValue instanceof Date);
-  }
-
-  private get formattedValueString() {
-    return this._formattedValueString;
-  }
-
-  private currentValue!: Date;
-
-  private onChangeFn: any;
-  private onTouchedFn: any;
-  private combination: string[] = [];
-
-  @Output() timeChange: EventEmitter<any> = new EventEmitter<any>();
-  @Output() invalidInput: EventEmitter<any> = new EventEmitter<any>();
-
-  @HostListener('input') inputHandler() {
-    const value = (this.elRef.nativeElement as any).value as string;
-    const length = value.length;
-
-    if (length === 0) {
-      this.writeValue(null, true);
-      this._value = null;
-      this._skipValueChangeEmission = true;
-      Promise.resolve().then(() => (this._skipValueChangeEmission = false));
-
-      if (this.onChangeFn) {
-        this.onChangeFn(null);
-      }
-
-      return;
-    }
-
-    const valueHasColumn = value.includes(':');
-    let [hours, minutes]: any =
-      length === 1
-        ? [value, 0]
-        : length === 2 && !valueHasColumn
-          ? [value, 0]
-          : valueHasColumn
-            ? value.split(':')
-            : value.split(/(\d\d)/).filter(v => v);
-
-    hours = +hours;
-
-    if (/\s/.test(minutes)) {
-      let other;
-      [minutes, other] = minutes.split(/\s/);
-      if (other === 'pm' && !isNaN(hours) && hours < 12) {
-        hours += 12;
-      }
-    }
-
-    minutes = +minutes;
-
-    if (isNaN(hours) || isNaN(minutes)) {
-      //this.writeValue(null, true);
-      this._skipValueChangeEmission = true;
-      Promise.resolve().then(() => (this._skipValueChangeEmission = false));
-      return;
-    }
-
-    if (+hours > 24) {
-      hours = '24';
-    } else if (+hours < 0) {
-      hours = '0';
-    }
-
-    if (+minutes > 59) {
-      minutes = '59';
-    } else if (+minutes < 0) {
-      minutes = '0';
-    }
-
-    const d = this.value ? new Date(this.value.getTime()) : new Date();
-    d.setHours(+hours);
-    d.setMinutes(+minutes);
-    d.setSeconds(0);
-    d.setMilliseconds(0);
-
-    const isValueInRange = isDateInRange(this.minDate, this.maxDate, d);
-    if (!isValueInRange) {
-      this.invalidInput.emit();
-    }
-
-    this.writeValue(d, true);
-    if (this.onChangeFn) {
-      this.onChangeFn(d);
-    }
-  }
-
-  @HostListener('keydown', ['$event']) keydownHandler(event: any) {
-    const e = <KeyboardEvent>event;
-
-    const allowedKey = [
-      '0',
-      '1',
-      '2',
-      '3',
-      '4',
-      '5',
-      '6',
-      '7',
-      '8',
-      '9',
-      ':',
-      'Backspace',
-      'Delete',
-      'Tab',
-      'Enter',
-      'ArrowLeft',
-      'ArrowRight',
-      'ArrowUp',
-      'ArrowDown',
-      'Home',
-      'End',
-    ];
-    if (allowedKey.indexOf(e.key) >= 0) return;
-
-    const allowedCtrlShortcuts = ['a', 'c', 'x', 'v'];
-    if (e.ctrlKey && allowedCtrlShortcuts.indexOf(e.key) >= 0) return;
-
-    if (event.metaKey || event.ctrlKey || event.altKey) {
-      this.combination = this.combination.concat(event.code);
-      return;
-    }
-    const target = event.target;
-    const tValue = target.value;
-    const value = `${tValue.slice(0, target.selectionStart)}${
-      event.key
-    }${tValue.slice(target.selectionEnd)}`;
-    if (value.match(this.pattern) || this.combination.length > 0) {
-      return true;
-    }
-    event.preventDefault();
-    event.stopImmediatePropagation();
-    return;
-  }
-
-  @HostListener('keyup', ['$event']) keyupHandler(event: any) {
-    this.combination = this.combination.filter(v => v !== event.code);
-  }
-
-  @HostListener('focus') focusHandler() {
-    this.isInputFocused = true;
-  }
-
-  @HostListener('focusout') focusoutHandler() {
-    this.isInputFocused = false;
-    this.setInputElementValue(this.formattedValueString);
-    if (this.onTouchedFn && !this._timepicker.modalRef) {
-      this.onTouchedFn();
-    }
-  }
-
-  constructor(
-    @Optional() @Self() public ngControl: NgControl,
-    private renderer: Renderer2,
-    private zone: NgZone,
-    private fm: FocusMonitor,
-    private elRef: ElementRef<HTMLElement>,
-    private ngZone: NgZone,
-    // tslint:disable-next-line:variable-name
-    protected _platform: Platform,
-    // tslint:disable-next-line:variable-name
-    @Optional() private _parentForm: NgForm,
-    // tslint:disable-next-line:variable-name
-    @Optional() private _matFormFiled: MatFormField,
-    // tslint:disable-next-line:variable-name
-    @Optional() private _parentFormGroup: FormGroupDirective,
-    // tslint:disable-next-line:variable-name
-    _defaultErrorStateMatcher: ErrorStateMatcher,
-  ) {
-    this.errorStateMatcher = _defaultErrorStateMatcher;
-    if (this.ngControl != null) {
-      this.ngControl.valueAccessor = this;
-    }
-
-    if (_platform.IOS) {
-      ngZone.runOutsideAngular(() => {
-        elRef.nativeElement.addEventListener('keyup', (event: Event) => {
-          const el = event.target as HTMLInputElement;
-          if (!el.value && !el.selectionStart && !el.selectionEnd) {
-            // Note: Just setting `0, 0` doesn't fix the issue. Setting
-            // `1, 1` fixes it for the first time that you type text and
-            // then hold delete. Toggling to `1, 1` and then back to
-            // `0, 0` seems to completely fix it.
-            el.setSelectionRange(1, 1);
-            el.setSelectionRange(0, 0);
-          }
-        });
-      });
-    }
-
-    this._isServer = !this._platform.isBrowser;
-  }
-
-  setDescribedByIds(ids: string[]) {
-    this.describedBy = ids.join(' ');
-  }
-
-  onContainerClick(event: MouseEvent) {
-    if ((event.target as Element).tagName.toLowerCase() !== 'input') {
-      this.elRef.nativeElement.focus();
-    }
-  }
-
-  setInputElementValue(value: any) {
-    Promise.resolve().then(() => {
-      this.zone.runOutsideAngular(() => {
-        this.renderer.setProperty(this.elRef.nativeElement, 'value', value);
-      });
-    });
-  }
-
-  validate() {
-    const isValueInRange = this.strict
-      ? isDateInRange(this.minDate, this.maxDate, this.currentValue)
-      : isTimeInRange(this.minDate, this.maxDate, this.currentValue);
-
-    return isValueInRange ? null : { dateRange: true };
-  }
-
-  ngOnInit() {
-    if (this._platform.isBrowser) {
-      this.fm.monitor(this.elRef.nativeElement, true).subscribe(origin => {
-        this.focused = !!origin;
-        this.stateChanges.next();
-      });
-    }
-    if (!this.value) {
-      const hasMaxDate = !!this.maxDate;
-      const hasMinDate = !!this.minDate;
-
-      //if (hasMinDate || hasMaxDate) {
-      if (hasMinDate) {
-        this.minDate.setSeconds(0);
-        this.minDate.setMilliseconds(0);
-      }
-      if (hasMaxDate) {
-        this.maxDate.setSeconds(0);
-        this.maxDate.setMilliseconds(0);
-      }
-
-      if (
-        !(this.ngControl as any)._rawValidators.find((v: any) => v === this)
-      ) {
-        (this.ngControl as any)._rawValidators.push(this);
-      }
-      //}
-    }
-    this._skipValueChangeEmission = false;
-  }
-
-  generateAllowedMap(): IAllowed24HourMap {
-    const isStrictMode = this.strict && this.value instanceof Date;
-    const a24hm: IAllowed24HourMap = {};
-    for (let h = 0; h < 24; h++) {
-      for (let m = 0; m < 60; m++) {
-        const hourMap = a24hm[h] || {};
-        if (isStrictMode && this.value) {
-          const currentDate = new Date(this.value.getTime());
-          currentDate.setHours(h);
-          currentDate.setMinutes(m);
-          currentDate.setSeconds(0);
-          currentDate.setMilliseconds(0);
-          hourMap[m] = isDateInRange(this.minDate, this.maxDate, currentDate);
-        } else {
-          hourMap[m] = isAllowed(h, m, this.minDate, this.maxDate);
-        }
-        a24hm[h] = hourMap;
-      }
-    }
-
-    return a24hm;
-  }
-
-  ngOnChanges() {
-    this.pattern = /^[0-9]{1,2}:?([0-9]{1,2})?$/;
-
-    if (
-      !this._timepicker.modalRef ||
-      !this._timepicker.modalRef.componentInstance
-    ) {
-      return;
-    }
-
-    this._timepicker.modalRef.componentInstance.data = {
-      value: this.currentValue,
-      okLabel: this.okLabel,
-      cancelLabel: this.cancelLabel,
-      color: this.color,
-      minDate: this.minDate,
-      maxDate: this.maxDate,
-      allowed24HourMap: this.allowed24HourMap,
-    };
-  }
-
-  checkValidity(value: Date) {
-    if (!value) {
-      return false;
-    }
-    const hour = value.getHours();
-    const minutes = value.getMinutes();
-    return isAllowed(hour, minutes, this.minDate, this.maxDate);
-  }
-
-  writeValue(value: Date | null, isInnerCall = false): void {
-    if (!isInnerCall) {
-      this._skipValueChangeEmission = true;
-      Promise.resolve().then(() => (this._skipValueChangeEmission = false));
-    }
-
-    if (value) {
-      value.setSeconds(0);
-      value.setMilliseconds(0);
-    }
-
-    if (this.value && +this.value === +(value ?? 0)) {
-      return;
-    } else {
-      this.value = value;
-    }
-  }
-
-  registerOnChange(fn: any): void {
-    this.onChangeFn = fn;
-  }
-
-  registerOnTouched(fn: any): void {
-    this.onTouchedFn = fn;
-  }
-
-  setDisabledState?(isDisabled: boolean): void {
-    this.disabled = isDisabled;
-  }
-}

package/mat-timepicker/src/util.ts

@@ -1,109 +0,0 @@
-import { ClockViewType } from './interfaces-and-types';
-
-export function twoDigits(n: number) {
-  return n < 10 ? `0${n}` : `${n}`;
-}
-
-export function addDays(date: Date, days: number) {
-  const result = new Date(date);
-  result.setDate(result.getDate() + days);
-  return result;
-}
-
-export function convertHoursForMode(hour: number) {
-  const isPm = hour >= 12;
-  return { hour, isPm };
-}
-
-function mod(a: number, b: number) {
-  return a - Math.floor(a / b) * b;
-}
-
-export function getShortestAngle(from: number, to: number) {
-  const difference = to - from;
-  return from + mod(difference + 180, 360) - 180;
-}
-
-export function isDateInRange(minDate: Date, maxDate: Date, current: Date) {
-  const unixCurrentDate = +current;
-  return (
-    (!minDate || +minDate <= unixCurrentDate) &&
-    (!maxDate || unixCurrentDate <= +maxDate)
-  );
-}
-
-export function isTimeInRange(minDate: Date, maxDate: Date, current: Date) {
-  if (minDate instanceof Date) {
-    const newMinDate = new Date();
-    newMinDate.setHours(minDate.getHours());
-    newMinDate.setMinutes(minDate.getMinutes());
-    newMinDate.setSeconds(0);
-    newMinDate.setMilliseconds(0);
-    minDate = newMinDate;
-  }
-  if (maxDate instanceof Date) {
-    const newMaxDate = new Date();
-    newMaxDate.setHours(maxDate.getHours());
-    newMaxDate.setMinutes(maxDate.getMinutes());
-    newMaxDate.setSeconds(0);
-    newMaxDate.setMilliseconds(0);
-    maxDate = newMaxDate;
-  }
-  if (current instanceof Date) {
-    const newCurrent = new Date();
-    newCurrent.setHours(current.getHours());
-    newCurrent.setMinutes(current.getMinutes());
-    newCurrent.setSeconds(0);
-    newCurrent.setMilliseconds(0);
-    current = newCurrent;
-  }
-  const unixCurrentDate = +current;
-  return (
-    (!minDate || +minDate <= unixCurrentDate) &&
-    (!maxDate || unixCurrentDate <= +maxDate)
-  );
-}
-
-// used when generating the allowed maps
-
-export function isAllowed(
-  hour: number,
-  minutes: number,
-  minDate: Date,
-  maxDate: Date,
-) {
-  if (hour > 24 || hour < 0 || minutes > 60 || minutes < 0) {
-    return false;
-  }
-
-  if (!minDate && !maxDate) {
-    return true;
-  }
-
-  const checkDate = new Date();
-
-  checkDate.setHours(hour);
-  checkDate.setMinutes(minutes);
-  checkDate.setSeconds(0);
-  checkDate.setMilliseconds(0);
-
-  return isDateInRange(minDate, maxDate, checkDate);
-}
-
-// used by the clock component to visually disable the not allowed values
-
-export function getIsAvailabeFn(allowed24HourMap: any) {
-  return (value: number, viewType: ClockViewType, h: number) => {
-    const isHourCheck = viewType === 'hours';
-    const [hour, minutes] = isHourCheck ? [value, 0] : [h, value];
-
-    if (!allowed24HourMap) {
-      return true;
-    }
-
-    if (isHourCheck) {
-      return !!Object.values(allowed24HourMap[hour]).find(v => v === true);
-    }
-    return allowed24HourMap[hour][minutes];
-  };
-}

package/mat-toast/index.ts

@@ -1,6 +0,0 @@
-/*
- * Public API Surface of mat-toast
- */
-
-export * from './src/onemrva-mat-toast.component';
-export * from './src/onemrva-mat-toast.module';

package/mat-toast/ng-package.json

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