af-connect-components 0.0.26 → 0.0.27

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

@@ -1,21 +0,0 @@
-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

@@ -1,7 +0,0 @@
-<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

@@ -1,18 +0,0 @@
-@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

@@ -1,23 +0,0 @@
-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

@@ -1,16 +0,0 @@
-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

@@ -1,15 +0,0 @@
-<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

@@ -1,58 +0,0 @@
-@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

@@ -1,23 +0,0 @@
-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

@@ -1,12 +0,0 @@
-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

@@ -1,57 +0,0 @@
-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/projects/af-connect-components/src/lib/models/radio.model.ts

@@ -1,3 +0,0 @@
-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

@@ -1,10 +0,0 @@
-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

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

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

@@ -1,13 +0,0 @@
-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

@@ -1,91 +0,0 @@
-@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

@@ -1,14 +0,0 @@
-/* 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

@@ -1,10 +0,0 @@
-/* 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

@@ -1,14 +0,0 @@
-/* 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

@@ -1,39 +0,0 @@
-/* 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
-  }
-}