@colijnit/relation 12.1.7 → 254.1.1

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

@@ -1,43 +1,40 @@
-import { ChangeDetectorRef, ElementRef, EventEmitter } from '@angular/core';
-import { RelationScreenConfigBaseComponent } from '../base/relation-screen-config-base.component';
-import { RelmanContactOptionsCfgNames } from '../../enum/relman-contact-options-cfg-names';
-import { ContactOption } from '@colijnit/relationapi/build/model/contact-option.bo';
-import { CommunicationType } from '@colijnit/relationapi/build/enum/communication-type.enum';
-import { OverlayService } 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 RelationContactOptionsComponent extends RelationScreenConfigBaseComponent {
-    relationService: RelationService;
-    iconCacheService: IconCacheService;
-    protected relationConnectorService: RelationConnectorService;
-    protected relationEventService: RelationEventService;
-    private _overlayService;
-    private _changeDetector;
-    deleteClick: EventEmitter<ContactOption>;
-    readonly commType: typeof CommunicationType;
-    readonly generalContactOptionsCfgNames: RelmanContactOptionsCfgNames;
-    overlayParent: ElementRef;
-    showClass(): boolean;
-    handleKeyDown(event: KeyboardEvent): void;
-    emailContactOptions: ContactOption[];
-    phoneContactOptions: ContactOption[];
-    otherContactOptions: ContactOption[];
-    showNewEmail: boolean;
-    showNewPhone: boolean;
-    showNewOther: boolean;
-    newOtherType: CommunicationType;
-    private _otherTypePopupComponentRef;
-    constructor(relationService: RelationService, iconCacheService: IconCacheService, relationConnectorService: RelationConnectorService, relationEventService: RelationEventService, _overlayService: OverlayService, _changeDetector: ChangeDetectorRef);
-    showNewOtherPopup(): void;
-    hideNewOtherPopup(): void;
-    addContactOption(option: ContactOption): Promise<void>;
-    handleDeleteOption(option: ContactOption): void;
-    protected relationSet(): void;
-    private _handleCreateOtherType;
-    private _getCollection;
-    private _resetNew;
-    hideNewEmail(): void;
-    hideNewPhone(): void;
-}
+import { ChangeDetectorRef, ElementRef } from '@angular/core';
+import { RelationScreenConfigBaseComponent } from '../base/relation-screen-config-base.component';
+import { RelmanContactOptionsCfgNames } from '../../enum/relman-contact-options-cfg-names';
+import { ContactOption } from '@colijnit/relationapi/build/model/contact-option.bo';
+import { CommunicationType } from '@colijnit/relationapi/build/enum/communication-type.enum';
+import { OverlayService } 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 RelationContactOptionsComponent extends RelationScreenConfigBaseComponent {
+    relationService: RelationService;
+    iconCacheService: IconCacheService;
+    protected relationConnectorService: RelationConnectorService;
+    protected relationEventService: RelationEventService;
+    private _overlayService;
+    private _changeDetector;
+    readonly commType: typeof CommunicationType;
+    readonly generalContactOptionsCfgNames: RelmanContactOptionsCfgNames;
+    overlayParent: ElementRef;
+    showClass(): boolean;
+    handleKeyDown(event: KeyboardEvent): void;
+    emailContactOptions: ContactOption[];
+    phoneContactOptions: ContactOption[];
+    otherContactOptions: ContactOption[];
+    showNewEmail: boolean;
+    showNewPhone: boolean;
+    showNewOther: boolean;
+    newOtherType: CommunicationType;
+    private _otherTypePopupComponentRef;
+    constructor(relationService: RelationService, iconCacheService: IconCacheService, relationConnectorService: RelationConnectorService, relationEventService: RelationEventService, _overlayService: OverlayService, _changeDetector: ChangeDetectorRef);
+    showNewOtherPopup(): void;
+    hideNewOtherPopup(): void;
+    addContactOption(option: ContactOption): Promise<void>;
+    handleDeleteOption(option: ContactOption): void;
+    protected relationSet(): void;
+    private _handleCreateOtherType;
+    private _getCollection;
+    private _resetNew;
+}

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

@@ -1,2 +1,2 @@
-export declare class RelationContactOptionsModule {
-}
+export declare class RelationContactOptionsModule {
+}

package/lib/component/relation-contact-options/style/_layout.scss

@@ -1,153 +1,113 @@
-@include export-module('co-relation-contact-options-layout') {
-  .co-relation-contact-options {
-    display: flex;
-    align-items: flex-start;
-    gap: $re-co-relation-contact-options-gap;
-    font-family: $re-co-relation-contact-options-font-family;
-    font-size: $re-co-relation-contact-options-font-size;
-    .co-relation-contact-option-list {
-      flex: 1;
-    }
-    .relation-contact-options-label {
-      font-family: $re-co-relation-contact-options-label-font-family;
-      font-size: $re-co-relation-contact-options-label-font-size;
-      margin: $re-co-relation-contact-options-label-margin;
-    }
-    .relation-contact-options-type-label-wrapper {
-      display: flex;
-      align-items: center;
-      margin: $re-co-relation-contact-options-label-margin;
-      gap: $re-co-relation-contact-options-label-gap;
-      .co-button {
-        cursor: pointer;
-        height: $re-co-relation-contact-options-label-icon-height;
-        width: $re-co-relation-contact-options-label-icon-width;
-        background-color: $re-co-relation-contact-options-label-background-color;
-        border-color: $re-co-relation-contact-options-label-border-color;
-        border-width: $re-co-relation-contact-options-label-border-width;
-        border-style: solid;
-        padding: $re-co-relation-contact-options-label-icon-padding;
-        &:hover {
-          filter: none;
-        }
-      }
-      .label {
-        color: $re-co-relation-contact-options-label-icon-color;
-        font-size: $re-co-relation-contact-options-label-icon-font-size;
-      }
-      .co-icon {
-        width: $re-co-relation-contact-options-label-icon-size;
-        height: $re-co-relation-contact-options-label-icon-size;
-        margin: $re-co-relation-contact-options-label-icon-margin;
-        svg {
-          fill: $re-co-relation-contact-options-label-icon-color;
-        }
-        [fill] {
-          fill: $re-co-relation-contact-options-label-icon-color;
-        }
-      }
-    }
-    .contact-option-wrapper {
-      display: flex;
-      flex-direction: column;
-      gap: $re-co-relation-contact-options-type-gap;
-    }
-    &.adding-email-option, .adding-phone-option, .adding-other-option {
-      .co-relation-contact-option:not(.new-contact-option) {
-        opacity: 0.5;
-        pointer-events: none;
-      }
-    }
-  }
-  .co-relation-contact-option {
-    font-family: $re-co-relation-contact-options-font-family;
-    font-size: $re-co-relation-contact-options-font-size;
-    display: flex;
-    align-items: center;
-    gap: $re-co-relation-contact-option-gap;
-    position: relative;
-    .co-icon {
-      cursor: pointer;
-      height: $re-co-relation-contact-option-left-icon-size;
-      width: $re-co-relation-contact-option-left-icon-size;
-      &.relation-contact-delete {
-        height: $re-co-relation-contact-option-delete-icon-size;
-        width: $re-co-relation-contact-option-delete-icon-size;
-        position: absolute;
-        top: $re-co-relation-contact-option-delete-icon-top;
-        right: $re-co-relation-contact-option-delete-icon-right;
-      }
-    }
-    &.new-contact-option {
-      margin: $re-co-relation-contact-options-type-new-option-margin;
-      flex: 1;
-    }
-    &:last-child {
-      margin-bottom: 10px;
-    }
-  }
-  .relation-contact-option-sequence {
-    border-radius: 50%;
-    position: absolute;
-    z-index: 1;
-    top: 2px;
-    left: 2px;
-    height: 15px;
-    width: 15px;
-    font-size: 10px;
-    align-items: center;
-    display: flex;
-    justify-content: center;
-  }
-
-  .draggable-contact-option.cdk-drag-preview, can-drag.cdk-drag-preview {
-    box-sizing: border-box;
-    border-radius: 4px;
-    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
-    0 8px 10px 1px rgba(0, 0, 0, 0.14),
-    0 3px 14px 2px rgba(0, 0, 0, 0.12);
-  }
-
-  .draggable-contact-option.cdk-drag-placeholder, .can-drag.cdk-drag-placeholder {
-    opacity: 0.3;
-  }
-
-  .cdk-drag-animating {
-    transition: transform 200ms cubic-bezier(0, 0, 0.2, 1);
-  }
-
-  .draggable-contact-option:last-child {
-    border: none;
-  }
-
-  .drag-drop-list.cdk-drop-list-dragging .draggable-contact-option:not(.cdk-drag-placeholder) {
-    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
-  }
-
-  .relation-contact-options-other-types-popup-content {
-    display: flex;
-    flex-direction: column;
-    z-index: $re-co-relation-contact-options-type-popup-z-index;
-    gap: $re-co-relation-contact-options-type-popup-gap;
-    font-family: $re-co-relation-contact-options-font-family;
-    font-size: $re-co-relation-contact-options-font-size;
-    padding: $re-co-relation-contact-options-type-popup-padding;
-    border-style: $re-co-relation-contact-options-type-popup-border-style;
-    border-width: $re-co-relation-contact-options-type-popup-border-width;
-    box-shadow: $re-co-relation-contact-options-type-popup-box-shadow;
-    .other-types-wrapper {
-      cursor: pointer;
-      display: flex;
-      align-items: center;
-      gap: $re-co-relation-contact-options-type-popup-gap;
-      padding: $re-co-relation-contact-options-type-popup-item-padding;
-      .co-icon {
-        height: $re-co-relation-contact-options-type-popup-icon-size;
-        width: $re-co-relation-contact-options-type-popup-icon-size;
-      }
-    }
-    .other-type-label {
-
-    }
-  }
-}
+@include export-module('co-relation-contact-options-layout') {
+  .co-relation-contact-options {
+    font-family: $re-co-relation-contact-options-font-family;
+    font-size: $re-co-relation-contact-options-font-size;
+    .relation-contact-options-label {
+      font-family: $re-co-relation-contact-options-label-font-family;
+      font-size: $re-co-relation-contact-options-label-font-size;
+      margin: $re-co-relation-contact-options-label-margin;
+    }
+    .relation-contact-options-type-label-wrapper {
+      display: flex;
+      align-items: center;
+      margin: $re-co-relation-contact-options-label-margin;
+      gap: $re-co-relation-contact-options-label-gap;
+      .co-icon {
+        cursor: pointer;
+        height: $re-co-relation-contact-options-label-icon-size;
+        width: $re-co-relation-contact-options-label-icon-size;
+      }
+    }
+    .contact-option-wrapper {
+      display: flex;
+      flex-direction: column;
+      gap: $re-co-relation-contact-options-type-gap;
+    }
+    &.adding-email-option, .adding-phone-option, .adding-other-option {
+      .co-relation-contact-option:not(.new-contact-option) {
+        opacity: 0.5;
+        pointer-events: none;
+      }
+    }
+  }
+  .co-relation-contact-option {
+    font-family: $re-co-relation-contact-options-font-family;
+    font-size: $re-co-relation-contact-options-font-size;
+    display: flex;
+    align-items: center;
+    gap: $re-co-relation-contact-option-gap;
+    position: relative;
+    .co-icon {
+      cursor: pointer;
+      height: $re-co-relation-contact-option-delete-icon-size;
+      width: $re-co-relation-contact-option-delete-icon-size;
+    }
+    &.new-contact-option {
+      margin: $re-co-relation-contact-options-type-new-option-margin;
+    }
+  }
+  .relation-contact-option-sequence {
+    border-radius: 50%;
+    position: absolute;
+    z-index: 1;
+    top: 2px;
+    left: 2px;
+    height: 15px;
+    width: 15px;
+    font-size: 10px;
+    align-items: center;
+    display: flex;
+    justify-content: center;
+  }
+
+  .draggable-contact-option.cdk-drag-preview, can-drag.cdk-drag-preview {
+    box-sizing: border-box;
+    border-radius: 4px;
+    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
+    0 8px 10px 1px rgba(0, 0, 0, 0.14),
+    0 3px 14px 2px rgba(0, 0, 0, 0.12);
+  }
+
+  .draggable-contact-option.cdk-drag-placeholder, .can-drag.cdk-drag-placeholder {
+    opacity: 0.3;
+  }
+
+  .cdk-drag-animating {
+    transition: transform 200ms cubic-bezier(0, 0, 0.2, 1);
+  }
+
+  .draggable-contact-option:last-child {
+    border: none;
+  }
+
+  .drag-drop-list.cdk-drop-list-dragging .draggable-contact-option:not(.cdk-drag-placeholder) {
+    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+  }
+
+  .relation-contact-options-other-types-popup-content {
+    display: flex;
+    flex-direction: column;
+    z-index: $re-co-relation-contact-options-type-popup-z-index;
+    gap: $re-co-relation-contact-options-type-popup-gap;
+    font-family: $re-co-relation-contact-options-font-family;
+    font-size: $re-co-relation-contact-options-font-size;
+    padding: $re-co-relation-contact-options-type-popup-padding;
+    border-style: $re-co-relation-contact-options-type-popup-border-style;
+    border-width: $re-co-relation-contact-options-type-popup-border-width;
+    box-shadow: $re-co-relation-contact-options-type-popup-box-shadow;
+    .other-types-wrapper {
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      gap: $re-co-relation-contact-options-type-popup-gap;
+      padding: $re-co-relation-contact-options-type-popup-item-padding;
+      .co-icon {
+        height: $re-co-relation-contact-options-type-popup-icon-size;
+        width: $re-co-relation-contact-options-type-popup-icon-size;
+      }
+    }
+    .other-type-label {
+
+    }
+  }
+}

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

@@ -1,47 +1,35 @@
-$re-co-relation-contact-options-font-family: $re-font-family !default;
-$re-co-relation-contact-options-font-size: $re-font-size !default;
-$re-co-relation-contact-options-font-color: $re-color-font !default;
-$re-co-relation-contact-options-gap: 10px !default;
-$re-co-relation-contact-options-label-font-family: $re-font-family !default;
-$re-co-relation-contact-options-label-font-size: $re-font-size !default;
-
-$re-co-relation-contact-options-label-margin: 0 0 10px 0 !default;
-$re-co-relation-contact-options-label-gap: 10px !default;
-$re-co-relation-contact-options-label-icon-width: 100% !default;
-$re-co-relation-contact-options-label-icon-height: 24px !default;
-$re-co-relation-contact-options-label-icon-size: 12px !default;
-$re-co-relation-contact-options-label-icon-font-size: 11px !default;
-$re-co-relation-contact-options-label-icon-color: $re-color-action !default;
-$re-co-relation-contact-options-label-icon-margin: 0 15px !default;
-$re-co-relation-contact-options-label-icon-padding: 0 !default;
-$re-co-relation-contact-options-label-background-color: #FFF !default;
-$re-co-relation-contact-options-label-border-color: $re-color-action !default;
-$re-co-relation-contact-options-label-border-width: 1px 1px 1px 1px !default;
-$re-co-relation-contact-options-label-delete-icon-color: $re-color-font !default;
-$re-co-relation-contact-options-type-gap: 10px !default;
-$re-co-relation-contact-options-type-new-option-margin: 0 0 10px 0 !default;
-
-$re-co-relation-contact-options-sequence-background-color: #e85152 !default;
-$re-co-relation-contact-options-sequence-color: #f7fafa !default;
-
-$re-co-relation-contact-options-type-popup-z-index: 999 !default;
-$re-co-relation-contact-options-type-popup-icon-size: 20px !default;
-$re-co-relation-contact-options-type-popup-gap: 10px !default;
-$re-co-relation-contact-options-type-popup-padding: 10px !default;
-$re-co-relation-contact-options-type-popup-background-color: $re-color-background-popup !default;
-$re-co-relation-contact-options-type-popup-color: $re-color-light !default;
-$re-co-relation-contact-options-type-popup-border-style: solid !default;
-$re-co-relation-contact-options-type-popup-border-width: 0 !default;
-$re-co-relation-contact-options-type-popup-border-color: $re-color-border !default;
-$re-co-relation-contact-options-type-popup-box-shadow: 2px 2px 5px 1px $re-color-border !default;
-$re-co-relation-contact-options-type-popup-item-padding: 10px !default;
-$re-co-relation-contact-options-type-popup-item-background-color: $re-color-background-popup-item !default;
-$re-co-relation-contact-options-type-popup-item-color: $re-color-light !default;
-$re-co-relation-contact-options-type-popup-item-hover-background-color: $re-color-background-popup-item-hover !default;
-$re-co-relation-contact-options-type-popup-item-hover-color: $re-color-font !default;
-
-$re-co-relation-contact-option-gap: 10px !default;
-$re-co-relation-contact-option-left-icon-size: 20px !default;
-$re-co-relation-contact-option-delete-icon-size: 12px !default;
-$re-co-relation-contact-option-delete-icon-top: 5px !default;
-$re-co-relation-contact-option-delete-icon-right: 5px !default;
+$re-co-relation-contact-options-font-family: $re-font-family !default;
+$re-co-relation-contact-options-font-size: $re-font-size !default;
+$re-co-relation-contact-options-font-color: $re-color-font !default;
+
+$re-co-relation-contact-options-label-font-family: $re-font-family !default;
+$re-co-relation-contact-options-label-font-size: $re-font-size !default;
+
+$re-co-relation-contact-options-label-margin: 10px 0 !default;
+$re-co-relation-contact-options-label-gap: 10px !default;
+$re-co-relation-contact-options-label-icon-size: 15px !default;
+$re-co-relation-contact-options-label-icon-color: $re-color-action !default;
+$re-co-relation-contact-options-type-gap: 5px !default;
+$re-co-relation-contact-options-type-new-option-margin: 0 0 10px 0 !default;
+
+$re-co-relation-contact-options-sequence-background-color: #e85152 !default;
+$re-co-relation-contact-options-sequence-color: #f7fafa !default;
+
+$re-co-relation-contact-options-type-popup-z-index: 999 !default;
+$re-co-relation-contact-options-type-popup-icon-size: 20px !default;
+$re-co-relation-contact-options-type-popup-gap: 10px !default;
+$re-co-relation-contact-options-type-popup-padding: 10px !default;
+$re-co-relation-contact-options-type-popup-background-color: $re-color-background-popup !default;
+$re-co-relation-contact-options-type-popup-color: $re-color-light !default;
+$re-co-relation-contact-options-type-popup-border-style: solid !default;
+$re-co-relation-contact-options-type-popup-border-width: 0 !default;
+$re-co-relation-contact-options-type-popup-border-color: $re-color-border !default;
+$re-co-relation-contact-options-type-popup-box-shadow: 2px 2px 5px 1px $re-color-border !default;
+$re-co-relation-contact-options-type-popup-item-padding: 10px !default;
+$re-co-relation-contact-options-type-popup-item-background-color: $re-color-background-popup-item !default;
+$re-co-relation-contact-options-type-popup-item-color: $re-color-light !default;
+$re-co-relation-contact-options-type-popup-item-hover-background-color: $re-color-background-popup-item-hover !default;
+$re-co-relation-contact-options-type-popup-item-hover-color: $re-color-font !default;
+
+$re-co-relation-contact-option-gap: 10px !default;
+$re-co-relation-contact-option-delete-icon-size: 20px !default;

package/lib/component/relation-contact-options/style/_theme.scss

@@ -1,64 +1,48 @@
-@include export-module('co-relation-contact-options-theme') {
-  .co-relation-contact-options {
-  }
-  .co-relation-contact-option {
-    color: $re-co-relation-contact-options-font-color;
-    .co-icon {
-      svg {
-        fill: $re-co-relation-contact-options-label-delete-icon-color;
-      }
-      [fill] {
-        fill: $re-co-relation-contact-options-label-delete-icon-color;
-      }
-      &.relation-contact-delete {
-        svg {
-          fill: $re-co-relation-contact-options-label-delete-icon-color;
-        }
-        [fill] {
-          fill: $re-co-relation-contact-options-label-delete-icon-color;
-        }
-      }
-      &.relation-contact-delete {
-        svg {
-          fill: $re-co-relation-contact-options-label-delete-icon-color;
-        }
-        [fill] {
-          fill: $re-co-relation-contact-options-label-delete-icon-color;
-        }
-      }
-    }
-  }
-  .relation-contact-option-sequence {
-    background-color: $re-co-relation-contact-options-sequence-background-color;
-    color: $re-co-relation-contact-options-sequence-color;
-  }
-  .relation-contact-options-other-types-popup-content {
-    background-color: $re-co-relation-contact-options-type-popup-background-color;
-    border-color: $re-co-relation-contact-options-type-popup-border-color;
-    color: $re-co-relation-contact-options-type-popup-color;
-    .other-types-wrapper {
-      background-color: $re-co-relation-contact-options-type-popup-item-background-color;
-      color: $re-co-relation-contact-options-type-popup-item-color;
-      .co-icon {
-        svg {
-          fill: $re-co-relation-contact-options-type-popup-item-color;
-        }
-        [fill] {
-          fill: $re-co-relation-contact-options-type-popup-item-color;
-        }
-      }
-      &:hover {
-        background-color: $re-co-relation-contact-options-type-popup-item-hover-background-color;
-        color: $re-co-relation-contact-options-type-popup-item-hover-color;
-        .co-icon {
-          svg {
-            fill: $re-co-relation-contact-options-type-popup-item-hover-color;
-          }
-          [fill] {
-            fill: $re-co-relation-contact-options-type-popup-item-hover-color;
-          }
-        }
-      }
-    }
-  }
-}
+@include export-module('co-relation-contact-options-theme') {
+  .co-relation-contact-options {
+  }
+  .co-relation-contact-option {
+    color: $re-co-relation-contact-options-font-color;
+    .co-icon {
+      svg {
+        fill: $re-co-relation-contact-options-label-icon-color;
+      }
+      [fill] {
+        fill: $re-co-relation-contact-options-label-icon-color;
+      }
+    }
+  }
+  .relation-contact-option-sequence {
+    background-color: $re-co-relation-contact-options-sequence-background-color;
+    color: $re-co-relation-contact-options-sequence-color;
+  }
+  .relation-contact-options-other-types-popup-content {
+    background-color: $re-co-relation-contact-options-type-popup-background-color;
+    border-color: $re-co-relation-contact-options-type-popup-border-color;
+    color: $re-co-relation-contact-options-type-popup-color;
+    .other-types-wrapper {
+      background-color: $re-co-relation-contact-options-type-popup-item-background-color;
+      color: $re-co-relation-contact-options-type-popup-item-color;
+      .co-icon {
+        svg {
+          fill: $re-co-relation-contact-options-type-popup-item-color;
+        }
+        [fill] {
+          fill: $re-co-relation-contact-options-type-popup-item-color;
+        }
+      }
+      &:hover {
+        background-color: $re-co-relation-contact-options-type-popup-item-hover-background-color;
+        color: $re-co-relation-contact-options-type-popup-item-hover-color;
+        .co-icon {
+          svg {
+            fill: $re-co-relation-contact-options-type-popup-item-hover-color;
+          }
+          [fill] {
+            fill: $re-co-relation-contact-options-type-popup-item-hover-color;
+          }
+        }
+      }
+    }
+  }
+}

package/lib/component/relation-contact-options/style/material.scss

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

package/lib/component/relation-first-name/relation-first-name.component.d.ts

@@ -1,4 +1,4 @@
-import { RelationScreenConfigBaseComponent } from '../base/relation-screen-config-base.component';
-export declare class RelationFirstNameComponent extends RelationScreenConfigBaseComponent {
-    showClass: boolean;
-}
+import { RelationScreenConfigBaseComponent } from '../base/relation-screen-config-base.component';
+export declare class RelationFirstNameComponent extends RelationScreenConfigBaseComponent {
+    showClass: boolean;
+}

package/lib/component/relation-first-name/relation-first-name.module.d.ts

@@ -1,2 +1,2 @@
-export declare class RelationFirstNameModule {
-}
+export declare class RelationFirstNameModule {
+}

package/lib/component/relation-first-name/style/_layout.scss

@@ -1,9 +1,9 @@
-@include export-module('co-relation-first-name-layout') {
-  .co-relation-first-name {
-    font-family: $re-co-relation-first-name-font-family;
-    font-size: $re-co-relation-first-name-font-size;
-    &:has(.co-input-text.hidden) {
-      display: none;
-    }
-  }
-}
+@include export-module('co-relation-first-name-layout') {
+  .co-relation-first-name {
+    font-family: $re-co-relation-first-name-font-family;
+    font-size: $re-co-relation-first-name-font-size;
+    &:has(.co-input-text.hidden) {
+      display: none;
+    }
+  }
+}

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

@@ -1,3 +1,3 @@
-$re-co-relation-first-name-font-family: $re-font-family !default;
-$re-co-relation-first-name-font-size: $re-font-size !default;
-$re-co-relation-first-name-font-color: $re-color-font !default;
+$re-co-relation-first-name-font-family: $re-font-family !default;
+$re-co-relation-first-name-font-size: $re-font-size !default;
+$re-co-relation-first-name-font-color: $re-color-font !default;

package/lib/component/relation-first-name/style/_theme.scss

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

package/lib/component/relation-first-name/style/material.scss

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