@colijnit/transaction 261.20.69 → 261.20.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/colijnit-transaction.mjs +479 -193
- package/fesm2022/colijnit-transaction.mjs.map +1 -1
- package/index.d.ts +82 -14
- package/lib/component/core/base/components/transaction-header-block/style/_layout.scss +0 -4
- package/lib/component/core/base/components/transaction-header-contact/style/_layout.scss +65 -0
- package/lib/component/core/base/components/transaction-header-contact/style/_material-definition.scss +25 -0
- package/lib/component/core/base/components/transaction-header-contact/style/_theme.scss +34 -0
- package/lib/component/core/base/components/transaction-header-contact/style/material.scss +4 -0
- package/lib/component/transaction-header/transaction-header-relation/style/_layout.scss +1 -1
- package/lib/component/transaction-header/transaction-header-relation/style/material.scss +1 -0
- package/package.json +2 -2
package/index.d.ts
CHANGED
|
@@ -861,7 +861,7 @@ declare class TransactionEventService {
|
|
|
861
861
|
readonly transactionCopyNavigation: Subject<string>;
|
|
862
862
|
readonly transactionDeleted: Subject<void>;
|
|
863
863
|
readonly transactionPaymentDone: Subject<void>;
|
|
864
|
-
readonly transactionLoaded: Subject<
|
|
864
|
+
readonly transactionLoaded: Subject<TransactionInfoResponse>;
|
|
865
865
|
readonly copyOrder: Subject<void>;
|
|
866
866
|
readonly updateTransactionReferences: Subject<void>;
|
|
867
867
|
readonly transactionLineVisibilityChange: BehaviorSubject<{
|
|
@@ -2081,6 +2081,7 @@ declare enum Icon {
|
|
|
2081
2081
|
CloseDialog = "close_dialog",
|
|
2082
2082
|
CodeRegular = "code_regular",
|
|
2083
2083
|
ContainerStorageRegularFull = "container_storage_regular_full",
|
|
2084
|
+
CopyRegularFull = "copy_regular_full",
|
|
2084
2085
|
CreditCardRegular = "credit_card_regular",
|
|
2085
2086
|
CreditCardRegularCheck = "credit_card_regular_check",
|
|
2086
2087
|
CreditCardSolid = "credit_card_solid",
|
|
@@ -4651,7 +4652,9 @@ declare class TransactionMappingService {
|
|
|
4651
4652
|
private _cardConfig;
|
|
4652
4653
|
private _sidePanelConfig;
|
|
4653
4654
|
private _quickAccessConfig;
|
|
4655
|
+
private _handledByDescription;
|
|
4654
4656
|
constructor(_buttonBarConfig: TransactionButtonBarMappingConfig, _filterConfig: TransactionFilterMappingConfig, _searchConfig: TransactionSearchMappingConfig, _lineConfig: TransactionLineMappingConfig, _cardConfig: TransactionCardMappingConfig, _sidePanelConfig: TransactionSidePanelMappingConfig, _quickAccessConfig: TransactionQuickAccessMappingConfig);
|
|
4657
|
+
getHandledByDescription(type: TransactionKind): string;
|
|
4655
4658
|
getButtonBar(type: TransactionKind): TransactionBarButton[];
|
|
4656
4659
|
getSidePanelComponent(type: TransactionKind): any;
|
|
4657
4660
|
getQuickAccessComponent(type: TransactionKind, category: TransactionTypeCategory): any;
|
|
@@ -7566,12 +7569,16 @@ declare class AvatarComponent implements OnInit {
|
|
|
7566
7569
|
get image(): CoDocument;
|
|
7567
7570
|
set relationId(value: number);
|
|
7568
7571
|
get relationId(): number;
|
|
7572
|
+
tooltipTitle: string;
|
|
7569
7573
|
set relation(value: RelationListObject);
|
|
7570
7574
|
get relation(): RelationListObject;
|
|
7571
|
-
|
|
7575
|
+
showRelationNr: boolean;
|
|
7572
7576
|
showClass(): boolean;
|
|
7573
|
-
imageSrc: string;
|
|
7574
7577
|
backgroundColor: string;
|
|
7578
|
+
imageSrc: string;
|
|
7579
|
+
relationName: string;
|
|
7580
|
+
tooltip: string;
|
|
7581
|
+
initialsFontSize: number;
|
|
7575
7582
|
set initials(value: string);
|
|
7576
7583
|
get initials(): string;
|
|
7577
7584
|
private _initials;
|
|
@@ -7586,14 +7593,24 @@ declare class AvatarComponent implements OnInit {
|
|
|
7586
7593
|
private _setRelationInitials;
|
|
7587
7594
|
private _getImageContent;
|
|
7588
7595
|
private _setBackgroundColor;
|
|
7596
|
+
private _handleRelationSet;
|
|
7597
|
+
/**
|
|
7598
|
+
* Returns the font size (in SVG user units) at which the initials still fit inside the round avatar.
|
|
7599
|
+
*
|
|
7600
|
+
* The widest text that fits a circle depends on how tall that text is: for a centred single line with cap height
|
|
7601
|
+
* `h` the usable chord is `2 * sqrt(r^2 - (h / 2)^2)`. Estimating the text width as
|
|
7602
|
+
* `length * AVATAR_GLYPH_ADVANCE_RATIO * fontSize` and the cap height as `AVATAR_CAP_HEIGHT_RATIO * fontSize` and solving for the
|
|
7603
|
+
* font size gives the expression below, capped at `AVATAR_MAX_FONT_SIZE` so short initials keep their normal size.
|
|
7604
|
+
*/
|
|
7605
|
+
private _calculateFontSize;
|
|
7589
7606
|
private _detectChanges;
|
|
7590
7607
|
static ɵfac: i0.ɵɵFactoryDeclaration<AvatarComponent, never>;
|
|
7591
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<AvatarComponent, "co-avatar", never, { "image": { "alias": "image"; "required": false; }; "relationId": { "alias": "relationId"; "required": false; }; "relation": { "alias": "relation"; "required": false; }; "
|
|
7608
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<AvatarComponent, "co-avatar", never, { "image": { "alias": "image"; "required": false; }; "relationId": { "alias": "relationId"; "required": false; }; "tooltipTitle": { "alias": "tooltipTitle"; "required": false; }; "relation": { "alias": "relation"; "required": false; }; "showRelationNr": { "alias": "showRelationNr"; "required": false; }; }, {}, never, never, false, never>;
|
|
7592
7609
|
}
|
|
7593
7610
|
|
|
7594
7611
|
declare class AvatarModule {
|
|
7595
7612
|
static ɵfac: i0.ɵɵFactoryDeclaration<AvatarModule, never>;
|
|
7596
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<AvatarModule, [typeof AvatarComponent], [typeof i2.CommonModule, typeof CoreModule], [typeof AvatarComponent]>;
|
|
7613
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<AvatarModule, [typeof AvatarComponent], [typeof i2.CommonModule, typeof CoreModule, typeof i3.TooltipDirectiveModule], [typeof AvatarComponent]>;
|
|
7597
7614
|
static ɵinj: i0.ɵɵInjectorDeclaration<AvatarModule>;
|
|
7598
7615
|
}
|
|
7599
7616
|
|
|
@@ -9938,7 +9955,7 @@ declare class TransactionSalesOverviewButtonBarButtonComponent extends Transacti
|
|
|
9938
9955
|
showCategories: boolean;
|
|
9939
9956
|
constructor(iconCacheService: IconCacheService, changeDetector: ChangeDetectorRef, _transactionEventService: TransactionEventService, _mappingService: TransactionMappingService, _dictionaryService: DictionaryService, _screenConfigService: TransactionScreenConfigurationService, _transactionService: TransactionService, _elementRef: ElementRef, _renderer: Renderer2, _transactionBaseService: TransactionService);
|
|
9940
9957
|
currentIcon(): Icon.CartShoppingRegular | Icon.ChartPieSimpleRegular;
|
|
9941
|
-
currentTitle(): "
|
|
9958
|
+
currentTitle(): "OVERVIEW" | "MARGINS";
|
|
9942
9959
|
ngOnDestroy(): void;
|
|
9943
9960
|
handleClickWrapper(event: MouseEvent): void;
|
|
9944
9961
|
handleMarginClicked(event: MouseEvent, category: TransactionTypeCategory): void;
|
|
@@ -9964,7 +9981,7 @@ declare class TransactionPurchaseOverviewButtonBarButtonComponent extends Transa
|
|
|
9964
9981
|
constructor(iconCacheService: IconCacheService, transactionHeaderService: TransactionHeaderService, transactionEventService: TransactionEventService, changeDetector: ChangeDetectorRef, _mappingService: TransactionMappingService, _transactionService: TransactionService, _elementRef: ElementRef);
|
|
9965
9982
|
ngOnDestroy(): void;
|
|
9966
9983
|
currentIcon(): Icon.CartShoppingRegular | Icon.ChartPieSimpleRegular;
|
|
9967
|
-
currentTitle(): "
|
|
9984
|
+
currentTitle(): "OVERVIEW" | "MARGINS";
|
|
9968
9985
|
handleClickWrapper(event: MouseEvent): void;
|
|
9969
9986
|
handleMarginClicked(event: MouseEvent, category: TransactionTypeCategory): Promise<void>;
|
|
9970
9987
|
private handleDocumentClick;
|
|
@@ -10016,7 +10033,7 @@ declare class TransactionSalesQuotationButtonBarButtonComponent extends Transact
|
|
|
10016
10033
|
showCategories: boolean;
|
|
10017
10034
|
constructor(iconCacheService: IconCacheService, changeDetector: ChangeDetectorRef, _transactionEventService: TransactionEventService, _mappingService: TransactionMappingService, _dictionaryService: DictionaryService, _screenConfigService: TransactionScreenConfigurationService, _transactionService: TransactionService, _elementRef: ElementRef, _renderer: Renderer2, _transactionBaseService: TransactionService);
|
|
10018
10035
|
currentIcon(): Icon.CartShoppingRegular | Icon.ChartPieSimpleRegular;
|
|
10019
|
-
currentTitle(): "
|
|
10036
|
+
currentTitle(): "OVERVIEW" | "MARGINS";
|
|
10020
10037
|
ngOnDestroy(): void;
|
|
10021
10038
|
handleClickWrapper(event: MouseEvent): void;
|
|
10022
10039
|
handleMarginClicked(event: MouseEvent, category: TransactionTypeCategory): void;
|
|
@@ -13701,7 +13718,6 @@ declare class TransactionHeaderBlockComponent {
|
|
|
13701
13718
|
secondBlockTemplate: TemplateRef<any>;
|
|
13702
13719
|
thirdBlockTemplate: TemplateRef<any>;
|
|
13703
13720
|
hiddenBlockTemplate: TemplateRef<any>;
|
|
13704
|
-
dontShowEditIcon: boolean;
|
|
13705
13721
|
headerClick: EventEmitter<MouseEvent>;
|
|
13706
13722
|
showClass(): boolean;
|
|
13707
13723
|
handleHostClick(event: MouseEvent): void;
|
|
@@ -13709,7 +13725,7 @@ declare class TransactionHeaderBlockComponent {
|
|
|
13709
13725
|
constructor(iconCacheService: IconCacheService);
|
|
13710
13726
|
onHeaderClick(event: MouseEvent): void;
|
|
13711
13727
|
static ɵfac: i0.ɵɵFactoryDeclaration<TransactionHeaderBlockComponent, never>;
|
|
13712
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<TransactionHeaderBlockComponent, "co-transaction-header-block", never, { "headerBlockTemplate": { "alias": "headerBlockTemplate"; "required": false; }; "firstBlockTemplate": { "alias": "firstBlockTemplate"; "required": false; }; "secondBlockTemplate": { "alias": "secondBlockTemplate"; "required": false; }; "thirdBlockTemplate": { "alias": "thirdBlockTemplate"; "required": false; }; "hiddenBlockTemplate": { "alias": "hiddenBlockTemplate"; "required": false; };
|
|
13728
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TransactionHeaderBlockComponent, "co-transaction-header-block", never, { "headerBlockTemplate": { "alias": "headerBlockTemplate"; "required": false; }; "firstBlockTemplate": { "alias": "firstBlockTemplate"; "required": false; }; "secondBlockTemplate": { "alias": "secondBlockTemplate"; "required": false; }; "thirdBlockTemplate": { "alias": "thirdBlockTemplate"; "required": false; }; "hiddenBlockTemplate": { "alias": "hiddenBlockTemplate"; "required": false; }; }, { "headerClick": "headerClick"; }, never, never, false, never>;
|
|
13713
13729
|
}
|
|
13714
13730
|
|
|
13715
13731
|
declare class TransactionHeaderBlockModule {
|
|
@@ -14054,8 +14070,14 @@ declare class TransactionHeaderComponent {
|
|
|
14054
14070
|
static ɵcmp: i0.ɵɵComponentDeclaration<TransactionHeaderComponent, "co-transaction-header", never, { "transaction": { "alias": "transaction"; "required": false; }; }, {}, never, never, false, never>;
|
|
14055
14071
|
}
|
|
14056
14072
|
|
|
14073
|
+
declare enum ContactValueKind {
|
|
14074
|
+
Email = "email",
|
|
14075
|
+
Phone = "phone"
|
|
14076
|
+
}
|
|
14077
|
+
|
|
14057
14078
|
declare class TransactionHeaderRelationComponent extends TransactionHeaderBaseComponent implements OnInit, OnDestroy {
|
|
14058
14079
|
readonly icons: typeof Icon;
|
|
14080
|
+
readonly contactKinds: typeof ContactValueKind;
|
|
14059
14081
|
showClass(): boolean;
|
|
14060
14082
|
firstAddress: string;
|
|
14061
14083
|
firstPostal: string;
|
|
@@ -14068,7 +14090,6 @@ declare class TransactionHeaderRelationComponent extends TransactionHeaderBaseCo
|
|
|
14068
14090
|
typeOfCustomerFullObject(relation: Relation): boolean;
|
|
14069
14091
|
get relationAsCustomer(): CustomerFullObject;
|
|
14070
14092
|
contactPersonForId(relationId: number): RelationContactLink;
|
|
14071
|
-
isPopupBlocked(): boolean;
|
|
14072
14093
|
handleHeaderClick(): void;
|
|
14073
14094
|
protected relationSet(): void;
|
|
14074
14095
|
protected transactionInfoSet(): void;
|
|
@@ -14077,9 +14098,49 @@ declare class TransactionHeaderRelationComponent extends TransactionHeaderBaseCo
|
|
|
14077
14098
|
static ɵcmp: i0.ɵɵComponentDeclaration<TransactionHeaderRelationComponent, "co-transaction-header-relation", never, {}, {}, never, never, false, never>;
|
|
14078
14099
|
}
|
|
14079
14100
|
|
|
14101
|
+
declare class TransactionHeaderContactComponent implements OnInit, OnDestroy {
|
|
14102
|
+
iconCacheService: IconCacheService;
|
|
14103
|
+
private _changeDetector;
|
|
14104
|
+
value: string;
|
|
14105
|
+
kind: ContactValueKind;
|
|
14106
|
+
showClass(): boolean;
|
|
14107
|
+
readonly icons: typeof Icon;
|
|
14108
|
+
copied: boolean;
|
|
14109
|
+
/**
|
|
14110
|
+
* Href of the `mailto:` / `tel:` link, or `undefined` when the value must render as plain text.
|
|
14111
|
+
* Only touch-only devices get a link: there a tap to call or to mail is what the user wants, and a
|
|
14112
|
+
* long press hands them the operating system's own "copy" menu. With a mouse the same link would
|
|
14113
|
+
* hijack the click and open an unwanted mail client.
|
|
14114
|
+
*/
|
|
14115
|
+
get href(): string;
|
|
14116
|
+
private _touchOnlyDevice;
|
|
14117
|
+
private _copyResetTimeoutId;
|
|
14118
|
+
constructor(iconCacheService: IconCacheService, _changeDetector: ChangeDetectorRef);
|
|
14119
|
+
ngOnInit(): void;
|
|
14120
|
+
ngOnDestroy(): void;
|
|
14121
|
+
handleValueClick(event: MouseEvent): void;
|
|
14122
|
+
handleCopyClick(event: MouseEvent): void;
|
|
14123
|
+
private _isTouchOnlyDevice;
|
|
14124
|
+
private _copyUsingFallback;
|
|
14125
|
+
private _confirmCopy;
|
|
14126
|
+
/**
|
|
14127
|
+
* Fallback for the pages where `navigator.clipboard` is missing — it needs a secure context, so it is
|
|
14128
|
+
* simply absent when iOne is served over plain http.
|
|
14129
|
+
*/
|
|
14130
|
+
private _copyUsingSelection;
|
|
14131
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TransactionHeaderContactComponent, never>;
|
|
14132
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TransactionHeaderContactComponent, "co-transaction-header-contact", never, { "value": { "alias": "value"; "required": false; }; "kind": { "alias": "kind"; "required": false; }; }, {}, never, never, false, never>;
|
|
14133
|
+
}
|
|
14134
|
+
|
|
14135
|
+
declare class TransactionHeaderContactModule {
|
|
14136
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TransactionHeaderContactModule, never>;
|
|
14137
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<TransactionHeaderContactModule, [typeof TransactionHeaderContactComponent], [typeof i2.CommonModule, typeof i3.IconModule, typeof PipeModule], [typeof TransactionHeaderContactComponent]>;
|
|
14138
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<TransactionHeaderContactModule>;
|
|
14139
|
+
}
|
|
14140
|
+
|
|
14080
14141
|
declare class TransactionHeaderRelationModule {
|
|
14081
14142
|
static ɵfac: i0.ɵɵFactoryDeclaration<TransactionHeaderRelationModule, never>;
|
|
14082
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<TransactionHeaderRelationModule, [typeof TransactionHeaderRelationComponent], [typeof i2.CommonModule, typeof TransactionHeaderBlockModule, typeof CheckoutModule, typeof RelationTypeModule, typeof CoreModule, typeof RelationGeneralModule, typeof RelationAddressModule, typeof RelationAddressesModule, typeof i3.InputCheckboxModule, typeof RelationContactDetailsModule, typeof RelationPreferencesModule, typeof PipeModule, typeof i3.CoDialogModule, typeof TransactionFilterCategoriesModule, typeof i3.ButtonModule, typeof i3.FormModule, typeof TransactionHeaderPopupModule, typeof i3.IconModule, typeof AvatarModule, typeof i3.ScreenConfigurationModule], [typeof TransactionHeaderRelationComponent]>;
|
|
14143
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<TransactionHeaderRelationModule, [typeof TransactionHeaderRelationComponent], [typeof i2.CommonModule, typeof TransactionHeaderBlockModule, typeof TransactionHeaderContactModule, typeof CheckoutModule, typeof RelationTypeModule, typeof CoreModule, typeof RelationGeneralModule, typeof RelationAddressModule, typeof RelationAddressesModule, typeof i3.InputCheckboxModule, typeof RelationContactDetailsModule, typeof RelationPreferencesModule, typeof PipeModule, typeof i3.CoDialogModule, typeof TransactionFilterCategoriesModule, typeof i3.ButtonModule, typeof i3.FormModule, typeof TransactionHeaderPopupModule, typeof i3.IconModule, typeof AvatarModule, typeof i3.ScreenConfigurationModule], [typeof TransactionHeaderRelationComponent]>;
|
|
14083
14144
|
static ɵinj: i0.ɵɵInjectorDeclaration<TransactionHeaderRelationModule>;
|
|
14084
14145
|
}
|
|
14085
14146
|
|
|
@@ -16473,7 +16534,9 @@ declare class TransactionSalesPersonInputModule {
|
|
|
16473
16534
|
static ɵinj: i0.ɵɵInjectorDeclaration<TransactionSalesPersonInputModule>;
|
|
16474
16535
|
}
|
|
16475
16536
|
|
|
16476
|
-
declare class TransactionHeaderHandledByComponent implements ScreenConfigAdapterComponent {
|
|
16537
|
+
declare class TransactionHeaderHandledByComponent implements ScreenConfigAdapterComponent, OnInit {
|
|
16538
|
+
private _mappingService;
|
|
16539
|
+
private _dictionary;
|
|
16477
16540
|
transaction: TransactionInfoResponse;
|
|
16478
16541
|
showClass(): boolean;
|
|
16479
16542
|
objectConfigName: string;
|
|
@@ -16484,13 +16547,18 @@ declare class TransactionHeaderHandledByComponent implements ScreenConfigAdapter
|
|
|
16484
16547
|
maxLength: number;
|
|
16485
16548
|
decimals: number;
|
|
16486
16549
|
redErrorBackground: boolean;
|
|
16550
|
+
relationName: string;
|
|
16551
|
+
handledByDescription: string;
|
|
16552
|
+
tooltip: string;
|
|
16553
|
+
constructor(_mappingService: TransactionMappingService, _dictionary: DictionaryService);
|
|
16554
|
+
ngOnInit(): void;
|
|
16487
16555
|
static ɵfac: i0.ɵɵFactoryDeclaration<TransactionHeaderHandledByComponent, never>;
|
|
16488
16556
|
static ɵcmp: i0.ɵɵComponentDeclaration<TransactionHeaderHandledByComponent, "co-transaction-header-handled-by", never, { "transaction": { "alias": "transaction"; "required": false; }; }, {}, never, never, false, never>;
|
|
16489
16557
|
}
|
|
16490
16558
|
|
|
16491
16559
|
declare class TransactionHeaderHandledByModule {
|
|
16492
16560
|
static ɵfac: i0.ɵɵFactoryDeclaration<TransactionHeaderHandledByModule, never>;
|
|
16493
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<TransactionHeaderHandledByModule, [typeof TransactionHeaderHandledByComponent], [typeof i2.CommonModule, typeof AvatarModule], [typeof TransactionHeaderHandledByComponent]>;
|
|
16561
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<TransactionHeaderHandledByModule, [typeof TransactionHeaderHandledByComponent], [typeof i2.CommonModule, typeof AvatarModule, typeof i3.TooltipDirectiveModule], [typeof TransactionHeaderHandledByComponent]>;
|
|
16494
16562
|
static ɵinj: i0.ɵɵInjectorDeclaration<TransactionHeaderHandledByModule>;
|
|
16495
16563
|
}
|
|
16496
16564
|
|
|
@@ -17,10 +17,6 @@
|
|
|
17
17
|
border-radius: $tp-transaction-header-block-border-radius $tp-transaction-header-block-border-radius 0 0;
|
|
18
18
|
z-index: 100;
|
|
19
19
|
}
|
|
20
|
-
&.no-pointer {
|
|
21
|
-
pointer-events: none;
|
|
22
|
-
cursor: initial;
|
|
23
|
-
}
|
|
24
20
|
.transaction-header-block-header {
|
|
25
21
|
font-family: $tp-transaction-header-block-label-font-family;
|
|
26
22
|
display: flex;
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
@include export-module('co-transaction-header-contact-layout') {
|
|
2
|
+
.co-transaction-header-contact {
|
|
3
|
+
display: flex;
|
|
4
|
+
align-items: center;
|
|
5
|
+
column-gap: var(--co-transaction-header-contact-column-gap);
|
|
6
|
+
min-width: 0;
|
|
7
|
+
|
|
8
|
+
.transaction-header-contact-value {
|
|
9
|
+
flex: 1 1 auto;
|
|
10
|
+
min-width: 0;
|
|
11
|
+
overflow: hidden;
|
|
12
|
+
text-overflow: ellipsis;
|
|
13
|
+
white-space: nowrap;
|
|
14
|
+
text-decoration: none;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.transaction-header-contact-copy {
|
|
18
|
+
display: flex;
|
|
19
|
+
align-items: center;
|
|
20
|
+
justify-content: center;
|
|
21
|
+
flex-shrink: 0;
|
|
22
|
+
width: var(--co-transaction-header-contact-copy-hit-size);
|
|
23
|
+
height: var(--co-transaction-header-contact-copy-hit-size);
|
|
24
|
+
cursor: pointer;
|
|
25
|
+
// Always visible, so the option is discoverable without a hovering pointer.
|
|
26
|
+
opacity: var(--co-transaction-header-contact-copy-idle-opacity);
|
|
27
|
+
transition: var(--co-transaction-header-contact-copy-transition);
|
|
28
|
+
|
|
29
|
+
&:hover, &.copied {
|
|
30
|
+
opacity: 1;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.co-icon {
|
|
34
|
+
width: var(--co-transaction-header-contact-copy-icon-size);
|
|
35
|
+
height: var(--co-transaction-header-contact-copy-icon-size);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
// Deliberately not the screen-mobile mixin: the target has to grow wherever a finger is doing the
|
|
40
|
+
// tapping, which is the same condition under which the component renders a mailto: / tel: link.
|
|
41
|
+
// A tablet in landscape is wider than the mobile breakpoint and still needs the bigger target.
|
|
42
|
+
@media only screen and (max-width: 700px), (hover: none) and (pointer: coarse) {
|
|
43
|
+
min-height: var(--co-transaction-header-contact-copy-hit-size-touch);
|
|
44
|
+
|
|
45
|
+
.transaction-header-contact-copy {
|
|
46
|
+
width: var(--co-transaction-header-contact-copy-hit-size-touch);
|
|
47
|
+
height: var(--co-transaction-header-contact-copy-hit-size-touch);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.transaction-header-contact-clipboard-proxy {
|
|
53
|
+
position: fixed;
|
|
54
|
+
top: 0;
|
|
55
|
+
left: 0;
|
|
56
|
+
width: 1px;
|
|
57
|
+
height: 1px;
|
|
58
|
+
padding: 0;
|
|
59
|
+
border-width: 0;
|
|
60
|
+
// iOS zooms in on a focused field below 16px, even one it cannot see.
|
|
61
|
+
font-size: 16px;
|
|
62
|
+
opacity: 0;
|
|
63
|
+
pointer-events: none;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
$tp-transaction-header-contact-column-gap: 4px !default;
|
|
2
|
+
$tp-transaction-header-contact-copy-icon-size: 11px !default;
|
|
3
|
+
$tp-transaction-header-contact-copy-hit-size: 16px !default;
|
|
4
|
+
// A finger needs a target of its own; on touch the contact row grows to fit it.
|
|
5
|
+
$tp-transaction-header-contact-copy-hit-size-touch: 32px !default;
|
|
6
|
+
$tp-transaction-header-contact-copy-idle-opacity: 0.45 !default;
|
|
7
|
+
$tp-transaction-header-contact-copy-transition: opacity 0.2s !default;
|
|
8
|
+
|
|
9
|
+
$tp-transaction-header-contact-copy-color: $tp-color-text-grey !default;
|
|
10
|
+
$tp-transaction-header-contact-copy-hover-color: $tp-color-action !default;
|
|
11
|
+
$tp-transaction-header-contact-copied-color: $tp-color-active !default;
|
|
12
|
+
|
|
13
|
+
@include export-module('co-transaction-header-contact-tokens') {
|
|
14
|
+
:root {
|
|
15
|
+
--co-transaction-header-contact-column-gap: #{$tp-transaction-header-contact-column-gap};
|
|
16
|
+
--co-transaction-header-contact-copy-icon-size: #{$tp-transaction-header-contact-copy-icon-size};
|
|
17
|
+
--co-transaction-header-contact-copy-hit-size: #{$tp-transaction-header-contact-copy-hit-size};
|
|
18
|
+
--co-transaction-header-contact-copy-hit-size-touch: #{$tp-transaction-header-contact-copy-hit-size-touch};
|
|
19
|
+
--co-transaction-header-contact-copy-idle-opacity: #{$tp-transaction-header-contact-copy-idle-opacity};
|
|
20
|
+
--co-transaction-header-contact-copy-transition: #{$tp-transaction-header-contact-copy-transition};
|
|
21
|
+
--co-transaction-header-contact-copy-color: #{$tp-transaction-header-contact-copy-color};
|
|
22
|
+
--co-transaction-header-contact-copy-hover-color: #{$tp-transaction-header-contact-copy-hover-color};
|
|
23
|
+
--co-transaction-header-contact-copied-color: #{$tp-transaction-header-contact-copied-color};
|
|
24
|
+
}
|
|
25
|
+
}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
@include export-module('co-transaction-header-contact-theme') {
|
|
2
|
+
.co-transaction-header-contact {
|
|
3
|
+
.transaction-header-contact-value {
|
|
4
|
+
color: inherit;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.transaction-header-contact-copy {
|
|
8
|
+
svg {
|
|
9
|
+
fill: var(--co-transaction-header-contact-copy-color);
|
|
10
|
+
}
|
|
11
|
+
[fill] {
|
|
12
|
+
fill: var(--co-transaction-header-contact-copy-color);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
&:hover {
|
|
16
|
+
svg {
|
|
17
|
+
fill: var(--co-transaction-header-contact-copy-hover-color);
|
|
18
|
+
}
|
|
19
|
+
[fill] {
|
|
20
|
+
fill: var(--co-transaction-header-contact-copy-hover-color);
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
&.copied {
|
|
25
|
+
svg {
|
|
26
|
+
fill: var(--co-transaction-header-contact-copied-color);
|
|
27
|
+
}
|
|
28
|
+
[fill] {
|
|
29
|
+
fill: var(--co-transaction-header-contact-copied-color);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
}
|
|
@@ -125,7 +125,7 @@
|
|
|
125
125
|
.header-relation-email {
|
|
126
126
|
margin: $tp-co-transaction-header-relation-content-email-margin;
|
|
127
127
|
}
|
|
128
|
-
.text-overflow {
|
|
128
|
+
.text-overflow, .co-transaction-header-contact .transaction-header-contact-value {
|
|
129
129
|
max-height: $tp-co-transaction-header-relation-content-line-height;
|
|
130
130
|
text-overflow: ellipsis;
|
|
131
131
|
overflow: hidden;
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
@import "./layout";
|
|
3
3
|
@import "./theme";
|
|
4
4
|
@import "../../../core/base/components/transaction-header-block/style/material";
|
|
5
|
+
@import "../../../core/base/components/transaction-header-contact/style/material";
|
|
5
6
|
@import "../../../relation/relation-type/style/material";
|
|
6
7
|
@import "../../../relation/relation-addresses/style/material";
|
|
7
8
|
@import "../../../relation/relation-address/style/material";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@colijnit/transaction",
|
|
3
|
-
"version": "261.20.
|
|
3
|
+
"version": "261.20.71",
|
|
4
4
|
"description": "Colijn IT transaction module for Angular 20",
|
|
5
5
|
"repository": "npm/npm",
|
|
6
6
|
"author": "Colijn IT",
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"@angular/core": ">=20.3.16",
|
|
12
12
|
"@colijnit/articleapi": ">=261.1.3",
|
|
13
13
|
"@colijnit/catalog": ">=261.20.3",
|
|
14
|
-
"@colijnit/corecomponents_v12": ">=261.20.
|
|
14
|
+
"@colijnit/corecomponents_v12": ">=261.20.20",
|
|
15
15
|
"@colijnit/ioneconnector": ">=261.1.4",
|
|
16
16
|
"@colijnit/mainapi": ">=261.1.13",
|
|
17
17
|
"@colijnit/product": ">=261.20.0",
|