(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@wm/components/base'), require('@wm/core')) :
    typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@wm/components/base', '@wm/core'], factory) :
    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wm = global.wm || {}, global.wm.components = global.wm.components || {}, global.wm.components.containers = global.wm.components.containers || {}, global.wm.components.containers.layoutgrid = {}), global.ng.core, global.ng.common, global.wm.components.base, global.wm.core));
})(this, (function (exports, i0, common, base, i1) { 'use strict';

    function _interopNamespaceDefault(e) {
        var n = Object.create(null);
        if (e) {
            Object.keys(e).forEach(function (k) {
                if (k !== 'default') {
                    var d = Object.getOwnPropertyDescriptor(e, k);
                    Object.defineProperty(n, k, d.get ? d : {
                        enumerable: true,
                        get: function () { return e[k]; }
                    });
                }
            });
        }
        n.default = e;
        return Object.freeze(n);
    }

    var i0__namespace = /*#__PURE__*/_interopNamespaceDefault(i0);
    var i1__namespace = /*#__PURE__*/_interopNamespaceDefault(i1);

    const registerProps$2 = () => {
        base.register('wm-layoutgrid', new Map([
            ['class', base.PROP_STRING],
            ['name', base.PROP_STRING],
            ['show', { value: true, ...base.PROP_BOOLEAN }]
        ]));
    };

    const DEFAULT_CLS$2 = 'app-grid-layout clearfix';
    const WIDGET_CONFIG$2 = {
        widgetType: 'wm-layoutgrid',
        hostClass: DEFAULT_CLS$2
    };
    class LayoutgridDirective extends base.BaseContainerComponent {
        static { this.initializeProps = registerProps$2(); }
        constructor(inj, explicitContext) {
            super(inj, WIDGET_CONFIG$2, explicitContext);
            base.styler(this.nativeElement, this, base.APPLY_STYLES_TYPE.CONTAINER);
        }
        static { this.ɵfac = function LayoutgridDirective_Factory(t) { return new (t || LayoutgridDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
        static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: LayoutgridDirective, selectors: [["", "wmLayoutGrid", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                    base.provideAsWidgetRef(LayoutgridDirective)
                ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
    }
    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LayoutgridDirective, [{
            type: i0.Directive,
            args: [{
                    selector: '[wmLayoutGrid]',
                    providers: [
                        base.provideAsWidgetRef(LayoutgridDirective)
                    ]
                }]
        }], () => [{ type: i0__namespace.Injector }, { type: undefined, decorators: [{
                    type: i0.Inject,
                    args: ['EXPLICIT_CONTEXT']
                }, {
                    type: i0.Optional
                }] }], null); })();

    const registerProps$1 = () => {
        base.register('wm-layout-grid-row', new Map([
            ['class', base.PROP_STRING],
            ['name', base.PROP_STRING],
            ['show', { value: true, ...base.PROP_BOOLEAN }]
        ]));
    };

    const DEFAULT_CLS$1 = 'app-grid-row clearfix';
    const WIDGET_CONFIG$1 = {
        widgetType: 'wm-layout-grid-row',
        hostClass: DEFAULT_CLS$1
    };
    class LayoutGridRowDirective extends base.StylableComponent {
        static { this.initializeProps = registerProps$1(); }
        constructor(inj, explicitContext) {
            super(inj, WIDGET_CONFIG$1, explicitContext);
            base.styler(this.nativeElement, this, base.APPLY_STYLES_TYPE.CONTAINER);
        }
        static { this.ɵfac = function LayoutGridRowDirective_Factory(t) { return new (t || LayoutGridRowDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
        static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: LayoutGridRowDirective, selectors: [["", "wmLayoutGridRow", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                    base.provideAsWidgetRef(LayoutGridRowDirective)
                ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
    }
    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LayoutGridRowDirective, [{
            type: i0.Directive,
            args: [{
                    selector: '[wmLayoutGridRow]',
                    providers: [
                        base.provideAsWidgetRef(LayoutGridRowDirective)
                    ]
                }]
        }], () => [{ type: i0__namespace.Injector }, { type: undefined, decorators: [{
                    type: i0.Inject,
                    args: ['EXPLICIT_CONTEXT']
                }, {
                    type: i0.Optional
                }] }], null); })();

    const registerProps = () => {
        base.register('wm-gridcolumn', new Map([
            ['class', base.PROP_STRING],
            ['name', base.PROP_STRING],
            ['columnwidth', base.PROP_NUMBER],
            ['show', { value: true, ...base.PROP_BOOLEAN }],
            ['xscolumnwidth', base.PROP_NUMBER]
        ]));
    };

    const DEFAULT_CLS = 'app-grid-column';
    const WIDGET_CONFIG = {
        widgetType: 'wm-gridcolumn',
        hostClass: DEFAULT_CLS
    };
    class LayoutGridColumnDirective extends base.StylableComponent {
        static { this.initializeProps = registerProps(); }
        constructor(inj, height, viewport, explicitContext) {
            super(inj, WIDGET_CONFIG, explicitContext);
            this.viewport = viewport;
            // if the height is provided set the overflow to auto
            if (height) {
                i1.setCSS(this.nativeElement, 'overflow', 'auto');
            }
            base.styler(this.nativeElement, this, base.APPLY_STYLES_TYPE.CONTAINER);
        }
        onPropertyChange(key, nv, ov) {
            const prefix = i1.isMobileApp() ? 'xs' : 'sm';
            if (key === 'xscolumnwidth' && this.viewport.isMobileType && i1.isMobileApp()) {
                i1.switchClass(this.nativeElement, `col-${prefix}-${nv}`, ov ? `col-${prefix}-${ov}` : '');
            }
            else if (key === 'columnwidth') {
                if (!i1.isMobileApp() || (this.viewport.isMobileType && !this.getAttr('xscolumnwidth')) || !this.viewport.isMobileType) {
                    i1.switchClass(this.nativeElement, `col-${prefix}-${nv}`, ov ? `col-${prefix}-${ov}` : '');
                }
            }
            else {
                super.onPropertyChange(key, nv, ov);
            }
        }
        static { this.ɵfac = function LayoutGridColumnDirective_Factory(t) { return new (t || LayoutGridColumnDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵinjectAttribute('height'), i0__namespace.ɵɵdirectiveInject(i1__namespace.Viewport), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
        static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: LayoutGridColumnDirective, selectors: [["", "wmLayoutGridColumn", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                    base.provideAsWidgetRef(LayoutGridColumnDirective)
                ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
    }
    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LayoutGridColumnDirective, [{
            type: i0.Directive,
            args: [{
                    selector: '[wmLayoutGridColumn]',
                    providers: [
                        base.provideAsWidgetRef(LayoutGridColumnDirective)
                    ]
                }]
        }], () => [{ type: i0__namespace.Injector }, { type: undefined, decorators: [{
                    type: i0.Attribute,
                    args: ['height']
                }] }, { type: i1__namespace.Viewport }, { type: undefined, decorators: [{
                    type: i0.Inject,
                    args: ['EXPLICIT_CONTEXT']
                }, {
                    type: i0.Optional
                }] }], null); })();

    const components = [
        LayoutgridDirective,
        LayoutGridRowDirective,
        LayoutGridColumnDirective
    ];
    class LayoutGridModule {
        static { this.ɵfac = function LayoutGridModule_Factory(t) { return new (t || LayoutGridModule)(); }; }
        static { this.ɵmod = /*@__PURE__*/ i0__namespace.ɵɵdefineNgModule({ type: LayoutGridModule }); }
        static { this.ɵinj = /*@__PURE__*/ i0__namespace.ɵɵdefineInjector({ imports: [common.CommonModule,
                base.WmComponentsModule] }); }
    }
    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LayoutGridModule, [{
            type: i0.NgModule,
            args: [{
                    imports: [
                        common.CommonModule,
                        base.WmComponentsModule
                    ],
                    declarations: [...components],
                    exports: [...components]
                }]
        }], null, null); })();
    (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0__namespace.ɵɵsetNgModuleScope(LayoutGridModule, { declarations: [LayoutgridDirective,
            LayoutGridRowDirective,
            LayoutGridColumnDirective], imports: [common.CommonModule,
            base.WmComponentsModule], exports: [LayoutgridDirective,
            LayoutGridRowDirective,
            LayoutGridColumnDirective] }); })();

    exports.LayoutGridColumnDirective = LayoutGridColumnDirective;
    exports.LayoutGridModule = LayoutGridModule;
    exports.LayoutGridRowDirective = LayoutGridRowDirective;
    exports.LayoutgridDirective = LayoutgridDirective;

}));
