af-connect-components 0.0.24 → 0.0.26

package/projects/af-connect-components/src/lib/expandable/expandable-container/expandable-container.component.ts

@@ -0,0 +1,21 @@
+import { ChangeDetectionStrategy, Component, Host, Optional } from '@angular/core';
+import { animate, style, transition, trigger, state } from '@angular/animations';
+import { ExpandableWrapperComponent } from '../afc-expandable-wrapper/afc-expandable-wrapper.component';
+
+@Component({
+  selector: 'afc-expandable-container',
+  templateUrl: './expandable-container.component.html',
+  styleUrls: ['./expandable-container.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  animations: [trigger('expandContainer', [
+    state(
+      'collapsed',
+      style({ height: '0px', minHeight: '0', visibility: 'hidden', border: 'none', overflow: 'hidden' })
+    ),
+    state('expanded', style({ height: '*' })),
+    transition('expanded <=> collapsed', animate('300ms ease-out'))
+  ])]
+})
+export class ExpandableContainerComponent {
+  constructor(@Host() @Optional() public wrapper: ExpandableWrapperComponent) { }
+}

package/projects/af-connect-components/src/lib/faq/faq/faq.component.html

@@ -0,0 +1,7 @@
+<div class="faq-container">
+    <div class="item-container">
+        <ng-container *ngFor="let item of faqItems">
+            <lib-faq-item [faqItem]="item"></lib-faq-item>
+        </ng-container>
+    </div>
+</div>

package/projects/af-connect-components/src/lib/faq/faq/faq.component.scss

@@ -0,0 +1,18 @@
+@import '../../../styles/breakpoints.scss';
+
+.item-container {
+    display: flex;
+    flex-direction: column;
+    gap: 15px;
+
+    @include media(tabletTreshold) {
+      gap: 10px;
+    }
+}
+
+.faq-container {
+    gap: 2rem;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}

package/projects/af-connect-components/src/lib/faq/faq/faq.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FaqComponent } from './faq.component';
+
+describe('FaqComponent', () => {
+  let component: FaqComponent;
+  let fixture: ComponentFixture<FaqComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ FaqComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(FaqComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/af-connect-components/src/lib/faq/faq/faq.component.ts

@@ -0,0 +1,16 @@
+import { Component, Input } from '@angular/core';
+import { FaqItem } from '../faqItem';
+
+@Component({
+  selector: 'lib-faq',
+  templateUrl: './faq.component.html',
+  styleUrls: ['./faq.component.scss']
+})
+export class FaqComponent {
+  @Input()
+  faqItems: FaqItem[] = [];
+  @Input()
+  fallBackImageSrc: string;
+  @Input()
+  imageSrc: string;
+}

package/projects/af-connect-components/src/lib/faq/faq-item/faq-item.component.html

@@ -0,0 +1,15 @@
+<div class="item-container">
+    <afc-expandable-wrapper>
+        <div triggerable class="title-container">
+            <h2 class="section-title">
+                {{faqItem.title}}
+            </h2>
+            <afc-expandable-arrow color="#124E57"></afc-expandable-arrow>
+        </div>
+        <afc-expandable-container>
+            <div class="expanded-info">
+                {{faqItem.description}}
+            </div>
+        </afc-expandable-container>
+    </afc-expandable-wrapper>
+</div>

package/projects/af-connect-components/src/lib/faq/faq-item/faq-item.component.scss

@@ -0,0 +1,58 @@
+@import '../../../styles/breakpoints.scss';
+
+$baseColor: #124E57;
+$basePadding: 4%;
+$basePaddingMobile: 2.2%;
+$baseFullPaddingMobile: clamp(1rem, $basePaddingMobile, 27px);
+
+.item-container {
+    border: 1px solid $baseColor;
+    border-radius: 5px;
+}
+
+.title-container {
+    padding: clamp(1rem, $basePadding, 27px);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    cursor: pointer;
+    background: none;
+
+    @include media(tabletTreshold) {
+        padding: $baseFullPaddingMobile;
+      }
+}
+
+.expanded-info {
+    $padding: clamp(1rem, $basePadding, 27px);
+    padding: 0rem $padding $padding $padding;
+    color: #707070;
+    font-family: Hero New;
+    font-size: 1rem;
+
+    @include media(tabletTreshold) {
+        padding: 0rem $baseFullPaddingMobile $baseFullPaddingMobile $baseFullPaddingMobile;
+        font-size: 0.875rem;
+      }
+
+      @include media(mobileBreakPointTreshold) {
+        margin: 0px;
+        font-size: 0.75rem;
+      }
+}
+
+.section-title {
+    margin: 0px;
+    font-size: 1.25rem;
+    font-family: Hero New SemiBold;
+    color: $baseColor;
+
+    @include media(tabletTreshold) {
+    font-size: 1rem;
+    }
+
+    @include media(mobileBreakPointTreshold) {
+        margin: 0px;
+        font-size: 0.875rem;
+    }
+}

package/projects/af-connect-components/src/lib/faq/faq-item/faq-item.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FaqItemComponent } from './faq-item.component';
+
+describe('FaqItemComponent', () => {
+  let component: FaqItemComponent;
+  let fixture: ComponentFixture<FaqItemComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ FaqItemComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(FaqItemComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/af-connect-components/src/lib/faq/faq-item/faq-item.component.ts

@@ -0,0 +1,12 @@
+import { Component, Input } from '@angular/core';
+import { FaqItem } from '../faqItem';
+
+@Component({
+  selector: 'lib-faq-item',
+  templateUrl: './faq-item.component.html',
+  styleUrls: ['./faq-item.component.scss']
+})
+export class FaqItemComponent {
+  @Input()
+  faqItem: FaqItem;
+}

package/projects/af-connect-components/src/lib/faq/image-fallback/image-fallback.component.ts

@@ -0,0 +1,57 @@
+import { Directive, Component, Input, ContentChild, ElementRef } from '@angular/core';
+import { fromEvent } from 'rxjs';
+import { first } from 'rxjs/operators';
+
+@Directive({ selector: '[imgWithFallback]' })
+export class ImageWithFallbackDirective {
+  constructor(public el: ElementRef) { }
+}
+
+enum ImageState {
+  loading = 'loading',
+  error = 'error',
+  loaded = 'loaded'
+}
+
+@Component({
+  selector: 'img-with-fallback',
+  template: `
+  <ng-container *ngIf="loaded">
+  <ng-content select="[imgWithFallback]" [style.visibility]="loaded"></ng-content>
+  </ng-container>
+  <div *ngIf="loading">
+    <ng-content select=".loading"></ng-content>
+  </div>
+  <div *ngIf="error">
+    <ng-content select=".error"></ng-content>
+  </div>
+  `,
+  styles: []
+})
+export class ImageWithFallbackComponent {
+  @ContentChild(ImageWithFallbackDirective) image: ImageWithFallbackDirective;
+
+  private state: ImageState = ImageState.loading;
+
+  get loaded() {
+    return this.state === ImageState.loaded;
+  }
+
+  get loading() {
+    return this.state === ImageState.loading;
+  }
+
+  get error() {
+    return this.state === ImageState.error;
+  }
+  ngAfterContentInit() {
+    fromEvent(this.image.el.nativeElement, 'load')
+      .pipe(first())
+      .subscribe(() => this.state = ImageState.loaded)
+
+    fromEvent(this.image.el.nativeElement, 'error')
+      .pipe(first())
+      .subscribe(() => this.state = ImageState.error)
+  }
+
+}

package/{lib/models/notification-response.model.d.ts → projects/af-connect-components/src/lib/models/notification-response.model.ts}

@@ -3,6 +3,7 @@ export interface NotificationResponse {
     isSuccess: boolean;
     errorMessage: string;
 }
+
 export interface NotificationResponseList {
     isEnabled: boolean;
     title: string;

package/projects/af-connect-components/src/lib/models/radio.model.ts

@@ -0,0 +1,3 @@
+export type RadioButtonVariant = 'default' | 'checkbox' | 'cube';
+export type RadioButtonLabelPosition = 'before' | 'after';
+export type RadioButtonSize = 'inline' | 'box';

package/projects/af-connect-components/src/lib/services/breakpoint.service.ts

@@ -0,0 +1,10 @@
+import { BreakpointObserver } from '@angular/cdk/layout';
+import { Injectable } from '@angular/core';
+import { map } from 'rxjs';
+
+@Injectable()
+export class BreakpointLibService {
+  constructor(private responsive: BreakpointObserver) { }
+
+  public isMobile$ = this.responsive.observe(['(max-width: 768px)']).pipe(map((result) => !result.matches));
+}

package/projects/af-connect-components/src/lib/utilities/number.util.ts

@@ -0,0 +1,3 @@
+export function numberWithCommas(number: number) {
+  return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+}

package/{public-api.d.ts → projects/af-connect-components/src/public-api.ts}

@@ -1,3 +1,7 @@
+/*
+ * Public API Surface of af-connect-components
+ */
+
 export * from './lib/af-connect-components.service';
 export * from './lib/af-connect-components.component';
 export * from './lib/af-connect-components.module';
@@ -37,3 +41,6 @@ export * from './lib/af-connect-toaster-message/af-connect-toaster-message.compo
 export * from './lib/af-connect-toggle-button/af-connect-toggle-button.component';
 export * from './lib/af-connect-tooltip/af-connect-tooltip.component';
 export * from './lib/af-connect-breadcrumb/af-connect-breadcrumb.component';
+
+
+

package/projects/af-connect-components/src/shared/pipes/get-initials.ts

@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from '@angular/core';
+/**
+ * Gets the initials of a Name (First Second -> FS)
+ */
+@Pipe({ name: 'getInitials' })
+export class GetinItialsPipe implements PipeTransform {
+  transform(value: string | undefined): string {
+    if (!value) {
+      return '';
+    }
+    return value.split(' ').map(word => word.charAt(0)).join('').slice(0, 2);
+  }
+}

package/projects/af-connect-components/src/styles/breakpoints.scss

@@ -0,0 +1,91 @@
+@mixin mobileScreen {
+  @media (max-width: 480px) {
+    @content;
+  }
+}
+
+@mixin tabletScreen {
+  @media (min-width: 481px) and (max-width: 768px) {
+    @content;
+  }
+}
+
+@mixin smallDesktopScreen {
+  @media (min-width: 769px) and (max-width: 1023px) {
+    @content;
+  }
+}
+
+@mixin desktopScreen {
+  @media (min-width: 1024px) and (max-width: 1200px) {
+    @content;
+  }
+}
+
+@mixin desktopTreshold {
+  @media (max-width: 1200px) {
+    @content;
+  }
+}
+
+@mixin faqTreshold {
+  @media (max-width: 1351px) {
+    @content;
+  }
+}
+
+@mixin tabletTreshold {
+  @media (max-width: 1024px) {
+    @content;
+  }
+}
+
+@mixin mobileBreakPointTreshold {
+  @media (max-width: 768px) {
+    @content;
+  }
+}
+
+@mixin media($keys...) {
+  @each $key in $keys {
+    @if ($key == mobileScreen) {
+      @include mobileScreen {
+        @content;
+      }
+    } @else if ($key == tabletScreen) {
+      @include tabletScreen {
+        @content;
+      }
+    } @else if ($key == desktopScreen) {
+      @include desktopScreen {
+        @content;
+      }
+    } @else if ($key == mobileBreakPointTreshold) {
+      @include mobileBreakPointTreshold {
+        @content;
+      }
+    } @else if ($key == tabletTreshold) {
+      @include tabletTreshold {
+        @content;
+      }
+    } @else if ($key == desktopTreshold) {
+      @include desktopTreshold {
+        @content;
+      }
+    } @else if ($key == smallDesktopScreen) {
+      @include smallDesktopScreen {
+        @content;
+      }
+    } @else if ($key == faqTreshold) {
+      @include faqTreshold {
+        @content;
+      }
+    }
+  }
+}
+
+//USAGE
+
+// @include media(smallDesktopScreen, tabletScreen, mobileScreen){
+//   font-size: 24px;
+//   }

package/projects/af-connect-components/tsconfig.lib.json

@@ -0,0 +1,14 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": []
+  },
+  "exclude": [
+    "**/*.spec.ts"
+  ]
+}

package/projects/af-connect-components/tsconfig.lib.prod.json

@@ -0,0 +1,10 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "compilationMode": "partial"
+  }
+}

package/projects/af-connect-components/tsconfig.spec.json

@@ -0,0 +1,14 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "include": [
+    "**/*.spec.ts",
+    "**/*.d.ts"
+  ]
+}

package/tsconfig.json

@@ -0,0 +1,39 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "strictPropertyInitialization": false,
+    "paths": {
+      "af-connect-components": [
+        "dist/af-connect-components"
+      ]
+    },
+    "baseUrl": "./",
+    "outDir": "./dist/out-tsc",
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "sourceMap": true,
+    "declaration": false,
+    "downlevelIteration": true,
+    "experimentalDecorators": true,
+    "moduleResolution": "node",
+    "importHelpers": true,
+    "target": "ES2022",
+    "module": "ES2022",
+    "useDefineForClassFields": false,
+    "lib": [
+      "ES2022",
+      "dom"
+    ]
+  },
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "strictTemplates": true
+  }
+}

package/esm2020/af-connect-components.mjs

@@ -1,5 +0,0 @@
-/**
- * Generated bundle index. Do not edit.
- */
-export * from './public-api';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWYtY29ubmVjdC1jb21wb25lbnRzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vcHJvamVjdHMvYWYtY29ubmVjdC1jb21wb25lbnRzL3NyYy9hZi1jb25uZWN0LWNvbXBvbmVudHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==

package/esm2020/lib/af-connect-breadcrumb/af-connect-breadcrumb.component.mjs

@@ -1,22 +0,0 @@
-import { Component, Input } from '@angular/core';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/router";
-import * as i2 from "../expandable/expandable-arrow/expandable-arrow.component";
-import * as i3 from "../af-connect-svg-button/af-connect-svg-button.component";
-export class AfConnectBreadcrumbComponent {
-    constructor(router) {
-        this.router = router;
-    }
-    goToDashboard() {
-        // this.router.navigate(['/dashboard']);
-    }
-}
-AfConnectBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: AfConnectBreadcrumbComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-AfConnectBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: AfConnectBreadcrumbComponent, selector: "lib-af-connect-breadcrumb", inputs: { currentPage: "currentPage" }, ngImport: i0, template: "<div class=\"breadcrumb-wrapper\">\r\n    <div class=\"breadcrumb-container\">\r\n      <div class=\"home-icon-container\" (click)=\"goToDashboard()\">\r\n        <lib-af-connect-svg-button [customSize]=\"24\" src=\"../../../assets/icons/home.svg\" emitValue=\"isCloseModal\"></lib-af-connect-svg-button>\r\n      </div>\r\n      <div class=\"titles-container\">\r\n        <div class=\"home-title\" (click)=\"goToDashboard()\">Home</div>\r\n        <afc-expandable-arrow></afc-expandable-arrow>\r\n        <div class=\"current-title\">{{ currentPage }}</div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  ", styles: [".breadcrumb-wrapper{padding:2rem 0}@media (max-width: 768px){.breadcrumb-wrapper{padding:12px 6px}}.breadcrumb-container{display:inline-flex;align-items:center;padding:.5rem;background:var(--main-white-color);border-radius:22px;gap:14px}.home-icon-container{flex-shrink:0;width:32px;height:32px;background-color:var(--breadcrumb-background-color);display:flex;justify-content:center;align-items:center;border-radius:16px}.titles-container{display:flex;gap:1rem;font-size:14px;justify-content:space-between;align-items:center}@media (max-width: 768px){.titles-container{gap:.5rem}}.current-title{color:var(--primary-dark-teal-color);margin-right:.375rem}.home-title{cursor:pointer}\n"], dependencies: [{ kind: "component", type: i2.ExpandableArrowComponent, selector: "afc-expandable-arrow", inputs: ["color", "startPosition", "endPosition"] }, { kind: "component", type: i3.AfConnectSvgButtonComponent, selector: "lib-af-connect-svg-button", inputs: ["src", "emitValue", "customSize", "size"], outputs: ["clickBtn"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: AfConnectBreadcrumbComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-af-connect-breadcrumb', template: "<div class=\"breadcrumb-wrapper\">\r\n    <div class=\"breadcrumb-container\">\r\n      <div class=\"home-icon-container\" (click)=\"goToDashboard()\">\r\n        <lib-af-connect-svg-button [customSize]=\"24\" src=\"../../../assets/icons/home.svg\" emitValue=\"isCloseModal\"></lib-af-connect-svg-button>\r\n      </div>\r\n      <div class=\"titles-container\">\r\n        <div class=\"home-title\" (click)=\"goToDashboard()\">Home</div>\r\n        <afc-expandable-arrow></afc-expandable-arrow>\r\n        <div class=\"current-title\">{{ currentPage }}</div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  ", styles: [".breadcrumb-wrapper{padding:2rem 0}@media (max-width: 768px){.breadcrumb-wrapper{padding:12px 6px}}.breadcrumb-container{display:inline-flex;align-items:center;padding:.5rem;background:var(--main-white-color);border-radius:22px;gap:14px}.home-icon-container{flex-shrink:0;width:32px;height:32px;background-color:var(--breadcrumb-background-color);display:flex;justify-content:center;align-items:center;border-radius:16px}.titles-container{display:flex;gap:1rem;font-size:14px;justify-content:space-between;align-items:center}@media (max-width: 768px){.titles-container{gap:.5rem}}.current-title{color:var(--primary-dark-teal-color);margin-right:.375rem}.home-title{cursor:pointer}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { currentPage: [{
-                type: Input
-            }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWYtY29ubmVjdC1icmVhZGNydW1iLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FmLWNvbm5lY3QtY29tcG9uZW50cy9zcmMvbGliL2FmLWNvbm5lY3QtYnJlYWRjcnVtYi9hZi1jb25uZWN0LWJyZWFkY3J1bWIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvYWYtY29ubmVjdC1jb21wb25lbnRzL3NyYy9saWIvYWYtY29ubmVjdC1icmVhZGNydW1iL2FmLWNvbm5lY3QtYnJlYWRjcnVtYi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFRakQsTUFBTSxPQUFPLDRCQUE0QjtJQU92QyxZQUFvQixNQUFjO1FBQWQsV0FBTSxHQUFOLE1BQU0sQ0FBUTtJQUFHLENBQUM7SUFKL0IsYUFBYTtRQUNsQix3Q0FBd0M7SUFDMUMsQ0FBQzs7eUhBTFUsNEJBQTRCOzZHQUE1Qiw0QkFBNEIseUdDUnpDLGltQkFZRTsyRkRKVyw0QkFBNEI7a0JBTHhDLFNBQVM7K0JBQ0UsMkJBQTJCOzZGQUs1QixXQUFXO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBSb3V0ZXIgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdsaWItYWYtY29ubmVjdC1icmVhZGNydW1iJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vYWYtY29ubmVjdC1icmVhZGNydW1iLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9hZi1jb25uZWN0LWJyZWFkY3J1bWIuY29tcG9uZW50LnNjc3MnXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgQWZDb25uZWN0QnJlYWRjcnVtYkNvbXBvbmVudCB7XHJcbiAgQElucHV0KCkgY3VycmVudFBhZ2U6IHN0cmluZztcclxuXHJcbiAgcHVibGljIGdvVG9EYXNoYm9hcmQoKSB7XHJcbiAgICAvLyB0aGlzLnJvdXRlci5uYXZpZ2F0ZShbJy9kYXNoYm9hcmQnXSk7XHJcbiAgfVxyXG5cclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHJvdXRlcjogUm91dGVyKSB7fVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJicmVhZGNydW1iLXdyYXBwZXJcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJicmVhZGNydW1iLWNvbnRhaW5lclwiPlxyXG4gICAgICA8ZGl2IGNsYXNzPVwiaG9tZS1pY29uLWNvbnRhaW5lclwiIChjbGljayk9XCJnb1RvRGFzaGJvYXJkKClcIj5cclxuICAgICAgICA8bGliLWFmLWNvbm5lY3Qtc3ZnLWJ1dHRvbiBbY3VzdG9tU2l6ZV09XCIyNFwiIHNyYz1cIi4uLy4uLy4uL2Fzc2V0cy9pY29ucy9ob21lLnN2Z1wiIGVtaXRWYWx1ZT1cImlzQ2xvc2VNb2RhbFwiPjwvbGliLWFmLWNvbm5lY3Qtc3ZnLWJ1dHRvbj5cclxuICAgICAgPC9kaXY+XHJcbiAgICAgIDxkaXYgY2xhc3M9XCJ0aXRsZXMtY29udGFpbmVyXCI+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cImhvbWUtdGl0bGVcIiAoY2xpY2spPVwiZ29Ub0Rhc2hib2FyZCgpXCI+SG9tZTwvZGl2PlxyXG4gICAgICAgIDxhZmMtZXhwYW5kYWJsZS1hcnJvdz48L2FmYy1leHBhbmRhYmxlLWFycm93PlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJjdXJyZW50LXRpdGxlXCI+e3sgY3VycmVudFBhZ2UgfX08L2Rpdj5cclxuICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICA8L2Rpdj5cclxuICAiXX0=

package/esm2020/lib/af-connect-button/af-connect-button.component.mjs

@@ -1,47 +0,0 @@
-import { Component, Input, Output, EventEmitter } from '@angular/core';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-export class AfConnectButtonComponent {
-    constructor() {
-        this.title = '';
-        this.size = 'small';
-        this.variant = 'outlined';
-        this.iconSize = 14;
-        this.iconPosition = 'start';
-        this.clickBtn = new EventEmitter();
-    }
-    ngOnInit() { }
-}
-AfConnectButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: AfConnectButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AfConnectButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: AfConnectButtonComponent, selector: "lib-af-connect-button", inputs: { isActive: "isActive", emitValue: "emitValue", title: "title", disabled: "disabled", hybrid: "hybrid", fullWidth: "fullWidth", size: "size", variant: "variant", iconSrc: "iconSrc", iconSize: "iconSize", iconPosition: "iconPosition", activeItem: "activeItem" }, outputs: { clickBtn: "clickBtn" }, ngImport: i0, template: "<button\r\n  [class.hybrid]=\"hybrid\"\r\n  [ngClass]=\"[\r\n    fullWidth ? 'fullWidth' : '', 'button',\r\n    size,\r\n    variant,\r\n    activeItem === title || isActive ? 'active' : '',\r\n    iconPosition\r\n  ]\"\r\n  title=\"\"\r\n  [disabled]=\"disabled\"\r\n  (click)=\"this.clickBtn.emit(emitValue || title)\"\r\n>\r\n  <!-- TODO: Templates -->\r\n  <div\r\n    *ngIf=\"iconSrc\"\r\n    [ngStyle]=\"{\r\n      '-webkit-mask-image': 'url(' + iconSrc + ')',\r\n      'width': iconSize + 'px'\r\n    }\"\r\n    class=\"icon\"\r\n  >\r\n  </div>\r\n  <span [class]=\"['title', size, variant]\">{{ title }}</span>\r\n</button>\r\n", styles: [":host{display:flex;justify-content:center;width:auto}:host(.align-right){justify-content:flex-end}:host(.align-left){justify-content:flex-start}:host(.full-width) .button{width:100%}:host(.register-button) .button{color:var(--main-white-color);border-color:var(--main-white-color)}.button{display:flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;border-radius:30px;font-size:.8rem;padding:0 10px;background-color:var(--transparent-color);color:var(--primary-connected-orange-color);border:solid 1px var(--primary-connected-orange-color)}.button:disabled{border-color:var(--neutral-anchor-color);color:var(--neutral-anchor-color);cursor:auto}.button:disabled .icon{background:var(--neutral-anchor-color)}.button.small{width:8.4rem;height:2rem}.button.dynamic{width:100%;height:2rem}.button.medium{width:8.875rem;height:2.6rem}@media (max-width: 1024px){.button.medium{height:2.1rem}}.button.large{width:12rem;height:2.6rem}@media (max-width: 1024px){.button.large{min-width:8.5rem;height:2.3rem;font-size:12px}}.button.x-large{width:22rem;height:3.1875rem;font-size:1.375rem}@media (max-width: 1024px){.button.x-large{width:11.8rem;height:2.5rem;font-size:1rem}}.button.block{width:22rem;font-size:1rem;height:3rem}@media (max-width: 1024px){.button.block{width:11.8rem;height:2.5rem}}.button.filled{color:var(--main-white-color);background-color:var(--primary-connected-orange-color)}.button.filled:hover:not(:disabled){background:var(--primary-catalyst-yellow-color) 0% 0% no-repeat padding-box;border-color:var(--primary-catalyst-yellow-color)}.button.filled:disabled{background-color:var(--neutral-button-color);color:var(--neutral-anchor-color);border-color:var(--neutral-button-color)}.button.transparent{color:var(--main-white-color);border:solid 1px var(--main-white-color)}.button.cancel{color:var(--neutral-anchor-color);background:var(--neutral-button-color);border:none}.button.link{color:var(--primary-connected-orange-color);background:none;border:none;padding:0;height:-moz-fit-content;height:fit-content;width:auto;display:block}.button.link:disabled{color:var(--neutral-anchor-color)}.button.link:hover:not(:disabled),.button.link:disabled{background:transparent}@media (max-width: 768px){.button.hybrid{color:var(--primary-connected-orange-color);background:none;border:none;padding:0;height:-moz-fit-content;height:fit-content;width:auto;display:block}.button.hybrid:disabled{color:var(--neutral-anchor-color)}.button.hybrid:hover:not(:disabled),.button.hybrid:disabled{background:transparent}.button.hybrid .icon{display:none}}.button.fullWidth{width:100%}.button.greyish{padding:10px 8px;color:var(--main-black-color);background:var(--neutral-button-color);border:none;font-family:var(--standard-font-family-hero-new);font-size:.875rem;width:6.25rem;height:2.35rem;transition:background-color 125ms ease-in-out}.button.greyish>.title{white-space:nowrap;font-family:var(--standard-font-family-hero-new);font-size:14px}.button.greyish.small{height:2rem;width:5.5rem}@media (max-width: 768px){.button.greyish.small{min-width:auto;max-width:4.8rem}}.button.greyish.active{background-color:var(--primary-balanced-teal-color);color:var(--main-white-color)}@media (max-width: 768px){.button.greyish{min-width:100%;width:auto;max-height:2rem;padding:0}}.button.start{flex-direction:row}.button.end{flex-direction:row-reverse}.mat-button-disabled{opacity:.5;pointer-events:none}.icon{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;aspect-ratio:1;background:var(--primary-connected-orange-color)}.filled .icon{background:var(--main-white-color)}.title{font-family:var(--standard-font-family-hero-new-bold);font-size:14px}.title.small,.title.dynamic{font-size:12px}.title.medium{font-size:14px}.title.x-large{font-size:1.375rem;font-family:var(--standard-font-family-hero-new)}.title.link{font-family:var(--standard-font-family-hero-new-semibold)}@media (max-width: 1024px){.title{font-size:.75rem}.title.x-large{font-size:1rem}}@media (max-width: 768px){.title.large{font-family:var(--standard-font-family-hero-new-semibold)}}:host(.bold) .title{font-family:var(--standard-font-family-hero-new-semibold)}:host(.filter) .button.small{min-height:32px}:host(.filter) .title{font-size:1rem;font-family:var(--standard-font-family-hero-new-semibold)}@media (max-width: 768px){:host(.filter) .title{font-size:14px}}:host(.filter) .button{max-width:6.5rem}@media (max-width: 768px){:host(.filter) .button{max-width:4.5rem;max-height:1.75rem}}:host(.auto-width){width:auto}:host(.full-width){width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: AfConnectButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-af-connect-button', template: "<button\r\n  [class.hybrid]=\"hybrid\"\r\n  [ngClass]=\"[\r\n    fullWidth ? 'fullWidth' : '', 'button',\r\n    size,\r\n    variant,\r\n    activeItem === title || isActive ? 'active' : '',\r\n    iconPosition\r\n  ]\"\r\n  title=\"\"\r\n  [disabled]=\"disabled\"\r\n  (click)=\"this.clickBtn.emit(emitValue || title)\"\r\n>\r\n  <!-- TODO: Templates -->\r\n  <div\r\n    *ngIf=\"iconSrc\"\r\n    [ngStyle]=\"{\r\n      '-webkit-mask-image': 'url(' + iconSrc + ')',\r\n      'width': iconSize + 'px'\r\n    }\"\r\n    class=\"icon\"\r\n  >\r\n  </div>\r\n  <span [class]=\"['title', size, variant]\">{{ title }}</span>\r\n</button>\r\n", styles: [":host{display:flex;justify-content:center;width:auto}:host(.align-right){justify-content:flex-end}:host(.align-left){justify-content:flex-start}:host(.full-width) .button{width:100%}:host(.register-button) .button{color:var(--main-white-color);border-color:var(--main-white-color)}.button{display:flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;border-radius:30px;font-size:.8rem;padding:0 10px;background-color:var(--transparent-color);color:var(--primary-connected-orange-color);border:solid 1px var(--primary-connected-orange-color)}.button:disabled{border-color:var(--neutral-anchor-color);color:var(--neutral-anchor-color);cursor:auto}.button:disabled .icon{background:var(--neutral-anchor-color)}.button.small{width:8.4rem;height:2rem}.button.dynamic{width:100%;height:2rem}.button.medium{width:8.875rem;height:2.6rem}@media (max-width: 1024px){.button.medium{height:2.1rem}}.button.large{width:12rem;height:2.6rem}@media (max-width: 1024px){.button.large{min-width:8.5rem;height:2.3rem;font-size:12px}}.button.x-large{width:22rem;height:3.1875rem;font-size:1.375rem}@media (max-width: 1024px){.button.x-large{width:11.8rem;height:2.5rem;font-size:1rem}}.button.block{width:22rem;font-size:1rem;height:3rem}@media (max-width: 1024px){.button.block{width:11.8rem;height:2.5rem}}.button.filled{color:var(--main-white-color);background-color:var(--primary-connected-orange-color)}.button.filled:hover:not(:disabled){background:var(--primary-catalyst-yellow-color) 0% 0% no-repeat padding-box;border-color:var(--primary-catalyst-yellow-color)}.button.filled:disabled{background-color:var(--neutral-button-color);color:var(--neutral-anchor-color);border-color:var(--neutral-button-color)}.button.transparent{color:var(--main-white-color);border:solid 1px var(--main-white-color)}.button.cancel{color:var(--neutral-anchor-color);background:var(--neutral-button-color);border:none}.button.link{color:var(--primary-connected-orange-color);background:none;border:none;padding:0;height:-moz-fit-content;height:fit-content;width:auto;display:block}.button.link:disabled{color:var(--neutral-anchor-color)}.button.link:hover:not(:disabled),.button.link:disabled{background:transparent}@media (max-width: 768px){.button.hybrid{color:var(--primary-connected-orange-color);background:none;border:none;padding:0;height:-moz-fit-content;height:fit-content;width:auto;display:block}.button.hybrid:disabled{color:var(--neutral-anchor-color)}.button.hybrid:hover:not(:disabled),.button.hybrid:disabled{background:transparent}.button.hybrid .icon{display:none}}.button.fullWidth{width:100%}.button.greyish{padding:10px 8px;color:var(--main-black-color);background:var(--neutral-button-color);border:none;font-family:var(--standard-font-family-hero-new);font-size:.875rem;width:6.25rem;height:2.35rem;transition:background-color 125ms ease-in-out}.button.greyish>.title{white-space:nowrap;font-family:var(--standard-font-family-hero-new);font-size:14px}.button.greyish.small{height:2rem;width:5.5rem}@media (max-width: 768px){.button.greyish.small{min-width:auto;max-width:4.8rem}}.button.greyish.active{background-color:var(--primary-balanced-teal-color);color:var(--main-white-color)}@media (max-width: 768px){.button.greyish{min-width:100%;width:auto;max-height:2rem;padding:0}}.button.start{flex-direction:row}.button.end{flex-direction:row-reverse}.mat-button-disabled{opacity:.5;pointer-events:none}.icon{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;aspect-ratio:1;background:var(--primary-connected-orange-color)}.filled .icon{background:var(--main-white-color)}.title{font-family:var(--standard-font-family-hero-new-bold);font-size:14px}.title.small,.title.dynamic{font-size:12px}.title.medium{font-size:14px}.title.x-large{font-size:1.375rem;font-family:var(--standard-font-family-hero-new)}.title.link{font-family:var(--standard-font-family-hero-new-semibold)}@media (max-width: 1024px){.title{font-size:.75rem}.title.x-large{font-size:1rem}}@media (max-width: 768px){.title.large{font-family:var(--standard-font-family-hero-new-semibold)}}:host(.bold) .title{font-family:var(--standard-font-family-hero-new-semibold)}:host(.filter) .button.small{min-height:32px}:host(.filter) .title{font-size:1rem;font-family:var(--standard-font-family-hero-new-semibold)}@media (max-width: 768px){:host(.filter) .title{font-size:14px}}:host(.filter) .button{max-width:6.5rem}@media (max-width: 768px){:host(.filter) .button{max-width:4.5rem;max-height:1.75rem}}:host(.auto-width){width:auto}:host(.full-width){width:100%}\n"] }]
-        }], propDecorators: { isActive: [{
-                type: Input
-            }], emitValue: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], hybrid: [{
-                type: Input
-            }], fullWidth: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], variant: [{
-                type: Input
-            }], iconSrc: [{
-                type: Input
-            }], iconSize: [{
-                type: Input
-            }], iconPosition: [{
-                type: Input
-            }], activeItem: [{
-                type: Input
-            }], clickBtn: [{
-                type: Output
-            }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWYtY29ubmVjdC1idXR0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvYWYtY29ubmVjdC1jb21wb25lbnRzL3NyYy9saWIvYWYtY29ubmVjdC1idXR0b24vYWYtY29ubmVjdC1idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvYWYtY29ubmVjdC1jb21wb25lbnRzL3NyYy9saWIvYWYtY29ubmVjdC1idXR0b24vYWYtY29ubmVjdC1idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBUXZFLE1BQU0sT0FBTyx3QkFBd0I7SUFMckM7UUFRVyxVQUFLLEdBQUcsRUFBRSxDQUFDO1FBSVgsU0FBSSxHQUFtRSxPQUFPLENBQUM7UUFDL0UsWUFBTyxHQUEwRSxVQUFVLENBQUM7UUFFNUYsYUFBUSxHQUFHLEVBQUUsQ0FBQztRQUNkLGlCQUFZLEdBQW9CLE9BQU8sQ0FBQztRQUV2QyxhQUFRLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztLQUdqRDtJQURDLFFBQVEsS0FBVSxDQUFDOztxSEFmUix3QkFBd0I7eUdBQXhCLHdCQUF3Qiw4V0NSckMsOG5CQXlCQTsyRkRqQmEsd0JBQXdCO2tCQUxwQyxTQUFTOytCQUNFLHVCQUF1Qjs4QkFLeEIsUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUNJLFFBQVE7c0JBQWpCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPdXRwdXQsIEV2ZW50RW1pdHRlciB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBFbWl0VmFsdWUgfSBmcm9tICcuLi9jb25zdGFudHMvYmFzZS5jb25zdGFudHMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdsaWItYWYtY29ubmVjdC1idXR0b24nLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9hZi1jb25uZWN0LWJ1dHRvbi5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vYWYtY29ubmVjdC1idXR0b24uY29tcG9uZW50LnNjc3MnXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgQWZDb25uZWN0QnV0dG9uQ29tcG9uZW50IHtcclxuICBASW5wdXQoKSBpc0FjdGl2ZTogYm9vbGVhbjtcclxuICBASW5wdXQoKSBlbWl0VmFsdWU6IEVtaXRWYWx1ZTtcclxuICBASW5wdXQoKSB0aXRsZSA9ICcnO1xyXG4gIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuO1xyXG4gIEBJbnB1dCgpIGh5YnJpZDogYm9vbGVhbjtcclxuICBASW5wdXQoKSBmdWxsV2lkdGg6IGJvb2xlYW47XHJcbiAgQElucHV0KCkgc2l6ZTogJ3NtYWxsJyB8ICdtZWRpdW0nIHwgJ2xhcmdlJyB8ICd4LWxhcmdlJyB8ICdibG9jaycgfCAnZHluYW1pYycgPSAnc21hbGwnO1xyXG4gIEBJbnB1dCgpIHZhcmlhbnQ6ICdvdXRsaW5lZCcgfCAnZmlsbGVkJyB8ICd0cmFuc3BhcmVudCcgfCAnbGluaycgfCAnY2FuY2VsJyB8ICdncmV5aXNoJyA9ICdvdXRsaW5lZCc7XHJcbiAgQElucHV0KCkgaWNvblNyYzogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGljb25TaXplID0gMTQ7XHJcbiAgQElucHV0KCkgaWNvblBvc2l0aW9uOiAnc3RhcnQnIHwgJ2VuZCcgPSAnc3RhcnQnO1xyXG4gIEBJbnB1dCgpIGFjdGl2ZUl0ZW06IHN0cmluZztcclxuICBAT3V0cHV0KCkgY2xpY2tCdG4gPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7fVxyXG59XHJcbiIsIjxidXR0b25cclxuICBbY2xhc3MuaHlicmlkXT1cImh5YnJpZFwiXHJcbiAgW25nQ2xhc3NdPVwiW1xyXG4gICAgZnVsbFdpZHRoID8gJ2Z1bGxXaWR0aCcgOiAnJywgJ2J1dHRvbicsXHJcbiAgICBzaXplLFxyXG4gICAgdmFyaWFudCxcclxuICAgIGFjdGl2ZUl0ZW0gPT09IHRpdGxlIHx8IGlzQWN0aXZlID8gJ2FjdGl2ZScgOiAnJyxcclxuICAgIGljb25Qb3NpdGlvblxyXG4gIF1cIlxyXG4gIHRpdGxlPVwiXCJcclxuICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxyXG4gIChjbGljayk9XCJ0aGlzLmNsaWNrQnRuLmVtaXQoZW1pdFZhbHVlIHx8IHRpdGxlKVwiXHJcbj5cclxuICA8IS0tIFRPRE86IFRlbXBsYXRlcyAtLT5cclxuICA8ZGl2XHJcbiAgICAqbmdJZj1cImljb25TcmNcIlxyXG4gICAgW25nU3R5bGVdPVwie1xyXG4gICAgICAnLXdlYmtpdC1tYXNrLWltYWdlJzogJ3VybCgnICsgaWNvblNyYyArICcpJyxcclxuICAgICAgJ3dpZHRoJzogaWNvblNpemUgKyAncHgnXHJcbiAgICB9XCJcclxuICAgIGNsYXNzPVwiaWNvblwiXHJcbiAgPlxyXG4gIDwvZGl2PlxyXG4gIDxzcGFuIFtjbGFzc109XCJbJ3RpdGxlJywgc2l6ZSwgdmFyaWFudF1cIj57eyB0aXRsZSB9fTwvc3Bhbj5cclxuPC9idXR0b24+XHJcbiJdfQ==