simpo-component-library 3.6.103 → 3.6.107

package/lib/components/input-fields/input-fields.component.d.ts

@@ -13,7 +13,7 @@ export declare class InputFieldsComponent implements OnChanges {
     constructor(elementRef: ElementRef);
     ngOnChanges(changes: SimpleChanges): void;
     handleMoneyInput(event: any): void;
-    get getTextColor(): "#FFF" | "#000";
+    get getTextColor(): "#000" | "#FFF";
     interpolateColor(color1: string, color2: string, factor: number): string;
     padZero(str: string, length: number): string;
     generateColorBasedOnNumber(number: number): string;

package/lib/directive/background-directive.d.ts

@@ -11,7 +11,7 @@ export declare class BackgroundDirective implements OnChanges {
     constructor(el: ElementRef, eventService: EventsService);
     ngOnDestroy(): void;
     ngOnChanges(change: SimpleChanges): void;
-    getTextColor(bgColor: string): "#ffffff" | "#000000" | "#ffffff;";
+    getTextColor(bgColor: string): "#000000" | "#ffffff" | "#ffffff;";
     static ɵfac: i0.ɵɵFactoryDeclaration<BackgroundDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<BackgroundDirective, "[simpoBackground]", never, { "simpoBackground": { "alias": "simpoBackground"; "required": false; }; "scrollValue": { "alias": "scrollValue"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/directive/button-directive.directive.d.ts

@@ -16,7 +16,7 @@ export declare class ButtonDirectiveDirective implements OnChanges {
     applyButtonStyleChanges(): void;
     applyButtonType(style: ButtonStyleModel, backgroundInfo?: BackgroundModel): void;
     applyButtonShape(style: ButtonStyleModel): void;
-    getTextColor(bgColor: string): "#ffffff" | "#000000" | "#ffffff;";
+    getTextColor(bgColor: string): "#000000" | "#ffffff" | "#ffffff;";
     buttonStyleSubscription?: Subscription;
     buttonStyleChangeCheck(): void;
     changeButtonStyle(id: any, style: ButtonStyleModel, backgroundInfo: BackgroundModel): void;

package/lib/directive/color.directive.d.ts

@@ -12,7 +12,7 @@ export declare class ColorDirective implements OnChanges {
     ngOnDestroy(): void;
     applyColor(): void;
     bgColorChangeCheck(): void;
-    getTextColor(): "#ffffff" | "#000000" | "#ffffff;";
+    getTextColor(): "#000000" | "#ffffff" | "#ffffff;";
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ColorDirective, "[simpoColor]", never, { "bgColor": { "alias": "simpoColor"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/ecommerce/sections/authentication-required/authentication-required.component.d.ts

@@ -58,7 +58,7 @@ export declare class AuthenticationRequiredComponent extends BaseSection {
     validateNumber(event: KeyboardEvent): void;
     validateOTP(event: KeyboardEvent): void;
     checkStrength(): void;
-    getStrengthColor(index: number): "yellow" | "tomato" | "#d3d3d3ba" | "orange" | "lightgreen";
+    getStrengthColor(index: number): "tomato" | "#d3d3d3ba" | "orange" | "yellow" | "lightgreen";
     get isEmailValid(): boolean;
     get isPasswordValid(): boolean;
     get isMobile(): boolean;

package/lib/ecommerce/sections/new-collection/new-collection.component.d.ts

@@ -30,7 +30,7 @@ export declare class NewCollectionComponent extends BaseSection {
     get getDirection(): "ROW" | "COLUMN" | undefined;
     get isMobile(): boolean;
     editSection(): void;
-    getColor(color: any): "#ffffff" | "#000000";
+    getColor(color: any): "#000000" | "#ffffff";
     static ɵfac: i0.ɵɵFactoryDeclaration<NewCollectionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<NewCollectionComponent, "simpo-new-collection", never, { "data": { "alias": "data"; "required": false; }; "responseData": { "alias": "responseData"; "required": false; }; "index": { "alias": "index"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "nextComponentColor": { "alias": "nextComponentColor"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/elements/link-editor/link-editor.component.d.ts

@@ -28,7 +28,7 @@ export declare class LinkEditorComponent {
     buttonStyles: any;
     changeButtonStyle(): void;
     backgroundType: string[];
-    setBorderRadius(): "0px" | "99px" | "7px";
+    setBorderRadius(): "0px" | "7px" | "99px";
     setBorder(): string;
     setColor(): any;
     setBackground(): any;

package/lib/sections/banner-carousel/banner-carousel.component.d.ts

@@ -25,8 +25,8 @@ export declare class BannerCarouselComponent extends BaseSection implements OnIn
     get stylesLayout(): LayOutModel;
     get getBlurValue(): "NONE" | "LIGHT" | "MODERATE" | "STRONG" | "VERY_STRONG" | undefined;
     get getBackgroundColor(): BackgroundModel;
-    get getBackgroundOpacity(): "0" | "0.7" | "0.5" | "0.3" | "0.2";
-    opacityValue(value: OverlayValue): "0" | "0.7" | "0.5" | "0.3" | "0.2";
+    get getBackgroundOpacity(): "0.2" | "0.3" | "0.5" | "0.7" | "0";
+    opacityValue(value: OverlayValue): "0.2" | "0.3" | "0.5" | "0.7" | "0";
     editSection(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<BannerCarouselComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BannerCarouselComponent, "simpo-banner-carousel", never, { "data": { "alias": "data"; "required": false; }; "index": { "alias": "index"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "nextComponentColor": { "alias": "nextComponentColor"; "required": false; }; }, {}, never, never, true, never>;

package/lib/sections/banner-grid-section/banner-grid-section.component.d.ts

@@ -27,6 +27,7 @@ export declare class BannerGridSectionComponent extends BaseSection implements O
     get spacingLayout(): SpacingModel;
     get alignmentLayout(): import("simpo-component-library").ALIGN | undefined;
     get fitLayout(): import("simpo-component-library").FIT | undefined;
+    getTextColor(bgColor: string): "#000000" | "#ffffff" | "#ffffff;";
     static ɵfac: i0.ɵɵFactoryDeclaration<BannerGridSectionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BannerGridSectionComponent, "simpo-banner-grid-section", never, { "data": { "alias": "data"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "index": { "alias": "index"; "required": false; }; "nextComponentColor": { "alias": "nextComponentColor"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/sections/carousel-banner/carousel-banner.component.d.ts

@@ -25,7 +25,7 @@ export declare class CarouselBannerComponent extends BaseSection implements OnIn
     get canMergeNavbar(): boolean | undefined;
     get isBorderlessImage(): boolean | undefined;
     get getPositionLayout(): PositionLayoutModal;
-    opacityValue(value: OverlayValue): "0" | "0.7" | "0.5" | "0.3" | "0.2";
+    opacityValue(value: OverlayValue): "0.2" | "0.3" | "0.5" | "0.7" | "0";
     editSection(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CarouselBannerComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<CarouselBannerComponent, "simpo-carousel-banner", never, { "data": { "alias": "data"; "required": false; }; "index": { "alias": "index"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "nextComponentColor": { "alias": "nextComponentColor"; "required": false; }; }, {}, never, never, true, never>;

package/lib/sections/contact-us/contact-us.component.d.ts

@@ -28,7 +28,7 @@ export declare class ContactUsComponent extends BaseSection implements OnInit {
     editSection(): void;
     canShowContactField(field: any): any;
     getCardStyle(): {};
-    getTextColor(bgColor: string): "#ffffff" | "#000000" | "#ffffff;";
+    getTextColor(bgColor: string): "#000000" | "#ffffff" | "#ffffff;";
     static ɵfac: i0.ɵɵFactoryDeclaration<ContactUsComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ContactUsComponent, "simpo-contact-us", never, { "data": { "alias": "data"; "required": false; }; "index": { "alias": "index"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "nextComponentColor": { "alias": "nextComponentColor"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/sections/header-section/header-section.component.d.ts

@@ -71,7 +71,7 @@ export declare class HeaderSectionComponent implements OnInit {
     get userGender(): import("../../ecommerce/styles/user.modal").GENDER | null;
     get getNavbarButton(): any[];
     isScrolled: boolean;
-    setColor(): "#ffffff" | "#000000";
+    setColor(): "#000000" | "#ffffff";
     static ɵfac: i0.ɵɵFactoryDeclaration<HeaderSectionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<HeaderSectionComponent, "simpo-header-section", never, { "data": { "alias": "data"; "required": false; }; "nextComponent": { "alias": "nextComponent"; "required": false; }; "index": { "alias": "index"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/sections/image-grid-section/image-grid-section.component.d.ts

@@ -22,9 +22,6 @@ export declare class ImageGridSectionComponent extends BaseSection {
     get headingSpace(): SPACING;
     editSection(): void;
     getLength(): number;
-    getImageData(index: number): any;
-    getImageDataArray(): any[];
-    getImage(): any[];
     static ɵfac: i0.ɵɵFactoryDeclaration<ImageGridSectionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ImageGridSectionComponent, "simpo-image-grid-section", never, { "data": { "alias": "data"; "required": false; }; "index": { "alias": "index"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "nextComponentColor": { "alias": "nextComponentColor"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/sections/image-grid-section/image-grid-section.model.d.ts

@@ -19,6 +19,7 @@ export interface ImageGridStylesModel extends StylesModel {
     fullWidth: boolean;
     size: CARD_SIZE;
     gridStyle: GRID_STYLE;
+    direction: "ROW" | "COLUMN";
 }
 export interface ImageGridItemModel {
     image: Image;

package/lib/sections/image-section/image-section.component.d.ts

@@ -20,9 +20,9 @@ export declare class ImageSectionComponent extends BaseSection {
     constructor(_eventService: EventsService);
     ngOnInit(): void;
     get canMergeNavbar(): boolean | undefined;
-    get getBackgroundOpacity(): "1" | "0.7" | "0.5" | "0.3" | "0.2";
+    get getBackgroundOpacity(): "1" | "0.2" | "0.3" | "0.5" | "0.7";
     get stylesLayout(): LayOutModel;
-    opacityValue(value: OverlayValue): "1" | "0.7" | "0.5" | "0.3" | "0.2";
+    opacityValue(value: OverlayValue): "1" | "0.2" | "0.3" | "0.5" | "0.7";
     editSection(): void;
     redirectTo(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ImageSectionComponent, never>;

package/lib/sections/logo-showcase/logo-showcase.component.d.ts

@@ -24,7 +24,7 @@ export declare class LogoShowcaseComponent extends BaseSection implements OnInit
     ngOnInit(): void;
     get stylesLayout(): LayOutModel;
     get animationDuration(): logoSpeed;
-    get animationDirection(): logoDirection.Left | "reverse" | "normal";
+    get animationDirection(): "reverse" | "normal" | logoDirection.Left;
     get isMobile(): boolean;
     get getPositionLayout(): PositionLayoutModal;
     screenWidth: number;

package/lib/sections/moving-text/moving-text.component.d.ts

@@ -22,7 +22,7 @@ export declare class MovingTextComponent extends BaseSection {
     private transitionToNext;
     isItemVisible(index: number): boolean;
     getItemClass(index: number): string;
-    getTextColor(bgColor: string): "#ffffff" | "#000000";
+    getTextColor(bgColor: string): "#000000" | "#ffffff";
     static ɵfac: i0.ɵɵFactoryDeclaration<MovingTextComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<MovingTextComponent, "simpo-moving-text", never, { "data": { "alias": "data"; "required": false; }; "edit": { "alias": "edit"; "required": false; }; "delete": { "alias": "delete"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "index": { "alias": "index"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/sections/new-testimonials/new-testimonials.component.d.ts

@@ -21,7 +21,7 @@ export declare class NewTestimonialsComponent extends BaseSection {
     idx: number;
     getImageData(): import("../../styles/style.model").Image | undefined;
     getImageUrl(): string | undefined;
-    getImageType(): "Image" | "Video";
+    getImageType(): "Video" | "Image";
     editSection(): void;
     stopPropagation(event: any): void;
     screenWidth: any;

package/lib/sections/pricing-section/pricing-section.component.d.ts

@@ -18,7 +18,7 @@ export declare class PricingSectionComponent extends BaseSection {
     constructor(_eventService: EventsService);
     ngOnInit(): void;
     get stylesLayout(): LayOutModel;
-    getTextColor(): "#ffffff" | "#000000";
+    getTextColor(): "#000000" | "#ffffff";
     get headingSpace(): SPACING;
     getButtonId(): string;
     editSection(): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "simpo-component-library",
-  "version": "3.6.103",
+  "version": "3.6.107",
   "peerDependencies": {
     "@angular/common": "^17.2.0",
     "@angular/core": "^17.2.0",

package/src/lib/styles/global-styles.css

@@ -1,204 +1,204 @@
-:root {
-  --primary-font-family: 'mulish';
-  --primary-bg-color: linear-gradient(345deg, #230860 0%, #00b6ff 100%);
-  --primary-color: white;
-}
-
-.add-section {
-  position: absolute !important;
-  width: 40%;
-  top: 0;
-  left: 0 !important;
-  height: 100vh;
-  background-color: transparent !important;
-  box-shadow: none !important;
-  animation: slideInLeft 0.5s ease-in-out forwards;
-}
-
-.add-section.closing {
-  animation: slideOutLeft 0.5 s ease-in-out forwards;
-}
-
-@keyframes slideInLeft {
-  from {
-    transform: translateX(-100%);
-    opacity: 0;
-  }
-
-  to {
-    transform: translateX(0);
-    opacity: 1;
-  }
-}
-
-@keyframes slideOutLeft {
-  from {
-    transform: translateX(0);
-    opacity: 1;
-  }
-
-  to {
-    transform: translateX(-100%);
-    /* Close to the left side */
-    opacity: 0;
-  }
-}
-
-
-@media screen and (min-width: 1280px) {
-  .content-side {
-    h1 {
-      font-size: 72px !important;
-      line-height: 80px !important;
-    }
-
-    h2 {
-      font-size: 48px !important;
-      line-height: 56px !important;
-    }
-
-    h3 {
-      font-size: 32px !important;
-      line-height: 40px !important;
-    }
-
-    h4 {
-      font-size: 24px !important;
-      line-height: 36px !important;
-    }
-
-    h5 {
-      font-size: 18px !important;
-      line-height: 28px !important;
-    }
-
-    p {
-      font-size: 16px !important;
-      line-height: 21px !important;
-    }
-  }
-
-}
-
-@media screen and (min-width: 768px) {
-  .content-side {
-    h1 {
-      font-size: 46px;
-      line-height: 54px;
-    }
-
-    h2 {
-      font-size: 35px;
-      line-height: 42px;
-    }
-
-    h3 {
-      font-size: 28px;
-      line-height: 36px;
-    }
-
-    h4 {
-      font-size: 18px;
-      line-height: 26px;
-    }
-
-    h5 {
-      font-size: 16px;
-      line-height: 24px;
-    }
-
-    p {
-      font-size: 14px;
-      line-height: 21px;
-    }
-  }
-
-}
-
-.content-side {
-  h1 {
-    font-size: 36px;
-    line-height: 42px;
-  }
-
-  h2 {
-    font-size: 30px;
-    line-height: 36px;
-  }
-
-  h3 {
-    font-size: 24px;
-    line-height: 32px;
-  }
-
-  h4 {
-    font-size: 18px;
-    line-height: 26px;
-  }
-
-  h5 {
-    font-size: 16px;
-    line-height: 24px;
-  }
-
-  p {
-    font-size: 14px;
-    line-height: 21px;
-  }
-}
-
-.link-editor {
-  height: 100vh;
-  width: 28vw;
-  position: absolute !important;
-  top: 0;
-  left: 0 !important;
-  animation: slideInLeft 0.5s ease-in-out forwards;
-}
-
-@media screen and (max-width : 475px) {
-  .link-editor {
-    width: 100% !important;
-  }
-
-  .link-editor {
-    width: 100% !important;
-    max-width: 100% !important;
-  }
-
-  .media-selector {
-    width: 100% !important;
-    max-width: 100% !important;
-  }
-
-  .add-section{
-    width: 100% !important;
-    max-width: 100% !important;
-  }
-
-}
-
-.mat-mdc-form-field-subscript-wrapper {
-  display: none;
-}
-
-.media-selector {
-  position: absolute !important;
-  top: 0 !important;
-  left: 0 !important;
-  width: 60%;
-  height: 100vh;
-  animation: slideInLeft 0.5s ease-in-out forwards;
-}
-
-.appointment-form{
-  @media only screen and (max-width: 500px){
-    margin: auto !important;
-    height: 65vh !important;
-    width: 95vw !important;
-  }
-}
-
-.hover-effect:hover {
-  box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
-}
+:root {
+  --primary-font-family: 'mulish';
+  --primary-bg-color: linear-gradient(345deg, #230860 0%, #00b6ff 100%);
+  --primary-color: white;
+}
+
+.add-section {
+  position: absolute !important;
+  width: 40%;
+  top: 0;
+  left: 0 !important;
+  height: 100vh;
+  background-color: transparent !important;
+  box-shadow: none !important;
+  animation: slideInLeft 0.5s ease-in-out forwards;
+}
+
+.add-section.closing {
+  animation: slideOutLeft 0.5 s ease-in-out forwards;
+}
+
+@keyframes slideInLeft {
+  from {
+    transform: translateX(-100%);
+    opacity: 0;
+  }
+
+  to {
+    transform: translateX(0);
+    opacity: 1;
+  }
+}
+
+@keyframes slideOutLeft {
+  from {
+    transform: translateX(0);
+    opacity: 1;
+  }
+
+  to {
+    transform: translateX(-100%);
+    /* Close to the left side */
+    opacity: 0;
+  }
+}
+
+
+@media screen and (min-width: 1280px) {
+  .content-side {
+    h1 {
+      font-size: 72px !important;
+      line-height: 80px !important;
+    }
+
+    h2 {
+      font-size: 48px !important;
+      line-height: 56px !important;
+    }
+
+    h3 {
+      font-size: 32px !important;
+      line-height: 40px !important;
+    }
+
+    h4 {
+      font-size: 24px !important;
+      line-height: 36px !important;
+    }
+
+    h5 {
+      font-size: 18px !important;
+      line-height: 28px !important;
+    }
+
+    p {
+      font-size: 16px !important;
+      line-height: 21px !important;
+    }
+  }
+
+}
+
+@media screen and (min-width: 768px) {
+  .content-side {
+    h1 {
+      font-size: 46px;
+      line-height: 54px;
+    }
+
+    h2 {
+      font-size: 35px;
+      line-height: 42px;
+    }
+
+    h3 {
+      font-size: 28px;
+      line-height: 36px;
+    }
+
+    h4 {
+      font-size: 18px;
+      line-height: 26px;
+    }
+
+    h5 {
+      font-size: 16px;
+      line-height: 24px;
+    }
+
+    p {
+      font-size: 14px;
+      line-height: 21px;
+    }
+  }
+
+}
+
+.content-side {
+  h1 {
+    font-size: 36px;
+    line-height: 42px;
+  }
+
+  h2 {
+    font-size: 30px;
+    line-height: 36px;
+  }
+
+  h3 {
+    font-size: 24px;
+    line-height: 32px;
+  }
+
+  h4 {
+    font-size: 18px;
+    line-height: 26px;
+  }
+
+  h5 {
+    font-size: 16px;
+    line-height: 24px;
+  }
+
+  p {
+    font-size: 14px;
+    line-height: 21px;
+  }
+}
+
+.link-editor {
+  height: 100vh;
+  width: 28vw;
+  position: absolute !important;
+  top: 0;
+  left: 0 !important;
+  animation: slideInLeft 0.5s ease-in-out forwards;
+}
+
+@media screen and (max-width : 475px) {
+  .link-editor {
+    width: 100% !important;
+  }
+
+  .link-editor {
+    width: 100% !important;
+    max-width: 100% !important;
+  }
+
+  .media-selector {
+    width: 100% !important;
+    max-width: 100% !important;
+  }
+
+  .add-section{
+    width: 100% !important;
+    max-width: 100% !important;
+  }
+
+}
+
+.mat-mdc-form-field-subscript-wrapper {
+  display: none;
+}
+
+.media-selector {
+  position: absolute !important;
+  top: 0 !important;
+  left: 0 !important;
+  width: 60%;
+  height: 100vh;
+  animation: slideInLeft 0.5s ease-in-out forwards;
+}
+
+.appointment-form{
+  @media only screen and (max-width: 500px){
+    margin: auto !important;
+    height: 65vh !important;
+    width: 95vw !important;
+  }
+}
+
+.hover-effect:hover {
+  box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
+}