@colijnit/relation 12.1.1

package/lib/component/base/relation-base.component.d.ts

@@ -0,0 +1,24 @@
+import { EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { RelationService } from '../../service/relation.service';
+import { RelationConnectorService } from '../../service/relation-connector.service';
+import { Subscription } from 'rxjs';
+import { RelationEventService } from '../../service/relation-event.service';
+import { IconCacheService } from '../../service/icon-cache.service';
+import { Icon } from '../../enum/icon.enum';
+import { RelationAnyType } from '@colijnit/relationapi/build/model/relation-any-type';
+export declare abstract class RelationBaseComponent implements OnInit, OnDestroy {
+    relationService: RelationService;
+    iconCacheService: IconCacheService;
+    protected relationConnectorService: RelationConnectorService;
+    protected relationEventService: RelationEventService;
+    readonly icons: typeof Icon;
+    set relation(value: RelationAnyType);
+    get relation(): RelationAnyType;
+    relationChange: EventEmitter<RelationAnyType>;
+    protected subs: Subscription[];
+    private _relation;
+    constructor(relationService: RelationService, iconCacheService: IconCacheService, relationConnectorService: RelationConnectorService, relationEventService: RelationEventService);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    protected relationSet(): void;
+}

package/lib/component/base/relation-loader.component.d.ts

@@ -0,0 +1,12 @@
+import { OnDestroy, OnInit } from '@angular/core';
+import { RelationEventService } from '../../service/relation-event.service';
+export declare class RelationLoaderComponent implements OnInit, OnDestroy {
+    private _relationEventService;
+    showLoader: boolean;
+    private _loaderSub;
+    private _showLoaderTimeout;
+    constructor(_relationEventService: RelationEventService);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    _setShowLoader(show: boolean): void;
+}

package/lib/component/base/relation-screen-config-base.component.d.ts

@@ -0,0 +1,14 @@
+import { ScreenConfigAdapterComponent } from '@colijnit/corecomponents_v12';
+import { RelationBaseComponent } from './relation-base.component';
+import { RelmanCfgName } from '../../enum/relman-cfg-name.enum';
+export declare abstract class RelationScreenConfigBaseComponent extends RelationBaseComponent implements ScreenConfigAdapterComponent {
+    readonly cfgName: typeof RelmanCfgName;
+    decimals: number;
+    forceReadonly: boolean;
+    hidden: boolean;
+    maxLength: number;
+    objectConfigName: string;
+    readonly: boolean;
+    redErrorBackground: boolean;
+    required: boolean;
+}

package/lib/component/relation/relation.component.d.ts

@@ -0,0 +1,21 @@
+import { OnDestroy, OnInit } from '@angular/core';
+import { CoreComponentsTranslationService } from '@colijnit/corecomponents_v12';
+import { RelationEventService } from '../../service/relation-event.service';
+import { RelationSettingsService } from '../../service/relation-settings.service';
+import { RelationAnyType } from '@colijnit/relationapi/build/model/relation-any-type';
+import { RelationService } from '../../service/relation.service';
+import { RelationConnectorService } from '../../service/relation-connector.service';
+export declare class RelationComponent implements OnInit, OnDestroy {
+    protected relationEventService: RelationEventService;
+    private _translationService;
+    private _settingsService;
+    private _relationConnectorService;
+    private _relationService;
+    loadRelationFromLoginResponse: boolean;
+    showClass(): boolean;
+    relation: RelationAnyType;
+    private _subs;
+    constructor(relationEventService: RelationEventService, _translationService: CoreComponentsTranslationService, _settingsService: RelationSettingsService, _relationConnectorService: RelationConnectorService, _relationService: RelationService);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+}

package/lib/component/relation/relation.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationModule {
+}

package/lib/component/relation/style/_layout.scss

@@ -0,0 +1,46 @@
+@include export-module('co-relation-layout') {
+  .co-relation {
+    display: block;
+    font-family: $re-co-relation-font-family;
+    font-size: $re-co-relation-font-size;
+    .loader-wrapper {
+      position: fixed;
+      z-index: 999;
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    .relation-section {
+      display: flex;
+      flex-direction: column;
+      padding: $re-co-relation-section-padding;
+      margin: $re-co-relation-section-margin;
+      width: $re-co-relation-section-width;
+    }
+    .relation-data-row {
+      display: flex;
+      gap: $re-co-relation-section-gap;
+      margin: $re-co-relation-section-fields-margin;
+      > * {
+        flex-basis: 100%;
+      }
+      .co-relation-prefix-name {
+        flex-basis: 20%;
+      }
+    }
+    .relation-data-field-default {
+      flex-basis: 50%;
+    }
+    .relation-section-label {
+      font-family: $re-co-relation-section-label-font-family;
+      font-size: $re-co-relation-section-label-font-size;
+      margin: $re-co-relation-section-label-margin;
+    }
+    .relation-account-data {
+      display: flex;
+      justify-content: space-between;
+    }
+  }
+}

package/lib/component/relation/style/_material-definition.scss

@@ -0,0 +1,15 @@
+$re-co-relation-font-family: $re-font-family !default;
+$re-co-relation-font-size: $re-font-size !default;
+$re-co-relation-font-color: $re-color-font !default;
+$re-co-relation-section-background-color: $re-color-background !default;
+$re-co-relation-section-width: 800px !default;
+$re-co-relation-section-gap: 10px !default;
+$re-co-relation-section-padding: 20px !default;
+$re-co-relation-section-margin: 0 0 20px 0 !default;
+
+$re-co-relation-section-fields-margin: 0 0 5px 0 !default;
+
+$re-co-relation-section-label-font-family: $re-font-family !default;
+$re-co-relation-section-label-font-size: 20px !default;
+$re-co-relation-section-label-font-color: $re-color-action !default;
+$re-co-relation-section-label-margin: 10px 0 !default;

package/lib/component/relation/style/_theme.scss

@@ -0,0 +1,12 @@
+@include export-module('co-relation-theme') {
+  .co-relation {
+    color: $re-co-relation-font-color;
+
+    .relation-section {
+      background-color: $re-co-relation-section-background-color;
+    }
+    .relation-section-label {
+      color: $re-co-relation-section-label-font-color;
+    }
+  }
+}

package/lib/component/relation/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation-address/relation-address.component.d.ts

@@ -0,0 +1,35 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { RelationAddressCfgNames } from '../../interface/relation-address-cfg-names.interface';
+import { Address } from '@colijnit/relationapi/build/model/address.bo';
+import { Country } from '@colijnit/ioneconnector/build/model/country.bo';
+import { DictionaryService } from '../../service/dictionary.service';
+import { FormMasterService } from '@colijnit/corecomponents_v12';
+import { RelationService } from '../../service/relation.service';
+import { RelationConnectorService } from '../../service/relation-connector.service';
+export declare class RelationAddressComponent implements OnInit {
+    private _dictionary;
+    private _relationConnectorService;
+    private _formMasterService;
+    protected relationService: RelationService;
+    configNames: RelationAddressCfgNames;
+    set address(value: Address);
+    get address(): Address;
+    addressChange: EventEmitter<Address>;
+    showClass(): boolean;
+    countries: Country[];
+    fields: Object;
+    countryModel: Country;
+    postalCodeCheckErrorMessage: string;
+    private _prevPostalCodeForCheck;
+    private _prevHouseNoForCheck;
+    private _address;
+    constructor(_dictionary: DictionaryService, _relationConnectorService: RelationConnectorService, _formMasterService: FormMasterService, relationService: RelationService);
+    ngOnInit(): Promise<void>;
+    checkForPostalCodeCheckError(): Promise<void>;
+    changeHouseNo(): void;
+    handleCountryChange(country: Country): void;
+    handlePostalCodeChange(): void;
+    handleStreetChange(): void;
+    handleCityChange(): void;
+    private _setSelectedAddress;
+}

package/lib/component/relation-address/relation-address.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationAddressModule {
+}

package/lib/component/relation-address/style/_layout.scss

@@ -0,0 +1,16 @@
+@include export-module('co-relation-address-layout') {
+  .co-relation-address {
+    display: flex;
+    flex-direction: column;
+    font-family: $re-co-relation-address-font-family;
+    font-size: $re-co-relation-address-font-size;
+    gap: $re-co-relation-address-row-gap;
+    .relation-address-data-row {
+      display: flex;
+      > * {
+        flex-basis: 100%;
+      }
+      gap: $re-co-relation-address-column-gap;
+    }
+  }
+}

package/lib/component/relation-address/style/_material-definition.scss

@@ -0,0 +1,5 @@
+$re-co-relation-address-font-family: $re-font-family !default;
+$re-co-relation-address-font-size: $re-font-size !default;
+$re-co-relation-address-font-color: $re-color-font !default;
+$re-co-relation-address-row-gap: 20px !default;
+$re-co-relation-address-column-gap: 10px !default;

package/lib/component/relation-address/style/_theme.scss

@@ -0,0 +1,5 @@
+@include export-module('co-relation-address-theme') {
+  .co-relation-address {
+    color: $re-co-relation-address-font-color;
+  }
+}

package/lib/component/relation-address/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation-address-tile/relation-address-tile.component.d.ts

@@ -0,0 +1,19 @@
+import { EventEmitter } from '@angular/core';
+import { Address } from '@colijnit/relationapi/build/model/address.bo';
+import { Icon } from '../../enum/icon.enum';
+import { IconCacheService } from '../../service/icon-cache.service';
+export declare class RelationAddressTileComponent {
+    iconCacheService: IconCacheService;
+    readonly icons: typeof Icon;
+    showClass: boolean;
+    address: Address;
+    readonly: boolean;
+    selected: boolean;
+    actAsAddTile: boolean;
+    selectedChange: EventEmitter<Address>;
+    addAddressClicked: EventEmitter<void>;
+    editAddressClicked: EventEmitter<Address>;
+    constructor(iconCacheService: IconCacheService);
+    handleEditAddressClick(event: MouseEvent): void;
+    handleSelectedChange(address: Address): void;
+}

package/lib/component/relation-address-tile/relation-address-tile.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationAddressTileModule {
+}

package/lib/component/relation-address-tile/style/_layout.scss

@@ -0,0 +1,46 @@
+@include export-module('co-relation-address-tile-layout') {
+  .co-relation-address-tile {
+    display: flex;
+    position: relative;
+    .co-tile {
+      .co-tile-wrapper {
+        width: $re-co-relation-address-tile-width;
+        height: $re-co-relation-address-tile-height;
+      }
+    }
+    .relation-content-wrapper {
+      display: flex;
+      flex-direction: column;
+      row-gap: $re-co-relation-address-tile-row-gap;
+    }
+    .relation-address-type {
+      font-weight: bold;
+    }
+    .relation-address-create, .relation-address-change {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      font-weight: bold;
+      .relation-address-icon {
+        height: $re-co-relation-address-tile-icon-width;
+        width: $re-co-relation-address-tile-icon-width;
+      }
+    }
+    .relation-address-create {
+      justify-content: center;
+    }
+    .relation-address-edit {
+      position: absolute;
+      top: 0;
+      right: 0;
+      opacity: 0.5;
+      .relation-address-edit-icon {
+        height: $re-co-relation-address-tile-edit-icon-width;
+        width: $re-co-relation-address-tile-edit-icon-width;
+      }
+      &:hover {
+        opacity: 1;
+      }
+    }
+  }
+}

package/lib/component/relation-address-tile/style/_material-definition.scss

@@ -0,0 +1,18 @@
+$re-co-relation-address-tile-font-family: $re-font-family !default;
+$re-co-relation-address-tile-font-size: $re-font-size !default;
+$re-co-relation-address-tile-width: 200px !default;
+$re-co-relation-address-tile-height: 120px !default;
+$re-co-relation-address-tile-row-gap: 3px;
+$re-co-relation-address-tile-padding: 10px !default;
+$re-co-relation-address-tile-border-radius: 5px !default;
+$re-co-relation-address-tile-min-width: 200px !default;
+$re-co-relation-address-tile-min-height: 100px !default;
+$re-co-relation-address-tile-icon-width: 20px !default;
+$re-co-relation-address-tile-background-color: white !default;
+$re-co-relation-address-tile-border: 2px solid !default;
+$re-co-relation-address-tile-border-color: $re-color-border !default;
+$re-co-relation-address-tile-selected-background-color: $re-color-background-selected !default;
+$re-co-relation-address-tile-selected-border-color: #0084de !default;
+$re-co-relation-address-tile-edit-background-color: $re-color-border !default;
+$re-co-relation-address-tile-edit-icon-color: $re-color-action !default;
+$re-co-relation-address-tile-edit-icon-width: 30px !default;

package/lib/component/relation-address-tile/style/_theme.scss

@@ -0,0 +1,19 @@
+@include export-module('co-relation-address-tile-theme') {
+  .co-relation-address-tile {
+    .relation-address-create, .relation-address-change {
+      .relation-address-icon {
+        [fill] {
+          fill: $re-co-relation-address-tile-selected-border-color;
+        }
+      }
+      color: $re-co-relation-address-tile-selected-border-color;
+    }
+    .relation-address-edit {
+      .relation-address-edit-icon {
+        [fill] {
+          fill: $re-co-relation-address-tile-edit-icon-color;
+        }
+      }
+    }
+  }
+}

package/lib/component/relation-address-tile/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation-addresses/relation-addresses.component.d.ts

@@ -0,0 +1,31 @@
+import { Address } from '@colijnit/relationapi/build/model/address.bo';
+import { AddressType } from '@colijnit/relationapi/build/enum/address-type.enum';
+import { RelationScreenConfigBaseComponent } from '../base/relation-screen-config-base.component';
+import { FormMasterService } from '@colijnit/corecomponents_v12';
+import { RelationService } from '../../service/relation.service';
+import { IconCacheService } from '../../service/icon-cache.service';
+import { RelationConnectorService } from '../../service/relation-connector.service';
+import { RelationEventService } from '../../service/relation-event.service';
+export declare class RelationAddressesComponent extends RelationScreenConfigBaseComponent {
+    relationService: RelationService;
+    iconCacheService: IconCacheService;
+    protected relationConnectorService: RelationConnectorService;
+    protected relationEventService: RelationEventService;
+    private _formMasterService;
+    readonly addressType: typeof AddressType;
+    showClass(): boolean;
+    deliveryAddresses: Address[];
+    invoiceAddresses: Address[];
+    addressToEdit: Address;
+    selectedNawNr: number;
+    showEditAddressDialog: boolean;
+    private _boFactory;
+    constructor(relationService: RelationService, iconCacheService: IconCacheService, relationConnectorService: RelationConnectorService, relationEventService: RelationEventService, _formMasterService: FormMasterService);
+    submitForm(): void;
+    saveAddress(address: Address): Promise<void>;
+    changeAddress(address: Address): void;
+    showNewAddressDialog(type: AddressType): void;
+    editAddress(addr: Address): void;
+    protected relationSet(): void;
+    private _setAddresses;
+}

package/lib/component/relation-addresses/relation-addresses.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationAddressesModule {
+}

package/lib/component/relation-addresses/style/_layout.scss

@@ -0,0 +1,26 @@
+@include export-module('co-relation-addresses-layout') {
+  .co-relation-addresses {
+    font-family: $re-co-relation-addresses-font-family;
+    font-size: $re-co-relation-addresses-font-size;
+
+    .co-dialog:not(.is-mobile) .co-dialog-wrapper {
+      //height: $tp-dialog-catalog-min-height;
+      width: $re-co-relation-addresses-dialog-min-width;
+      max-width: 100vw;
+    }
+    .relation-addresses-label {
+      font-size: $re-co-relation-addresses-label-font-size;
+      margin: $re-co-relation-addresses-label-margin;
+    }
+    .relation-address-new {
+      display: flex;
+      align-items: center;
+      cursor: pointer;
+      margin: $re-co-relation-addresses-new-address-margin;
+      .co-icon {
+        height: $re-co-relation-addresses-new-address-icon-size;
+        width: $re-co-relation-addresses-new-address-icon-size;
+      }
+    }
+  }
+}

package/lib/component/relation-addresses/style/_material-definition.scss

@@ -0,0 +1,12 @@
+$re-co-relation-addresses-font-family: $re-font-family !default;
+$re-co-relation-addresses-font-size: $re-font-size !default;
+$re-co-relation-addresses-font-color: $re-color-font !default;
+$re-co-relation-addresses-dialog-min-width: 400px !default;
+$re-co-relation-addresses-new-address-icon-size: 15px !default;
+$re-co-relation-addresses-new-address-margin: 5px 0 !default;
+$re-co-relation-addresses-new-address-color: $re-color-action !default;
+$re-co-relation-addresses-new-address-icon-color: $re-color-action !default;
+
+$re-co-relation-addresses-label-font-size: $re-font-size !default;
+$re-co-relation-addresses-label-color: $re-color-font !default;
+$re-co-relation-addresses-label-margin: 10px 0 !default;

package/lib/component/relation-addresses/style/_theme.scss

@@ -0,0 +1,20 @@
+@include export-module('co-relation-addresses-theme') {
+  .co-relation-addresses {
+    color: $re-co-relation-addresses-font-color;
+
+    .relation-address-label {
+      color: $re-co-relation-addresses-label-color;
+    }
+    .relation-address-new {
+      color: $re-co-relation-addresses-new-address-color;
+      .co-icon {
+        svg {
+          fill: $re-co-relation-addresses-new-address-icon-color;
+        }
+        [fill] {
+          fill: $re-co-relation-addresses-new-address-icon-color;
+        }
+      }
+    }
+  }
+}

package/lib/component/relation-addresses/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation-avatar/relation-avatar.component.d.ts

@@ -0,0 +1,47 @@
+import { ChangeDetectorRef, ElementRef, OnDestroy, OnInit } from '@angular/core';
+import { CoDocument } from '@colijnit/mainapi/build/model/co-document';
+import { RelationConnectorService } from '../../service/relation-connector.service';
+import { ColorSequenceService, CoreDialogService } from '@colijnit/corecomponents_v12';
+import { RelationAnyType } from '@colijnit/relationapi/build/model/relation-any-type';
+import { IconCacheService } from '../../service/icon-cache.service';
+import { Icon } from '../../enum/icon.enum';
+export declare class RelationAvatarComponent implements OnInit, OnDestroy {
+    iconCacheService: IconCacheService;
+    private _relationConnectorService;
+    private _colorSequenceService;
+    private _changeDetector;
+    private _dialogService;
+    readonly icons: typeof Icon;
+    input: ElementRef;
+    set image(value: CoDocument);
+    get image(): CoDocument;
+    set relationId(value: number);
+    get relationId(): number;
+    set relation(value: RelationAnyType);
+    get relation(): RelationAnyType;
+    canChangeAvatar: boolean;
+    maxUploadSizeInMb: number;
+    maxAvatarSize: number;
+    showClass(): boolean;
+    imageSrc: string;
+    backgroundColor: string;
+    onClick(): void;
+    set initials(value: string);
+    get initials(): string;
+    private _initials;
+    private _relationId;
+    private _relation;
+    private _image;
+    constructor(iconCacheService: IconCacheService, _relationConnectorService: RelationConnectorService, _colorSequenceService: ColorSequenceService, _changeDetector: ChangeDetectorRef, _dialogService: CoreDialogService);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    uploadTheAvatar(): void;
+    onFileChangeEvent(event: any): void;
+    private _setFileAsAvatarToCurrentRelation;
+    private setDocProperties;
+    private _setImageForAvatar;
+    private _setImageFromRelation;
+    private _setRelationInitials;
+    private _getImageContent;
+    private _setBackgroundColor;
+}

package/lib/component/relation-avatar/relation-avatar.module.d.ts

@@ -0,0 +1,2 @@
+export declare class RelationAvatarModule {
+}

package/lib/component/relation-avatar/style/_layout.scss

@@ -0,0 +1,44 @@
+@include export-module('co-relation-avatar-layout') {
+  .co-relation-avatar {
+    font-family: $re-co-relation-avatar-font-family;
+    position: relative;
+    display: block;
+    border-radius: 50%;
+    height: $re-co-relation-avatar-size;
+    width: auto;
+    aspect-ratio: 1;
+    vertical-align: middle;
+    text-align: center;
+    overflow: hidden;
+    flex-shrink: 0;
+    input {
+      display: none;
+    }
+    .co-image img {
+      height: 100%;
+      width: auto;
+      background-size: cover;
+    }
+    .relation-avatar-pencil-wrapper {
+      position: absolute;
+      z-index: 1;
+      transform: translate(-50%, -50%);
+      top: 50%;
+      left: 50%;
+      border-radius: 50%;
+      opacity: 0;
+      transition: all .2s ease-in-out;
+      height: $re-co-relation-avatar-edit-pencil-size;
+      width: auto;
+      aspect-ratio: 1;
+      .pencil-icon {
+        cursor: pointer;
+        height: 100%;
+        width: 100%;
+      }
+      &:hover {
+        opacity: 1;
+      }
+    }
+  }
+}

package/lib/component/relation-avatar/style/_material-definition.scss

@@ -0,0 +1,4 @@
+$re-co-relation-avatar-font-family: $re-font-family !default;
+$re-co-relation-avatar-size: 80px !default;
+$re-co-relation-avatar-edit-pencil-size: 60% !default;
+$re-co-relation-avatar-edit-pencil-hover-color: rgba(black, 0.5) !default;

package/lib/component/relation-avatar/style/_theme.scss

@@ -0,0 +1,9 @@
+@include export-module('co-relation-avatar-theme') {
+  .co-relation-avatar {
+    .relation-avatar-pencil-wrapper {
+      &:hover {
+        background-color: $re-co-relation-avatar-edit-pencil-hover-color;
+      }
+    }
+  }
+}

package/lib/component/relation-avatar/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/relation-contact-options/relation-contact-option-list.component.d.ts

@@ -0,0 +1,22 @@
+import { EventEmitter } from '@angular/core';
+import { ContactOption } from '@colijnit/relationapi/build/model/contact-option.bo';
+import { CommunicationType } from '@colijnit/relationapi/build/enum/communication-type.enum';
+import { CdkDrag, CdkDragDrop, CdkDropList } from '@angular/cdk/drag-drop';
+export declare class RelationContactOptionListComponent {
+    dragDropDisabled: boolean;
+    type: CommunicationType;
+    collection: ContactOption[];
+    deleteClick: EventEmitter<ContactOption>;
+    showClass: boolean;
+    dragStartDelay: number;
+    private _mouseDownTimeout;
+    handleCanDragDrop: (drag: CdkDrag, drop: CdkDropList) => boolean;
+    handleDrop(event: CdkDragDrop<ContactOption[]>): Promise<void>;
+    /**
+     * Hack to make sure that dragged item has the right css when not moving the mouse
+     * @param event
+     */
+    handleOptionMouseDown(event: MouseEvent): void;
+    handleOptionMouseUp(event: MouseEvent): void;
+    private _reArrangeSequences;
+}

package/lib/component/relation-contact-options/relation-contact-option.component.d.ts

@@ -0,0 +1,30 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { CommunicationType } from '@colijnit/relationapi/build/enum/communication-type.enum';
+import { Icon } from '../../enum/icon.enum';
+import { IconCacheService } from '../../service/icon-cache.service';
+import { ContactOption } from '@colijnit/relationapi/build/model/contact-option.bo';
+import { InputTextComponent } from '@colijnit/corecomponents_v12';
+import { RelationService } from '../../service/relation.service';
+export declare class RelationContactOptionComponent implements OnInit {
+    iconCacheService: IconCacheService;
+    private _relationService;
+    readonly icons: typeof Icon;
+    set child(content: any);
+    set model(value: ContactOption);
+    get model(): ContactOption;
+    set type(value: CommunicationType);
+    get type(): CommunicationType;
+    saveClick: EventEmitter<ContactOption>;
+    deleteClick: EventEmitter<ContactOption>;
+    showClass: boolean;
+    iconType: Icon;
+    label: string;
+    input: InputTextComponent;
+    shouldFocus: boolean;
+    private _model;
+    private _type;
+    constructor(iconCacheService: IconCacheService, _relationService: RelationService);
+    ngOnInit(): void;
+    handleCommit(value: string): Promise<boolean>;
+    private _prepareType;
+}