@skyux/core 5.8.0 → 5.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/skyux-core.umd.js +11 -16
- package/documentation.json +145 -365
- package/esm2015/lib/modules/media-query/media-query.service.js.map +1 -1
- package/esm2015/lib/modules/resize-observer/resize-observer-media-query.service.js +5 -10
- package/esm2015/lib/modules/resize-observer/resize-observer-media-query.service.js.map +1 -1
- package/fesm2015/skyux-core.js +4 -8
- package/fesm2015/skyux-core.js.map +1 -1
- package/lib/modules/media-query/media-query.service.d.ts +1 -1
- package/lib/modules/resize-observer/resize-observer-media-query.service.d.ts +4 -6
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"media-query.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/core/src/lib/modules/media-query/media-query.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,EAAa,MAAM,eAAe,CAAC;AAE9D,OAAO,EAAE,eAAe,EAAgB,MAAM,MAAM,CAAC;AAErD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;;AAM1D,MAAM,OAAO,oBAAoB;IAiE/B,YAAoB,IAAY;QAAZ,SAAI,GAAJ,IAAI,CAAQ;QAjCxB,mBAAc,GAAG,IAAI,eAAe,CAC1C,IAAI,CAAC,OAAO,CACb,CAAC;QAEM,aAAQ,GAAG,mBAAmB,CAAC,EAAE,CAAC;QAElC,gBAAW,GAGb;YACJ;gBACE,gBAAgB,EAAE,oBAAoB,CAAC,EAAE;gBACzC,IAAI,EAAE,mBAAmB,CAAC,EAAE;aAC7B;YACD;gBACE,gBAAgB,EAAE,oBAAoB,CAAC,EAAE;gBACzC,IAAI,EAAE,mBAAmB,CAAC,EAAE;aAC7B;YACD;gBACE,gBAAgB,EAAE,oBAAoB,CAAC,EAAE;gBACzC,IAAI,EAAE,mBAAmB,CAAC,EAAE;aAC7B;YACD;gBACE,gBAAgB,EAAE,oBAAoB,CAAC,EAAE;gBACzC,IAAI,EAAE,mBAAmB,CAAC,EAAE;aAC7B;SACF,CAAC;QAEM,iBAAY,GAGd,EAAE,CAAC;QAGP,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IA1CD;;OAEG;IACH,IAAW,OAAO;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAuCM,WAAW;QAChB,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC;IAED;;;OAGG;IACI,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;IAED;;OAEG;IACI,OAAO;QACZ,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC;
|
|
1
|
+
{"version":3,"file":"media-query.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/core/src/lib/modules/media-query/media-query.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { Injectable, NgZone, OnDestroy } from '@angular/core';\n\nimport { BehaviorSubject, Subscription } from 'rxjs';\n\nimport { SkyMediaBreakpoints } from './media-breakpoints';\nimport { SkyMediaQueryListener } from './media-query-listener';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class SkyMediaQueryService implements OnDestroy {\n /**\n * The size for the `xs` breakpoint.\n * @default \"(max-width: 767px)\"\n */\n public static xs = '(max-width: 767px)';\n\n /**\n * The size for the `sm` breakpoint.\n * @default \"(min-width: 768px) and (max-width: 991px)\"\n */\n public static sm = '(min-width: 768px) and (max-width: 991px)';\n\n /**\n * The size for the `md` breakpoint.\n * @default \"(min-width: 992px) and (max-width: 1199px)\"\n */\n public static md = '(min-width: 992px) and (max-width: 1199px)';\n\n /**\n * The size for the `lg` breakpoint.\n * @default \"(min-width: 1200px)\"\n */\n public static lg = '(min-width: 1200px)';\n\n /**\n * Returns the current breakpoint.\n */\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.md;\n\n private breakpoints: {\n mediaQueryString: string;\n name: SkyMediaBreakpoints;\n }[] = [\n {\n mediaQueryString: SkyMediaQueryService.xs,\n name: SkyMediaBreakpoints.xs,\n },\n {\n mediaQueryString: SkyMediaQueryService.sm,\n name: SkyMediaBreakpoints.sm,\n },\n {\n mediaQueryString: SkyMediaQueryService.md,\n name: SkyMediaBreakpoints.md,\n },\n {\n mediaQueryString: SkyMediaQueryService.lg,\n name: SkyMediaBreakpoints.lg,\n },\n ];\n\n private mediaQueries: {\n mediaQueryList: MediaQueryList;\n listener: (event: any) => void;\n }[] = [];\n\n constructor(private zone: NgZone) {\n this.addListeners();\n }\n\n public ngOnDestroy(): void {\n this.removeListeners();\n this.currentSubject.complete();\n }\n\n /**\n * Subscribes to screen size changes.\n * @param listener Specifies a function that is called when breakpoints change.\n */\n public subscribe(listener: SkyMediaQueryListener): Subscription {\n return this.currentSubject.subscribe({\n next: (breakpoints: SkyMediaBreakpoints) => {\n listener(breakpoints);\n },\n });\n }\n\n /**\n * @internal\n */\n public destroy(): void {\n this.removeListeners();\n this.currentSubject.complete();\n }\n\n private addListeners(): void {\n this.mediaQueries = this.breakpoints.map((breakpoint: any) => {\n const mq = matchMedia(breakpoint.mediaQueryString);\n\n const listener = (event: any) => {\n // Run the check outside of Angular's change detection since Angular\n // does not wrap matchMedia listeners in NgZone.\n // See: https://blog.assaf.co/angular-2-change-detection-zones-and-an-example/\n this.zone.run(() => {\n if (event.matches) {\n this.notifyBreakpointChange(breakpoint.name);\n }\n });\n };\n\n mq.addListener(listener);\n\n if (mq.matches) {\n this.notifyBreakpointChange(breakpoint.name);\n }\n\n return {\n mediaQueryList: mq,\n listener,\n };\n });\n }\n\n private removeListeners(): void {\n this.mediaQueries.forEach((mediaQuery) => {\n mediaQuery.mediaQueryList.removeListener(mediaQuery.listener);\n });\n this.mediaQueries = [];\n }\n\n private notifyBreakpointChange(breakpoint: SkyMediaBreakpoints): void {\n this._current = breakpoint;\n this.currentSubject.next(breakpoint);\n }\n}\n"]}
|
|
@@ -1,17 +1,15 @@
|
|
|
1
|
-
import { Injectable
|
|
1
|
+
import { Injectable } from '@angular/core';
|
|
2
2
|
import { ReplaySubject, Subject } from 'rxjs';
|
|
3
3
|
import { takeUntil } from 'rxjs/operators';
|
|
4
4
|
import { SkyMediaBreakpoints } from '../media-query/media-breakpoints';
|
|
5
|
-
import { SkyMediaQueryService } from '../media-query/media-query.service';
|
|
6
5
|
import { SkyResizeObserverService } from './resize-observer.service';
|
|
7
6
|
import * as i0 from "@angular/core";
|
|
8
7
|
import * as i1 from "./resize-observer.service";
|
|
9
8
|
/**
|
|
10
9
|
* Acts like `SkyMediaQueryService` for a container element, emitting the same responsive breakpoints.
|
|
11
10
|
*/
|
|
12
|
-
export class SkyResizeObserverMediaQueryService
|
|
13
|
-
constructor(
|
|
14
|
-
super(zone);
|
|
11
|
+
export class SkyResizeObserverMediaQueryService {
|
|
12
|
+
constructor(resizeObserverService) {
|
|
15
13
|
this.resizeObserverService = resizeObserverService;
|
|
16
14
|
this._breakpoints = [
|
|
17
15
|
{
|
|
@@ -99,9 +97,6 @@ export class SkyResizeObserverMediaQueryService extends SkyMediaQueryService {
|
|
|
99
97
|
.pipe(takeUntil(this._stopListening))
|
|
100
98
|
.subscribe(listener);
|
|
101
99
|
}
|
|
102
|
-
addListeners() {
|
|
103
|
-
// do not add listeners in the constructor
|
|
104
|
-
}
|
|
105
100
|
updateBreakpoint(breakpoint) {
|
|
106
101
|
this._currentBreakpoint = breakpoint;
|
|
107
102
|
this._currentBreakpointObservable.next(breakpoint);
|
|
@@ -111,12 +106,12 @@ export class SkyResizeObserverMediaQueryService extends SkyMediaQueryService {
|
|
|
111
106
|
return (_a = this._breakpoints.find((breakpoint) => breakpoint.check(width))) === null || _a === void 0 ? void 0 : _a.name;
|
|
112
107
|
}
|
|
113
108
|
}
|
|
114
|
-
SkyResizeObserverMediaQueryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, deps: [{ token:
|
|
109
|
+
SkyResizeObserverMediaQueryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, deps: [{ token: i1.SkyResizeObserverService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
115
110
|
SkyResizeObserverMediaQueryService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, providedIn: 'any' });
|
|
116
111
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, decorators: [{
|
|
117
112
|
type: Injectable,
|
|
118
113
|
args: [{
|
|
119
114
|
providedIn: 'any',
|
|
120
115
|
}]
|
|
121
|
-
}], ctorParameters: function () { return [{ type:
|
|
116
|
+
}], ctorParameters: function () { return [{ type: i1.SkyResizeObserverService }]; } });
|
|
122
117
|
//# sourceMappingURL=resize-observer-media-query.service.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resize-observer-media-query.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/core/src/lib/modules/resize-observer/resize-observer-media-query.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,UAAU,
|
|
1
|
+
{"version":3,"file":"resize-observer-media-query.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/core/src/lib/modules/resize-observer/resize-observer-media-query.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { ElementRef, Injectable, OnDestroy } from '@angular/core';\n\nimport { ReplaySubject, Subject, Subscription } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyMediaBreakpoints } from '../media-query/media-breakpoints';\nimport { SkyMediaQueryListener } from '../media-query/media-query-listener';\n\nimport { SkyResizeObserverService } from './resize-observer.service';\n\n/**\n * Acts like `SkyMediaQueryService` for a container element, emitting the same responsive breakpoints.\n */\n@Injectable({\n providedIn: 'any',\n})\nexport class SkyResizeObserverMediaQueryService implements OnDestroy {\n /**\n * Returns the current breakpoint.\n */\n public get current(): SkyMediaBreakpoints | undefined {\n return this._currentBreakpoint;\n }\n\n private _breakpoints: {\n check: (width: number) => boolean;\n name: SkyMediaBreakpoints;\n }[] = [\n {\n check: (width: number) => width <= 767,\n name: SkyMediaBreakpoints.xs,\n },\n {\n check: (width: number) => width > 767 && width <= 991,\n name: SkyMediaBreakpoints.sm,\n },\n {\n check: (width: number) => width > 991 && width <= 1199,\n name: SkyMediaBreakpoints.md,\n },\n {\n check: (width: number) => width > 1199,\n name: SkyMediaBreakpoints.lg,\n },\n ];\n private _currentBreakpointObservable = new ReplaySubject<\n SkyMediaBreakpoints | undefined\n >(1);\n private _currentBreakpoint: SkyMediaBreakpoints;\n private _resizeSubscription: Subscription;\n private _stopListening = new Subject<void>();\n private _target?: ElementRef;\n\n constructor(private resizeObserverService: SkyResizeObserverService) {\n this._stopListening.subscribe(() => {\n this._target = undefined;\n this.updateBreakpoint(undefined);\n });\n }\n\n public ngOnDestroy(): void {\n this._stopListening.next();\n this._currentBreakpoint = undefined;\n this._stopListening.complete();\n this._currentBreakpointObservable.complete();\n }\n\n /**\n * @internal\n */\n public destroy(): void {\n this.ngOnDestroy();\n }\n\n /**\n * Sets the container element to watch. The `SkyResizeObserverMediaQueryService` will only observe one element at a\n * time. Any previous subscriptions will be unsubscribed when a new element is observed.\n */\n public observe(element: ElementRef): SkyResizeObserverMediaQueryService {\n if (this._target) {\n if (this._target === element) {\n return this;\n }\n this._stopListening.next();\n }\n this._target = element;\n const width = (element.nativeElement as HTMLElement).offsetWidth;\n if (width) {\n const breakpoint = this.checkBreakpoint(width);\n this.updateBreakpoint(breakpoint);\n }\n this._resizeSubscription = this.resizeObserverService\n .observe(element)\n .pipe(takeUntil(this._stopListening))\n .subscribe((value) => {\n const breakpoint = this.checkBreakpoint(value.contentRect.width);\n /* istanbul ignore else */\n if (breakpoint !== this._currentBreakpoint) {\n this.updateBreakpoint(breakpoint);\n }\n });\n return this;\n }\n\n /**\n * Stop watching the container element.\n */\n public unobserve(): void {\n this._stopListening.next();\n }\n\n /**\n * Subscribes to element size changes that cross breakpoints.\n */\n public subscribe(listener: SkyMediaQueryListener): Subscription {\n return this._currentBreakpointObservable\n .pipe(takeUntil(this._stopListening))\n .subscribe(listener);\n }\n\n private updateBreakpoint(breakpoint: SkyMediaBreakpoints) {\n this._currentBreakpoint = breakpoint;\n this._currentBreakpointObservable.next(breakpoint);\n }\n\n private checkBreakpoint(width: number): SkyMediaBreakpoints | undefined {\n return this._breakpoints.find((breakpoint) => breakpoint.check(width))\n ?.name;\n }\n}\n"]}
|
package/fesm2015/skyux-core.js
CHANGED
|
@@ -2481,9 +2481,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
|
|
|
2481
2481
|
/**
|
|
2482
2482
|
* Acts like `SkyMediaQueryService` for a container element, emitting the same responsive breakpoints.
|
|
2483
2483
|
*/
|
|
2484
|
-
class SkyResizeObserverMediaQueryService
|
|
2485
|
-
constructor(
|
|
2486
|
-
super(zone);
|
|
2484
|
+
class SkyResizeObserverMediaQueryService {
|
|
2485
|
+
constructor(resizeObserverService) {
|
|
2487
2486
|
this.resizeObserverService = resizeObserverService;
|
|
2488
2487
|
this._breakpoints = [
|
|
2489
2488
|
{
|
|
@@ -2571,9 +2570,6 @@ class SkyResizeObserverMediaQueryService extends SkyMediaQueryService {
|
|
|
2571
2570
|
.pipe(takeUntil(this._stopListening))
|
|
2572
2571
|
.subscribe(listener);
|
|
2573
2572
|
}
|
|
2574
|
-
addListeners() {
|
|
2575
|
-
// do not add listeners in the constructor
|
|
2576
|
-
}
|
|
2577
2573
|
updateBreakpoint(breakpoint) {
|
|
2578
2574
|
this._currentBreakpoint = breakpoint;
|
|
2579
2575
|
this._currentBreakpointObservable.next(breakpoint);
|
|
@@ -2583,14 +2579,14 @@ class SkyResizeObserverMediaQueryService extends SkyMediaQueryService {
|
|
|
2583
2579
|
return (_a = this._breakpoints.find((breakpoint) => breakpoint.check(width))) === null || _a === void 0 ? void 0 : _a.name;
|
|
2584
2580
|
}
|
|
2585
2581
|
}
|
|
2586
|
-
SkyResizeObserverMediaQueryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, deps: [{ token:
|
|
2582
|
+
SkyResizeObserverMediaQueryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, deps: [{ token: SkyResizeObserverService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2587
2583
|
SkyResizeObserverMediaQueryService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, providedIn: 'any' });
|
|
2588
2584
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyResizeObserverMediaQueryService, decorators: [{
|
|
2589
2585
|
type: Injectable,
|
|
2590
2586
|
args: [{
|
|
2591
2587
|
providedIn: 'any',
|
|
2592
2588
|
}]
|
|
2593
|
-
}], ctorParameters: function () { return [{ type:
|
|
2589
|
+
}], ctorParameters: function () { return [{ type: SkyResizeObserverService }]; } });
|
|
2594
2590
|
|
|
2595
2591
|
function notifySubscribers(subscribers, item) {
|
|
2596
2592
|
for (const subscriber of subscribers) {
|