@vectoriox/iox-ui 4.0.2 → 4.0.3

package/projects/iox-ui/package-lock.json

@@ -0,0 +1,93 @@
+{
+  "name": "@iox-dev/iox-ui",
+  "version": "1.0.9",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "@iox-dev/iox-ui",
+      "version": "1.0.9",
+      "dependencies": {
+        "@fristys/masonry": "^1.1.7",
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/animations": "^17.0.0",
+        "@angular/common": "^17.0.0",
+        "@angular/core": "^17.0.0"
+      }
+    },
+    "node_modules/@angular/animations": {
+      "version": "17.3.11",
+      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-17.3.11.tgz",
+      "integrity": "sha512-1y1Egag5jbdUSUWVK+KA39N9VFDrzq9ObjbAhrXFlXKa0npBRw5bprEEeLFQMETMP9Mpjbmj2PoASfl4vqj/Iw==",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^18.13.0 || >=20.9.0"
+      },
+      "peerDependencies": {
+        "@angular/core": "17.3.11"
+      }
+    },
+    "node_modules/@angular/common": {
+      "version": "17.3.11",
+      "resolved": "https://registry.npmjs.org/@angular/common/-/common-17.3.11.tgz",
+      "integrity": "sha512-WG+HQjUaQziYLGdbcv2aW+G73uroN5VF9yk4qWYcolW+VB8SV/DOAol8uFVgCF21cIOl5+wfJZvA4r5oG3dYaw==",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^18.13.0 || >=20.9.0"
+      },
+      "peerDependencies": {
+        "@angular/core": "17.3.11",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/@angular/core": {
+      "version": "17.3.11",
+      "resolved": "https://registry.npmjs.org/@angular/core/-/core-17.3.11.tgz",
+      "integrity": "sha512-2wPZwXFei3kVxK2ylIH6CdGebrC4kvooFx7qoX+250OITAEFMODJGdh/e3x0DpFUjlRvQtIFQ+YpQlfC5JnL4g==",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^18.13.0 || >=20.9.0"
+      },
+      "peerDependencies": {
+        "rxjs": "^6.5.3 || ^7.4.0",
+        "zone.js": "~0.14.0"
+      }
+    },
+    "node_modules/@fristys/masonry": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/@fristys/masonry/-/masonry-1.1.7.tgz",
+      "integrity": "sha512-b/CohDq3E/NOXIlBa+b64ObmZvtjofPMLThBjDLa5gp/NCwDD6b8GoXTmMAoCwibZvIsXsgvk5JgIpE5QJg9mA=="
+    },
+    "node_modules/rxjs": {
+      "version": "7.8.1",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
+      "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.6.3",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz",
+      "integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ=="
+    },
+    "node_modules/zone.js": {
+      "version": "0.14.7",
+      "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.14.7.tgz",
+      "integrity": "sha512-0w6DGkX2BPuiK/NLf+4A8FLE43QwBfuqz2dVgi/40Rj1WmqUskCqj329O/pwrqFJLG5X8wkeG2RhIAro441xtg==",
+      "peer": true
+    }
+  }
+}

package/projects/iox-ui/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "@vectoriox/iox-ui",
+  "version": "4.0.3",
+  "peerDependencies": {
+    "@angular/common": "^20.0.0",
+    "@angular/core": "^20.0.0",
+    "@angular/animations": "^20.0.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0",
+    "@fristys/masonry": "^1.1.7"
+  }
+}

package/projects/iox-ui/src/lib/iox-aos/iox-aos-animations.ts

@@ -0,0 +1,45 @@
+import { AnimationBuilder, style, animate, keyframes } from '@angular/animations';
+
+/**********  Entries Animations ********************/
+
+export const IoxAnimationStyles: any = {}
+
+IoxAnimationStyles["fade-up"] = (delay:string, duration:string)=>{
+    return [style({ opacity: 0, transform: "translate3d(0,100px,0)"}),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 1, transform: "translateZ(0)" }))]
+}
+
+IoxAnimationStyles["fade-right"] = (delay:string, duration:string)=>{
+    return [style({ opacity: 0, transform: "translateX(150px)"}),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 1, transform: "translateZ(0)" }))]
+}
+
+IoxAnimationStyles["fade-out-right"] = (delay:string, duration:string)=>{
+    return [style({ opacity: 1, transform: "translateX(0px)"}),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 0, transform: "translateX(150px)" }))]
+}
+
+IoxAnimationStyles["fade-left"] = (delay:string, duration:string)=>{
+    return [style({ opacity: 0, transform: "translateX(-150px)"}),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 1, transform: "translateZ(0)" }))]
+}
+
+IoxAnimationStyles["fade-out-up"] = (delay:string, duration:string)=>{
+    return [ style({ opacity: 1, transform: "translateZ(0)" }),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 0, transform: "translate3d(0,-100px,0)"}))]
+}
+
+IoxAnimationStyles["flip-left"] = (delay:string, duration:string)=>{
+    return [style({opacity: 0,transform: "perspective(2500px) rotateY(-100deg)"}),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 1, transform: "perspective(2500px) rotateY(0)" }))]
+}
+
+IoxAnimationStyles["flip-up"] = (delay:string, duration:string)=>{
+    return [style({opacity: 0,transform: "perspective(2500px) rotateX(-100deg)"}),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 1, transform: "perspective(2500px) rotateY(0)" }))]
+}
+
+IoxAnimationStyles["zoom-in-up"] = (delay:string, duration:string)=>{
+    return [style({opacity: 0,transform: "translate3d(0,100px,0) scale(.6)"}),
+    animate(`${duration} ${delay} cubic-bezier(0.445, 0.05, 0.55, 0.95)`, style({ opacity: 1, transform: "translateZ(0) scale(1)" }))]
+}

package/projects/iox-ui/src/lib/iox-aos/iox-aos-container.component.ts

@@ -0,0 +1,46 @@
+import { Component, ElementRef, HostListener, Input, SimpleChanges, ViewChild } from '@angular/core';
+import { Observable, Subject } from 'rxjs';
+import { AOSService } from './iox-aos.service';
+
+@Component({
+    selector: "[ioxAnimateContainer], ioxAnimateContainer",
+    template:`<div class='animate_root_element' #animateRooteElement>
+        <ng-content></ng-content>
+        </div>`,
+    standalone: false
+})
+export class IoxAnimateContainer {
+
+    @Input('kickIn') kickIn = true;
+
+    private _scrollOffset:Subject<any> = new Subject();
+    public readonly scrollOffset: Observable<any> = this._scrollOffset.asObservable();
+    @ViewChild('animateRooteElement') public  animateRooteElement:any;
+    
+
+    constructor(private _element: ElementRef, private _aOSService: AOSService) {
+    }
+
+    ngAfterViewInit(){
+        this.updateOffset();
+    }
+
+    @HostListener('scroll', ['$event'])
+    public onScroll($event:any){
+        this.updateOffset();
+    }
+
+    ngOnChanges(changes: SimpleChanges) {
+        console.log(changes);
+        if(changes['kickIn'] && changes['kickIn'].currentValue){
+            this.updateOffset();
+        }
+    }
+
+
+    private updateOffset(){
+        let elClientRect = this.animateRooteElement.nativeElement.getBoundingClientRect();
+        this._scrollOffset.next(elClientRect);
+        this._aOSService.updateScrollOffset(elClientRect);
+    }
+}

package/projects/iox-ui/src/lib/iox-aos/iox-aos.directive.ts

@@ -0,0 +1,133 @@
+import { Directive, OnDestroy, AfterViewInit, ElementRef, Input, OnInit, Renderer2, HostListener, Host, Optional  } from "@angular/core";
+import { AnimationBuilder, style, animate, AnimationPlayer } from '@angular/animations';
+import { IoxAnimationStyles } from "./iox-aos-animations"
+;
+import { IoxAnimateContainer } from "./iox-aos-container.component";
+@Directive({
+    selector: "[ioxAnimate], ioxAnimate",
+    standalone: false
+  })
+  export class IoxAosDirective implements OnDestroy, OnInit, AfterViewInit {
+    
+    @Input("animationDelay") animationDelay: string ="";
+    @Input("animationIn") animationIn: string ="";
+    @Input("animationOut") animationOut: string = "";
+    @Input("animationDuration") animationDuration: string = "0.5s";
+    
+    // @Input("in")
+    // @Input("out")
+
+    public animation:AnimationPlayer | any;
+    public isAnimationPlayed= false;
+    private _elTop:number =0;
+
+
+    constructor(@Host() @Optional() private _animateContainer: IoxAnimateContainer, private _element: ElementRef, private _animationBuilder:AnimationBuilder, private  _renderer: Renderer2){
+        
+        this._renderer.setStyle(_element.nativeElement,'opacity', '0');
+    }
+
+    public ngOnInit(){
+    }
+
+    public  ngAfterViewInit(){
+
+          setTimeout(()=>{
+
+            this._elTop = this._cumulativeOffset(this._element.nativeElement).top;
+
+            if(this._animateContainer){
+              if(this._animateContainer.kickIn){
+                this.runIfVisiable();
+              }else{
+                return
+              }
+            }else{
+              this.runIfVisiable();
+            }
+
+     
+            
+          },150)
+
+          const resizeObserver = new ResizeObserver((entries) =>
+            this._elTop = this._cumulativeOffset(this._element.nativeElement).top
+          );
+
+          resizeObserver.observe(document.body);
+          
+          if(this._animateContainer){
+            this._animateContainer?.scrollOffset.subscribe((offset:any)=>{
+              if(this._animateContainer.kickIn){
+                this.scrollEventHandler(-1 *offset.top);
+              }
+            })
+          }
+
+          
+    }
+
+    public makeAnimationIn(animationStyle:any):AnimationPlayer{
+        let animation = IoxAnimationStyles[animationStyle](this.animationDelay, this.animationDuration);
+        const myAnimation = this._animationBuilder.build(animation)
+        return myAnimation.create(this._element.nativeElement);  
+
+    }
+
+    private _cumulativeOffset(element:any) {
+        var top = 0, left = 0;
+        do {
+            top += element.offsetTop  || 0;
+            left += element.offsetLeft || 0;
+            element = element.offsetParent;
+        } while(element);
+    
+        return {
+            top: top,
+            left: left
+        };
+    };
+
+  @HostListener('document:scroll', ['$event']) onScrollEvent($event:any){
+       this.scrollEventHandler(window.pageYOffset)
+    }
+    
+    public isVisable(offset:number){
+      //console.log(this._elTop >= window.pageYOffset && this._elTop <= window.pageYOffset + window.innerHeight);
+      //return this._elTop >= window.pageYOffset && this._elTop <= window.pageYOffset + window.innerHeight;
+      return this._elTop >= offset && this._elTop <= offset + window.innerHeight;
+    }
+
+
+    public scrollEventHandler(offset:number){
+
+      if(this._animateContainer && this._animateContainer.kickIn == false){
+        return
+      }
+
+      if(this.isVisable(offset) && !this.isAnimationPlayed){
+        let animationStyle = this.animationIn || "fade-up";
+        this.makeAnimationIn(animationStyle).play();
+        this.isAnimationPlayed = true;
+      }else if(!this.isVisable(offset) && this.isAnimationPlayed && this.animationOut){
+        this.makeAnimationIn(this.animationOut).play();
+        this.isAnimationPlayed =false;
+      }
+    }
+
+    public runIfVisiable(){
+      if(this.isVisable(window.pageYOffset)){
+        let animationStyle = this.animationIn || "fade-up";
+        this.makeAnimationIn(animationStyle).play();
+        this.isAnimationPlayed = true;
+      }
+    }
+    public ngOnDestroy(){
+
+    }
+
+  }
+
+function ViewParent() {
+  throw new Error("Function not implemented.");
+}

package/projects/iox-ui/src/lib/iox-aos/iox-aos.module.ts

@@ -0,0 +1,33 @@
+import { ModuleWithProviders, NgModule } from '@angular/core';
+import { IoxAosDirective } from './iox-aos.directive';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { IoxAnimateContainer } from './iox-aos-container.component';
+import { AOSService } from './iox-aos.service';
+
+
+@NgModule({
+  declarations: [
+    IoxAosDirective,
+    IoxAnimateContainer
+  ],
+  imports: [
+    BrowserAnimationsModule
+  ],
+  providers:[
+    AOSService
+  ],
+  exports: [
+    IoxAosDirective,
+    IoxAnimateContainer
+   ]
+})
+export class IoxAosModule { 
+
+  static forRoot(): ModuleWithProviders<any> {
+    return {
+      ngModule: IoxAosModule,
+      providers: [AOSService]
+    };
+  }
+
+}

package/projects/iox-ui/src/lib/iox-aos/iox-aos.service.ts

@@ -0,0 +1,21 @@
+import { Injectable } from "@angular/core";
+import { Observable, Subject } from "rxjs";
+
+
+
+@Injectable({providedIn: 'root'})
+export class AOSService {
+
+
+
+    private _scrollOffset:Subject<any> = new Subject();
+    public readonly scrollOffset: Observable<any> = this._scrollOffset.asObservable();
+      
+  constructor() { }
+
+
+  updateScrollOffset(offset:any){
+    this._scrollOffset.next(offset);
+  }
+
+}

package/projects/iox-ui/src/lib/iox-masonry/iox-masonry-item.directive.ts

@@ -0,0 +1,24 @@
+import { Directive, Inject, ElementRef, forwardRef, OnDestroy, AfterViewInit, Renderer2 } from '@angular/core';
+import { IoxMasonryComponent } from './iox-masonry.component';
+@Directive({
+  selector: "[ioxMasonryItem], ioxMasonryItem",
+  standalone: false
+})
+export class IoxMasonryItemDirective implements OnDestroy, AfterViewInit {
+    constructor(
+      private _element: ElementRef,
+      @Inject(forwardRef(() => IoxMasonryComponent))
+      private _parent: IoxMasonryComponent,
+      private _renderer:Renderer2) {
+        //this._renderer.setStyle(_element.nativeElement,'opacity', '0');
+      }
+
+      ngAfterViewInit() {
+          console.log(this._element.nativeElement);
+          this._parent.add(this._element.nativeElement);
+      }
+
+      ngOnDestroy() {
+          this._parent.remove(this._element.nativeElement);
+      }
+}

package/projects/iox-ui/src/lib/iox-masonry/iox-masonry.component.spec.ts

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

package/projects/iox-ui/src/lib/iox-masonry/iox-masonry.component.ts

@@ -0,0 +1,71 @@
+import { Component, OnInit, Input, Output, EventEmitter, HostListener,  ElementRef, AfterViewInit} from '@angular/core';
+import { Masonry } from '@fristys/masonry';
+
+
+@Component({ 
+  selector: "[iox-masonry], iox-masonry",
+  template: `<ng-content></ng-content>`,
+  styles: [],
+  standalone: false
+})
+export class IoxMasonryComponent implements OnInit, AfterViewInit {
+
+  
+
+  // Inputs
+  @Input() public options: any = {};
+  @Input() public useImagesLoaded: Boolean = false;
+  @Input() updateLayout: Boolean = false;
+
+  @Output() layoutComplete: EventEmitter<any[]> = new EventEmitter<any[]>();
+  
+  public _msnry: any;
+  private isAppendAllowed:boolean = true;
+
+  constructor(private _element: ElementRef) { }
+
+  ngAfterViewInit(): void {
+    console.log("test");
+  }
+
+  ngOnInit() {
+    this._msnry = new Masonry(document.getElementById('masonry'), this.options);
+    this.layout();  
+  }
+ 
+  ngOnChanges(changes: any) {
+    console.log(changes);
+  }
+
+
+  add = (element: HTMLElement)=>{
+    setTimeout(()=>{
+      this._msnry.init();
+    },200)
+
+  }
+
+  public remove(element: HTMLElement) {
+    this._msnry.remove(element);
+  }
+
+  public layout() {
+    setTimeout(() => {
+      this._msnry.init();
+    });
+  }
+
+}
+
+export interface IoxMasonryOptions {
+  columns?: number;
+  columnBreakpoints?: number;
+  gutter?: number | string;
+  initOnImageLoad?: boolean;
+  loadingClass?: string;
+  loadedClass?: string;
+  onInit?:any;
+  bindOnScroll?: boolean;
+  useContainerWidth?: boolean;
+  trackItemSizeChanges?: boolean;
+}

package/projects/iox-ui/src/lib/iox-masonry/iox-masonry.module.ts

@@ -0,0 +1,15 @@
+import { NgModule } from '@angular/core';
+import { IoxMasonryComponent } from './iox-masonry.component';
+import { IoxMasonryItemDirective } from './iox-masonry-item.directive';
+import { BrowserModule } from '@angular/platform-browser';
+
+
+
+@NgModule({
+  declarations: [IoxMasonryComponent, IoxMasonryItemDirective],
+  imports: [
+    BrowserModule
+  ],
+  exports: [IoxMasonryComponent, IoxMasonryItemDirective]
+})
+export class IoxMasonryModule { }

package/projects/iox-ui/src/lib/iox-masonry/iox-masonry.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { IoxMasonryService } from './iox-masonry.service';
+
+describe('IoxMasonryService', () => {
+  let service: IoxMasonryService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(IoxMasonryService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

package/projects/iox-ui/src/lib/iox-masonry/iox-masonry.service.ts

@@ -0,0 +1,9 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class IoxMasonryService {
+
+  constructor() { }
+}

package/projects/iox-ui/src/lib/iox-page/iox-page.module.ts

@@ -0,0 +1,13 @@
+
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IoxPageComponent } from './page-component/page-component.component';
+import { PageScrollProvider } from '../services/page-scroll.provider';
+
+@NgModule({
+  imports: [CommonModule],
+  declarations: [IoxPageComponent],
+  exports: [IoxPageComponent],
+  providers: [PageScrollProvider]
+})
+export class IoxPageModule {}

package/projects/iox-ui/src/lib/iox-page/page-component/page-component.component.html

@@ -0,0 +1,5 @@
+<div #page [class]="class" class="iox-page-wrapper">
+  <div class="page-mask">
+    <ng-content></ng-content>
+  </div>
+</div>

package/projects/iox-ui/src/lib/iox-page/page-component/page-component.component.scss

@@ -0,0 +1,19 @@
+:host {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+.iox-page-wrapper {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+}
+
+.page-mask {
+  min-height: 100%;
+}
+
+

package/projects/iox-ui/src/lib/iox-page/page-component/page-component.component.ts

@@ -0,0 +1,60 @@
+import { Component, ElementRef, EventEmitter, Input, Output, ViewChild, AfterViewInit, OnDestroy } from '@angular/core';
+import { fromEvent, Subscription } from 'rxjs';
+import { PageScrollProvider } from '../../services/page-scroll.provider';
+
+@Component({
+  selector: 'iox-page-component',
+  templateUrl: './page-component.component.html',
+  styleUrls: ['./page-component.component.scss'],
+  standalone: false
+})
+export class IoxPageComponent implements AfterViewInit, OnDestroy {
+  @Input() class = '';
+  @ViewChild('page') public page!: ElementRef<HTMLDivElement>;
+  private scrollSubscription!: Subscription;
+  @Output() scrollEvent = new EventEmitter<{
+    scrollTop: number;
+    scrollLeft: number;
+    scrollHeight: number;
+    scrollWidth: number;
+    clientHeight: number;
+    clientWidth: number;
+    scrollPercentage: number;
+  }>();
+
+  constructor(private pageScrollProvider: PageScrollProvider) {}
+
+  ngAfterViewInit(): void {
+    if (this.page) {
+      this.scrollSubscription = fromEvent(this.page.nativeElement, 'scroll').subscribe((event) => {
+        this.onScroll(event as Event);
+      });
+
+      this.pageScrollProvider.init({
+        wrapper: this.page.nativeElement,
+        content: this.page.nativeElement.querySelector('.page-mask')!,
+        duration: 1.2,
+        easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
+      });
+    }
+  }
+
+  onScroll(event: Event): void {
+    const target = event.target as HTMLElement;
+    const scrollTop = target.scrollTop;
+    const scrollLeft = target.scrollLeft;
+    const scrollHeight = target.scrollHeight;
+    const scrollWidth = target.scrollWidth;
+    const clientHeight = target.clientHeight;
+    const clientWidth = target.clientWidth;
+    const scrollPercentage = (scrollTop / (scrollHeight - clientHeight)) * 100;
+
+    this.scrollEvent.emit({ scrollTop, scrollLeft, scrollHeight, scrollWidth, clientHeight, clientWidth, scrollPercentage });
+  }
+
+  ngOnDestroy(): void {
+    if (this.scrollSubscription) {
+      this.scrollSubscription.unsubscribe();
+    }
+  }
+}

package/projects/iox-ui/src/lib/iox-ui.module.ts

@@ -0,0 +1,11 @@
+import { NgModule } from '@angular/core';
+import { IoxAosModule } from './iox-aos/iox-aos.module';
+import { IoxPageModule } from './iox-page/iox-page.module';
+
+
+@NgModule({
+  declarations: [],
+  imports: [IoxAosModule, IoxPageModule],
+  exports: [IoxAosModule, IoxPageModule]
+})
+export class IoxUiModule { }