@colijnit/relation 12.1.1 → 12.1.3

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.
Files changed (19) hide show
  1. package/README.md +24 -24
  2. package/bundles/colijnit-relation.umd.js +21 -5
  3. package/bundles/colijnit-relation.umd.js.map +1 -1
  4. package/colijnit-relation.metadata.json +1 -1
  5. package/esm2015/lib/component/base/relation-base.component.js +2 -1
  6. package/esm2015/lib/component/relation-contact-options/relation-contact-option.component.js +2 -2
  7. package/esm2015/lib/component/relation-contact-options/relation-contact-options.component.js +37 -21
  8. package/esm2015/lib/component/relation-contact-options/relation-contact-options.module.js +4 -3
  9. package/esm2015/lib/enum/icon.enum.js +1 -1
  10. package/esm2015/lib/model/icon-svg.js +1 -1
  11. package/esm2015/lib/relation-version.js +3 -3
  12. package/esm2015/lib/res/dictionary/dictionaries.js +1 -1
  13. package/fesm2015/colijnit-relation.js +42 -24
  14. package/fesm2015/colijnit-relation.js.map +1 -1
  15. package/lib/component/relation-contact-options/relation-contact-options.component.d.ts +4 -1
  16. package/lib/component/relation-contact-options/style/_layout.scss +44 -4
  17. package/lib/component/relation-contact-options/style/_material-definition.scss +17 -5
  18. package/lib/component/relation-contact-options/style/_theme.scss +18 -2
  19. package/package.json +1 -1
package/lib/component/relation-contact-options/relation-contact-options.component.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { ChangeDetectorRef, ElementRef } from '@angular/core';
1
+ import { ChangeDetectorRef, ElementRef, EventEmitter } from '@angular/core';
2
2
  import { RelationScreenConfigBaseComponent } from '../base/relation-screen-config-base.component';
3
3
  import { RelmanContactOptionsCfgNames } from '../../enum/relman-contact-options-cfg-names';
4
4
  import { ContactOption } from '@colijnit/relationapi/build/model/contact-option.bo';
@@ -15,6 +15,7 @@ export declare class RelationContactOptionsComponent extends RelationScreenConfi
15
15
  protected relationEventService: RelationEventService;
16
16
  private _overlayService;
17
17
  private _changeDetector;
18
+ deleteClick: EventEmitter<ContactOption>;
18
19
  readonly commType: typeof CommunicationType;
19
20
  readonly generalContactOptionsCfgNames: RelmanContactOptionsCfgNames;
20
21
  overlayParent: ElementRef;
@@ -37,4 +38,6 @@ export declare class RelationContactOptionsComponent extends RelationScreenConfi
37
38
  private _handleCreateOtherType;
38
39
  private _getCollection;
39
40
  private _resetNew;
41
+ hideNewEmail(): void;
42
+ hideNewPhone(): void;
40
43
  }
package/lib/component/relation-contact-options/style/_layout.scss CHANGED
@@ -1,7 +1,13 @@
1
1
  @include export-module('co-relation-contact-options-layout') {
2
2
  .co-relation-contact-options {
3
+ display: flex;
4
+ align-items: flex-start;
5
+ gap: $re-co-relation-contact-options-gap;
3
6
  font-family: $re-co-relation-contact-options-font-family;
4
7
  font-size: $re-co-relation-contact-options-font-size;
8
+ .co-relation-contact-option-list {
9
+ flex: 1;
10
+ }
5
11
  .relation-contact-options-label {
6
12
  font-family: $re-co-relation-contact-options-label-font-family;
7
13
  font-size: $re-co-relation-contact-options-label-font-size;
@@ -12,10 +18,33 @@
12
18
  align-items: center;
13
19
  margin: $re-co-relation-contact-options-label-margin;
14
20
  gap: $re-co-relation-contact-options-label-gap;
15
- .co-icon {
21
+ .co-button {
16
22
  cursor: pointer;
17
- height: $re-co-relation-contact-options-label-icon-size;
23
+ height: $re-co-relation-contact-options-label-icon-height;
24
+ width: $re-co-relation-contact-options-label-icon-width;
25
+ background-color: $re-co-relation-contact-options-label-background-color;
26
+ border-color: $re-co-relation-contact-options-label-border-color;
27
+ border-width: $re-co-relation-contact-options-label-border-width;
28
+ border-style: solid;
29
+ padding: $re-co-relation-contact-options-label-icon-padding;
30
+ &:hover {
31
+ filter: none;
32
+ }
33
+ }
34
+ .label {
35
+ color: $re-co-relation-contact-options-label-icon-color;
36
+ font-size: $re-co-relation-contact-options-label-icon-font-size;
37
+ }
38
+ .co-icon {
18
39
  width: $re-co-relation-contact-options-label-icon-size;
40
+ height: $re-co-relation-contact-options-label-icon-size;
41
+ margin: $re-co-relation-contact-options-label-icon-margin;
42
+ svg {
43
+ fill: $re-co-relation-contact-options-label-icon-color;
44
+ }
45
+ [fill] {
46
+ fill: $re-co-relation-contact-options-label-icon-color;
47
+ }
19
48
  }
20
49
  }
21
50
  .contact-option-wrapper {
@@ -39,11 +68,22 @@
39
68
  position: relative;
40
69
  .co-icon {
41
70
  cursor: pointer;
42
- height: $re-co-relation-contact-option-delete-icon-size;
43
- width: $re-co-relation-contact-option-delete-icon-size;
71
+ height: $re-co-relation-contact-option-left-icon-size;
72
+ width: $re-co-relation-contact-option-left-icon-size;
73
+ &.relation-contact-delete {
74
+ height: $re-co-relation-contact-option-delete-icon-size;
75
+ width: $re-co-relation-contact-option-delete-icon-size;
76
+ position: absolute;
77
+ top: $re-co-relation-contact-option-delete-icon-top;
78
+ right: $re-co-relation-contact-option-delete-icon-right;
79
+ }
44
80
  }
45
81
  &.new-contact-option {
46
82
  margin: $re-co-relation-contact-options-type-new-option-margin;
83
+ flex: 1;
84
+ }
85
+ &:last-child {
86
+ margin-bottom: 10px;
47
87
  }
48
88
  }
49
89
  .relation-contact-option-sequence {
package/lib/component/relation-contact-options/style/_material-definition.scss CHANGED
@@ -1,15 +1,24 @@
1
1
  $re-co-relation-contact-options-font-family: $re-font-family !default;
2
2
  $re-co-relation-contact-options-font-size: $re-font-size !default;
3
3
  $re-co-relation-contact-options-font-color: $re-color-font !default;
4
-
4
+ $re-co-relation-contact-options-gap: 10px !default;
5
5
  $re-co-relation-contact-options-label-font-family: $re-font-family !default;
6
6
  $re-co-relation-contact-options-label-font-size: $re-font-size !default;
7
7
 
8
- $re-co-relation-contact-options-label-margin: 10px 0 !default;
8
+ $re-co-relation-contact-options-label-margin: 0 0 10px 0 !default;
9
9
  $re-co-relation-contact-options-label-gap: 10px !default;
10
- $re-co-relation-contact-options-label-icon-size: 15px !default;
10
+ $re-co-relation-contact-options-label-icon-width: 100% !default;
11
+ $re-co-relation-contact-options-label-icon-height: 24px !default;
12
+ $re-co-relation-contact-options-label-icon-size: 12px !default;
13
+ $re-co-relation-contact-options-label-icon-font-size: 11px !default;
11
14
  $re-co-relation-contact-options-label-icon-color: $re-color-action !default;
12
- $re-co-relation-contact-options-type-gap: 5px !default;
15
+ $re-co-relation-contact-options-label-icon-margin: 0 15px !default;
16
+ $re-co-relation-contact-options-label-icon-padding: 0 !default;
17
+ $re-co-relation-contact-options-label-background-color: #FFF !default;
18
+ $re-co-relation-contact-options-label-border-color: $re-color-action !default;
19
+ $re-co-relation-contact-options-label-border-width: 1px 1px 1px 1px !default;
20
+ $re-co-relation-contact-options-label-delete-icon-color: $re-color-font !default;
21
+ $re-co-relation-contact-options-type-gap: 10px !default;
13
22
  $re-co-relation-contact-options-type-new-option-margin: 0 0 10px 0 !default;
14
23
 
15
24
  $re-co-relation-contact-options-sequence-background-color: #e85152 !default;
@@ -32,4 +41,7 @@ $re-co-relation-contact-options-type-popup-item-hover-background-color: $re-colo
32
41
  $re-co-relation-contact-options-type-popup-item-hover-color: $re-color-font !default;
33
42
 
34
43
  $re-co-relation-contact-option-gap: 10px !default;
35
- $re-co-relation-contact-option-delete-icon-size: 20px !default;
44
+ $re-co-relation-contact-option-left-icon-size: 20px !default;
45
+ $re-co-relation-contact-option-delete-icon-size: 12px !default;
46
+ $re-co-relation-contact-option-delete-icon-top: 5px !default;
47
+ $re-co-relation-contact-option-delete-icon-right: 5px !default;
package/lib/component/relation-contact-options/style/_theme.scss CHANGED
@@ -5,10 +5,26 @@
5
5
  color: $re-co-relation-contact-options-font-color;
6
6
  .co-icon {
7
7
  svg {
8
- fill: $re-co-relation-contact-options-label-icon-color;
8
+ fill: $re-co-relation-contact-options-label-delete-icon-color;
9
9
  }
10
10
  [fill] {
11
- fill: $re-co-relation-contact-options-label-icon-color;
11
+ fill: $re-co-relation-contact-options-label-delete-icon-color;
12
+ }
13
+ &.relation-contact-delete {
14
+ svg {
15
+ fill: $re-co-relation-contact-options-label-delete-icon-color;
16
+ }
17
+ [fill] {
18
+ fill: $re-co-relation-contact-options-label-delete-icon-color;
19
+ }
20
+ }
21
+ &.relation-contact-delete {
22
+ svg {
23
+ fill: $re-co-relation-contact-options-label-delete-icon-color;
24
+ }
25
+ [fill] {
26
+ fill: $re-co-relation-contact-options-label-delete-icon-color;
27
+ }
12
28
  }
13
29
  }
14
30
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@colijnit/relation",
3
- "version": "12.1.1",
3
+ "version": "12.1.3",
4
4
  "description": "Colijn IT relation module for Angular 12",
5
5
  "repository": "npm/npm",
6
6
  "author": "Colijn IT",