@skyux/flyout 5.1.0 → 5.5.0

package/README.md

@@ -1,5 +1,7 @@
-# @skyux/flyout
+# flyout
 
-[![npm](https://img.shields.io/npm/v/@skyux/flyout.svg)](https://www.npmjs.com/package/@skyux/flyout)
-![SKY UX CI](https://github.com/blackbaud/skyux-flyout/workflows/SKY%20UX%20CI/badge.svg)
-[![coverage](https://codecov.io/gh/blackbaud/skyux-flyout/branch/master/graphs/badge.svg?branch=master)](https://codecov.io/gh/blackbaud/skyux-flyout/branch/master)
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test flyout` to execute the unit tests.

package/documentation.json

@@ -56,6 +56,8 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
+                      "qualifiedName": "Function",
+                      "package": "typescript",
                       "name": "Function"
                     }
                   }
@@ -89,6 +91,8 @@
             ],
             "type": {
               "type": "reference",
+              "qualifiedName": "Function",
+              "package": "typescript",
               "name": "Function"
             }
           }
@@ -197,6 +201,8 @@
                   "name": "void"
                 }
               ],
+              "qualifiedName": "EventEmitter",
+              "package": "@angular/core",
               "name": "EventEmitter"
             },
             "defaultValue": "..."
@@ -289,6 +295,8 @@
                       "name": "SkyFlyoutBeforeCloseHandler"
                     }
                   ],
+                  "qualifiedName": "Observable",
+                  "package": "rxjs",
                   "name": "Observable"
                 }
               }
@@ -327,6 +335,8 @@
                       "name": "void"
                     }
                   ],
+                  "qualifiedName": "EventEmitter",
+                  "package": "@angular/core",
                   "name": "EventEmitter"
                 }
               }
@@ -355,7 +365,13 @@
                 "kindString": "Get signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Disables the next iterator button."
+                  "shortText": "Disables the next iterator button.",
+                  "tags": [
+                    {
+                      "tag": "default",
+                      "text": "false\n"
+                    }
+                  ]
                 },
                 "type": {
                   "type": "intrinsic",
@@ -432,6 +448,8 @@
                       "name": "void"
                     }
                   ],
+                  "qualifiedName": "EventEmitter",
+                  "package": "@angular/core",
                   "name": "EventEmitter"
                 }
               }
@@ -460,7 +478,13 @@
                 "kindString": "Get signature",
                 "flags": {},
                 "comment": {
-                  "shortText": "Disables the previous iterator button."
+                  "shortText": "Disables the previous iterator button.",
+                  "tags": [
+                    {
+                      "tag": "default",
+                      "text": "false\n"
+                    }
+                  ]
                 },
                 "type": {
                   "type": "intrinsic",
@@ -620,6 +644,8 @@
             "name": "NgModule",
             "type": {
               "type": "reference",
+              "qualifiedName": "NgModuleDecorator",
+              "package": "@angular/core",
               "name": "NgModule"
             },
             "arguments": {
@@ -681,6 +707,8 @@
             "name": "Injectable",
             "type": {
               "type": "reference",
+              "qualifiedName": "InjectableDecorator",
+              "package": "@angular/core",
               "name": "Injectable"
             },
             "arguments": {
@@ -751,6 +779,8 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
+                      "qualifiedName": "Router",
+                      "package": "@angular/router",
                       "name": "Router"
                     }
                   },
@@ -762,6 +792,8 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
+                      "qualifiedName": "NgZone",
+                      "package": "@angular/core",
                       "name": "NgZone"
                     }
                   },
@@ -773,6 +805,8 @@
                     "flags": {},
                     "type": {
                       "type": "reference",
+                      "qualifiedName": "ApplicationRef",
+                      "package": "@angular/core",
                       "name": "ApplicationRef"
                     }
                   }
@@ -926,6 +960,8 @@
                           "name": "T"
                         }
                       ],
+                      "qualifiedName": "Type",
+                      "package": "@angular/core",
                       "name": "Type"
                     }
                   },
@@ -991,6 +1027,8 @@
         "implementedTypes": [
           {
             "type": "reference",
+            "qualifiedName": "OnDestroy",
+            "package": "@angular/core",
             "name": "OnDestroy"
           }
         ]
@@ -1491,7 +1529,7 @@
               "isOptional": true
             },
             "comment": {
-              "shortText": "Specifies a unique key for the UI Config Service to retrieve stored settings from a database.\nThe UI Config Service saves configuration settings for users to preserve the width of\nthe flyout. For more information about the UI Config Service,\nsee [the sticky settings documentation](https://developer.blackbaud.com/skyux/learn/get-started/advanced/sticky-settings)."
+              "shortText": "Specifies a unique key for the UI Config Service to retrieve stored settings from a database.\nThe UI Config Service saves configuration settings for users to preserve the width of\nthe flyout. For more information about the UI Config Service,\nsee [the sticky settings documentation](https://developer.blackbaud.com/skyux/learn/get-started/sticky-settings)."
             },
             "sources": [
               {
@@ -1630,7 +1668,7 @@
                     "flags": {},
                     "sources": [
                       {
-                        "fileName": "projects/flyout/src/modules/flyout/types/flyout-permalink.ts",
+                        "fileName": "lib/modules/flyout/types/flyout-permalink.ts",
                         "line": 16,
                         "character": 4
                       }
@@ -1653,13 +1691,15 @@
                     },
                     "sources": [
                       {
-                        "fileName": "projects/flyout/src/modules/flyout/types/flyout-permalink.ts",
+                        "fileName": "lib/modules/flyout/types/flyout-permalink.ts",
                         "line": 17,
                         "character": 4
                       }
                     ],
                     "type": {
                       "type": "reference",
+                      "qualifiedName": "NavigationExtras",
+                      "package": "@angular/router",
                       "name": "NavigationExtras"
                     }
                   }
@@ -1745,18 +1785,13 @@
     ],
     "sources": [
       {
-        "fileName": "projects/flyout/src/public-api.ts",
+        "fileName": "index.ts",
         "line": 1,
         "character": 0
       }
     ]
   },
   "codeExamples": [
-    {
-      "fileName": ".eslintrc.json",
-      "filePath": "/projects/flyout/documentation/code-examples/.eslintrc.json",
-      "rawContents": "{\n  \"extends\": [\"../../.eslintrc.json\"],\n  \"overrides\": [\n    {\n      \"files\": [\"*.ts\"],\n      \"rules\": {\n        \"@angular-eslint/directive-selector\": [\n          \"error\",\n          {\n            \"type\": \"attribute\",\n            \"prefix\": \"app\",\n            \"style\": \"camelCase\"\n          }\n        ],\n        \"@angular-eslint/component-selector\": [\n          \"error\",\n          {\n            \"type\": \"element\",\n            \"prefix\": \"app\",\n            \"style\": \"kebab-case\"\n          }\n        ]\n      }\n    }\n  ]\n}\n"
-    },
     {
       "fileName": "flyout-demo-flyout.component.ts",
       "filePath": "/projects/flyout/documentation/code-examples/flyout/basic/flyout-demo-flyout.component.ts",
@@ -1828,4 +1863,4 @@
       "rawContents": "import { NgModule } from '@angular/core';\n\nimport { CommonModule } from '@angular/common';\n\nimport { SkyAvatarModule } from '@skyux/avatar';\n\nimport { SkyFlyoutModule } from '@skyux/flyout';\n\nimport { SkyKeyInfoModule, SkyLabelModule } from '@skyux/indicators';\n\nimport { SkyPageSummaryModule } from '@skyux/layout';\n\nimport { SkyListModule } from '@skyux/list-builder';\n\nimport { SkyListViewGridModule } from '@skyux/list-builder-view-grids';\n\nimport { FlyoutDemoComponent } from './flyout-demo.component';\n\nimport { FlyoutDemoFlyoutComponent } from './flyout-demo-flyout.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    SkyAvatarModule,\n    SkyFlyoutModule,\n    SkyListModule,\n    SkyKeyInfoModule,\n    SkyLabelModule,\n    SkyListViewGridModule,\n    SkyPageSummaryModule,\n  ],\n  declarations: [FlyoutDemoComponent, FlyoutDemoFlyoutComponent],\n  entryComponents: [FlyoutDemoFlyoutComponent],\n  exports: [FlyoutDemoComponent],\n})\nexport class AutocompleteDemoModule {}\n"
     }
   ]
-}
+}

package/esm2015/index.js

@@ -0,0 +1,14 @@
+export * from './lib/modules/flyout/flyout-instance';
+export * from './lib/modules/flyout/flyout.module';
+export * from './lib/modules/flyout/flyout.service';
+export * from './lib/modules/flyout/types/flyout-action';
+export * from './lib/modules/flyout/types/flyout-before-close-handler';
+export * from './lib/modules/flyout/types/flyout-close-args';
+export * from './lib/modules/flyout/types/flyout-config';
+export * from './lib/modules/flyout/types/flyout-message';
+export * from './lib/modules/flyout/types/flyout-message-type';
+export * from './lib/modules/flyout/types/flyout-permalink';
+// Components and directives must be exported to support Angular’s “partial” Ivy compiler.
+// Obscure names are used to indicate types are not part of the public API.
+export { SkyFlyoutComponent as λ1 } from './lib/modules/flyout/flyout.component';
+//# sourceMappingURL=index.js.map

package/esm2015/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/components/flyout/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,sCAAsC,CAAC;AACrD,cAAc,oCAAoC,CAAC;AACnD,cAAc,qCAAqC,CAAC;AACpD,cAAc,0CAA0C,CAAC;AACzD,cAAc,wDAAwD,CAAC;AACvE,cAAc,8CAA8C,CAAC;AAC7D,cAAc,0CAA0C,CAAC;AACzD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,6CAA6C,CAAC;AAE5D,0FAA0F;AAC1F,2EAA2E;AAC3E,OAAO,EAAE,kBAAkB,IAAI,EAAE,EAAE,MAAM,uCAAuC,CAAC","sourcesContent":["export * from './lib/modules/flyout/flyout-instance';\nexport * from './lib/modules/flyout/flyout.module';\nexport * from './lib/modules/flyout/flyout.service';\nexport * from './lib/modules/flyout/types/flyout-action';\nexport * from './lib/modules/flyout/types/flyout-before-close-handler';\nexport * from './lib/modules/flyout/types/flyout-close-args';\nexport * from './lib/modules/flyout/types/flyout-config';\nexport * from './lib/modules/flyout/types/flyout-message';\nexport * from './lib/modules/flyout/types/flyout-message-type';\nexport * from './lib/modules/flyout/types/flyout-permalink';\n\n// Components and directives must be exported to support Angular’s “partial” Ivy compiler.\n// Obscure names are used to indicate types are not part of the public API.\nexport { SkyFlyoutComponent as λ1 } from './lib/modules/flyout/flyout.component';\n"]}

package/esm2015/lib/modules/flyout/flyout-adapter.service.js

@@ -0,0 +1,64 @@
+import { Injectable, RendererFactory2, } from '@angular/core';
+import { SkyAppWindowRef, SkyMediaBreakpoints } from '@skyux/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@skyux/core";
+/**
+ * @internal
+ */
+export class SkyFlyoutAdapterService {
+    constructor(rendererFactory, windowRef) {
+        this.rendererFactory = rendererFactory;
+        this.windowRef = windowRef;
+        this.renderer = this.rendererFactory.createRenderer(undefined, undefined);
+    }
+    adjustHeaderForHelp(header) {
+        const windowObj = this.windowRef.nativeWindow;
+        const helpWidget = windowObj.document.getElementById('bb-help-invoker');
+        if (helpWidget) {
+            this.renderer.addClass(header.nativeElement, 'sky-flyout-help-shim');
+        }
+    }
+    setResponsiveClass(element, breakpoint) {
+        const nativeEl = element.nativeElement;
+        this.renderer.removeClass(nativeEl, 'sky-responsive-container-xs');
+        this.renderer.removeClass(nativeEl, 'sky-responsive-container-sm');
+        this.renderer.removeClass(nativeEl, 'sky-responsive-container-md');
+        this.renderer.removeClass(nativeEl, 'sky-responsive-container-lg');
+        let newClass;
+        switch (breakpoint) {
+            case SkyMediaBreakpoints.xs: {
+                newClass = 'sky-responsive-container-xs';
+                break;
+            }
+            case SkyMediaBreakpoints.sm: {
+                newClass = 'sky-responsive-container-sm';
+                break;
+            }
+            case SkyMediaBreakpoints.md: {
+                newClass = 'sky-responsive-container-md';
+                break;
+            }
+            default: {
+                newClass = 'sky-responsive-container-lg';
+                break;
+            }
+        }
+        this.renderer.addClass(nativeEl, newClass);
+    }
+    toggleIframePointerEvents(enable) {
+        // When iframes are present on the page, they may interfere with dragging
+        // temporarily disable pointer events in iframes when dragging starts.
+        // When re-enabling we set to the empty string as it will remove the element styling
+        // and fall back to any css originally given to iframe
+        const iframes = document.querySelectorAll('iframe');
+        for (let i = 0; i < iframes.length; i++) {
+            iframes[i].style.pointerEvents = enable ? '' : 'none';
+        }
+    }
+}
+SkyFlyoutAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutAdapterService, deps: [{ token: i0.RendererFactory2 }, { token: i1.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
+SkyFlyoutAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutAdapterService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutAdapterService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }, { type: i1.SkyAppWindowRef }]; } });
+//# sourceMappingURL=flyout-adapter.service.js.map

package/esm2015/lib/modules/flyout/flyout-adapter.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flyout-adapter.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-adapter.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,UAAU,EAEV,gBAAgB,GACjB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;;;AAEnE;;GAEG;AAEH,MAAM,OAAO,uBAAuB;IAGlC,YACU,eAAiC,EACjC,SAA0B;QAD1B,oBAAe,GAAf,eAAe,CAAkB;QACjC,cAAS,GAAT,SAAS,CAAiB;QAElC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAC5E,CAAC;IAEM,mBAAmB,CAAC,MAAkB;QAC3C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC;QAC9C,MAAM,UAAU,GAAG,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;QAExE,IAAI,UAAU,EAAE;YACd,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,EAAE,sBAAsB,CAAC,CAAC;SACtE;IACH,CAAC;IAEM,kBAAkB,CACvB,OAAmB,EACnB,UAA+B;QAE/B,MAAM,QAAQ,GAAgB,OAAO,CAAC,aAAa,CAAC;QAEpD,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QACnE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QACnE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QACnE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QAEnE,IAAI,QAAgB,CAAC;QAErB,QAAQ,UAAU,EAAE;YAClB,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;YACD,OAAO,CAAC,CAAC;gBACP,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;SACF;QAED,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAC7C,CAAC;IAEM,yBAAyB,CAAC,MAAe;QAC9C,yEAAyE;QACzE,sEAAsE;QACtE,oFAAoF;QACpF,sDAAsD;QACtD,MAAM,OAAO,GAAG,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QACpD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACvC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC;SACvD;IACH,CAAC;;qHA/DU,uBAAuB;yHAAvB,uBAAuB;4FAAvB,uBAAuB;kBADnC,UAAU","sourcesContent":["import {\n  ElementRef,\n  Injectable,\n  Renderer2,\n  RendererFactory2,\n} from '@angular/core';\n\nimport { SkyAppWindowRef, SkyMediaBreakpoints } from '@skyux/core';\n\n/**\n * @internal\n */\n@Injectable()\nexport class SkyFlyoutAdapterService {\n  private renderer: Renderer2;\n\n  constructor(\n    private rendererFactory: RendererFactory2,\n    private windowRef: SkyAppWindowRef\n  ) {\n    this.renderer = this.rendererFactory.createRenderer(undefined, undefined);\n  }\n\n  public adjustHeaderForHelp(header: ElementRef): void {\n    const windowObj = this.windowRef.nativeWindow;\n    const helpWidget = windowObj.document.getElementById('bb-help-invoker');\n\n    if (helpWidget) {\n      this.renderer.addClass(header.nativeElement, 'sky-flyout-help-shim');\n    }\n  }\n\n  public setResponsiveClass(\n    element: ElementRef,\n    breakpoint: SkyMediaBreakpoints\n  ): void {\n    const nativeEl: HTMLElement = element.nativeElement;\n\n    this.renderer.removeClass(nativeEl, 'sky-responsive-container-xs');\n    this.renderer.removeClass(nativeEl, 'sky-responsive-container-sm');\n    this.renderer.removeClass(nativeEl, 'sky-responsive-container-md');\n    this.renderer.removeClass(nativeEl, 'sky-responsive-container-lg');\n\n    let newClass: string;\n\n    switch (breakpoint) {\n      case SkyMediaBreakpoints.xs: {\n        newClass = 'sky-responsive-container-xs';\n        break;\n      }\n      case SkyMediaBreakpoints.sm: {\n        newClass = 'sky-responsive-container-sm';\n        break;\n      }\n      case SkyMediaBreakpoints.md: {\n        newClass = 'sky-responsive-container-md';\n        break;\n      }\n      default: {\n        newClass = 'sky-responsive-container-lg';\n        break;\n      }\n    }\n\n    this.renderer.addClass(nativeEl, newClass);\n  }\n\n  public toggleIframePointerEvents(enable: boolean): void {\n    // When iframes are present on the page, they may interfere with dragging\n    // temporarily disable pointer events in iframes when dragging starts.\n    // When re-enabling we set to the empty string as it will remove the element styling\n    // and fall back to any css originally given to iframe\n    const iframes = document.querySelectorAll('iframe');\n    for (let i = 0; i < iframes.length; i++) {\n      iframes[i].style.pointerEvents = enable ? '' : 'none';\n    }\n  }\n}\n"]}

package/esm2015/lib/modules/flyout/flyout-instance.js

@@ -0,0 +1,109 @@
+import { EventEmitter } from '@angular/core';
+import { Subject } from 'rxjs';
+import { SkyFlyoutMessageType } from './types/flyout-message-type';
+/**
+ * Represents a single displayed flyout.
+ */
+export class SkyFlyoutInstance {
+    constructor() {
+        /**
+         * An event that the flyout instance emits when it closes.
+         */
+        this.closed = new EventEmitter();
+        /**
+         * A `boolean` value that returns `true` if the flyout is open.
+         * @default true
+         */
+        this.isOpen = true;
+        this._beforeClose = new Subject();
+        this._iteratorNextButtonClick = new EventEmitter();
+        this._iteratorPreviousButtonClick = new EventEmitter();
+        this._iteratorNextButtonDisabled = false;
+        this._iteratorPreviousButtonDisabled = false;
+        this._hostController = new Subject();
+        this.closed.subscribe(() => {
+            this.isOpen = false;
+        });
+    }
+    /**
+     * An event that the modal instance emits when it is about to close.
+     * If a subscription exists for this event,
+     * the modal does not close until the subscriber calls the handler's `closeModal` method.
+     */
+    get beforeClose() {
+        return this._beforeClose;
+    }
+    /**
+     * Used to communicate with the host component.
+     * @internal
+     */
+    get hostController() {
+        return this._hostController;
+    }
+    /**
+     * An event that the flyout instance emits when users click the next iterator button.
+     */
+    get iteratorNextButtonClick() {
+        return this._iteratorNextButtonClick;
+    }
+    /**
+     * An event that the flyout instance emits when users click the previous iterator button.
+     */
+    get iteratorPreviousButtonClick() {
+        return this._iteratorPreviousButtonClick;
+    }
+    /**
+     * Disables the next iterator button.
+     * @default false
+     */
+    set iteratorNextButtonDisabled(newValue) {
+        this._iteratorNextButtonDisabled = newValue;
+        if (newValue) {
+            this.hostController.next({
+                type: SkyFlyoutMessageType.DisableIteratorNextButton,
+            });
+        }
+        else {
+            this.hostController.next({
+                type: SkyFlyoutMessageType.EnableIteratorNextButton,
+            });
+        }
+    }
+    get iteratorNextButtonDisabled() {
+        return this._iteratorNextButtonDisabled;
+    }
+    /**
+     * Disables the previous iterator button.
+     * @default false
+     */
+    set iteratorPreviousButtonDisabled(newValue) {
+        this._iteratorPreviousButtonDisabled = newValue;
+        if (newValue) {
+            this.hostController.next({
+                type: SkyFlyoutMessageType.DisableIteratorPreviousButton,
+            });
+        }
+        else {
+            this.hostController.next({
+                type: SkyFlyoutMessageType.EnableIteratorPreviousButton,
+            });
+        }
+    }
+    get iteratorPreviousButtonDisabled() {
+        return this._iteratorPreviousButtonDisabled;
+    }
+    /**
+     * Closes the flyout instance and emits its `closed` event.
+     * @param args Arguments used when closing the flyout.
+     */
+    close(args) {
+        this.hostController.next({
+            type: SkyFlyoutMessageType.Close,
+            data: { ignoreBeforeClose: args ? args.ignoreBeforeClose : false },
+        });
+        this._iteratorPreviousButtonClick.complete();
+        this._iteratorNextButtonClick.complete();
+        this.hostController.complete();
+    }
+}
+//# sourceMappingURL=flyout-instance.js.map

package/esm2015/lib/modules/flyout/flyout-instance.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flyout-instance.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-instance.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,OAAO,EAAc,OAAO,EAAE,MAAM,MAAM,CAAC;AAO3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAEnE;;GAEG;AACH,MAAM,OAAO,iBAAiB;IAsG5B;QA5FA;;WAEG;QACI,WAAM,GAAG,IAAI,YAAY,EAAQ,CAAC;QAezC;;;WAGG;QACI,WAAM,GAAG,IAAI,CAAC;QA0Db,iBAAY,GAAG,IAAI,OAAO,EAA+B,CAAC;QAE1D,6BAAwB,GAAG,IAAI,YAAY,EAAQ,CAAC;QAEpD,iCAA4B,GAAG,IAAI,YAAY,EAAQ,CAAC;QAExD,gCAA2B,GAAG,KAAK,CAAC;QAEpC,oCAA+B,GAAG,KAAK,CAAC;QAExC,oBAAe,GAAG,IAAI,OAAO,EAAoB,CAAC;QAGxD,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,EAAE;YACzB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC,CAAC,CAAC;IACL,CAAC;IAzGD;;;;OAIG;IACH,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,YAAY,CAAC;IAC3B,CAAC;IAYD;;;OAGG;IACH,IAAW,cAAc;QACvB,OAAO,IAAI,CAAC,eAAe,CAAC;IAC9B,CAAC;IAQD;;OAEG;IACH,IAAW,uBAAuB;QAChC,OAAO,IAAI,CAAC,wBAAwB,CAAC;IACvC,CAAC;IAED;;OAEG;IACH,IAAW,2BAA2B;QACpC,OAAO,IAAI,CAAC,4BAA4B,CAAC;IAC3C,CAAC;IAED;;;OAGG;IACH,IAAW,0BAA0B,CAAC,QAAiB;QACrD,IAAI,CAAC,2BAA2B,GAAG,QAAQ,CAAC;QAC5C,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,yBAAyB;aACrD,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,wBAAwB;aACpD,CAAC,CAAC;SACJ;IACH,CAAC;IAED,IAAW,0BAA0B;QACnC,OAAO,IAAI,CAAC,2BAA2B,CAAC;IAC1C,CAAC;IAED;;;OAGG;IACH,IAAW,8BAA8B,CAAC,QAAiB;QACzD,IAAI,CAAC,+BAA+B,GAAG,QAAQ,CAAC;QAChD,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,6BAA6B;aACzD,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,4BAA4B;aACxD,CAAC,CAAC;SACJ;IACH,CAAC;IAED,IAAW,8BAA8B;QACvC,OAAO,IAAI,CAAC,+BAA+B,CAAC;IAC9C,CAAC;IAoBD;;;OAGG;IACI,KAAK,CAAC,IAAyB;QACpC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;YACvB,IAAI,EAAE,oBAAoB,CAAC,KAAK;YAChC,IAAI,EAAE,EAAE,iBAAiB,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,EAAE;SACnE,CAAC,CAAC;QAEH,IAAI,CAAC,4BAA4B,CAAC,QAAQ,EAAE,CAAC;QAC7C,IAAI,CAAC,wBAAwB,CAAC,QAAQ,EAAE,CAAC;QAEzC,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC;CACF","sourcesContent":["import { EventEmitter } from '@angular/core';\n\nimport { Observable, Subject } from 'rxjs';\n\nimport { SkyFlyoutBeforeCloseHandler } from './types/flyout-before-close-handler';\nimport { SkyFlyoutCloseArgs } from './types/flyout-close-args';\n\nimport { SkyFlyoutMessage } from './types/flyout-message';\n\nimport { SkyFlyoutMessageType } from './types/flyout-message-type';\n\n/**\n * Represents a single displayed flyout.\n */\nexport class SkyFlyoutInstance<T> {\n  /**\n   * An event that the modal instance emits when it is about to close.\n   * If a subscription exists for this event,\n   * the modal does not close until the subscriber calls the handler's `closeModal` method.\n   */\n  public get beforeClose(): Observable<SkyFlyoutBeforeCloseHandler> {\n    return this._beforeClose;\n  }\n\n  /**\n   * An event that the flyout instance emits when it closes.\n   */\n  public closed = new EventEmitter<void>();\n\n  /**\n   * Specifies the instance of the component to display in the flyout.\n   */\n  public componentInstance: T;\n\n  /**\n   * Used to communicate with the host component.\n   * @internal\n   */\n  public get hostController(): Subject<SkyFlyoutMessage> {\n    return this._hostController;\n  }\n\n  /**\n   * A `boolean` value that returns `true` if the flyout is open.\n   * @default true\n   */\n  public isOpen = true;\n\n  /**\n   * An event that the flyout instance emits when users click the next iterator button.\n   */\n  public get iteratorNextButtonClick(): EventEmitter<void> {\n    return this._iteratorNextButtonClick;\n  }\n\n  /**\n   * An event that the flyout instance emits when users click the previous iterator button.\n   */\n  public get iteratorPreviousButtonClick(): EventEmitter<void> {\n    return this._iteratorPreviousButtonClick;\n  }\n\n  /**\n   * Disables the next iterator button.\n   * @default false\n   */\n  public set iteratorNextButtonDisabled(newValue: boolean) {\n    this._iteratorNextButtonDisabled = newValue;\n    if (newValue) {\n      this.hostController.next({\n        type: SkyFlyoutMessageType.DisableIteratorNextButton,\n      });\n    } else {\n      this.hostController.next({\n        type: SkyFlyoutMessageType.EnableIteratorNextButton,\n      });\n    }\n  }\n\n  public get iteratorNextButtonDisabled(): boolean {\n    return this._iteratorNextButtonDisabled;\n  }\n\n  /**\n   * Disables the previous iterator button.\n   * @default false\n   */\n  public set iteratorPreviousButtonDisabled(newValue: boolean) {\n    this._iteratorPreviousButtonDisabled = newValue;\n    if (newValue) {\n      this.hostController.next({\n        type: SkyFlyoutMessageType.DisableIteratorPreviousButton,\n      });\n    } else {\n      this.hostController.next({\n        type: SkyFlyoutMessageType.EnableIteratorPreviousButton,\n      });\n    }\n  }\n\n  public get iteratorPreviousButtonDisabled(): boolean {\n    return this._iteratorPreviousButtonDisabled;\n  }\n\n  private _beforeClose = new Subject<SkyFlyoutBeforeCloseHandler>();\n\n  private _iteratorNextButtonClick = new EventEmitter<void>();\n\n  private _iteratorPreviousButtonClick = new EventEmitter<void>();\n\n  private _iteratorNextButtonDisabled = false;\n\n  private _iteratorPreviousButtonDisabled = false;\n\n  private _hostController = new Subject<SkyFlyoutMessage>();\n\n  constructor() {\n    this.closed.subscribe(() => {\n      this.isOpen = false;\n    });\n  }\n\n  /**\n   * Closes the flyout instance and emits its `closed` event.\n   * @param args Arguments used when closing the flyout.\n   */\n  public close(args?: SkyFlyoutCloseArgs): void {\n    this.hostController.next({\n      type: SkyFlyoutMessageType.Close,\n      data: { ignoreBeforeClose: args ? args.ignoreBeforeClose : false },\n    });\n\n    this._iteratorPreviousButtonClick.complete();\n    this._iteratorNextButtonClick.complete();\n\n    this.hostController.complete();\n  }\n}\n"]}

package/esm2015/lib/modules/flyout/flyout-iterator.component.js

@@ -0,0 +1,59 @@
+import { Component, EventEmitter, Input, Output, } from '@angular/core';
+import { Subject } from 'rxjs';
+import * as i0 from "@angular/core";
+import * as i1 from "@skyux/indicators";
+import * as i2 from "@skyux/theme";
+import * as i3 from "@skyux/i18n";
+/**
+ * @internal
+ */
+export class SkyFlyoutIteratorComponent {
+    constructor() {
+        this.ngUnsubscribe = new Subject();
+        this._nextButtonClick = new EventEmitter();
+        this._previousButtonClick = new EventEmitter();
+    }
+    get previousButtonClick() {
+        return this._previousButtonClick;
+    }
+    get nextButtonClick() {
+        return this._nextButtonClick;
+    }
+    ngOnDestroy() {
+        this.ngUnsubscribe.next();
+        this.ngUnsubscribe.complete();
+        this._previousButtonClick.complete();
+        this._nextButtonClick.complete();
+    }
+    onIteratorPreviousClick() {
+        /* istanbul ignore else */
+        if (!this.previousButtonDisabled) {
+            this._previousButtonClick.emit();
+        }
+    }
+    onIteratorNextClick() {
+        /* istanbul ignore else */
+        if (!this.nextButtonDisabled) {
+            this._nextButtonClick.emit();
+        }
+    }
+}
+SkyFlyoutIteratorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutIteratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SkyFlyoutIteratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyFlyoutIteratorComponent, selector: "sky-flyout-iterator", inputs: { nextButtonDisabled: "nextButtonDisabled", previousButtonDisabled: "previousButtonDisabled" }, outputs: { previousButtonClick: "previousButtonClick", nextButtonClick: "nextButtonClick" }, ngImport: i0, template: "<div id=\"iterators\" class=\"sky-flyout-iterators\">\n  <button\n    class=\"sky-btn\"\n    [attr.aria-label]=\"\n      'skyux_flyout_iterator_previous_button' | skyLibResources\n    \"\n    [disabled]=\"previousButtonDisabled\"\n    [skyThemeClass]=\"{\n      'sky-btn-default sky-margin-inline-compact': 'default',\n      'sky-btn-icon-borderless sky-margin-inline-sm': 'modern'\n    }\"\n    (click)=\"onIteratorPreviousClick()\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"chevron-up\"> </sky-icon>\n    <sky-icon\n      *skyThemeIf=\"'modern'\"\n      icon=\"chevron-up\"\n      iconType=\"skyux\"\n      size=\"lg\"\n    >\n    </sky-icon>\n  </button>\n  <button\n    class=\"sky-btn\"\n    [attr.aria-label]=\"'skyux_flyout_iterator_next_button' | skyLibResources\"\n    [disabled]=\"nextButtonDisabled\"\n    [skyThemeClass]=\"{\n      'sky-btn-default sky-margin-inline-compact': 'default',\n      'sky-btn-icon-borderless sky-margin-inline-sm': 'modern'\n    }\"\n    (click)=\"onIteratorNextClick()\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"chevron-down\"> </sky-icon>\n    <sky-icon\n      *skyThemeIf=\"'modern'\"\n      icon=\"chevron-down\"\n      iconType=\"skyux\"\n      size=\"lg\"\n    >\n    </sky-icon>\n  </button>\n</div>\n", styles: [":host-context(.sky-theme-modern) .sky-flyout-iterators{display:inline}.sky-theme-modern .sky-flyout-iterators{display:inline}\n"], components: [{ type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i2.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { type: i2.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }], pipes: { "skyLibResources": i3.SkyLibResourcesPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutIteratorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sky-flyout-iterator',
+                    templateUrl: './flyout-iterator.component.html',
+                    styleUrls: ['./flyout-iterator.component.scss'],
+                }]
+        }], propDecorators: { nextButtonDisabled: [{
+                type: Input
+            }], previousButtonDisabled: [{
+                type: Input
+            }], previousButtonClick: [{
+                type: Output
+            }], nextButtonClick: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=flyout-iterator.component.js.map

package/esm2015/lib/modules/flyout/flyout-iterator.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flyout-iterator.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-iterator.component.ts","../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-iterator.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EAET,YAAY,EACZ,KAAK,EACL,MAAM,GACP,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC;;;;;AAE/B;;GAEG;AAMH,MAAM,OAAO,0BAA0B;IALvC;QAsBU,kBAAa,GAAG,IAAI,OAAO,EAAE,CAAC;QAE9B,qBAAgB,GAAG,IAAI,YAAY,EAAQ,CAAC;QAE5C,yBAAoB,GAAG,IAAI,YAAY,EAAQ,CAAC;KAsBzD;IApCC,IACW,mBAAmB;QAC5B,OAAO,IAAI,CAAC,oBAAoB,CAAC;IACnC,CAAC;IAED,IACW,eAAe;QACxB,OAAO,IAAI,CAAC,gBAAgB,CAAC;IAC/B,CAAC;IAQM,WAAW;QAChB,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC;QAC9B,IAAI,CAAC,oBAAoB,CAAC,QAAQ,EAAE,CAAC;QACrC,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC;IACnC,CAAC;IAEM,uBAAuB;QAC5B,0BAA0B;QAC1B,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE;YAChC,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;SAClC;IACH,CAAC;IAEM,mBAAmB;QACxB,0BAA0B;QAC1B,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;YAC5B,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAAC;SAC9B;IACH,CAAC;;wHA1CU,0BAA0B;4GAA1B,0BAA0B,gQClBvC,yvCA0CA;4FDxBa,0BAA0B;kBALtC,SAAS;mBAAC;oBACT,QAAQ,EAAE,qBAAqB;oBAC/B,WAAW,EAAE,kCAAkC;oBAC/C,SAAS,EAAE,CAAC,kCAAkC,CAAC;iBAChD;8BAGQ,kBAAkB;sBADxB,KAAK;gBAIC,sBAAsB;sBAD5B,KAAK;gBAIK,mBAAmB;sBAD7B,MAAM;gBAMI,eAAe;sBADzB,MAAM","sourcesContent":["import {\n  Component,\n  OnDestroy,\n  EventEmitter,\n  Input,\n  Output,\n} from '@angular/core';\n\nimport { Subject } from 'rxjs';\n\n/**\n * @internal\n */\n@Component({\n  selector: 'sky-flyout-iterator',\n  templateUrl: './flyout-iterator.component.html',\n  styleUrls: ['./flyout-iterator.component.scss'],\n})\nexport class SkyFlyoutIteratorComponent implements OnDestroy {\n  @Input()\n  public nextButtonDisabled: boolean;\n\n  @Input()\n  public previousButtonDisabled: boolean;\n\n  @Output()\n  public get previousButtonClick(): EventEmitter<void> {\n    return this._previousButtonClick;\n  }\n\n  @Output()\n  public get nextButtonClick(): EventEmitter<void> {\n    return this._nextButtonClick;\n  }\n\n  private ngUnsubscribe = new Subject();\n\n  private _nextButtonClick = new EventEmitter<void>();\n\n  private _previousButtonClick = new EventEmitter<void>();\n\n  public ngOnDestroy(): void {\n    this.ngUnsubscribe.next();\n    this.ngUnsubscribe.complete();\n    this._previousButtonClick.complete();\n    this._nextButtonClick.complete();\n  }\n\n  public onIteratorPreviousClick(): void {\n    /* istanbul ignore else */\n    if (!this.previousButtonDisabled) {\n      this._previousButtonClick.emit();\n    }\n  }\n\n  public onIteratorNextClick(): void {\n    /* istanbul ignore else */\n    if (!this.nextButtonDisabled) {\n      this._nextButtonClick.emit();\n    }\n  }\n}\n","<div id=\"iterators\" class=\"sky-flyout-iterators\">\n  <button\n    class=\"sky-btn\"\n    [attr.aria-label]=\"\n      'skyux_flyout_iterator_previous_button' | skyLibResources\n    \"\n    [disabled]=\"previousButtonDisabled\"\n    [skyThemeClass]=\"{\n      'sky-btn-default sky-margin-inline-compact': 'default',\n      'sky-btn-icon-borderless sky-margin-inline-sm': 'modern'\n    }\"\n    (click)=\"onIteratorPreviousClick()\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"chevron-up\"> </sky-icon>\n    <sky-icon\n      *skyThemeIf=\"'modern'\"\n      icon=\"chevron-up\"\n      iconType=\"skyux\"\n      size=\"lg\"\n    >\n    </sky-icon>\n  </button>\n  <button\n    class=\"sky-btn\"\n    [attr.aria-label]=\"'skyux_flyout_iterator_next_button' | skyLibResources\"\n    [disabled]=\"nextButtonDisabled\"\n    [skyThemeClass]=\"{\n      'sky-btn-default sky-margin-inline-compact': 'default',\n      'sky-btn-icon-borderless sky-margin-inline-sm': 'modern'\n    }\"\n    (click)=\"onIteratorNextClick()\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"chevron-down\"> </sky-icon>\n    <sky-icon\n      *skyThemeIf=\"'modern'\"\n      icon=\"chevron-down\"\n      iconType=\"skyux\"\n      size=\"lg\"\n    >\n    </sky-icon>\n  </button>\n</div>\n"]}

package/esm2015/lib/modules/flyout/flyout-media-query.service.js

@@ -0,0 +1,72 @@
+import { Injectable } from '@angular/core';
+import { SkyMediaBreakpoints } from '@skyux/core';
+import { BehaviorSubject } from 'rxjs';
+import * as i0 from "@angular/core";
+/**
+ * @internal
+ */
+export class SkyFlyoutMediaQueryService {
+    constructor() {
+        this.currentSubject = new BehaviorSubject(this.current);
+        this._current = SkyMediaBreakpoints.xs;
+        this.currentSubject.next(this._current);
+    }
+    get current() {
+        return this._current;
+    }
+    subscribe(listener) {
+        return this.currentSubject.subscribe({
+            next: (breakpoints) => {
+                listener(breakpoints);
+            },
+        });
+    }
+    setBreakpointForWidth(width) {
+        let breakpoint;
+        if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.xs)) {
+            breakpoint = SkyMediaBreakpoints.xs;
+        }
+        else if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.sm)) {
+            breakpoint = SkyMediaBreakpoints.sm;
+        }
+        else if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.md)) {
+            breakpoint = SkyMediaBreakpoints.md;
+        }
+        else {
+            breakpoint = SkyMediaBreakpoints.lg;
+        }
+        this._current = breakpoint;
+        this.currentSubject.next(this._current);
+    }
+    isWidthWithinBreakpiont(width, breakpoint) {
+        const xsBreakpointMaxPixels = 767;
+        const smBreakpointMinPixels = 768;
+        const smBreakpointMaxPixels = 991;
+        const mdBreakpointMinPixels = 992;
+        const mdBreakpointMaxPixels = 1199;
+        const lgBreakpointMinPixels = 1200;
+        switch (breakpoint) {
+            case SkyMediaBreakpoints.xs: {
+                return width <= xsBreakpointMaxPixels;
+            }
+            case SkyMediaBreakpoints.sm: {
+                return width >= smBreakpointMinPixels && width <= smBreakpointMaxPixels;
+            }
+            case SkyMediaBreakpoints.md: {
+                return width >= mdBreakpointMinPixels && width <= mdBreakpointMaxPixels;
+            }
+            default: {
+                return width >= lgBreakpointMinPixels;
+            }
+        }
+    }
+    destroy() {
+        this.currentSubject.complete();
+    }
+}
+SkyFlyoutMediaQueryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutMediaQueryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+SkyFlyoutMediaQueryService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutMediaQueryService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyFlyoutMediaQueryService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return []; } });
+//# sourceMappingURL=flyout-media-query.service.js.map

package/esm2015/lib/modules/flyout/flyout-media-query.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flyout-media-query.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-media-query.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,OAAO,EAAE,mBAAmB,EAAyB,MAAM,aAAa,CAAC;AAEzE,OAAO,EAAE,eAAe,EAAgB,MAAM,MAAM,CAAC;;AAErD;;GAEG;AAEH,MAAM,OAAO,0BAA0B;IAWrC;QANQ,mBAAc,GAAG,IAAI,eAAe,CAC1C,IAAI,CAAC,OAAO,CACb,CAAC;QAEM,aAAQ,GAAG,mBAAmB,CAAC,EAAE,CAAC;QAGxC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC1C,CAAC;IAZD,IAAW,OAAO;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAYM,SAAS,CAAC,QAA+B;QAC9C,OAAO,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC;YACnC,IAAI,EAAE,CAAC,WAAgC,EAAE,EAAE;gBACzC,QAAQ,CAAC,WAAW,CAAC,CAAC;YACxB,CAAC;SACF,CAAC,CAAC;IACL,CAAC;IAEM,qBAAqB,CAAC,KAAa;QACxC,IAAI,UAA+B,CAAC;QAEpC,IAAI,IAAI,CAAC,uBAAuB,CAAC,KAAK,EAAE,mBAAmB,CAAC,EAAE,CAAC,EAAE;YAC/D,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;aAAM,IAAI,IAAI,CAAC,uBAAuB,CAAC,KAAK,EAAE,mBAAmB,CAAC,EAAE,CAAC,EAAE;YACtE,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;aAAM,IAAI,IAAI,CAAC,uBAAuB,CAAC,KAAK,EAAE,mBAAmB,CAAC,EAAE,CAAC,EAAE;YACtE,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;aAAM;YACL,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;QAED,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;QAC3B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC1C,CAAC;IAEM,uBAAuB,CAC5B,KAAa,EACb,UAA+B;QAE/B,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,IAAI,CAAC;QACnC,MAAM,qBAAqB,GAAG,IAAI,CAAC;QAEnC,QAAQ,UAAU,EAAE;YAClB,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,OAAO,KAAK,IAAI,qBAAqB,CAAC;aACvC;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,OAAO,KAAK,IAAI,qBAAqB,IAAI,KAAK,IAAI,qBAAqB,CAAC;aACzE;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,OAAO,KAAK,IAAI,qBAAqB,IAAI,KAAK,IAAI,qBAAqB,CAAC;aACzE;YACD,OAAO,CAAC,CAAC;gBACP,OAAO,KAAK,IAAI,qBAAqB,CAAC;aACvC;SACF;IACH,CAAC;IAEM,OAAO;QACZ,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC;;wHArEU,0BAA0B;4HAA1B,0BAA0B;4FAA1B,0BAA0B;kBADtC,UAAU","sourcesContent":["import { Injectable } from '@angular/core';\n\nimport { SkyMediaBreakpoints, SkyMediaQueryListener } from '@skyux/core';\n\nimport { BehaviorSubject, Subscription } from 'rxjs';\n\n/**\n * @internal\n */\n@Injectable()\nexport class SkyFlyoutMediaQueryService {\n  public get current(): SkyMediaBreakpoints {\n    return this._current;\n  }\n\n  private currentSubject = new BehaviorSubject<SkyMediaBreakpoints>(\n    this.current\n  );\n\n  private _current = SkyMediaBreakpoints.xs;\n\n  constructor() {\n    this.currentSubject.next(this._current);\n  }\n\n  public subscribe(listener: SkyMediaQueryListener): Subscription {\n    return this.currentSubject.subscribe({\n      next: (breakpoints: SkyMediaBreakpoints) => {\n        listener(breakpoints);\n      },\n    });\n  }\n\n  public setBreakpointForWidth(width: number): void {\n    let breakpoint: SkyMediaBreakpoints;\n\n    if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.xs)) {\n      breakpoint = SkyMediaBreakpoints.xs;\n    } else if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.sm)) {\n      breakpoint = SkyMediaBreakpoints.sm;\n    } else if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.md)) {\n      breakpoint = SkyMediaBreakpoints.md;\n    } else {\n      breakpoint = SkyMediaBreakpoints.lg;\n    }\n\n    this._current = breakpoint;\n    this.currentSubject.next(this._current);\n  }\n\n  public isWidthWithinBreakpiont(\n    width: number,\n    breakpoint: SkyMediaBreakpoints\n  ): boolean {\n    const xsBreakpointMaxPixels = 767;\n    const smBreakpointMinPixels = 768;\n    const smBreakpointMaxPixels = 991;\n    const mdBreakpointMinPixels = 992;\n    const mdBreakpointMaxPixels = 1199;\n    const lgBreakpointMinPixels = 1200;\n\n    switch (breakpoint) {\n      case SkyMediaBreakpoints.xs: {\n        return width <= xsBreakpointMaxPixels;\n      }\n      case SkyMediaBreakpoints.sm: {\n        return width >= smBreakpointMinPixels && width <= smBreakpointMaxPixels;\n      }\n      case SkyMediaBreakpoints.md: {\n        return width >= mdBreakpointMinPixels && width <= mdBreakpointMaxPixels;\n      }\n      default: {\n        return width >= lgBreakpointMinPixels;\n      }\n    }\n  }\n\n  public destroy(): void {\n    this.currentSubject.complete();\n  }\n}\n"]}