Fix clipboard copy bug. Catch up with Ivy version changes.

Author: kshetline

projects/ng-widgets-showcase/src/app/app.component.html

@@ -2,7 +2,7 @@
   <div class="top-line">
     <label [style.margin-right]="'1em'"><input type="checkbox"
         [(ngModel)]="darkMode" (change)="settingsUpdated()">Dark mode</label>
-    <tbw-angle-editor></tbw-angle-editor>
+    <tbw-angle-editor [viewOnly]="viewOnly"></tbw-angle-editor>
     <tbw-angle-editor [options]="{ angleStyle: DD_MM, compass: true }"></tbw-angle-editor>
     <tbw-angle-editor [(ngModel)]="angle" [options]="{ compass: true, copyDecimal: true }"></tbw-angle-editor>
     <tbw-angle-editor [(ngModel)]="angle" [options]="{ unsigned: true }"></tbw-angle-editor>

projects/ng-widgets-showcase/src/app/app.component.ts

@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
 import { DateAndTime, DateTime, newDateTimeFormat, Timezone, YMDDate } from '@tubular/time';
 import { clone, isAndroid, isEqual, isIOS, isString, toBoolean, toNumber } from '@tubular/util';
-import { DateTimeStyle, HourStyle, TimeEditorOptions, YearStyle }
+import { DateTimeStyle, HourStyle, OPTIONS_ISO, OPTIONS_ISO_DATE, OPTIONS_ISO_TIME, TimeEditorOptions, YearStyle }
   from '../../../tubular-ng-widgets/src/lib/time-editor/time-editor.component';
 import { TimeEditorLimit } from '../../../tubular-ng-widgets/src/lib/time-editor/time-editor-limit';
 import { AngleStyle } from '../../../tubular-ng-widgets/src/lib/angle-editor/angle-editor.component';
@@ -252,15 +252,32 @@ export class AppComponent {
   }
 
   getOptions(): TimeEditorOptions {
+    const style = toNumber(this.customStyle);
+    let yearStyle = toNumber(this.yearStyle);
+
+    if (this.customLocale?.toLowerCase() === 'iso') {
+      const options = clone(style === DateTimeStyle.DATE_ONLY ? OPTIONS_ISO_DATE :
+        style === DateTimeStyle.TIME_ONLY ? OPTIONS_ISO_TIME : OPTIONS_ISO);
+
+      if (yearStyle === YearStyle.AD_BC)
+        yearStyle = YearStyle.SIGNED;
+
+      return Object.assign(options, {
+        millisDigits: this.millis,
+        showSeconds: this.showSeconds,
+        yearStyle
+      });
+    }
+
     return {
-      dateTimeStyle: toNumber(this.customStyle),
+      dateTimeStyle: style,
       hourStyle: toNumber(this.customCycle),
       locale: this.customLocale,
       millisDigits: this.millis,
       numbering: this.numSystem || undefined,
       showSeconds: this.showSeconds,
       twoDigitYear: this.customYear ? toBoolean(this.customYear) : undefined,
-      yearStyle: toNumber(this.yearStyle)
+      yearStyle
     };
   }
 

projects/tubular-ng-widgets/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tubular/ng-widgets",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "peerDependencies": {
     "@angular/common": "^12.0.0",
     "@angular/core": "^12.0.0",

projects/tubular-ng-widgets/src/lib/angle-editor/angle-editor.component.ts

@@ -544,7 +544,7 @@ export class AngleEditorComponent extends DigitSequenceEditorDirective<number> i
         this._options.angleStyle === AngleStyle.DD || this._options.angleStyle === AngleStyle.DDD)
       return this.value.toString();
     else
-      return this.items.map(item => item.value.toString()).join('');
+      return this.items.map(item => (item.value ?? '').toString()).join('');
   }
 
   private parseText(text: string): number {

projects/tubular-ng-widgets/src/lib/digit-sequence-editor/digit-sequence-editor.directive.ts

@@ -1619,6 +1619,7 @@ export abstract class DigitSequenceEditorDirective<T> implements
     if (this.hiddenInput) {
       const disabled = (this._floating || this._disabled || this._viewOnly || this._disableMobileKeyboard);
       this.hiddenInput.setAttribute('tabindex', this.disabled ? '-1' : this.tabindex);
+      this.hiddenInput.inputMode = this.inputOff ? 'none' : this._fakeUrl ? 'url' : 'decimal';
       this.hiddenInput.disabled = disabled;
       this.hiddenInput.readOnly = disabled;
     }

projects/tubular-ng-widgets/src/lib/shrink-wrap/shrink-wrap.component.ts

@@ -164,9 +164,9 @@ export class ShrinkWrapComponent implements AfterViewInit, OnDestroy, OnInit {
     else {
       this.innerStyle = {
         transform: `scale(${this.scale})`,
-        'transform-origin': 'top center',
+        'transform-origin': 'top center', // eslint-disable-line @typescript-eslint/naming-convention
         margin: `0 ${this.marginX}px ${this.marginY}px ${this.marginX}px`,
-        'max-width': `${scalingWidth}px`
+        'max-width': `${scalingWidth}px` // eslint-disable-line @typescript-eslint/naming-convention
       };
       this.outerStyle.padding = '0.05px'; // prevents margin collapse
     }

projects/tubular-ng-widgets/src/lib/time-editor/time-editor.component.ts

@@ -79,10 +79,20 @@ export const OPTIONS_ISO_DATE: TimeEditorOptions = {
   twoDigitYear: false
 };
 
+export const OPTIONS_ISO_TIME: TimeEditorOptions = {
+  dateTimeStyle: DateTimeStyle.TIME_ONLY,
+  decimal: '.',
+  hourStyle: HourStyle.HOURS_24,
+  numbering: 'latn',
+  showSeconds: true,
+  timeFieldSeparator: ':',
+};
+
 const namedOptions: Record<string, TimeEditorOptions> = {
   date_only: OPTIONS_DATE_ONLY,
   iso: OPTIONS_ISO,
-  iso_date: OPTIONS_ISO_DATE
+  iso_date: OPTIONS_ISO_DATE,
+  iso_time: OPTIONS_ISO_TIME
 };
 
 type TimeFormat = 'date' | 'time' | 'datetime-local';
@@ -1395,8 +1405,37 @@ export class TimeEditorComponent extends DigitSequenceEditorDirective<number> im
 
     if (newValue !== origValue || this.outOfRange) {
       i[sel].value = newValue;
+      let wallTime = this.getWallTimeFromDigits();
+
+      if (this.yearIndex >= 0 &&
+          (sel === this.signIndex || (this.yearIndex <= sel && sel < this.yearIndex + this.yearDigits))) {
+        const yi = this.yearIndex;
+        const yd = this.yearDigits;
+        const len = sel - yi + 2;
+        const yv = this.getDigits(yi, yd);
+        const yp = ((yv >= 0 ? '+' : '-') + abs(yv).toString().padStart(yd, '0')).substring(0, len);
+        let yearTarget: number;
+        let timeTarget: number | DateAndTime;
+
+        if (this.minLimit.year != null && wallTime.y < this.minLimit.year) {
+          yearTarget = this.minLimit.year;
+          timeTarget = this.minLimit.wallTime ?? this.minLimit.utc;
+        }
+        else if (this.maxLimit.year != null && wallTime.y > this.maxLimit.year) {
+          yearTarget = this.maxLimit.year;
+          timeTarget = this.maxLimit.wallTime ?? this.maxLimit.utc;
+        }
+
+        if (yearTarget != null) {
+          const tp = ((yearTarget >= 0 ? '+' : '-') + abs(yearTarget).toString().padStart(yd, '0')).substring(0, len);
+
+          if (yp === tp) {
+            this.updateDigits(new DateTime(timeTarget, this.timezone));
+            wallTime = this.getWallTimeFromDigits();
+          }
+        }
+      }
 
-      const wallTime = this.getWallTimeFromDigits();
       const wasLeap = (this._tai && wallTime.sec >= 60);
       let extraSec = (wasLeap ? 1 : 0);