@ngartifex/core/fesm2020/ngartifex-core.mjs

ngartifex core library for angular

import * as i0 from '@angular/core';
import { Directive, Input, Injectable, NgModule } from '@angular/core';
import * as i1$1 from '@ngartifex/ngrx-action';
import { Action, Store, ReduxRegisterModule } from '@ngartifex/ngrx-action';
import { __decorate } from 'tslib';
import * as i1 from '@ngrx/store';
import { createAction, props, createSelector, select } from '@ngrx/store';
import { BehaviorSubject, fromEvent } from 'rxjs';
import { debounceTime, map, distinctUntilChanged, startWith, tap } from 'rxjs/operators';

class DynamicDirective {
    constructor(viewContainerRef) {
        this.viewContainerRef = viewContainerRef;
    }
}
DynamicDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: DynamicDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
DynamicDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.11", type: DynamicDirective, selector: "[ngartifexDynamic]", inputs: { name: "name" }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: DynamicDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[ngartifexDynamic]'
                }]
        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { name: [{
                type: Input
            }] } });

var ResponsiveActionTypes;
(function (ResponsiveActionTypes) {
    ResponsiveActionTypes["ScreenChanged"] = "[Responsive] Screen changed";
})(ResponsiveActionTypes || (ResponsiveActionTypes = {}));
const screenChanged = createAction(ResponsiveActionTypes.ScreenChanged, props());

let ResponsiveStore = class ResponsiveStore {
    constructor() {
        this.SMALL = 576;
        this.MEDIUM = 768;
        this.LARGE = 992;
        this.EXTRA_LARGE = 1200;
    }
    screenChanged(state, { payload: { width } }) {
        const xs = width <= this.SMALL;
        const sm = width > this.SMALL && width <= this.MEDIUM;
        const md = width > this.MEDIUM && width <= this.LARGE;
        const lg = width > this.LARGE && width <= this.EXTRA_LARGE;
        const xl = width > this.EXTRA_LARGE;
        const screen = {
            xs,
            sm,
            md,
            lg,
            xl,
        };
        return { ...state, screen };
    }
};
__decorate([
    Action(screenChanged)
], ResponsiveStore.prototype, "screenChanged", null);
ResponsiveStore = __decorate([
    Store({
        screen: {
            xs: false,
            sm: false,
            md: false,
            lg: false,
            xl: false,
        },
    })
], ResponsiveStore);

const selectResponsiveState = (state) => state.responsive.responsive;
const selectAllScreen = createSelector(selectResponsiveState, (responsive) => responsive.screen);

class ResponsiveService {
    constructor(_store) {
        this._store = _store;
        this.isMobileSubject = new BehaviorSubject(false);
        this.isMobile$ = this.isMobileSubject.asObservable();
        this._listenChange();
        this.resize$ = fromEvent(window, 'resize')
            .pipe(debounceTime(100), map(this.getWindowWith), distinctUntilChanged(), startWith(window.innerWidth), tap(width => this._store.dispatch(screenChanged({ payload: { width } }))));
    }
    _listenChange() {
        const screen$ = this._store.pipe(select(selectAllScreen));
        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
        screen$.subscribe(this._onScreenChange.bind(this));
    }
    _onScreenChange(screenModel) {
        this.isMobileSubject.next(screenModel.xs || screenModel.sm);
    }
    getWindowWith() {
        return window.innerWidth;
    }
}
ResponsiveService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: ResponsiveService, deps: [{ token: i1.Store }], target: i0.ɵɵFactoryTarget.Injectable });
ResponsiveService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: ResponsiveService });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: ResponsiveService, decorators: [{
            type: Injectable
        }], ctorParameters: function () { return [{ type: i1.Store }]; } });

class CoreModule {
}
CoreModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: CoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
CoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.11", ngImport: i0, type: CoreModule, declarations: [DynamicDirective], imports: [i1$1.ReduxRegisterFeatureModule], exports: [DynamicDirective] });
CoreModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: CoreModule, providers: [
        ResponsiveService
    ], imports: [ReduxRegisterModule.forFeature('responsive', { responsive: ResponsiveStore })] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: CoreModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        ReduxRegisterModule.forFeature('responsive', { responsive: ResponsiveStore }),
                    ],
                    declarations: [
                        DynamicDirective
                    ],
                    exports: [
                        DynamicDirective
                    ],
                    providers: [
                        ResponsiveService
                    ]
                }]
        }] });

class ResolveComponent {
    constructor() { }
    createEmbeddedView(template, context, viewContainerRef) {
        if (!template) {
            return;
        }
        viewContainerRef.clear();
        viewContainerRef.createEmbeddedView(template, context);
    }
    createComponent(component, viewContainerRef, injector) {
        if (!component) {
            return;
        }
        viewContainerRef.clear();
        viewContainerRef.createComponent(component, {
            injector
        });
    }
}
ResolveComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: ResolveComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
ResolveComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: ResolveComponent, providedIn: 'root' });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: ResolveComponent, decorators: [{
            type: Injectable,
            args: [{
                    providedIn: 'root'
                }]
        }], ctorParameters: function () { return []; } });

class ScreenModel {
}

/*
 * Public API Surface of core
 */

/**
 * Generated bundle index. Do not edit.
 */

export { CoreModule, DynamicDirective, ResolveComponent, ResponsiveActionTypes, ResponsiveService, ResponsiveStore, ScreenModel, screenChanged, selectAllScreen, selectResponsiveState };
//# sourceMappingURL=ngartifex-core.mjs.map