@symphony-talent/component-library 3.3.1 → 3.6.0

package/lib/atoms/input-checkbox/input-checkbox.model.d.ts

@@ -1,5 +1,5 @@
 export interface InputCheckboxModel {
     isActive: boolean;
     label: string;
-    isRequired: boolean;
+    isRequired?: boolean;
 }

package/lib/atoms/input-editable-text/input-editable-text.component.d.ts

@@ -0,0 +1,16 @@
+import { EventEmitter } from '@angular/core';
+import { InputEditableTextModel } from './input-editable-text.model';
+import * as i0 from "@angular/core";
+export declare class InputEditableTextComponent {
+    model: InputEditableTextModel;
+    type: string;
+    confirm: EventEmitter<InputEditableTextModel>;
+    previousValue: string;
+    isInEditMode: boolean;
+    constructor();
+    onEditClick(): void;
+    onConfirmClick(): void;
+    onCloseClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputEditableTextComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputEditableTextComponent, "symphony-input-editable-text", never, { "model": "model"; "type": "type"; }, { "confirm": "confirm"; }, never, never>;
+}

package/lib/atoms/input-editable-text/input-editable-text.model.d.ts

@@ -0,0 +1,7 @@
+export interface InputEditableTextModel {
+    id?: number;
+    inputMask: string;
+    value: string;
+    isEditable: boolean;
+    isInEditMode: boolean;
+}

package/lib/atoms/input-editable-text/input-editable-text.module.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./input-editable-text.component";
+import * as i2 from "@angular/common";
+import * as i3 from "../icon/icon.module";
+import * as i4 from "@angular/forms";
+import * as i5 from "../paragraph/paragraph.module";
+export declare class InputEditableTextModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputEditableTextModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<InputEditableTextModule, [typeof i1.InputEditableTextComponent], [typeof i2.CommonModule, typeof i3.IconModule, typeof i4.FormsModule, typeof i5.ParagraphModule], [typeof i1.InputEditableTextComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<InputEditableTextModule>;
+}

package/lib/atoms/tooltip-wrapper/tooltip-wrapper.component.d.ts

@@ -1,8 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class TooltipWrapperComponent {
     placement: string;
-    tooltipText: string;
+    tooltipHtml: string;
     constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<TooltipWrapperComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TooltipWrapperComponent, "symphony-tooltip-wrapper", never, { "placement": "placement"; "tooltipText": "tooltipText"; }, {}, never, ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TooltipWrapperComponent, "symphony-tooltip-wrapper", never, { "placement": "placement"; "tooltipHtml": "tooltipHtml"; }, {}, never, ["*"]>;
 }

package/lib/molecules/advertise-order-review/advertise-order-review.component.d.ts

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+export declare class AdvertiseOrderReviewComponent {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<AdvertiseOrderReviewComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AdvertiseOrderReviewComponent, "symphony-advertise-order-review", never, {}, {}, never, never>;
+}

package/lib/molecules/advertise-order-review/advertise-order-review.module.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./advertise-order-review.component";
+import * as i2 from "@angular/common";
+import * as i3 from "../../atoms/h4/h4.module";
+import * as i4 from "../../atoms/paragraph/paragraph.module";
+export declare class AdvertiseOrderReviewModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AdvertiseOrderReviewModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AdvertiseOrderReviewModule, [typeof i1.AdvertiseOrderReviewComponent], [typeof i2.CommonModule, typeof i3.H4Module, typeof i4.ParagraphModule], [typeof i1.AdvertiseOrderReviewComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AdvertiseOrderReviewModule>;
+}

package/lib/molecules/advertise-postingboard-selection-item/advertise-postingboard-selection-item.component.d.ts

@@ -0,0 +1,18 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { InputCheckboxModel } from '../../atoms/input-checkbox/input-checkbox.model';
+import { InputEditableTextModel } from '../../atoms/input-editable-text/input-editable-text.model';
+import { PostingBoardsSelectionModel } from '../../pages/modals/advertise-modal/advertise-modal.model';
+import * as i0 from "@angular/core";
+export declare class AdvertisePostingboardSelectionItemComponent implements OnInit {
+    model: PostingBoardsSelectionModel;
+    priceChange: EventEmitter<PostingBoardsSelectionModel>;
+    postingBoardSelect: EventEmitter<PostingBoardsSelectionModel>;
+    editableTextModel: InputEditableTextModel;
+    constructor();
+    ngOnInit(): void;
+    onBoardPriceChange(priceChangeEvent: InputEditableTextModel): void;
+    onPostingBoardSelect(postingBoardSelectEvent: InputCheckboxModel): void;
+    mapModel(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AdvertisePostingboardSelectionItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AdvertisePostingboardSelectionItemComponent, "symphony-advertise-postingboard-selection-item", never, { "model": "model"; }, { "priceChange": "priceChange"; "postingBoardSelect": "postingBoardSelect"; }, never, never>;
+}

package/lib/molecules/advertise-postingboard-selection-item/advertise-postingboard-selection-item.module.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./advertise-postingboard-selection-item.component";
+import * as i2 from "@angular/common";
+import * as i3 from "../../atoms/input-editable-text/input-editable-text.module";
+import * as i4 from "../../atoms/input-checkbox/input-checkbox.module";
+export declare class AdvertisePostingboardSelectionItemModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AdvertisePostingboardSelectionItemModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AdvertisePostingboardSelectionItemModule, [typeof i1.AdvertisePostingboardSelectionItemComponent], [typeof i2.CommonModule, typeof i3.InputEditableTextModule, typeof i4.InputCheckboxModule], [typeof i1.AdvertisePostingboardSelectionItemComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AdvertisePostingboardSelectionItemModule>;
+}

package/lib/molecules/h5-with-icon/h5-with-icon.model.d.ts

@@ -4,6 +4,6 @@ export interface H5WithIconModel {
     icon: Icons;
     iconFirst: boolean;
     iconColor?: string;
-    tooltipText?: string;
+    tooltipHtml?: string;
     placement?: string;
 }

package/lib/molecules/h5-with-icon/h5-with-icon.module.d.ts

@@ -3,10 +3,9 @@ import * as i1 from "./h5-with-icon.component";
 import * as i2 from "@angular/common";
 import * as i3 from "../../atoms/h5/h5.module";
 import * as i4 from "../../atoms/icon/icon.module";
-import * as i5 from "ngx-bootstrap/tooltip";
-import * as i6 from "../../atoms/tooltip-wrapper/tooltip-wrapper.module";
+import * as i5 from "../../atoms/tooltip-wrapper/tooltip-wrapper.module";
 export declare class H5WithIconModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<H5WithIconModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<H5WithIconModule, [typeof i1.H5WithIconComponent], [typeof i2.CommonModule, typeof i3.H5Module, typeof i4.IconModule, typeof i5.TooltipModule, typeof i6.TooltipWrapperModule], [typeof i1.H5WithIconComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<H5WithIconModule, [typeof i1.H5WithIconComponent], [typeof i2.CommonModule, typeof i3.H5Module, typeof i4.IconModule, typeof i5.TooltipWrapperModule], [typeof i1.H5WithIconComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<H5WithIconModule>;
 }

package/lib/molecules/invoice-line-item/invoice-line-item.component.d.ts

@@ -0,0 +1,8 @@
+import { InvoiceModel } from './invoice-line-item.model';
+import * as i0 from "@angular/core";
+export declare class InvoiceLineItemComponent {
+    model: Partial<InvoiceModel>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<InvoiceLineItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InvoiceLineItemComponent, "symphony-invoice-line-item", never, { "model": "model"; }, {}, never, never>;
+}

package/lib/molecules/invoice-line-item/invoice-line-item.model.d.ts

@@ -0,0 +1,5 @@
+export interface InvoiceModel {
+    textLeft: string;
+    textRight: string;
+    label: string;
+}

package/lib/molecules/invoice-line-item/invoice-line-item.module.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./invoice-line-item.component";
+import * as i2 from "@angular/common";
+import * as i3 from "../../atoms/paragraph/paragraph.module";
+import * as i4 from "../../atoms/h5/h5.module";
+export declare class InvoiceLineItemModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<InvoiceLineItemModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<InvoiceLineItemModule, [typeof i1.InvoiceLineItemComponent], [typeof i2.CommonModule, typeof i3.ParagraphModule, typeof i4.H5Module], [typeof i1.InvoiceLineItemComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<InvoiceLineItemModule>;
+}

package/lib/molecules/molecules.module.d.ts

@@ -7,8 +7,9 @@ import * as i5 from "./color-swatch/color-swatch.module";
 import * as i6 from "./icon-swatch/icon-swatch.module";
 import * as i7 from "./breadcrumb/breadcrumb.module";
 import * as i8 from "./h5-with-icon/h5-with-icon.module";
+import * as i9 from "./invoice-line-item/invoice-line-item.module";
 export declare class MoleculesModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MoleculesModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MoleculesModule, never, [typeof i1.CommonModule, typeof i2.AvatarModule, typeof i3.ContextualMenuModule, typeof i4.PillsModule, typeof i5.ColorSwatchModule, typeof i6.IconSwatchModule, typeof i7.BreadcrumbModule, typeof i8.H5WithIconModule], [typeof i4.PillsModule, typeof i7.BreadcrumbModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MoleculesModule, never, [typeof i1.CommonModule, typeof i2.AvatarModule, typeof i3.ContextualMenuModule, typeof i4.PillsModule, typeof i5.ColorSwatchModule, typeof i6.IconSwatchModule, typeof i7.BreadcrumbModule, typeof i8.H5WithIconModule, typeof i9.InvoiceLineItemModule], [typeof i4.PillsModule, typeof i7.BreadcrumbModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MoleculesModule>;
 }

package/lib/organisms/advertise-postingboard-selection-list/advertise-postingboard-selection-list.component.d.ts

@@ -0,0 +1,8 @@
+import { PostingBoardsSelectionModel } from '../../pages/modals/advertise-modal/advertise-modal.model';
+import * as i0 from "@angular/core";
+export declare class AdvertisePostingboardSelectionListComponent {
+    model: PostingBoardsSelectionModel[];
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<AdvertisePostingboardSelectionListComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AdvertisePostingboardSelectionListComponent, "symphony-advertise-postingboard-selection-list", never, { "model": "model"; }, {}, never, never>;
+}

package/lib/organisms/advertise-postingboard-selection-list/advertise-postingboard-selection-list.module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./advertise-postingboard-selection-list.component";
+import * as i2 from "@angular/common";
+import * as i3 from "../../molecules/advertise-postingboard-selection-item/advertise-postingboard-selection-item.module";
+export declare class AdvertisePostingboardSelectionListModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AdvertisePostingboardSelectionListModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AdvertisePostingboardSelectionListModule, [typeof i1.AdvertisePostingboardSelectionListComponent], [typeof i2.CommonModule, typeof i3.AdvertisePostingboardSelectionItemModule], [typeof i1.AdvertisePostingboardSelectionListComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AdvertisePostingboardSelectionListModule>;
+}

package/lib/pages/modals/advertise-modal/advertise-modal.component.d.ts

@@ -1,15 +1,16 @@
-import { EventEmitter } from '@angular/core';
-import { AdvertiseModalModel } from './advertise-modal.model';
+import { EventEmitter, OnInit } from '@angular/core';
+import { AdvertiseModalModel, PostingBoardsSelectionModel } from './advertise-modal.model';
 import * as i0 from "@angular/core";
-export declare class AdvertiseModalComponent {
+export declare class AdvertiseModalComponent implements OnInit {
     model: Partial<AdvertiseModalModel>;
-    keywordSearchChange: EventEmitter<string>;
     buttonClicked: EventEmitter<string>;
     closeButtonClicked: EventEmitter<string>;
+    filteredPostingBoardList: PostingBoardsSelectionModel[];
     constructor();
+    ngOnInit(): void;
     keywordSearch(keyword: string): void;
     onButtonClick(text: string): void;
     onCloseButtonClick(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AdvertiseModalComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AdvertiseModalComponent, "symphony-advertise-modal", never, { "model": "model"; }, { "keywordSearchChange": "keywordSearchChange"; "buttonClicked": "buttonClicked"; "closeButtonClicked": "closeButtonClicked"; }, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AdvertiseModalComponent, "symphony-advertise-modal", never, { "model": "model"; }, { "buttonClicked": "buttonClicked"; "closeButtonClicked": "closeButtonClicked"; }, never, never>;
 }

package/lib/pages/modals/advertise-modal/advertise-modal.model.d.ts

@@ -5,6 +5,7 @@ export interface AdvertiseModalModel {
     showFunds: boolean;
     fundsInfo: H5WithIconModel;
     primaryButtonText: string;
+    disablePrimaryButton: boolean;
     secondaryButtonText: string;
     backButtonText: string;
     jobsToAdvertise: AdvertiseJobModel[];
@@ -13,6 +14,7 @@ export interface AdvertiseModalModel {
     hasJobBoardsLoadingFailed: boolean;
     currency: string;
     navigation: AdvertiseModalNavigation;
+    isLoading: boolean;
 }
 export interface AdvertiseJobModel {
     id: number;

package/lib/pages/modals/advertise-modal/advertise-modal.module.d.ts

@@ -11,8 +11,11 @@ import * as i9 from "../../../atoms/input-text/input-text.module";
 import * as i10 from "../../../atoms/button/button.module";
 import * as i11 from "../../../templates/placeholder/placeholder.module";
 import * as i12 from "../../../molecules/h5-with-icon/h5-with-icon.module";
+import * as i13 from "../../../organisms/advertise-postingboard-selection-list/advertise-postingboard-selection-list.module";
+import * as i14 from "../../../atoms/sfx-loader/sfx-loader.module";
+import * as i15 from "../../../molecules/advertise-order-review/advertise-order-review.module";
 export declare class ModalModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ModalModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ModalModule, [typeof i1.AdvertiseModalComponent], [typeof i2.CommonModule, typeof i3.TwoColumnModalModule, typeof i4.TwoColumnBodyTemplateModule, typeof i5.H4Module, typeof i6.H5Module, typeof i7.ParagraphModule, typeof i8.IconModule, typeof i9.InputTextModule, typeof i10.ButtonModule, typeof i11.PlaceholderModule, typeof i12.H5WithIconModule], [typeof i1.AdvertiseModalComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ModalModule, [typeof i1.AdvertiseModalComponent], [typeof i2.CommonModule, typeof i3.TwoColumnModalModule, typeof i4.TwoColumnBodyTemplateModule, typeof i5.H4Module, typeof i6.H5Module, typeof i7.ParagraphModule, typeof i8.IconModule, typeof i9.InputTextModule, typeof i10.ButtonModule, typeof i11.PlaceholderModule, typeof i12.H5WithIconModule, typeof i13.AdvertisePostingboardSelectionListModule, typeof i14.SfxLoaderModule, typeof i15.AdvertiseOrderReviewModule], [typeof i1.AdvertiseModalComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ModalModule>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symphony-talent/component-library",
-  "version": "3.3.1",
+  "version": "3.6.0",
   "private": false,
   "dependencies": {
     "tslib": "^1.10.0"

package/projects/component-library/global-assets/spacing.scss

@@ -161,6 +161,10 @@ $space-75: 4.688rem;
   padding-top: $space-15;
   padding-bottom: $space-15;
 }
+.sfx-px-20 {
+  padding-top: $space-20;
+  padding-bottom: $space-20;
+}
 .sfx-px-30 {
   padding-top: $space-30;
   padding-bottom: $space-30;

package/projects/component-library/global.scss

@@ -117,13 +117,12 @@ $font-sfxicon: "sfxicons", sans-serif;
   @include ag-theme-alpine();
 }
 body {
-  @extend %sfx-custom-scroll;
   font-family: $font-reg !important;
-  line-height: 20px;
   overflow-x: hidden;
   background: $color-white;
   color: $color-black;
   .sfx {
+    @extend %sfx-custom-scroll;
     a {
       font-size: $font-14;
       color: $color-st-link;
@@ -363,231 +362,6 @@ body {
     // End Helper Classes
     // End Utilities
   }
-  p {
-    font-size: $font-14;
-    font-family: $font-reg;
-  }
-  h5 {
-    font-size: $font-14;
-    font-family: $font-bold;
-  }
-  h4 {
-    font-size: $font-24;
-    font-family: $font-bold;
-  }
-  h3 {
-    font-size: $font-30;
-    font-family: $font-bold;
-  }
-  h2 {
-    font-size: $font-46;
-    font-family: $font-black;
-  }
-  h1 {
-    font-size: $font-56;
-    font-family: $font-black;
-  }
-  // End Typography
-  // Utilities
-  // Fonts
-  .sfx-font12 {
-    font-size: $font-12;
-  }
-  .sfx-font14 {
-    font-size: $font-14;
-  }
-  .sfx-font18 {
-    font-size: $font-18;
-  }
-  .sfx-font24 {
-    font-size: $font-24;
-  }
-  .sfx-font30 {
-    font-size: $font-30;
-  }
-  .sfx-font-40 {
-    font-size: $font-40;
-  }
-  .sfx-font46 {
-    font-size: $font-46;
-  }
-  .sfx-font56 {
-    font-size: $font-56;
-  }
-  .sfx-font400 {
-    font-weight: 400;
-  }
-  .sfx-font600 {
-    font-weight: 600;
-  }
-  .sfx-font700 {
-    font-weight: 600;
-  }
-  .sfx-font-light {
-    font-family: $font-light;
-  }
-  .sfx-font-bold {
-    font-family: $font-bold;
-  }
-  .sfx-font-black {
-    font-family: $font-black;
-  }
-  // End Fonts
-  // Color
-  .sfx-txt-white {
-    color: $color-white;
-  }
-  .sfx-txt-black {
-    color: $color-black;
-  }
-  .sfx-txt-mdm-black {
-    color: $color-mdm-black;
-  }
-  .sfx-txt-gray {
-    color: $color-gray;
-  }
-  .sfx-txt-light-gray {
-    color: $color-light-gray;
-  }
-  .sfx-txt-light-gray2 {
-    color: $color-light-gray2;
-  }
-  .sfx-txt-fuchsia {
-    color: $color-st-fuchsia;
-  }
-  .sfx-txt-purple {
-    color: $color-purple;
-  }
-  .sfx-txt-pink {
-    color: $color-pink;
-  }
-  .sfx-txt-turq {
-    color: $color-turquoise;
-  }
-  .sfx-txt-blue {
-    color: $color-blue;
-  }
-  .sfx-txt-green {
-    color: $color-green;
-  }
-  .sfx-txt-orange {
-    color: $color-orange;
-  }
-  .sfx-txt-yellow {
-    color: $color-yellow;
-  }
-  .sfx-txt-red {
-    color: $color-red;
-  }
-  .sfx-link {
-    color: $color-st-link;
-  }
-  // Background Color
-  .sfx-bg-black {
-    background: $color-black;
-  }
-  .sfx-bg-white {
-    background: $color-white;
-  }
-  // End Background Color
-  // End Color
-
-  // Border
-  .sfx-border-0 {
-    border: 0;
-  }
-  .sfx-border-top-0 {
-    border-top: 0;
-  }
-  .sfx-border-bottom-0 {
-    border-bottom: 0;
-  }
-  .sfx-border-left-0 {
-    border-left: 0;
-  }
-  .sfx-border-right-0 {
-    border-right: 0;
-  }
-  .sfx-border-gray-1 {
-    border: 1px solid $color-light-gray2;
-  }
-  .sfx-border-black-1 {
-    border: 1px solid $color-black;
-  }
-  .sfx-border-bottom-gray-1 {
-    border-bottom: 1px solid $color-light-gray2;
-  }
-  .sfx-border-bottom-black-1 {
-    border-bottom: 1px solid $color-black;
-  }
-  .sfx-border-bottom-mdm-black-1 {
-    border-bottom: 1px solid $color-mdm-black;
-  }
-  .sfx-border-bottom-black-5 {
-    border-bottom: 5px solid $color-black;
-  }
-  .sfx-border-bottom-white-5 {
-    border-bottom: 5px solid $color-white;
-  }
-  .sfx-border-top-gray-1 {
-    border-top: 1px solid $color-light-gray2;
-  }
-  .sfx-border-top-black-1 {
-    border-top: 1px solid $color-black;
-  }
-  .sfx-border-top-black-5 {
-    border-top: 5px solid $color-black;
-  }
-  .sfx-border-radius-0 {
-    border-radius: 0;
-  }
-  // End Border
-  // Display
-  .sfx-d-none {
-    display: none;
-  }
-  .sfx-d-block {
-    display: block;
-  }
-  .sfx-d-inline-block {
-    display: inline-block;
-  }
-  .sfx-d-flex {
-    display: flex;
-  }
-  .sfx-d-table {
-    display: table;
-  }
-  .sfx-d-grid {
-    display: grid;
-  }
-  // End Display
-  .sfx-wid-100 {
-    width: 100%;
-  }
-  .sfx-wid-100px {
-    width: 100px;
-  }
-  // Position
-  .sfx-position-relative {
-    position: relative;
-  }
-  .sfx-position-absolute {
-    position: absolute;
-  }
-  .sfx-position-fixed {
-    position: fixed;
-  }
-  .sfx-position-sticky {
-    position: sticky;
-  }
-  // End Position
-  // Helper Classes
-  .sfx-cursor-pointer {
-    cursor: pointer;
-  }
-  // End Helper Classes
-  // End Utilities
 }
 // Grid
 .ag-theme-alpine {
@@ -697,42 +471,44 @@ body {
   }
 }
 // grid rows
-.ag-row {
-  z-index: 1;
-  .ag-row div:first-child {
-    font-family: "neuzeit_groteskbold";
-  }
-  .ag-cell {
-    .more-options {
-      display: none;
-    }
-    .sfx-icon-show-password {
-      display: none;
+.grid-with-dropdown {
+  .ag-row {
+    z-index: 1;
+    .ag-row div:first-child {
+      font-family: "neuzeit_groteskbold";
     }
-    &:last-child {
-      overflow: visible;
-      padding-left: 0;
-      padding-right: 0;
+    .ag-cell {
+      .more-options {
+        display: none;
+      }
+      .sfx-icon-show-password {
+        display: none;
+      }
+      &:last-child {
+        overflow: visible;
+        padding-left: 0;
+        padding-right: 0;
+      }
     }
   }
-}
-.ag-row.ag-row-hover {
-  .ag-cell {
-    .more-options {
-      display: inline-block;
-      float: right;
-      .dropdown-menu::before {
-        top: -24px;
+  .ag-row.ag-row-hover {
+    .ag-cell {
+      .more-options {
+        display: inline-block;
+        float: right;
+        .dropdown-menu::before {
+          top: -24px;
+        }
+      }
+      .sfx-icon-show-password {
+        display: inline-block;
+        color: $color-white;
       }
-    }
-    .sfx-icon-show-password {
-      display: inline-block;
-      color: $color-white;
     }
   }
-}
-.ag-row.ag-row-focus {
-  z-index: 2;
+  .ag-row.ag-row-focus {
+    z-index: 2;
+  }
 }
 
 // End Grid

package/projects/component-library/lib/atoms/input-checkbox/input-checkbox.model.d.ts

@@ -1,5 +1,5 @@
 export interface InputCheckboxModel {
     isActive: boolean;
     label: string;
-    isRequired: boolean;
+    isRequired?: boolean;
 }

package/projects/component-library/lib/atoms/input-editable-text/input-editable-text.component.d.ts

@@ -0,0 +1,16 @@
+import { EventEmitter } from '@angular/core';
+import { InputEditableTextModel } from './input-editable-text.model';
+import * as i0 from "@angular/core";
+export declare class InputEditableTextComponent {
+    model: InputEditableTextModel;
+    type: string;
+    confirm: EventEmitter<InputEditableTextModel>;
+    previousValue: string;
+    isInEditMode: boolean;
+    constructor();
+    onEditClick(): void;
+    onConfirmClick(): void;
+    onCloseClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputEditableTextComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputEditableTextComponent, "symphony-input-editable-text", never, { "model": "model"; "type": "type"; }, { "confirm": "confirm"; }, never, never>;
+}

package/projects/component-library/lib/atoms/input-editable-text/input-editable-text.model.d.ts

@@ -0,0 +1,7 @@
+export interface InputEditableTextModel {
+    id?: number;
+    inputMask: string;
+    value: string;
+    isEditable: boolean;
+    isInEditMode: boolean;
+}

package/projects/component-library/lib/atoms/input-editable-text/input-editable-text.module.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./input-editable-text.component";
+import * as i2 from "@angular/common";
+import * as i3 from "../icon/icon.module";
+import * as i4 from "@angular/forms";
+import * as i5 from "../paragraph/paragraph.module";
+export declare class InputEditableTextModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputEditableTextModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<InputEditableTextModule, [typeof i1.InputEditableTextComponent], [typeof i2.CommonModule, typeof i3.IconModule, typeof i4.FormsModule, typeof i5.ParagraphModule], [typeof i1.InputEditableTextComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<InputEditableTextModule>;
+}

package/projects/component-library/lib/atoms/tooltip-wrapper/tooltip-wrapper.component.d.ts

@@ -1,8 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class TooltipWrapperComponent {
     placement: string;
-    tooltipText: string;
+    tooltipHtml: string;
     constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<TooltipWrapperComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TooltipWrapperComponent, "symphony-tooltip-wrapper", never, { "placement": "placement"; "tooltipText": "tooltipText"; }, {}, never, ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TooltipWrapperComponent, "symphony-tooltip-wrapper", never, { "placement": "placement"; "tooltipHtml": "tooltipHtml"; }, {}, never, ["*"]>;
 }

package/projects/component-library/lib/molecules/advertise-order-review/advertise-order-review.component.d.ts

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+export declare class AdvertiseOrderReviewComponent {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<AdvertiseOrderReviewComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AdvertiseOrderReviewComponent, "symphony-advertise-order-review", never, {}, {}, never, never>;
+}