@yomotech/view-toolkit 1.0.15 → 1.0.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yomotech/view-toolkit",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "peerDependencies": {
     "@angular/cdk": "^21.0.0",
     "@angular/common": "^21.0.0",
@@ -26,7 +26,8 @@
     "primeflex": "^4.0.0",
     "primeicons": "^7.0.0",
     "primeng": "^21.1.3",
-    "rxjs": "^7.8.1"
+    "rxjs": "^7.8.1",
+    "@aparajita/capacitor-secure-storage": "^7.1.6"
   },
   "dependencies": {
     "tslib": "^2.8.0"

package/types/yomotech-view-toolkit.d.ts

@@ -45,9 +45,17 @@ declare class UtilityService {
     };
     setStorage(key: string, value: any): Promise<void>;
     getStorage(key: string): Promise<string | null>;
+    /**
+     * Keys that hold a saved sign-in; on the devices they live in the keychain / keystore.
+     * keycloak: KeycloakInfo, oktaAuth: loginedUser, jwtToken: <project>Logined.
+     */
+    private readonly secureKeys;
+    private isSecureKey;
     setLocalStorage(key: string, value: any): Promise<void>;
     removeLocalStorage(keyName: string): Promise<void>;
     removeStorage(key: string): Promise<void>;
+    /** Reads a credential key from the keychain, moving a value stored the old way on first read. */
+    private getSecureItem;
     getLocalStorage<T = unknown>(key: string): Promise<any>;
     showAllProjects(): Promise<void>;
     parseBodyObject(obj: any): any;
@@ -126,24 +134,6 @@ declare class Couchdb {
     private getReadHeaders;
     private buildTenantHeaders;
     getImageSrcFromCouchDb(couchDbName: string, filePath: string): Promise<string>;
-    /**
-     * Returns a URL that a <video>, <audio> or <img> element can load directly.
-     *
-     * Unlike getImageSrcFromCouchDb above, this never reads the file. It asks
-     * jwt-auth for a short-lived signed URL and hands that back, so the browser
-     * fetches the attachment itself - with Range requests, so a video starts on
-     * the first chunk and a seek costs one request instead of the whole file.
-     *
-     * The reason a signed URL is needed at all: a media element issues its own
-     * HTTP requests, for the initial load and again for every seek, and those
-     * requests carry none of the tenant headers buildTenantHeaders adds here.
-     * The token in the query string is the only credential the element can pass.
-     *
-     * The path comes back from the endpoint and is used as given. The signature
-     * covers the raw, still-encoded path, so rebuilding it here with a different
-     * encoding would produce a URL that fails with a bare 403.
-     */
-    getMediaUrlFromCouchDb(couchDbName: string, filePath: string, attachmentName?: string): Promise<string>;
     static ɵfac: i0.ɵɵFactoryDeclaration<Couchdb, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<Couchdb>;
 }
@@ -169,6 +159,7 @@ declare class ConfigService {
         logoutRedirectUri: any;
         scope: any;
         responseType: any;
+        offlineAccess: boolean;
     } | null;
     private updateLoaderValue;
     currentLoader$: rxjs.Observable<any>;
@@ -188,6 +179,142 @@ declare class NotificationService {
     static ɵprov: i0.ɵɵInjectableDeclaration<NotificationService>;
 }
 
+type CustomKeyboardType = 'email' | 'numeric' | 'alpha' | 'string' | 'date' | 'time';
+declare function normalizeCustomKeyboardType(value: unknown): CustomKeyboardType | null;
+/**
+ * Keyboard for a field: option.keyboardType when the layout sets one, otherwise derived from the
+ * attribute (property schema) type. Returns null where the system keyboard stays in charge.
+ */
+declare function resolveCustomKeyboardType(option: any, property: any): CustomKeyboardType | null;
+
+type CustomKeyboardTarget = HTMLInputElement | HTMLTextAreaElement;
+interface CustomKeyboardSession {
+    target: CustomKeyboardTarget;
+    type: CustomKeyboardType;
+    originalReadOnly: boolean;
+    originalInputMode: string | null;
+    originalInputType: string | null;
+}
+declare class CustomKeyboardService {
+    private openingSuspendedUntil;
+    private lastKeyboardHeight;
+    private pickerOverlayOpen;
+    private pickerTriggerPressedUntil;
+    readonly interactionBlocked: i0.WritableSignal<boolean>;
+    private interactionUnlockTimer;
+    readonly activeSession: i0.WritableSignal<CustomKeyboardSession | null>;
+    isNativeMobile(): boolean;
+    open(target: CustomKeyboardTarget, type: CustomKeyboardType): Promise<void>;
+    private blockInitialInteraction;
+    private scrollTargetIntoDialogView;
+    private updateKeyboardHeight;
+    private canProcessKeyboardAction;
+    insert(character: string): void;
+    backspace(): void;
+    clear(): void;
+    close(option?: {
+        blurTarget?: boolean;
+        restoreAccessoryBar?: boolean;
+        keepBottomArea?: boolean;
+    }): void;
+    closeIfTargetInside(container: HTMLElement): void;
+    private updateTarget;
+    private isValidValue;
+    private moveCursorToEnd;
+    private readonly documentPointerDownHandler;
+    private readonly activeTargetBlurHandler;
+    private handleDocumentPointerDown;
+    private handleActiveTargetBlur;
+    private insertDateTimeDigit;
+    private removeDateTimeDigit;
+    private setCaret;
+    /** Number of digits left of the cursor; the end when the field has no usable selection. */
+    private digitsBeforeCaret;
+    private updateDateTimeTarget;
+    /** String position right after the given number of digits, separators included. */
+    private positionAfterDigits;
+    private formatDateDigits;
+    private formatTimeDigits;
+    beginPickerOverlay(): void;
+    endPickerOverlay(option?: {
+        suspendReopen?: boolean;
+        keepBottomArea?: boolean;
+    }): void;
+    /**
+     * A panel docked at the bottom (date or time picker) takes the keyboard's place: the same body
+     * class and height variable let the dialog end above it.
+     */
+    reserveBottomArea(panel: HTMLElement | null): void;
+    releaseBottomArea(): void;
+    getActiveValue(type: CustomKeyboardType, targetName?: string): string | null;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CustomKeyboardService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CustomKeyboardService>;
+}
+
+declare class DateTimePickerService {
+    private readonly keyboard;
+    /** On the devices the date picker docks at the bottom like a keyboard; in a browser it drops down. */
+    readonly isNativeMobile: boolean;
+    /** panelStyleClass of a date picker. */
+    readonly datePanelClass: string;
+    /** panelStyleClass of a time picker: compact and attached to its field everywhere. */
+    readonly timePanelClass = "model-datepicker-panel model-timepicker-panel";
+    /**
+     * The docked date picker runs without PrimeNG's open/close animation. The animation scales the
+     * wrapper around the panel, and a transformed wrapper becomes the reference of the panel's
+     * position: fixed - the docked calendar flew up next to its field while closing.
+     */
+    readonly dockedMotion: {
+        disabled: boolean;
+    } | undefined;
+    private activePicker;
+    private activePickerRequest;
+    private pickerOpening;
+    private lockedPickerInput;
+    constructor(keyboard: CustomKeyboardService);
+    /** (onShow) of a picker. */
+    onShown(): void;
+    /** (onClose) of a picker; pass the picker so a late close of a replaced one is ignored. */
+    onClose(picker?: any): void;
+    /** (pointerdown) of the calendar or clock icon inside a .picker-field. */
+    openFromIcon(event: PointerEvent, picker: any): Promise<void>;
+    /** (click) of the icon. */
+    blockIconClick(event: MouseEvent): void;
+    /** (pointerdown) of the p-datepicker: a tap into its field while a picker is open. */
+    onFieldPointerDown(event: PointerEvent, picker: any): void;
+    /** (onFocus) of the p-datepicker. */
+    onFieldFocus(event: any): void;
+    /**
+     * For ngOnDestroy of a container: a picker can still be open when its dialog or page goes away.
+     * Without this the keyboard service keeps "picker open" and the reserved bottom area: no
+     * toolkit keyboard opens any more and the next dialog is cut short above an empty strip.
+     */
+    closeIfWithin(container: HTMLElement): void;
+    /**
+     * A month has five or six week rows, so the docked calendar grew and shrank while paging
+     * through the months and its upper edge went up and down. It keeps the height of six rows.
+     */
+    private keepSixWeekHeight;
+    /**
+     * Scrolls the dialog so the field sits right above the docked picker: the eye and the thumb
+     * move a short way from the value to the picker instead of across the whole screen.
+     */
+    private scrollFieldAbovePicker;
+    private configureDateTimeInput;
+    private lockPickerInput;
+    private unlockPickerInput;
+    /**
+     * The pointerdown on the icon closes the toolkit keyboard and the layout below the finger can
+     * change. The click that follows lands wherever the finger is now - in the emulator it opened
+     * the autocomplete list of the field that had moved under it. A click that no longer hits the
+     * icon is dropped; one on the icon passes, so other lists still close on it.
+     */
+    private swallowShiftedClick;
+    private closeActivePicker;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateTimePickerService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<DateTimePickerService>;
+}
+
 declare class CardComponent {
     private utilityService;
     private platform;
@@ -199,6 +326,9 @@ declare class CardComponent {
     private notificationService;
     private oauthService;
     private requestService;
+    /** Date and time picker behaviour shared by all containers. */
+    readonly picker: DateTimePickerService;
+    private readonly pickerHost;
     /** Keep existing checkbox data objects usable; new objects use boolean. */
     renderFieldType(type: string | undefined): string | undefined;
     itemInfo: any;
@@ -291,7 +421,11 @@ declare class CardComponent {
     static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "vl-card", never, { "itemInfo": { "alias": "itemInfo"; "required": false; }; "currentPage": { "alias": "currentPage"; "required": false; }; "pageSize": { "alias": "pageSize"; "required": false; }; "selectedLanguageInfo": { "alias": "selectedLanguageInfo"; "required": false; }; "mobileDisplay": { "alias": "mobileDisplay"; "required": false; }; "scrollPagination": { "alias": "scrollPagination"; "required": false; }; "pages": { "alias": "pages"; "required": false; }; "paginationMode": { "alias": "paginationMode"; "required": false; }; "paginationLoading": { "alias": "paginationLoading"; "required": false; }; }, { "cardButtonClick": "cardButtonClick"; "cardHeaderButtonClick": "cardHeaderButtonClick"; "linkDetails": "linkDetails"; "imageDetails": "imageDetails"; "onPageSizeChange": "onPageSizeChange"; "onPageChange": "onPageChange"; "cardDataChange": "cardDataChange"; }, never, never, true, never>;
 }
 
-declare class FormComponent implements OnInit, OnChanges, AfterViewInit {
+declare class FormComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy {
+    /** Date and time picker behaviour shared by all containers. */
+    readonly picker: DateTimePickerService;
+    private readonly host;
+    ngOnDestroy(): void;
     /** Keep existing checkbox data objects usable; new objects use boolean. */
     renderFieldType(type: string | undefined): string | undefined;
     customEmailPattern: string;
@@ -324,16 +458,9 @@ declare class FormComponent implements OnInit, OnChanges, AfterViewInit {
     setValidations(): void;
     matchData: any;
     getLabel(formField: any): any;
-    onPickerContainerPointerDown(event: any, datePicker: any): void;
-    onPickerInputFocus(event: any, datePicker: any): void;
-    openPickerFromIcon(event: any, datePicker: any): void;
-    onPickerShown(): void;
-    onPickerClose(): void;
     dateChangeEvent(formField: any, event: any): void;
     onDateTyping(event: any): void;
     onTimeTyping(event: any): void;
-    onTimePanelShow(formField: any): void;
-    blockPickerIconClick(event: any): void;
     timeChangeEvent(formField: any, event: any): void;
     autocompChangeEvent(event: any, formfield: any): void;
     autocompFocusOutEvent(event: any, formfield: any): void;
@@ -345,11 +472,15 @@ interface GridColumnFilterState {
     operator: string;
     value: string;
 }
-declare class GridComponent implements AfterViewInit {
+declare class GridComponent implements AfterViewInit, OnDestroy {
     private requestService;
     private utilityService;
     private notificationService;
     private oktaAuthService;
+    /** Date and time picker behaviour shared by all containers. */
+    readonly picker: DateTimePickerService;
+    private readonly host;
+    ngOnDestroy(): void;
     /** New data objects use boolean; older projects may still use checkbox. */
     isLegacyCheckboxFieldType(type: string | undefined): boolean;
     isLogined: boolean;
@@ -479,69 +610,20 @@ declare class LogsComponent {
     static ɵcmp: i0.ɵɵComponentDeclaration<LogsComponent, "vl-logs", never, {}, {}, never, never, true, never>;
 }
 
-type CustomKeyboardType = 'email' | 'numeric' | 'alpha' | 'string' | 'date' | 'time';
-declare function normalizeCustomKeyboardType(value: unknown): CustomKeyboardType | null;
-
-type CustomKeyboardTarget = HTMLInputElement | HTMLTextAreaElement;
-interface CustomKeyboardSession {
-    target: CustomKeyboardTarget;
-    type: CustomKeyboardType;
-    originalReadOnly: boolean;
-    originalInputMode: string | null;
-    originalInputType: string | null;
-}
-declare class CustomKeyboardService {
-    private openingSuspendedUntil;
-    private pickerOverlayOpen;
-    private pickerTriggerPressedUntil;
-    readonly interactionBlocked: i0.WritableSignal<boolean>;
-    private interactionUnlockTimer;
-    readonly activeSession: i0.WritableSignal<CustomKeyboardSession | null>;
-    isNativeMobile(): boolean;
-    open(target: CustomKeyboardTarget, type: CustomKeyboardType): Promise<void>;
-    private blockInitialInteraction;
-    private scrollTargetIntoDialogView;
-    private updateKeyboardHeight;
-    private canProcessKeyboardAction;
-    insert(character: string): void;
-    backspace(): void;
-    clear(): void;
-    close(option?: {
-        blurTarget?: boolean;
-        restoreAccessoryBar?: boolean;
-    }): void;
-    closeIfTargetInside(container: HTMLElement): void;
-    private updateTarget;
-    private isValidValue;
-    private moveCursorToEnd;
-    private readonly documentPointerDownHandler;
-    private readonly activeTargetBlurHandler;
-    private handleDocumentPointerDown;
-    private handleActiveTargetBlur;
-    private insertDateTimeDigit;
-    private formatDateDigits;
-    private formatTimeDigits;
-    private removeDateTimeDigit;
-    beginPickerOverlay(): void;
-    endPickerOverlay(): void;
-    getActiveValue(type: CustomKeyboardType, targetName?: string): string | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<CustomKeyboardService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<CustomKeyboardService>;
-}
-
-declare class ModelComponent implements OnChanges {
+declare class ModelComponent implements OnChanges, OnDestroy {
     private cdr;
     private readonly dialogRef;
     private readonly dialogConfig;
     private utilityService;
-    private readonly customKeyboardService;
     /** Keep existing checkbox data objects usable; new objects use boolean. */
     renderFieldType(type: string | undefined): string | undefined;
-    private activePickerRequest;
+    /** Date and time picker behaviour shared by all containers. */
+    readonly picker: DateTimePickerService;
+    private readonly host;
+    /** The toolkit keyboard for a field, from option.keyboardType or the attribute type. */
+    keyboardTypeFor(formField: any): CustomKeyboardType | null;
     matchData: any[];
     date2: Date | undefined;
-    private pickerOpening;
-    private lockedPickerInput;
     errorMessages: any;
     modalItemInfo: any;
     selectedLanguageInfo: any;
@@ -550,8 +632,9 @@ declare class ModelComponent implements OnChanges {
     copyLayoutSchema: any;
     isLoading: boolean;
     projectLanguage: any;
-    constructor(cdr: ChangeDetectorRef, dialogRef: DynamicDialogRef, dialogConfig: DynamicDialogConfig, utilityService: UtilityService, customKeyboardService: CustomKeyboardService);
+    constructor(cdr: ChangeDetectorRef, dialogRef: DynamicDialogRef, dialogConfig: DynamicDialogConfig, utilityService: UtilityService);
     ngAfterViewInit(): void;
+    ngOnDestroy(): void;
     ngOnChanges(changes: SimpleChanges): void;
     private initializeDialogContent;
     private updateDialogHeader;
@@ -602,16 +685,6 @@ declare class ModelComponent implements OnChanges {
     invokeFormBtnClick(option: any, propertySchema: any, form: NgForm): void;
     checkValidty(form: NgForm): boolean;
     onCancel(): void;
-    onPickerShown(): void;
-    onPickerClose(): void;
-    openPickerFromIcon(event: PointerEvent, picker: any): Promise<void>;
-    onPickerInputFocus(event: any): void;
-    forceNumericKeyboard(event: any): void;
-    private configureDateTimeInput;
-    private lockPickerInput;
-    private unlockPickerInput;
-    blockPickerIconClick(event: MouseEvent): void;
-    onPickerContainerPointerDown(event: PointerEvent, picker: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ModelComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ModelComponent, "vl-model", never, { "errorMessages": { "alias": "errorMessages"; "required": false; }; "modalItemInfo": { "alias": "modalItemInfo"; "required": false; }; "selectedLanguageInfo": { "alias": "selectedLanguageInfo"; "required": false; }; "userInfo": { "alias": "userInfo"; "required": false; }; "setFormDataHandler": { "alias": "setFormDataHandler"; "required": false; }; }, {}, never, never, true, never>;
 }
@@ -662,6 +735,13 @@ declare class MobileKeycloakService {
     private tokens;
     constructor(config: ConfigService, http: HttpClient, utilityService: UtilityService, platform: Platform);
     login(): Promise<any>;
+    /** The configured scope plus offline_access, without duplicating it. */
+    private withOfflineAccess;
+    /**
+     * New tokens from the refresh token (grant_type=refresh_token). Returns them in the stored token
+     * shape, or null when Keycloak refuses - then the caller falls back to the login.
+     */
+    refreshTokens(stored: MobileAuthTokens | any): Promise<any | null>;
     getUserInfo(accessToken: any, issuer: any): Promise<any>;
     getAccessToken(): string | null;
     getRefreshToken(): string | null;
@@ -690,6 +770,8 @@ declare class SideMenuComponent implements AfterViewInit, OnChanges, OnDestroy {
     menuItemsCopy: any[];
     settingMenu: any;
     setLanguage: boolean;
+    /** Translations of the last language change, for menu items that arrive after it. */
+    private lastMenuTranslations;
     tenantKey: string;
     scrollPagination: any;
     private oktaAuthStateSubscription?;
@@ -851,6 +933,8 @@ declare class Textbox {
         classes: any;
         style: any;
     };
+    /** The toolkit keyboard for this field, from option.keyboardType or the attribute type. */
+    keyboardTypeFor(formField: any): CustomKeyboardType | null;
     getPlaceholder(formField: any): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<Textbox, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<Textbox, "vl-textbox", never, { "formField": { "alias": "formField"; "required": false; }; "modalItemInfo": { "alias": "modalItemInfo"; "required": false; }; }, {}, never, never, true, never>;
@@ -880,13 +964,21 @@ declare class AppVersionResetService {
 declare class CustomKeyboardComponent {
     readonly keyboard: CustomKeyboardService;
     readonly uppercase: i0.WritableSignal<boolean>;
-    private readonly digitRow;
-    private readonly letterRows;
+    /** true while the ?123 page is shown instead of the letters. */
+    readonly symbols: i0.WritableSignal<boolean>;
+    private readonly languageCode;
+    private readonly projectLayout;
+    constructor();
     get keyboardType(): CustomKeyboardType | null;
+    /** The symbol page exists where free text is typed. */
+    get hasSymbolPage(): boolean;
     get rows(): string[][];
+    /** ß has no single-letter capital in common use ("SS"), so it keeps its form. */
+    private toUpper;
     enterKey(key: string): void;
     enterSpace(): void;
     toggleCase(): void;
+    toggleSymbols(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CustomKeyboardComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<CustomKeyboardComponent, "vl-custom-keyboard", never, {}, {}, never, never, true, never>;
 }
@@ -905,5 +997,5 @@ declare class CustomKeyboardDirective implements OnDestroy {
     static ɵdir: i0.ɵɵDirectiveDeclaration<CustomKeyboardDirective, "[vlCustomKeyboard]", never, { "keyboardType": { "alias": "vlCustomKeyboard"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-export { AppVersionResetService, CardComponent, ConfigService, Couchdb, CustomKeyboardComponent, CustomKeyboardDirective, CustomKeyboardService, FormComponent, GridComponent, HeaderMenuComponent, LogsComponent, MobileKeycloakService, ModelComponent, NetworkLogService, NotificationService, PaginationComponent, RequestService, SideMenuComponent, UtilityService, ViewToolkitModule, normalizeCustomKeyboardType };
+export { AppVersionResetService, CardComponent, ConfigService, Couchdb, CustomKeyboardComponent, CustomKeyboardDirective, CustomKeyboardService, FormComponent, GridComponent, HeaderMenuComponent, LogsComponent, MobileKeycloakService, ModelComponent, NetworkLogService, NotificationService, PaginationComponent, RequestService, SideMenuComponent, UtilityService, ViewToolkitModule, normalizeCustomKeyboardType, resolveCustomKeyboardType };
 export type { CustomKeyboardTarget, CustomKeyboardType, MobileAuthTokens };