trm-tmpl 3.2.2 → 3.3.1

package/lib/app/pages/components/constructor-form/components/constructor-field-iframe/constructor-field-iframe.component.d.ts

@@ -5,7 +5,6 @@ import * as i0 from "@angular/core";
 import * as i1 from "./iframe-validator-directive.directive";
 export declare class ConstructorFieldIframeComponent implements AfterViewInit, ControlValueAccessor {
     private _translateSrv;
-    private _sessionSrv;
     private _cd;
     private _control;
     private _injector;

package/lib/app/pages/components/constructor-form/components/method-amount-hint/method-amount-hint.component.d.ts

@@ -1,10 +1,13 @@
+import { TemplateRef } from '@angular/core';
 import { I18N_KEY } from './../../../../../i18n';
 import { PaymentFieldOptions } from "../../models";
 import * as i0 from "@angular/core";
 export declare class MethodAmountHintComponent {
+    private mainTpl;
     loading: boolean;
     options: PaymentFieldOptions;
     I18N_KEY: typeof I18N_KEY;
+    get feeTpl(): TemplateRef<any>;
     static ɵfac: i0.ɵɵFactoryDeclaration<MethodAmountHintComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<MethodAmountHintComponent, "app-method-amount-hint", never, { "loading": { "alias": "loading"; "required": false; }; "options": { "alias": "options"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/app/pages/components/constructor-form/constructor-form.component.d.ts

@@ -26,7 +26,7 @@ export declare class ConstructorFormComponent implements OnChanges, AfterViewIni
     feeOptions: PaymentFieldOptions;
     currency: string;
     userCurrency: string[];
-    loading: boolean;
+    loading: any;
     types: MethodType[];
     canReturnToProject: boolean;
     amountChanged: EventEmitter<number>;

package/lib/app/pages/components/constructor-form/models/payment-field-options.d.ts

@@ -5,7 +5,7 @@ export interface PaymentFieldOptionsItem {
     name?: string;
 }
 export interface PaymentFieldOptions {
-    info?: string;
+    info?: any;
     fee?: number;
     fixedFee?: number;
     minFixedFee?: number;

package/lib/app/pages/components/constructor-form/services/constructor-form.service.d.ts

@@ -20,8 +20,6 @@ export declare class ConstructorFormService extends FormGroup<{
     ready: boolean;
     constructor();
     get methodInfoLoading(): boolean;
-    continueLoaderOn(): void;
-    continueLoaderOff(): void;
     get paymentFormFieldNames(): string[];
     removePaymentFormControls(): void;
     init(): Observable<void>;

package/lib/app/pages/components/terminal-layout/terminal-layout.component.d.ts

@@ -30,6 +30,7 @@ export declare class TerminalLayoutComponent implements OnInit, OnDestroy {
     };
     scrollComponent: NgScrollbar;
     private urlChangeListener;
+    sessionLoading: any;
     constructor();
     get hasChoice(): boolean;
     get logoClass(): string;

package/lib/app/pages/directives/fee-template.directive.d.ts

@@ -0,0 +1,5 @@
+import * as i0 from "@angular/core";
+export declare class FeeTemplateDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<FeeTemplateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FeeTemplateDirective, "[terminalFee]", never, {}, {}, never, never, true, never>;
+}

package/lib/app/pages/directives/index.d.ts

@@ -1,2 +1,3 @@
 export * from './tab-index-focus.directive';
 export * from './input-mask-corrector.directive';
+export * from './fee-template.directive';

package/lib/app/services/session.data-source.d.ts

@@ -16,7 +16,6 @@ export declare class SessionDataSource {
     data$: BehaviorSubject<SessionInfo>;
     loading$: BehaviorSubject<boolean>;
     loadingMethodInfo$: BehaviorSubject<boolean>;
-    loadingConfirm$: BehaviorSubject<boolean>;
     private redirectUrl;
     private returnUrl;
     private configurations;

package/lib/app/terminal-tpl.component.d.ts

@@ -7,11 +7,12 @@ export declare class TerminalTplComponent implements OnInit, OnDestroy {
     ready$: BehaviorSubject<boolean>;
     langStorage: TranslateLangStorageService;
     private unSubscriber;
+    feeTpl: any;
     next(ev: any, document: Document): void;
     prev(ev: any, document: Document): void;
     ngOnInit(): void;
     private navigationEnd$;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TerminalTplComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TerminalTplComponent, "terminal-tpl", never, {}, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TerminalTplComponent, "terminal", never, {}, {}, ["feeTpl"], never, true, never>;
 }

package/lib/app/terminal.module.d.ts

@@ -1,9 +1,31 @@
+import { ApiErrorsService, ScriptLoader, TranslateLangStorageService } from './services';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "@angular/router";
-import * as i3 from "./terminal-tpl.component";
+import * as i1 from "@angular/router";
 export declare class TerminalModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<TerminalModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<TerminalModule, never, [typeof i1.CommonModule, typeof i2.RouterModule, typeof i3.TerminalTplComponent], never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<TerminalModule, never, [typeof i1.RouterModule], never>;
     static ɵinj: i0.ɵɵInjectorDeclaration<TerminalModule>;
 }
+export declare const provideTerminal: () => (typeof ApiErrorsService | typeof TranslateLangStorageService | typeof ScriptLoader | {
+    provide: import("@angular/core").InjectionToken<unknown>;
+    useValue: {
+        ru: import("i18n-iso-countries").LocalizedCountryNames<{
+            select: "official";
+        }>;
+        lt: import("i18n-iso-countries").LocalizedCountryNames<{
+            select: "official";
+        }>;
+        en: import("i18n-iso-countries").LocalizedCountryNames<{
+            select: "official";
+        }>;
+        es: import("i18n-iso-countries").LocalizedCountryNames<{
+            select: "official";
+        }>;
+        tr: import("i18n-iso-countries").LocalizedCountryNames<{
+            select: "official";
+        }>;
+        pt: import("i18n-iso-countries").LocalizedCountryNames<{
+            select: "official";
+        }>;
+    };
+})[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "trm-tmpl",
-  "version": "3.2.2",
+  "version": "3.3.1",
   "peerDependencies": {
     "@angular/common": "^15.2.0 || ^16.0.0 || ^17.0.0 || ^18.0.0",
     "@angular/core": "^15.2.0 || ^16.0.0 || ^17.0.0 || ^18.0.0",

package/scss/base.scss

@@ -1,12 +1,12 @@
-.trm {
-    background: #F5F5F5;
-    * {
-        box-sizing: border-box;
-    }
-
-    a:not(.gm-button) {
-        color: var(--color-primary-500);
-        font-weight: 500;
-        text-decoration: none;
-    }
-}
+.trm {
+    background: #F5F5F5;
+    * {
+        box-sizing: border-box;
+    }
+
+    a:not(.gm-button) {
+        color: var(--color-primary-500);
+        font-weight: 500;
+        text-decoration: none;
+    }
+}

package/scss/btn.scss

@@ -1,50 +1,50 @@
-@use './mixins' as mix;
-
-.trm {
-    .trm-button {
-        @include mix.flexRow(10px, center);
-        @include mix.font(14px, 20px, 500);
-        border-radius: 10px;
-        height: 42px;
-        outline: 0;
-        width: 100%;
-        border: none;
-        cursor: pointer;
-
-        @include mix.tablet {
-            height: 48px;
-            @include mix.font(15px, 22px, 500);
-        }
-
-        &--primary {
-            background: var(--color-primary-500);
-            color: white;
-            font-weight: 600;
-
-            &:hover, &:focus {
-                background: var(--color-primary-600);
-            }
-
-            &:active {
-                outline: 0;
-                background: var(--color-primary-650);
-            }
-
-            &:disabled {
-                background: var(--color-base-250);
-            }
-        }
-
-        &--secondary {
-            background: var(--color-base-50);
-
-            &:hover, &:focus {
-                background: var(--color-base-100);
-            }
-
-            &:active {
-                background: var(--color-base-150);
-            }
-        }
-    }
-}
+@use './mixins' as mix;
+
+.trm {
+    .trm-button {
+        @include mix.flexRow(10px, center);
+        @include mix.font(14px, 20px, 500);
+        border-radius: 10px;
+        height: 42px;
+        outline: 0;
+        width: 100%;
+        border: none;
+        cursor: pointer;
+
+        @include mix.tablet {
+            height: 48px;
+            @include mix.font(15px, 22px, 500);
+        }
+
+        &--primary {
+            background: var(--color-primary-500);
+            color: white;
+            font-weight: 600;
+
+            &:hover, &:focus {
+                background: var(--color-primary-600);
+            }
+
+            &:active {
+                outline: 0;
+                background: var(--color-primary-650);
+            }
+
+            &:disabled {
+                background: var(--color-base-250);
+            }
+        }
+
+        &--secondary {
+            background: var(--color-base-50);
+
+            &:hover, &:focus {
+                background: var(--color-base-100);
+            }
+
+            &:active {
+                background: var(--color-base-150);
+            }
+        }
+    }
+}

package/scss/currency.scss

@@ -1,31 +1,31 @@
-.trm {
-    --currency-color: var(--color-base-350);
-    --currency-amount-color: black;
-    &-currency {
-        color: var(--currency-color);
-        word-break: keep-all;
-        text-transform: none;
-    }
-
-    &-amount {
-        text-overflow: ellipsis;
-        overflow: hidden;
-        word-break: break-word;
-        white-space: nowrap;
-        font-weight: 500;
-
-        &__value {
-            margin-right: 2px;
-            white-space: nowrap;
-            color: var(--currency-amount-color);
-        }
-
-        &__int {
-            color: var(--currency-amount-int-color, var(--currency-amount-color));
-        }
-
-        &__fract {
-            color: var(--currency-amount-fract-color, var(--currency-amount-color));
-        }
-    }
-}
+.trm {
+    --currency-color: var(--color-base-350);
+    --currency-amount-color: black;
+    &-currency {
+        color: var(--currency-color);
+        word-break: keep-all;
+        text-transform: none;
+    }
+
+    &-amount {
+        text-overflow: ellipsis;
+        overflow: hidden;
+        word-break: break-word;
+        white-space: nowrap;
+        font-weight: 500;
+
+        &__value {
+            margin-right: 2px;
+            white-space: nowrap;
+            color: var(--currency-amount-color);
+        }
+
+        &__int {
+            color: var(--currency-amount-int-color, var(--currency-amount-color));
+        }
+
+        &__fract {
+            color: var(--currency-amount-fract-color, var(--currency-amount-color));
+        }
+    }
+}

package/scss/datepicker.scss

@@ -1,19 +1,19 @@
-.trm {
-    .mat-datepicker-toggle {
-        .mdc-icon-button.mat-mdc-icon-button [matdatepickertoggleicon] {
-            height: 24px;
-            width: 24px;
-            background-color: var(--color-base-300);
-        }
-
-        &.mat-datepicker-toggle-active {
-            .mdc-icon-button.mat-mdc-icon-button [matdatepickertoggleicon] {
-                background-color: var(--color-base-350) !important;
-            }
-        }
-    }
-
-    .mat-calendar-body-cell-content.mat-focus-indicator.mat-calendar-body-selected {
-        color: white;
-    }
-}
+.trm {
+    .mat-datepicker-toggle {
+        .mdc-icon-button.mat-mdc-icon-button [matdatepickertoggleicon] {
+            height: 24px;
+            width: 24px;
+            background-color: var(--color-base-300);
+        }
+
+        &.mat-datepicker-toggle-active {
+            .mdc-icon-button.mat-mdc-icon-button [matdatepickertoggleicon] {
+                background-color: var(--color-base-350) !important;
+            }
+        }
+    }
+
+    .mat-calendar-body-cell-content.mat-focus-indicator.mat-calendar-body-selected {
+        color: white;
+    }
+}

package/scss/fonts.scss

@@ -1,18 +1,18 @@
-@use './mixins' as mix;
-.trm {
-    * {
-        -webkit-font-smoothing: antialiased;
-        -webkit-tap-highlight-color: transparent;
-        -moz-osx-font-smoothing: auto;
-        font-family: 'Inter', sans-serif;
-    }
-
-    h5 {
-        @include mix.font(18px, 28px, 500);
-        margin: 0;
-    }
-
-    .text--warn {
-        color: var(--color-orange-500) !important;
-    }
-}
+@use './mixins' as mix;
+.trm {
+    * {
+        -webkit-font-smoothing: antialiased;
+        -webkit-tap-highlight-color: transparent;
+        -moz-osx-font-smoothing: auto;
+        font-family: 'Inter', sans-serif;
+    }
+
+    h5 {
+        @include mix.font(18px, 28px, 500);
+        margin: 0;
+    }
+
+    .text--warn {
+        color: var(--color-orange-500) !important;
+    }
+}

package/scss/icons.scss

@@ -1,9 +1,9 @@
-@use 'mixins';
-
-@use 'flag-icons/sass/flag-icons';
-@include mixins.load_PS_icons();
-@include mixins.load_currency_icons();
-
-@include mixins.additional-flag-icon(ab);
-@include mixins.additional-flag-icon(os);
-@include mixins.additional-flag-icon(other);
+@use 'mixins';
+
+@use 'flag-icons/sass/flag-icons';
+@include mixins.load_PS_icons();
+@include mixins.load_currency_icons();
+
+@include mixins.additional-flag-icon(ab);
+@include mixins.additional-flag-icon(os);
+@include mixins.additional-flag-icon(other);

package/scss/images.scss

@@ -1,43 +1,43 @@
-@use './variables' as vars;
-@use './mixins' as mix;
-
-.template-footer__logo {
-  @include mix.setBgImage(url(#{vars.$trm-tmpl-assets-base-url}/svg/pci-dss.svg), 113px, 42px);
-}
-
-.c-status {
-  &--progress {
-    .c-status__img {
-      background-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/status-wait.svg);
-    }
-  }
-
-  &--failed {
-    .c-status__img {
-      background-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/status-error.svg);
-    }
-  }
-
-  &__img {
-
-    @include mix.setBgImage(url(#{vars.$trm-tmpl-assets-base-url}/svg/status-success.svg), 56px, 56px);
-
-  }
-}
-
-.date {
-  &__toggle {
-    &Icon {
-      mask-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/datepicker.svg);
-    }
-  }
-}
-
-
-.trm-select {
-  &-value {
-    &__arrow {
-      mask-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/arrow_down.svg);
-    }
-  }
-}
+@use './variables' as vars;
+@use './mixins' as mix;
+
+.template-footer__logo {
+  @include mix.setBgImage(url(#{vars.$trm-tmpl-assets-base-url}/svg/pci-dss.svg), 113px, 42px);
+}
+
+.c-status {
+  &--progress {
+    .c-status__img {
+      background-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/status-wait.svg);
+    }
+  }
+
+  &--failed {
+    .c-status__img {
+      background-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/status-error.svg);
+    }
+  }
+
+  &__img {
+
+    @include mix.setBgImage(url(#{vars.$trm-tmpl-assets-base-url}/svg/status-success.svg), 56px, 56px);
+
+  }
+}
+
+.date {
+  &__toggle {
+    &Icon {
+      mask-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/datepicker.svg);
+    }
+  }
+}
+
+
+.trm-select {
+  &-value {
+    &__arrow {
+      mask-image: url(#{vars.$trm-tmpl-assets-base-url}/svg/arrow_down.svg);
+    }
+  }
+}

package/scss/index.scss

@@ -1,12 +1,12 @@
-@use 'theme';
-@use 'fonts';
-@use 'base';
-@use 'currency';
-@use 'spinner';
-@use 'utils';
-@use 'btn';
-@use 'input';
-@use 'icons';
-@use 'skeleton';
-@use 'validation';
-@use 'datepicker';
+@use 'theme';
+@use 'fonts';
+@use 'base';
+@use 'currency';
+@use 'spinner';
+@use 'utils';
+@use 'btn';
+@use 'input';
+@use 'icons';
+@use 'skeleton';
+@use 'validation';
+@use 'datepicker';

package/scss/input.scss

@@ -1,60 +1,60 @@
-@use './mixins' as mix;
-
-.trm {
-    --trm-input-border-color: var(--color-base-200);
-    --trm-input-border-color--hover: var(--color-base-250);
-    --trm-input-border-color--focus: var(--color-primary-500);
-
-
-    --trm-input-border-color--disabled: var(--color-base-200);
-    --trm-input-bg-color--disabled: var(--color-base-50);
-}
-
-.trm-input {
-    background: #FFFFFF;
-    border-radius: 10px;
-    &.trm-form-field {
-        -webkit-appearance: none;
-        border: 1px solid var(--trm-input-border-color);
-        border-radius: 10px;
-        width: 100%;
-        box-sizing: border-box;
-
-        min-height: 46px;
-        padding: 12px 20px;
-        @include mix.font(14px, 20px, 500);
-        @include mix.tablet {
-            min-height: 50px;
-            padding: 13px 20px;
-            @include mix.font(15px, 22px, 500);
-        }
-        &:hover {
-            border-color: var(--trm-input-border-color--hover);
-        }
-
-        &:focus, &:active {
-            box-shadow: 0 0 0 2px var(--trm-input-border-color--focus);
-            outline: none;
-        }
-
-        &.ng-invalid.ng-touched.ng-dirty {
-            --trm-input-border-color: var(--color-red-500);
-            --trm-input-border-color--hover: var(--color-red-500);
-            --trm-input-border-color--focus: transparent;
-        }
-    }
-}
-
-.trm-label {
-    @include mix.font(15px, 18px, 500);
-    margin-bottom: 10px;
-    display: block;
-}
-
-::-webkit-input-placeholder {
-    color: var(--color-base-350);
-}
-
-::placeholder {
-    color: var(--color-base-350);
-}
+@use './mixins' as mix;
+
+.trm {
+    --trm-input-border-color: var(--color-base-200);
+    --trm-input-border-color--hover: var(--color-base-250);
+    --trm-input-border-color--focus: var(--color-primary-500);
+
+
+    --trm-input-border-color--disabled: var(--color-base-200);
+    --trm-input-bg-color--disabled: var(--color-base-50);
+}
+
+.trm-input {
+    background: #FFFFFF;
+    border-radius: 10px;
+    &.trm-form-field {
+        -webkit-appearance: none;
+        border: 1px solid var(--trm-input-border-color);
+        border-radius: 10px;
+        width: 100%;
+        box-sizing: border-box;
+
+        min-height: 46px;
+        padding: 12px 20px;
+        @include mix.font(14px, 20px, 500);
+        @include mix.tablet {
+            min-height: 50px;
+            padding: 13px 20px;
+            @include mix.font(15px, 22px, 500);
+        }
+        &:hover {
+            border-color: var(--trm-input-border-color--hover);
+        }
+
+        &:focus, &:active {
+            box-shadow: 0 0 0 2px var(--trm-input-border-color--focus);
+            outline: none;
+        }
+
+        &.ng-invalid.ng-touched.ng-dirty {
+            --trm-input-border-color: var(--color-red-500);
+            --trm-input-border-color--hover: var(--color-red-500);
+            --trm-input-border-color--focus: transparent;
+        }
+    }
+}
+
+.trm-label {
+    @include mix.font(15px, 18px, 500);
+    margin-bottom: 10px;
+    display: block;
+}
+
+::-webkit-input-placeholder {
+    color: var(--color-base-350);
+}
+
+::placeholder {
+    color: var(--color-base-350);
+}