@limetech/lime-elements 37.1.0-next.66 → 37.1.0-next.68
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/dist/cjs/{component-9c3fa668.js → component-66df95e7.js} +935 -12
- package/dist/cjs/component-66df95e7.js.map +1 -0
- package/dist/cjs/index.es-75b5e7c4.js +222 -0
- package/dist/cjs/index.es-75b5e7c4.js.map +1 -0
- package/dist/cjs/lime-elements.cjs.js +1 -1
- package/dist/cjs/limel-breadcrumbs_3.cjs.entry.js +147 -28
- package/dist/cjs/limel-breadcrumbs_3.cjs.entry.js.map +1 -1
- package/dist/cjs/{limel-list.cjs.entry.js → limel-input-field_3.cjs.entry.js} +820 -4
- package/dist/cjs/limel-input-field_3.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-picker.cjs.entry.js +2 -218
- package/dist/cjs/limel-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-select.cjs.entry.js +8 -0
- package/dist/cjs/limel-select.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/menu/menu.js +178 -16
- package/dist/collection/components/menu/menu.js.map +1 -1
- package/dist/collection/components/menu/menu.types.js.map +1 -1
- package/dist/collection/components/select/select.template.js +8 -0
- package/dist/collection/components/select/select.template.js.map +1 -1
- package/dist/esm/{component-0be247ac.js → component-fffa3419.js} +934 -13
- package/dist/esm/component-fffa3419.js.map +1 -0
- package/dist/esm/index.es-61c13ecf.js +220 -0
- package/dist/esm/index.es-61c13ecf.js.map +1 -0
- package/dist/esm/lime-elements.js +1 -1
- package/dist/esm/limel-breadcrumbs_3.entry.js +137 -18
- package/dist/esm/limel-breadcrumbs_3.entry.js.map +1 -1
- package/dist/esm/{limel-list.entry.js → limel-input-field_3.entry.js} +818 -4
- package/dist/esm/limel-input-field_3.entry.js.map +1 -0
- package/dist/esm/limel-picker.entry.js +1 -217
- package/dist/esm/limel-picker.entry.js.map +1 -1
- package/dist/esm/limel-select.entry.js +8 -0
- package/dist/esm/limel-select.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/lime-elements/lime-elements.esm.js +1 -1
- package/dist/lime-elements/lime-elements.esm.js.map +1 -1
- package/dist/lime-elements/p-0bbfc036.entry.js +82 -0
- package/dist/lime-elements/{p-4db3e907.entry.js.map → p-0bbfc036.entry.js.map} +1 -1
- package/dist/lime-elements/p-78a442a0.entry.js +2 -0
- package/dist/lime-elements/p-78a442a0.entry.js.map +1 -0
- package/dist/lime-elements/p-97107e34.js +16 -0
- package/dist/lime-elements/p-97107e34.js.map +1 -0
- package/dist/lime-elements/{p-2ce8168b.entry.js → p-ade5366a.entry.js} +6 -6
- package/dist/lime-elements/p-ade5366a.entry.js.map +1 -0
- package/dist/lime-elements/p-dfba92de.js +206 -0
- package/dist/lime-elements/p-dfba92de.js.map +1 -0
- package/dist/lime-elements/p-dfc927a3.entry.js +2 -0
- package/dist/lime-elements/p-dfc927a3.entry.js.map +1 -0
- package/dist/types/components/menu/menu.d.ts +27 -7
- package/dist/types/components/menu/menu.types.d.ts +8 -0
- package/dist/types/components.d.ts +22 -2
- package/package.json +2 -2
- package/dist/cjs/component-9c3fa668.js.map +0 -1
- package/dist/cjs/component-a0124759.js +0 -929
- package/dist/cjs/component-a0124759.js.map +0 -1
- package/dist/cjs/limel-input-field.cjs.entry.js +0 -707
- package/dist/cjs/limel-input-field.cjs.entry.js.map +0 -1
- package/dist/cjs/limel-list.cjs.entry.js.map +0 -1
- package/dist/cjs/limel-menu-surface.cjs.entry.js +0 -130
- package/dist/cjs/limel-menu-surface.cjs.entry.js.map +0 -1
- package/dist/esm/component-0be247ac.js.map +0 -1
- package/dist/esm/component-6d079abe.js +0 -926
- package/dist/esm/component-6d079abe.js.map +0 -1
- package/dist/esm/limel-input-field.entry.js +0 -703
- package/dist/esm/limel-input-field.entry.js.map +0 -1
- package/dist/esm/limel-list.entry.js.map +0 -1
- package/dist/esm/limel-menu-surface.entry.js +0 -126
- package/dist/esm/limel-menu-surface.entry.js.map +0 -1
- package/dist/lime-elements/p-2ce8168b.entry.js.map +0 -1
- package/dist/lime-elements/p-32ff1b76.entry.js +0 -2
- package/dist/lime-elements/p-32ff1b76.entry.js.map +0 -1
- package/dist/lime-elements/p-3efb6ac5.entry.js +0 -2
- package/dist/lime-elements/p-3efb6ac5.entry.js.map +0 -1
- package/dist/lime-elements/p-4db3e907.entry.js +0 -82
- package/dist/lime-elements/p-5dd6d677.js +0 -82
- package/dist/lime-elements/p-5dd6d677.js.map +0 -1
- package/dist/lime-elements/p-99b26036.entry.js +0 -2
- package/dist/lime-elements/p-99b26036.entry.js.map +0 -1
- package/dist/lime-elements/p-bbf317b8.entry.js +0 -16
- package/dist/lime-elements/p-bbf317b8.entry.js.map +0 -1
- package/dist/lime-elements/p-e3b16b61.js +0 -126
- package/dist/lime-elements/p-e3b16b61.js.map +0 -1
|
@@ -3,6 +3,105 @@
|
|
|
3
3
|
const component = require('./component-67144c1c.js');
|
|
4
4
|
const ponyfill = require('./ponyfill-98ca4766.js');
|
|
5
5
|
const keyboard = require('./keyboard-9477d3a8.js');
|
|
6
|
+
const util = require('./util-b0f5741e.js');
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* @license
|
|
10
|
+
* Copyright 2018 Google Inc.
|
|
11
|
+
*
|
|
12
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
13
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
14
|
+
* in the Software without restriction, including without limitation the rights
|
|
15
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
16
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
17
|
+
* furnished to do so, subject to the following conditions:
|
|
18
|
+
*
|
|
19
|
+
* The above copyright notice and this permission notice shall be included in
|
|
20
|
+
* all copies or substantial portions of the Software.
|
|
21
|
+
*
|
|
22
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
23
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
24
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
25
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
26
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
27
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
28
|
+
* THE SOFTWARE.
|
|
29
|
+
*/
|
|
30
|
+
var cssClasses$1 = {
|
|
31
|
+
ANCHOR: 'mdc-menu-surface--anchor',
|
|
32
|
+
ANIMATING_CLOSED: 'mdc-menu-surface--animating-closed',
|
|
33
|
+
ANIMATING_OPEN: 'mdc-menu-surface--animating-open',
|
|
34
|
+
FIXED: 'mdc-menu-surface--fixed',
|
|
35
|
+
IS_OPEN_BELOW: 'mdc-menu-surface--is-open-below',
|
|
36
|
+
OPEN: 'mdc-menu-surface--open',
|
|
37
|
+
ROOT: 'mdc-menu-surface',
|
|
38
|
+
};
|
|
39
|
+
// tslint:disable:object-literal-sort-keys
|
|
40
|
+
var strings$1 = {
|
|
41
|
+
CLOSED_EVENT: 'MDCMenuSurface:closed',
|
|
42
|
+
CLOSING_EVENT: 'MDCMenuSurface:closing',
|
|
43
|
+
OPENED_EVENT: 'MDCMenuSurface:opened',
|
|
44
|
+
FOCUSABLE_ELEMENTS: [
|
|
45
|
+
'button:not(:disabled)',
|
|
46
|
+
'[href]:not([aria-disabled="true"])',
|
|
47
|
+
'input:not(:disabled)',
|
|
48
|
+
'select:not(:disabled)',
|
|
49
|
+
'textarea:not(:disabled)',
|
|
50
|
+
'[tabindex]:not([tabindex="-1"]):not([aria-disabled="true"])',
|
|
51
|
+
].join(', '),
|
|
52
|
+
};
|
|
53
|
+
// tslint:enable:object-literal-sort-keys
|
|
54
|
+
var numbers$1 = {
|
|
55
|
+
/** Total duration of menu-surface open animation. */
|
|
56
|
+
TRANSITION_OPEN_DURATION: 120,
|
|
57
|
+
/** Total duration of menu-surface close animation. */
|
|
58
|
+
TRANSITION_CLOSE_DURATION: 75,
|
|
59
|
+
/**
|
|
60
|
+
* Margin left to the edge of the viewport when menu-surface is at maximum
|
|
61
|
+
* possible height. Also used as a viewport margin.
|
|
62
|
+
*/
|
|
63
|
+
MARGIN_TO_EDGE: 32,
|
|
64
|
+
/**
|
|
65
|
+
* Ratio of anchor width to menu-surface width for switching from corner
|
|
66
|
+
* positioning to center positioning.
|
|
67
|
+
*/
|
|
68
|
+
ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO: 0.67,
|
|
69
|
+
/**
|
|
70
|
+
* Amount of time to wait before restoring focus when closing the menu
|
|
71
|
+
* surface. This is important because if a touch event triggered the menu
|
|
72
|
+
* close, and the subsequent mouse event occurs after focus is restored, then
|
|
73
|
+
* the restored focus would be lost.
|
|
74
|
+
*/
|
|
75
|
+
TOUCH_EVENT_WAIT_MS: 30,
|
|
76
|
+
};
|
|
77
|
+
/**
|
|
78
|
+
* Enum for bits in the {@see Corner) bitmap.
|
|
79
|
+
*/
|
|
80
|
+
var CornerBit;
|
|
81
|
+
(function (CornerBit) {
|
|
82
|
+
CornerBit[CornerBit["BOTTOM"] = 1] = "BOTTOM";
|
|
83
|
+
CornerBit[CornerBit["CENTER"] = 2] = "CENTER";
|
|
84
|
+
CornerBit[CornerBit["RIGHT"] = 4] = "RIGHT";
|
|
85
|
+
CornerBit[CornerBit["FLIP_RTL"] = 8] = "FLIP_RTL";
|
|
86
|
+
})(CornerBit || (CornerBit = {}));
|
|
87
|
+
/**
|
|
88
|
+
* Enum for representing an element corner for positioning the menu-surface.
|
|
89
|
+
*
|
|
90
|
+
* The START constants map to LEFT if element directionality is left
|
|
91
|
+
* to right and RIGHT if the directionality is right to left.
|
|
92
|
+
* Likewise END maps to RIGHT or LEFT depending on the directionality.
|
|
93
|
+
*/
|
|
94
|
+
exports.Corner = void 0;
|
|
95
|
+
(function (Corner) {
|
|
96
|
+
Corner[Corner["TOP_LEFT"] = 0] = "TOP_LEFT";
|
|
97
|
+
Corner[Corner["TOP_RIGHT"] = 4] = "TOP_RIGHT";
|
|
98
|
+
Corner[Corner["BOTTOM_LEFT"] = 1] = "BOTTOM_LEFT";
|
|
99
|
+
Corner[Corner["BOTTOM_RIGHT"] = 5] = "BOTTOM_RIGHT";
|
|
100
|
+
Corner[Corner["TOP_START"] = 8] = "TOP_START";
|
|
101
|
+
Corner[Corner["TOP_END"] = 12] = "TOP_END";
|
|
102
|
+
Corner[Corner["BOTTOM_START"] = 9] = "BOTTOM_START";
|
|
103
|
+
Corner[Corner["BOTTOM_END"] = 13] = "BOTTOM_END";
|
|
104
|
+
})(exports.Corner || (exports.Corner = {}));
|
|
6
105
|
|
|
7
106
|
/*! *****************************************************************************
|
|
8
107
|
Copyright (c) Microsoft Corporation.
|
|
@@ -20,30 +119,30 @@ PERFORMANCE OF THIS SOFTWARE.
|
|
|
20
119
|
***************************************************************************** */
|
|
21
120
|
/* global Reflect, Promise */
|
|
22
121
|
|
|
23
|
-
var extendStatics = function(d, b) {
|
|
24
|
-
extendStatics = Object.setPrototypeOf ||
|
|
122
|
+
var extendStatics$1 = function(d, b) {
|
|
123
|
+
extendStatics$1 = Object.setPrototypeOf ||
|
|
25
124
|
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
26
125
|
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
27
|
-
return extendStatics(d, b);
|
|
126
|
+
return extendStatics$1(d, b);
|
|
28
127
|
};
|
|
29
128
|
|
|
30
|
-
function __extends(d, b) {
|
|
129
|
+
function __extends$1(d, b) {
|
|
31
130
|
if (typeof b !== "function" && b !== null)
|
|
32
131
|
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
33
|
-
extendStatics(d, b);
|
|
132
|
+
extendStatics$1(d, b);
|
|
34
133
|
function __() { this.constructor = d; }
|
|
35
134
|
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
36
135
|
}
|
|
37
136
|
|
|
38
|
-
var __assign = function() {
|
|
39
|
-
__assign = Object.assign || function __assign(t) {
|
|
137
|
+
var __assign$1 = function() {
|
|
138
|
+
__assign$1 = Object.assign || function __assign(t) {
|
|
40
139
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
41
140
|
s = arguments[i];
|
|
42
141
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
43
142
|
}
|
|
44
143
|
return t;
|
|
45
144
|
};
|
|
46
|
-
return __assign.apply(this, arguments);
|
|
145
|
+
return __assign$1.apply(this, arguments);
|
|
47
146
|
};
|
|
48
147
|
|
|
49
148
|
/**
|
|
@@ -469,9 +568,9 @@ function isNumberArray(selectedIndex) {
|
|
|
469
568
|
return selectedIndex instanceof Array;
|
|
470
569
|
}
|
|
471
570
|
var MDCListFoundation = /** @class */ (function (_super) {
|
|
472
|
-
__extends(MDCListFoundation, _super);
|
|
571
|
+
__extends$1(MDCListFoundation, _super);
|
|
473
572
|
function MDCListFoundation(adapter) {
|
|
474
|
-
var _this = _super.call(this, __assign(__assign({}, MDCListFoundation.defaultAdapter), adapter)) || this;
|
|
573
|
+
var _this = _super.call(this, __assign$1(__assign$1({}, MDCListFoundation.defaultAdapter), adapter)) || this;
|
|
475
574
|
_this.wrapFocus = false;
|
|
476
575
|
_this.isVertical = true;
|
|
477
576
|
_this.isSingleSelectionList = false;
|
|
@@ -1143,7 +1242,7 @@ var MDCListFoundation = /** @class */ (function (_super) {
|
|
|
1143
1242
|
* THE SOFTWARE.
|
|
1144
1243
|
*/
|
|
1145
1244
|
var MDCList = /** @class */ (function (_super) {
|
|
1146
|
-
__extends(MDCList, _super);
|
|
1245
|
+
__extends$1(MDCList, _super);
|
|
1147
1246
|
function MDCList() {
|
|
1148
1247
|
return _super !== null && _super.apply(this, arguments) || this;
|
|
1149
1248
|
}
|
|
@@ -1493,10 +1592,834 @@ var MDCList = /** @class */ (function (_super) {
|
|
|
1493
1592
|
return MDCList;
|
|
1494
1593
|
}(component.MDCComponent));
|
|
1495
1594
|
|
|
1595
|
+
/*! *****************************************************************************
|
|
1596
|
+
Copyright (c) Microsoft Corporation.
|
|
1597
|
+
|
|
1598
|
+
Permission to use, copy, modify, and/or distribute this software for any
|
|
1599
|
+
purpose with or without fee is hereby granted.
|
|
1600
|
+
|
|
1601
|
+
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
1602
|
+
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
1603
|
+
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
1604
|
+
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
1605
|
+
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
1606
|
+
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
1607
|
+
PERFORMANCE OF THIS SOFTWARE.
|
|
1608
|
+
***************************************************************************** */
|
|
1609
|
+
/* global Reflect, Promise */
|
|
1610
|
+
|
|
1611
|
+
var extendStatics = function(d, b) {
|
|
1612
|
+
extendStatics = Object.setPrototypeOf ||
|
|
1613
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
1614
|
+
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
1615
|
+
return extendStatics(d, b);
|
|
1616
|
+
};
|
|
1617
|
+
|
|
1618
|
+
function __extends(d, b) {
|
|
1619
|
+
if (typeof b !== "function" && b !== null)
|
|
1620
|
+
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
1621
|
+
extendStatics(d, b);
|
|
1622
|
+
function __() { this.constructor = d; }
|
|
1623
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
1624
|
+
}
|
|
1625
|
+
|
|
1626
|
+
var __assign = function() {
|
|
1627
|
+
__assign = Object.assign || function __assign(t) {
|
|
1628
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
1629
|
+
s = arguments[i];
|
|
1630
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
1631
|
+
}
|
|
1632
|
+
return t;
|
|
1633
|
+
};
|
|
1634
|
+
return __assign.apply(this, arguments);
|
|
1635
|
+
};
|
|
1636
|
+
|
|
1637
|
+
function __values(o) {
|
|
1638
|
+
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
|
|
1639
|
+
if (m) return m.call(o);
|
|
1640
|
+
if (o && typeof o.length === "number") return {
|
|
1641
|
+
next: function () {
|
|
1642
|
+
if (o && i >= o.length) o = void 0;
|
|
1643
|
+
return { value: o && o[i++], done: !o };
|
|
1644
|
+
}
|
|
1645
|
+
};
|
|
1646
|
+
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
|
|
1647
|
+
}
|
|
1648
|
+
|
|
1649
|
+
/**
|
|
1650
|
+
* @license
|
|
1651
|
+
* Copyright 2018 Google Inc.
|
|
1652
|
+
*
|
|
1653
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
1654
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
1655
|
+
* in the Software without restriction, including without limitation the rights
|
|
1656
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
1657
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
1658
|
+
* furnished to do so, subject to the following conditions:
|
|
1659
|
+
*
|
|
1660
|
+
* The above copyright notice and this permission notice shall be included in
|
|
1661
|
+
* all copies or substantial portions of the Software.
|
|
1662
|
+
*
|
|
1663
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
1664
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
1665
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
1666
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
1667
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
1668
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
1669
|
+
* THE SOFTWARE.
|
|
1670
|
+
*/
|
|
1671
|
+
var MDCMenuSurfaceFoundation = /** @class */ (function (_super) {
|
|
1672
|
+
__extends(MDCMenuSurfaceFoundation, _super);
|
|
1673
|
+
function MDCMenuSurfaceFoundation(adapter) {
|
|
1674
|
+
var _this = _super.call(this, __assign(__assign({}, MDCMenuSurfaceFoundation.defaultAdapter), adapter)) || this;
|
|
1675
|
+
_this.isSurfaceOpen = false;
|
|
1676
|
+
_this.isQuickOpen = false;
|
|
1677
|
+
_this.isHoistedElement = false;
|
|
1678
|
+
_this.isFixedPosition = false;
|
|
1679
|
+
_this.isHorizontallyCenteredOnViewport = false;
|
|
1680
|
+
_this.maxHeight = 0;
|
|
1681
|
+
_this.openAnimationEndTimerId = 0;
|
|
1682
|
+
_this.closeAnimationEndTimerId = 0;
|
|
1683
|
+
_this.animationRequestId = 0;
|
|
1684
|
+
_this.anchorCorner = exports.Corner.TOP_START;
|
|
1685
|
+
/**
|
|
1686
|
+
* Corner of the menu surface to which menu surface is attached to anchor.
|
|
1687
|
+
*
|
|
1688
|
+
* Anchor corner --->+----------+
|
|
1689
|
+
* | ANCHOR |
|
|
1690
|
+
* +----------+
|
|
1691
|
+
* Origin corner --->+--------------+
|
|
1692
|
+
* | |
|
|
1693
|
+
* | |
|
|
1694
|
+
* | MENU SURFACE |
|
|
1695
|
+
* | |
|
|
1696
|
+
* | |
|
|
1697
|
+
* +--------------+
|
|
1698
|
+
*/
|
|
1699
|
+
_this.originCorner = exports.Corner.TOP_START;
|
|
1700
|
+
_this.anchorMargin = { top: 0, right: 0, bottom: 0, left: 0 };
|
|
1701
|
+
_this.position = { x: 0, y: 0 };
|
|
1702
|
+
return _this;
|
|
1703
|
+
}
|
|
1704
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "cssClasses", {
|
|
1705
|
+
get: function () {
|
|
1706
|
+
return cssClasses$1;
|
|
1707
|
+
},
|
|
1708
|
+
enumerable: false,
|
|
1709
|
+
configurable: true
|
|
1710
|
+
});
|
|
1711
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "strings", {
|
|
1712
|
+
get: function () {
|
|
1713
|
+
return strings$1;
|
|
1714
|
+
},
|
|
1715
|
+
enumerable: false,
|
|
1716
|
+
configurable: true
|
|
1717
|
+
});
|
|
1718
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "numbers", {
|
|
1719
|
+
get: function () {
|
|
1720
|
+
return numbers$1;
|
|
1721
|
+
},
|
|
1722
|
+
enumerable: false,
|
|
1723
|
+
configurable: true
|
|
1724
|
+
});
|
|
1725
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "Corner", {
|
|
1726
|
+
get: function () {
|
|
1727
|
+
return exports.Corner;
|
|
1728
|
+
},
|
|
1729
|
+
enumerable: false,
|
|
1730
|
+
configurable: true
|
|
1731
|
+
});
|
|
1732
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "defaultAdapter", {
|
|
1733
|
+
/**
|
|
1734
|
+
* @see {@link MDCMenuSurfaceAdapter} for typing information on parameters and return types.
|
|
1735
|
+
*/
|
|
1736
|
+
get: function () {
|
|
1737
|
+
// tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
|
|
1738
|
+
return {
|
|
1739
|
+
addClass: function () { return undefined; },
|
|
1740
|
+
removeClass: function () { return undefined; },
|
|
1741
|
+
hasClass: function () { return false; },
|
|
1742
|
+
hasAnchor: function () { return false; },
|
|
1743
|
+
isElementInContainer: function () { return false; },
|
|
1744
|
+
isFocused: function () { return false; },
|
|
1745
|
+
isRtl: function () { return false; },
|
|
1746
|
+
getInnerDimensions: function () { return ({ height: 0, width: 0 }); },
|
|
1747
|
+
getAnchorDimensions: function () { return null; },
|
|
1748
|
+
getWindowDimensions: function () { return ({ height: 0, width: 0 }); },
|
|
1749
|
+
getBodyDimensions: function () { return ({ height: 0, width: 0 }); },
|
|
1750
|
+
getWindowScroll: function () { return ({ x: 0, y: 0 }); },
|
|
1751
|
+
setPosition: function () { return undefined; },
|
|
1752
|
+
setMaxHeight: function () { return undefined; },
|
|
1753
|
+
setTransformOrigin: function () { return undefined; },
|
|
1754
|
+
saveFocus: function () { return undefined; },
|
|
1755
|
+
restoreFocus: function () { return undefined; },
|
|
1756
|
+
notifyClose: function () { return undefined; },
|
|
1757
|
+
notifyOpen: function () { return undefined; },
|
|
1758
|
+
notifyClosing: function () { return undefined; },
|
|
1759
|
+
};
|
|
1760
|
+
// tslint:enable:object-literal-sort-keys
|
|
1761
|
+
},
|
|
1762
|
+
enumerable: false,
|
|
1763
|
+
configurable: true
|
|
1764
|
+
});
|
|
1765
|
+
MDCMenuSurfaceFoundation.prototype.init = function () {
|
|
1766
|
+
var _a = MDCMenuSurfaceFoundation.cssClasses, ROOT = _a.ROOT, OPEN = _a.OPEN;
|
|
1767
|
+
if (!this.adapter.hasClass(ROOT)) {
|
|
1768
|
+
throw new Error(ROOT + " class required in root element.");
|
|
1769
|
+
}
|
|
1770
|
+
if (this.adapter.hasClass(OPEN)) {
|
|
1771
|
+
this.isSurfaceOpen = true;
|
|
1772
|
+
}
|
|
1773
|
+
};
|
|
1774
|
+
MDCMenuSurfaceFoundation.prototype.destroy = function () {
|
|
1775
|
+
clearTimeout(this.openAnimationEndTimerId);
|
|
1776
|
+
clearTimeout(this.closeAnimationEndTimerId);
|
|
1777
|
+
// Cancel any currently running animations.
|
|
1778
|
+
cancelAnimationFrame(this.animationRequestId);
|
|
1779
|
+
};
|
|
1780
|
+
/**
|
|
1781
|
+
* @param corner Default anchor corner alignment of top-left menu surface
|
|
1782
|
+
* corner.
|
|
1783
|
+
*/
|
|
1784
|
+
MDCMenuSurfaceFoundation.prototype.setAnchorCorner = function (corner) {
|
|
1785
|
+
this.anchorCorner = corner;
|
|
1786
|
+
};
|
|
1787
|
+
/**
|
|
1788
|
+
* Flip menu corner horizontally.
|
|
1789
|
+
*/
|
|
1790
|
+
MDCMenuSurfaceFoundation.prototype.flipCornerHorizontally = function () {
|
|
1791
|
+
this.originCorner = this.originCorner ^ CornerBit.RIGHT;
|
|
1792
|
+
};
|
|
1793
|
+
/**
|
|
1794
|
+
* @param margin Set of margin values from anchor.
|
|
1795
|
+
*/
|
|
1796
|
+
MDCMenuSurfaceFoundation.prototype.setAnchorMargin = function (margin) {
|
|
1797
|
+
this.anchorMargin.top = margin.top || 0;
|
|
1798
|
+
this.anchorMargin.right = margin.right || 0;
|
|
1799
|
+
this.anchorMargin.bottom = margin.bottom || 0;
|
|
1800
|
+
this.anchorMargin.left = margin.left || 0;
|
|
1801
|
+
};
|
|
1802
|
+
/** Used to indicate if the menu-surface is hoisted to the body. */
|
|
1803
|
+
MDCMenuSurfaceFoundation.prototype.setIsHoisted = function (isHoisted) {
|
|
1804
|
+
this.isHoistedElement = isHoisted;
|
|
1805
|
+
};
|
|
1806
|
+
/**
|
|
1807
|
+
* Used to set the menu-surface calculations based on a fixed position menu.
|
|
1808
|
+
*/
|
|
1809
|
+
MDCMenuSurfaceFoundation.prototype.setFixedPosition = function (isFixedPosition) {
|
|
1810
|
+
this.isFixedPosition = isFixedPosition;
|
|
1811
|
+
};
|
|
1812
|
+
/**
|
|
1813
|
+
* @return Returns true if menu is in fixed (`position: fixed`) position.
|
|
1814
|
+
*/
|
|
1815
|
+
MDCMenuSurfaceFoundation.prototype.isFixed = function () {
|
|
1816
|
+
return this.isFixedPosition;
|
|
1817
|
+
};
|
|
1818
|
+
/** Sets the menu-surface position on the page. */
|
|
1819
|
+
MDCMenuSurfaceFoundation.prototype.setAbsolutePosition = function (x, y) {
|
|
1820
|
+
this.position.x = this.isFinite(x) ? x : 0;
|
|
1821
|
+
this.position.y = this.isFinite(y) ? y : 0;
|
|
1822
|
+
};
|
|
1823
|
+
/** Sets whether menu-surface should be horizontally centered to viewport. */
|
|
1824
|
+
MDCMenuSurfaceFoundation.prototype.setIsHorizontallyCenteredOnViewport = function (isCentered) {
|
|
1825
|
+
this.isHorizontallyCenteredOnViewport = isCentered;
|
|
1826
|
+
};
|
|
1827
|
+
MDCMenuSurfaceFoundation.prototype.setQuickOpen = function (quickOpen) {
|
|
1828
|
+
this.isQuickOpen = quickOpen;
|
|
1829
|
+
};
|
|
1830
|
+
/**
|
|
1831
|
+
* Sets maximum menu-surface height on open.
|
|
1832
|
+
* @param maxHeight The desired max-height. Set to 0 (default) to
|
|
1833
|
+
* automatically calculate max height based on available viewport space.
|
|
1834
|
+
*/
|
|
1835
|
+
MDCMenuSurfaceFoundation.prototype.setMaxHeight = function (maxHeight) {
|
|
1836
|
+
this.maxHeight = maxHeight;
|
|
1837
|
+
};
|
|
1838
|
+
MDCMenuSurfaceFoundation.prototype.isOpen = function () {
|
|
1839
|
+
return this.isSurfaceOpen;
|
|
1840
|
+
};
|
|
1841
|
+
/**
|
|
1842
|
+
* Open the menu surface.
|
|
1843
|
+
*/
|
|
1844
|
+
MDCMenuSurfaceFoundation.prototype.open = function () {
|
|
1845
|
+
var _this = this;
|
|
1846
|
+
if (this.isSurfaceOpen) {
|
|
1847
|
+
return;
|
|
1848
|
+
}
|
|
1849
|
+
this.adapter.saveFocus();
|
|
1850
|
+
if (this.isQuickOpen) {
|
|
1851
|
+
this.isSurfaceOpen = true;
|
|
1852
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
1853
|
+
this.dimensions = this.adapter.getInnerDimensions();
|
|
1854
|
+
this.autoposition();
|
|
1855
|
+
this.adapter.notifyOpen();
|
|
1856
|
+
}
|
|
1857
|
+
else {
|
|
1858
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
|
|
1859
|
+
this.animationRequestId = requestAnimationFrame(function () {
|
|
1860
|
+
_this.dimensions = _this.adapter.getInnerDimensions();
|
|
1861
|
+
_this.autoposition();
|
|
1862
|
+
_this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
1863
|
+
_this.openAnimationEndTimerId = setTimeout(function () {
|
|
1864
|
+
_this.openAnimationEndTimerId = 0;
|
|
1865
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
|
|
1866
|
+
_this.adapter.notifyOpen();
|
|
1867
|
+
}, numbers$1.TRANSITION_OPEN_DURATION);
|
|
1868
|
+
});
|
|
1869
|
+
this.isSurfaceOpen = true;
|
|
1870
|
+
}
|
|
1871
|
+
};
|
|
1872
|
+
/**
|
|
1873
|
+
* Closes the menu surface.
|
|
1874
|
+
*/
|
|
1875
|
+
MDCMenuSurfaceFoundation.prototype.close = function (skipRestoreFocus) {
|
|
1876
|
+
var _this = this;
|
|
1877
|
+
if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
|
|
1878
|
+
if (!this.isSurfaceOpen) {
|
|
1879
|
+
return;
|
|
1880
|
+
}
|
|
1881
|
+
this.adapter.notifyClosing();
|
|
1882
|
+
if (this.isQuickOpen) {
|
|
1883
|
+
this.isSurfaceOpen = false;
|
|
1884
|
+
if (!skipRestoreFocus) {
|
|
1885
|
+
this.maybeRestoreFocus();
|
|
1886
|
+
}
|
|
1887
|
+
this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
1888
|
+
this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
|
|
1889
|
+
this.adapter.notifyClose();
|
|
1890
|
+
return;
|
|
1891
|
+
}
|
|
1892
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
|
|
1893
|
+
requestAnimationFrame(function () {
|
|
1894
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
1895
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
|
|
1896
|
+
_this.closeAnimationEndTimerId = setTimeout(function () {
|
|
1897
|
+
_this.closeAnimationEndTimerId = 0;
|
|
1898
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
|
|
1899
|
+
_this.adapter.notifyClose();
|
|
1900
|
+
}, numbers$1.TRANSITION_CLOSE_DURATION);
|
|
1901
|
+
});
|
|
1902
|
+
this.isSurfaceOpen = false;
|
|
1903
|
+
if (!skipRestoreFocus) {
|
|
1904
|
+
this.maybeRestoreFocus();
|
|
1905
|
+
}
|
|
1906
|
+
};
|
|
1907
|
+
/** Handle clicks and close if not within menu-surface element. */
|
|
1908
|
+
MDCMenuSurfaceFoundation.prototype.handleBodyClick = function (evt) {
|
|
1909
|
+
var el = evt.target;
|
|
1910
|
+
if (this.adapter.isElementInContainer(el)) {
|
|
1911
|
+
return;
|
|
1912
|
+
}
|
|
1913
|
+
this.close();
|
|
1914
|
+
};
|
|
1915
|
+
/** Handle keys that close the surface. */
|
|
1916
|
+
MDCMenuSurfaceFoundation.prototype.handleKeydown = function (evt) {
|
|
1917
|
+
var keyCode = evt.keyCode, key = evt.key;
|
|
1918
|
+
var isEscape = key === 'Escape' || keyCode === 27;
|
|
1919
|
+
if (isEscape) {
|
|
1920
|
+
this.close();
|
|
1921
|
+
}
|
|
1922
|
+
};
|
|
1923
|
+
MDCMenuSurfaceFoundation.prototype.autoposition = function () {
|
|
1924
|
+
var _a;
|
|
1925
|
+
// Compute measurements for autoposition methods reuse.
|
|
1926
|
+
this.measurements = this.getAutoLayoutmeasurements();
|
|
1927
|
+
var corner = this.getoriginCorner();
|
|
1928
|
+
var maxMenuSurfaceHeight = this.getMenuSurfaceMaxHeight(corner);
|
|
1929
|
+
var verticalAlignment = this.hasBit(corner, CornerBit.BOTTOM) ? 'bottom' : 'top';
|
|
1930
|
+
var horizontalAlignment = this.hasBit(corner, CornerBit.RIGHT) ? 'right' : 'left';
|
|
1931
|
+
var horizontalOffset = this.getHorizontalOriginOffset(corner);
|
|
1932
|
+
var verticalOffset = this.getVerticalOriginOffset(corner);
|
|
1933
|
+
var _b = this.measurements, anchorSize = _b.anchorSize, surfaceSize = _b.surfaceSize;
|
|
1934
|
+
var position = (_a = {},
|
|
1935
|
+
_a[horizontalAlignment] = horizontalOffset,
|
|
1936
|
+
_a[verticalAlignment] = verticalOffset,
|
|
1937
|
+
_a);
|
|
1938
|
+
// Center align when anchor width is comparable or greater than menu
|
|
1939
|
+
// surface, otherwise keep corner.
|
|
1940
|
+
if (anchorSize.width / surfaceSize.width >
|
|
1941
|
+
numbers$1.ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO) {
|
|
1942
|
+
horizontalAlignment = 'center';
|
|
1943
|
+
}
|
|
1944
|
+
// If the menu-surface has been hoisted to the body, it's no longer relative
|
|
1945
|
+
// to the anchor element
|
|
1946
|
+
if (this.isHoistedElement || this.isFixedPosition) {
|
|
1947
|
+
this.adjustPositionForHoistedElement(position);
|
|
1948
|
+
}
|
|
1949
|
+
this.adapter.setTransformOrigin(horizontalAlignment + " " + verticalAlignment);
|
|
1950
|
+
this.adapter.setPosition(position);
|
|
1951
|
+
this.adapter.setMaxHeight(maxMenuSurfaceHeight ? maxMenuSurfaceHeight + 'px' : '');
|
|
1952
|
+
// If it is opened from the top then add is-open-below class
|
|
1953
|
+
if (!this.hasBit(corner, CornerBit.BOTTOM)) {
|
|
1954
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
|
|
1955
|
+
}
|
|
1956
|
+
};
|
|
1957
|
+
/**
|
|
1958
|
+
* @return Measurements used to position menu surface popup.
|
|
1959
|
+
*/
|
|
1960
|
+
MDCMenuSurfaceFoundation.prototype.getAutoLayoutmeasurements = function () {
|
|
1961
|
+
var anchorRect = this.adapter.getAnchorDimensions();
|
|
1962
|
+
var bodySize = this.adapter.getBodyDimensions();
|
|
1963
|
+
var viewportSize = this.adapter.getWindowDimensions();
|
|
1964
|
+
var windowScroll = this.adapter.getWindowScroll();
|
|
1965
|
+
if (!anchorRect) {
|
|
1966
|
+
// tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
|
|
1967
|
+
anchorRect = {
|
|
1968
|
+
top: this.position.y,
|
|
1969
|
+
right: this.position.x,
|
|
1970
|
+
bottom: this.position.y,
|
|
1971
|
+
left: this.position.x,
|
|
1972
|
+
width: 0,
|
|
1973
|
+
height: 0,
|
|
1974
|
+
};
|
|
1975
|
+
// tslint:enable:object-literal-sort-keys
|
|
1976
|
+
}
|
|
1977
|
+
return {
|
|
1978
|
+
anchorSize: anchorRect,
|
|
1979
|
+
bodySize: bodySize,
|
|
1980
|
+
surfaceSize: this.dimensions,
|
|
1981
|
+
viewportDistance: {
|
|
1982
|
+
// tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
|
|
1983
|
+
top: anchorRect.top,
|
|
1984
|
+
right: viewportSize.width - anchorRect.right,
|
|
1985
|
+
bottom: viewportSize.height - anchorRect.bottom,
|
|
1986
|
+
left: anchorRect.left,
|
|
1987
|
+
// tslint:enable:object-literal-sort-keys
|
|
1988
|
+
},
|
|
1989
|
+
viewportSize: viewportSize,
|
|
1990
|
+
windowScroll: windowScroll,
|
|
1991
|
+
};
|
|
1992
|
+
};
|
|
1993
|
+
/**
|
|
1994
|
+
* Computes the corner of the anchor from which to animate and position the
|
|
1995
|
+
* menu surface.
|
|
1996
|
+
*
|
|
1997
|
+
* Only LEFT or RIGHT bit is used to position the menu surface ignoring RTL
|
|
1998
|
+
* context. E.g., menu surface will be positioned from right side on TOP_END.
|
|
1999
|
+
*/
|
|
2000
|
+
MDCMenuSurfaceFoundation.prototype.getoriginCorner = function () {
|
|
2001
|
+
var corner = this.originCorner;
|
|
2002
|
+
var _a = this.measurements, viewportDistance = _a.viewportDistance, anchorSize = _a.anchorSize, surfaceSize = _a.surfaceSize;
|
|
2003
|
+
var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
|
|
2004
|
+
var isAnchoredToBottom = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
|
|
2005
|
+
var availableTop;
|
|
2006
|
+
var availableBottom;
|
|
2007
|
+
if (isAnchoredToBottom) {
|
|
2008
|
+
availableTop =
|
|
2009
|
+
viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.bottom;
|
|
2010
|
+
availableBottom =
|
|
2011
|
+
viewportDistance.bottom - MARGIN_TO_EDGE - this.anchorMargin.bottom;
|
|
2012
|
+
}
|
|
2013
|
+
else {
|
|
2014
|
+
availableTop =
|
|
2015
|
+
viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.top;
|
|
2016
|
+
availableBottom = viewportDistance.bottom - MARGIN_TO_EDGE +
|
|
2017
|
+
anchorSize.height - this.anchorMargin.top;
|
|
2018
|
+
}
|
|
2019
|
+
var isAvailableBottom = availableBottom - surfaceSize.height > 0;
|
|
2020
|
+
if (!isAvailableBottom && availableTop > availableBottom) {
|
|
2021
|
+
// Attach bottom side of surface to the anchor.
|
|
2022
|
+
corner = this.setBit(corner, CornerBit.BOTTOM);
|
|
2023
|
+
}
|
|
2024
|
+
var isRtl = this.adapter.isRtl();
|
|
2025
|
+
var isFlipRtl = this.hasBit(this.anchorCorner, CornerBit.FLIP_RTL);
|
|
2026
|
+
var hasRightBit = this.hasBit(this.anchorCorner, CornerBit.RIGHT) ||
|
|
2027
|
+
this.hasBit(corner, CornerBit.RIGHT);
|
|
2028
|
+
// Whether surface attached to right side of anchor element.
|
|
2029
|
+
var isAnchoredToRight = false;
|
|
2030
|
+
// Anchored to start
|
|
2031
|
+
if (isRtl && isFlipRtl) {
|
|
2032
|
+
isAnchoredToRight = !hasRightBit;
|
|
2033
|
+
}
|
|
2034
|
+
else {
|
|
2035
|
+
// Anchored to right
|
|
2036
|
+
isAnchoredToRight = hasRightBit;
|
|
2037
|
+
}
|
|
2038
|
+
var availableLeft;
|
|
2039
|
+
var availableRight;
|
|
2040
|
+
if (isAnchoredToRight) {
|
|
2041
|
+
availableLeft =
|
|
2042
|
+
viewportDistance.left + anchorSize.width + this.anchorMargin.right;
|
|
2043
|
+
availableRight = viewportDistance.right - this.anchorMargin.right;
|
|
2044
|
+
}
|
|
2045
|
+
else {
|
|
2046
|
+
availableLeft = viewportDistance.left + this.anchorMargin.left;
|
|
2047
|
+
availableRight =
|
|
2048
|
+
viewportDistance.right + anchorSize.width - this.anchorMargin.left;
|
|
2049
|
+
}
|
|
2050
|
+
var isAvailableLeft = availableLeft - surfaceSize.width > 0;
|
|
2051
|
+
var isAvailableRight = availableRight - surfaceSize.width > 0;
|
|
2052
|
+
var isOriginCornerAlignedToEnd = this.hasBit(corner, CornerBit.FLIP_RTL) &&
|
|
2053
|
+
this.hasBit(corner, CornerBit.RIGHT);
|
|
2054
|
+
if (isAvailableRight && isOriginCornerAlignedToEnd && isRtl ||
|
|
2055
|
+
!isAvailableLeft && isOriginCornerAlignedToEnd) {
|
|
2056
|
+
// Attach left side of surface to the anchor.
|
|
2057
|
+
corner = this.unsetBit(corner, CornerBit.RIGHT);
|
|
2058
|
+
}
|
|
2059
|
+
else if (isAvailableLeft && isAnchoredToRight && isRtl ||
|
|
2060
|
+
(isAvailableLeft && !isAnchoredToRight && hasRightBit) ||
|
|
2061
|
+
(!isAvailableRight && availableLeft >= availableRight)) {
|
|
2062
|
+
// Attach right side of surface to the anchor.
|
|
2063
|
+
corner = this.setBit(corner, CornerBit.RIGHT);
|
|
2064
|
+
}
|
|
2065
|
+
return corner;
|
|
2066
|
+
};
|
|
2067
|
+
/**
|
|
2068
|
+
* @param corner Origin corner of the menu surface.
|
|
2069
|
+
* @return Maximum height of the menu surface, based on available space. 0
|
|
2070
|
+
* indicates should not be set.
|
|
2071
|
+
*/
|
|
2072
|
+
MDCMenuSurfaceFoundation.prototype.getMenuSurfaceMaxHeight = function (corner) {
|
|
2073
|
+
if (this.maxHeight > 0) {
|
|
2074
|
+
return this.maxHeight;
|
|
2075
|
+
}
|
|
2076
|
+
var viewportDistance = this.measurements.viewportDistance;
|
|
2077
|
+
var maxHeight = 0;
|
|
2078
|
+
var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
|
|
2079
|
+
var isBottomAnchored = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
|
|
2080
|
+
var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
|
|
2081
|
+
// When maximum height is not specified, it is handled from CSS.
|
|
2082
|
+
if (isBottomAligned) {
|
|
2083
|
+
maxHeight = viewportDistance.top + this.anchorMargin.top - MARGIN_TO_EDGE;
|
|
2084
|
+
if (!isBottomAnchored) {
|
|
2085
|
+
maxHeight += this.measurements.anchorSize.height;
|
|
2086
|
+
}
|
|
2087
|
+
}
|
|
2088
|
+
else {
|
|
2089
|
+
maxHeight = viewportDistance.bottom - this.anchorMargin.bottom +
|
|
2090
|
+
this.measurements.anchorSize.height - MARGIN_TO_EDGE;
|
|
2091
|
+
if (isBottomAnchored) {
|
|
2092
|
+
maxHeight -= this.measurements.anchorSize.height;
|
|
2093
|
+
}
|
|
2094
|
+
}
|
|
2095
|
+
return maxHeight;
|
|
2096
|
+
};
|
|
2097
|
+
/**
|
|
2098
|
+
* @param corner Origin corner of the menu surface.
|
|
2099
|
+
* @return Horizontal offset of menu surface origin corner from corresponding
|
|
2100
|
+
* anchor corner.
|
|
2101
|
+
*/
|
|
2102
|
+
MDCMenuSurfaceFoundation.prototype.getHorizontalOriginOffset = function (corner) {
|
|
2103
|
+
var anchorSize = this.measurements.anchorSize;
|
|
2104
|
+
// isRightAligned corresponds to using the 'right' property on the surface.
|
|
2105
|
+
var isRightAligned = this.hasBit(corner, CornerBit.RIGHT);
|
|
2106
|
+
var avoidHorizontalOverlap = this.hasBit(this.anchorCorner, CornerBit.RIGHT);
|
|
2107
|
+
if (isRightAligned) {
|
|
2108
|
+
var rightOffset = avoidHorizontalOverlap ?
|
|
2109
|
+
anchorSize.width - this.anchorMargin.left :
|
|
2110
|
+
this.anchorMargin.right;
|
|
2111
|
+
// For hoisted or fixed elements, adjust the offset by the difference
|
|
2112
|
+
// between viewport width and body width so when we calculate the right
|
|
2113
|
+
// value (`adjustPositionForHoistedElement`) based on the element
|
|
2114
|
+
// position, the right property is correct.
|
|
2115
|
+
if (this.isHoistedElement || this.isFixedPosition) {
|
|
2116
|
+
return rightOffset -
|
|
2117
|
+
(this.measurements.viewportSize.width -
|
|
2118
|
+
this.measurements.bodySize.width);
|
|
2119
|
+
}
|
|
2120
|
+
return rightOffset;
|
|
2121
|
+
}
|
|
2122
|
+
return avoidHorizontalOverlap ? anchorSize.width - this.anchorMargin.right :
|
|
2123
|
+
this.anchorMargin.left;
|
|
2124
|
+
};
|
|
2125
|
+
/**
|
|
2126
|
+
* @param corner Origin corner of the menu surface.
|
|
2127
|
+
* @return Vertical offset of menu surface origin corner from corresponding
|
|
2128
|
+
* anchor corner.
|
|
2129
|
+
*/
|
|
2130
|
+
MDCMenuSurfaceFoundation.prototype.getVerticalOriginOffset = function (corner) {
|
|
2131
|
+
var anchorSize = this.measurements.anchorSize;
|
|
2132
|
+
var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
|
|
2133
|
+
var avoidVerticalOverlap = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
|
|
2134
|
+
var y = 0;
|
|
2135
|
+
if (isBottomAligned) {
|
|
2136
|
+
y = avoidVerticalOverlap ? anchorSize.height - this.anchorMargin.top :
|
|
2137
|
+
-this.anchorMargin.bottom;
|
|
2138
|
+
}
|
|
2139
|
+
else {
|
|
2140
|
+
y = avoidVerticalOverlap ?
|
|
2141
|
+
(anchorSize.height + this.anchorMargin.bottom) :
|
|
2142
|
+
this.anchorMargin.top;
|
|
2143
|
+
}
|
|
2144
|
+
return y;
|
|
2145
|
+
};
|
|
2146
|
+
/**
|
|
2147
|
+
* Calculates the offsets for positioning the menu-surface when the
|
|
2148
|
+
* menu-surface has been hoisted to the body.
|
|
2149
|
+
*/
|
|
2150
|
+
MDCMenuSurfaceFoundation.prototype.adjustPositionForHoistedElement = function (position) {
|
|
2151
|
+
var e_1, _a;
|
|
2152
|
+
var _b = this.measurements, windowScroll = _b.windowScroll, viewportDistance = _b.viewportDistance, surfaceSize = _b.surfaceSize, viewportSize = _b.viewportSize;
|
|
2153
|
+
var props = Object.keys(position);
|
|
2154
|
+
try {
|
|
2155
|
+
for (var props_1 = __values(props), props_1_1 = props_1.next(); !props_1_1.done; props_1_1 = props_1.next()) {
|
|
2156
|
+
var prop = props_1_1.value;
|
|
2157
|
+
var value = position[prop] || 0;
|
|
2158
|
+
if (this.isHorizontallyCenteredOnViewport &&
|
|
2159
|
+
(prop === 'left' || prop === 'right')) {
|
|
2160
|
+
position[prop] = (viewportSize.width - surfaceSize.width) / 2;
|
|
2161
|
+
continue;
|
|
2162
|
+
}
|
|
2163
|
+
// Hoisted surfaces need to have the anchor elements location on the page
|
|
2164
|
+
// added to the position properties for proper alignment on the body.
|
|
2165
|
+
value += viewportDistance[prop];
|
|
2166
|
+
// Surfaces that are absolutely positioned need to have additional
|
|
2167
|
+
// calculations for scroll and bottom positioning.
|
|
2168
|
+
if (!this.isFixedPosition) {
|
|
2169
|
+
if (prop === 'top') {
|
|
2170
|
+
value += windowScroll.y;
|
|
2171
|
+
}
|
|
2172
|
+
else if (prop === 'bottom') {
|
|
2173
|
+
value -= windowScroll.y;
|
|
2174
|
+
}
|
|
2175
|
+
else if (prop === 'left') {
|
|
2176
|
+
value += windowScroll.x;
|
|
2177
|
+
}
|
|
2178
|
+
else { // prop === 'right'
|
|
2179
|
+
value -= windowScroll.x;
|
|
2180
|
+
}
|
|
2181
|
+
}
|
|
2182
|
+
position[prop] = value;
|
|
2183
|
+
}
|
|
2184
|
+
}
|
|
2185
|
+
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
2186
|
+
finally {
|
|
2187
|
+
try {
|
|
2188
|
+
if (props_1_1 && !props_1_1.done && (_a = props_1.return)) _a.call(props_1);
|
|
2189
|
+
}
|
|
2190
|
+
finally { if (e_1) throw e_1.error; }
|
|
2191
|
+
}
|
|
2192
|
+
};
|
|
2193
|
+
/**
|
|
2194
|
+
* The last focused element when the menu surface was opened should regain
|
|
2195
|
+
* focus, if the user is focused on or within the menu surface when it is
|
|
2196
|
+
* closed.
|
|
2197
|
+
*/
|
|
2198
|
+
MDCMenuSurfaceFoundation.prototype.maybeRestoreFocus = function () {
|
|
2199
|
+
var _this = this;
|
|
2200
|
+
var isRootFocused = this.adapter.isFocused();
|
|
2201
|
+
var childHasFocus = document.activeElement &&
|
|
2202
|
+
this.adapter.isElementInContainer(document.activeElement);
|
|
2203
|
+
if (isRootFocused || childHasFocus) {
|
|
2204
|
+
// Wait before restoring focus when closing the menu surface. This is
|
|
2205
|
+
// important because if a touch event triggered the menu close, and the
|
|
2206
|
+
// subsequent mouse event occurs after focus is restored, then the
|
|
2207
|
+
// restored focus would be lost.
|
|
2208
|
+
setTimeout(function () {
|
|
2209
|
+
_this.adapter.restoreFocus();
|
|
2210
|
+
}, numbers$1.TOUCH_EVENT_WAIT_MS);
|
|
2211
|
+
}
|
|
2212
|
+
};
|
|
2213
|
+
MDCMenuSurfaceFoundation.prototype.hasBit = function (corner, bit) {
|
|
2214
|
+
return Boolean(corner & bit); // tslint:disable-line:no-bitwise
|
|
2215
|
+
};
|
|
2216
|
+
MDCMenuSurfaceFoundation.prototype.setBit = function (corner, bit) {
|
|
2217
|
+
return corner | bit; // tslint:disable-line:no-bitwise
|
|
2218
|
+
};
|
|
2219
|
+
MDCMenuSurfaceFoundation.prototype.unsetBit = function (corner, bit) {
|
|
2220
|
+
return corner ^ bit;
|
|
2221
|
+
};
|
|
2222
|
+
/**
|
|
2223
|
+
* isFinite that doesn't force conversion to number type.
|
|
2224
|
+
* Equivalent to Number.isFinite in ES2015, which is not supported in IE.
|
|
2225
|
+
*/
|
|
2226
|
+
MDCMenuSurfaceFoundation.prototype.isFinite = function (num) {
|
|
2227
|
+
return typeof num === 'number' && isFinite(num);
|
|
2228
|
+
};
|
|
2229
|
+
return MDCMenuSurfaceFoundation;
|
|
2230
|
+
}(component.MDCFoundation));
|
|
2231
|
+
|
|
2232
|
+
/**
|
|
2233
|
+
* @license
|
|
2234
|
+
* Copyright 2018 Google Inc.
|
|
2235
|
+
*
|
|
2236
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
2237
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
2238
|
+
* in the Software without restriction, including without limitation the rights
|
|
2239
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
2240
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
2241
|
+
* furnished to do so, subject to the following conditions:
|
|
2242
|
+
*
|
|
2243
|
+
* The above copyright notice and this permission notice shall be included in
|
|
2244
|
+
* all copies or substantial portions of the Software.
|
|
2245
|
+
*
|
|
2246
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
2247
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
2248
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
2249
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
2250
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
2251
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
2252
|
+
* THE SOFTWARE.
|
|
2253
|
+
*/
|
|
2254
|
+
var MDCMenuSurface = /** @class */ (function (_super) {
|
|
2255
|
+
__extends(MDCMenuSurface, _super);
|
|
2256
|
+
function MDCMenuSurface() {
|
|
2257
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
2258
|
+
}
|
|
2259
|
+
MDCMenuSurface.attachTo = function (root) {
|
|
2260
|
+
return new MDCMenuSurface(root);
|
|
2261
|
+
};
|
|
2262
|
+
MDCMenuSurface.prototype.initialSyncWithDOM = function () {
|
|
2263
|
+
var _this = this;
|
|
2264
|
+
var parentEl = this.root.parentElement;
|
|
2265
|
+
this.anchorElement = parentEl && parentEl.classList.contains(cssClasses$1.ANCHOR) ? parentEl : null;
|
|
2266
|
+
if (this.root.classList.contains(cssClasses$1.FIXED)) {
|
|
2267
|
+
this.setFixedPosition(true);
|
|
2268
|
+
}
|
|
2269
|
+
this.handleKeydown = function (event) {
|
|
2270
|
+
_this.foundation.handleKeydown(event);
|
|
2271
|
+
};
|
|
2272
|
+
this.handleBodyClick = function (event) {
|
|
2273
|
+
_this.foundation.handleBodyClick(event);
|
|
2274
|
+
};
|
|
2275
|
+
// capture so that no race between handleBodyClick and quickOpen when
|
|
2276
|
+
// menusurface opened on button click which registers this listener
|
|
2277
|
+
this.registerBodyClickListener = function () {
|
|
2278
|
+
document.body.addEventListener('click', _this.handleBodyClick, { capture: true });
|
|
2279
|
+
};
|
|
2280
|
+
this.deregisterBodyClickListener = function () {
|
|
2281
|
+
document.body.removeEventListener('click', _this.handleBodyClick, { capture: true });
|
|
2282
|
+
};
|
|
2283
|
+
this.listen('keydown', this.handleKeydown);
|
|
2284
|
+
this.listen(strings$1.OPENED_EVENT, this.registerBodyClickListener);
|
|
2285
|
+
this.listen(strings$1.CLOSED_EVENT, this.deregisterBodyClickListener);
|
|
2286
|
+
};
|
|
2287
|
+
MDCMenuSurface.prototype.destroy = function () {
|
|
2288
|
+
this.unlisten('keydown', this.handleKeydown);
|
|
2289
|
+
this.unlisten(strings$1.OPENED_EVENT, this.registerBodyClickListener);
|
|
2290
|
+
this.unlisten(strings$1.CLOSED_EVENT, this.deregisterBodyClickListener);
|
|
2291
|
+
_super.prototype.destroy.call(this);
|
|
2292
|
+
};
|
|
2293
|
+
MDCMenuSurface.prototype.isOpen = function () {
|
|
2294
|
+
return this.foundation.isOpen();
|
|
2295
|
+
};
|
|
2296
|
+
MDCMenuSurface.prototype.open = function () {
|
|
2297
|
+
this.foundation.open();
|
|
2298
|
+
};
|
|
2299
|
+
MDCMenuSurface.prototype.close = function (skipRestoreFocus) {
|
|
2300
|
+
if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
|
|
2301
|
+
this.foundation.close(skipRestoreFocus);
|
|
2302
|
+
};
|
|
2303
|
+
Object.defineProperty(MDCMenuSurface.prototype, "quickOpen", {
|
|
2304
|
+
set: function (quickOpen) {
|
|
2305
|
+
this.foundation.setQuickOpen(quickOpen);
|
|
2306
|
+
},
|
|
2307
|
+
enumerable: false,
|
|
2308
|
+
configurable: true
|
|
2309
|
+
});
|
|
2310
|
+
/** Sets the foundation to use page offsets for an positioning when the menu is hoisted to the body. */
|
|
2311
|
+
MDCMenuSurface.prototype.setIsHoisted = function (isHoisted) {
|
|
2312
|
+
this.foundation.setIsHoisted(isHoisted);
|
|
2313
|
+
};
|
|
2314
|
+
/** Sets the element that the menu-surface is anchored to. */
|
|
2315
|
+
MDCMenuSurface.prototype.setMenuSurfaceAnchorElement = function (element) {
|
|
2316
|
+
this.anchorElement = element;
|
|
2317
|
+
};
|
|
2318
|
+
/** Sets the menu-surface to position: fixed. */
|
|
2319
|
+
MDCMenuSurface.prototype.setFixedPosition = function (isFixed) {
|
|
2320
|
+
if (isFixed) {
|
|
2321
|
+
this.root.classList.add(cssClasses$1.FIXED);
|
|
2322
|
+
}
|
|
2323
|
+
else {
|
|
2324
|
+
this.root.classList.remove(cssClasses$1.FIXED);
|
|
2325
|
+
}
|
|
2326
|
+
this.foundation.setFixedPosition(isFixed);
|
|
2327
|
+
};
|
|
2328
|
+
/** Sets the absolute x/y position to position based on. Requires the menu to be hoisted. */
|
|
2329
|
+
MDCMenuSurface.prototype.setAbsolutePosition = function (x, y) {
|
|
2330
|
+
this.foundation.setAbsolutePosition(x, y);
|
|
2331
|
+
this.setIsHoisted(true);
|
|
2332
|
+
};
|
|
2333
|
+
/**
|
|
2334
|
+
* @param corner Default anchor corner alignment of top-left surface corner.
|
|
2335
|
+
*/
|
|
2336
|
+
MDCMenuSurface.prototype.setAnchorCorner = function (corner) {
|
|
2337
|
+
this.foundation.setAnchorCorner(corner);
|
|
2338
|
+
};
|
|
2339
|
+
MDCMenuSurface.prototype.setAnchorMargin = function (margin) {
|
|
2340
|
+
this.foundation.setAnchorMargin(margin);
|
|
2341
|
+
};
|
|
2342
|
+
MDCMenuSurface.prototype.getDefaultFoundation = function () {
|
|
2343
|
+
var _this = this;
|
|
2344
|
+
// DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
|
|
2345
|
+
// To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
|
|
2346
|
+
// tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
|
|
2347
|
+
var adapter = {
|
|
2348
|
+
addClass: function (className) { return _this.root.classList.add(className); },
|
|
2349
|
+
removeClass: function (className) { return _this.root.classList.remove(className); },
|
|
2350
|
+
hasClass: function (className) { return _this.root.classList.contains(className); },
|
|
2351
|
+
hasAnchor: function () { return !!_this.anchorElement; },
|
|
2352
|
+
notifyClose: function () {
|
|
2353
|
+
return _this.emit(MDCMenuSurfaceFoundation.strings.CLOSED_EVENT, {});
|
|
2354
|
+
},
|
|
2355
|
+
notifyClosing: function () {
|
|
2356
|
+
_this.emit(MDCMenuSurfaceFoundation.strings.CLOSING_EVENT, {});
|
|
2357
|
+
},
|
|
2358
|
+
notifyOpen: function () {
|
|
2359
|
+
return _this.emit(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, {});
|
|
2360
|
+
},
|
|
2361
|
+
isElementInContainer: function (el) { return _this.root.contains(el); },
|
|
2362
|
+
isRtl: function () {
|
|
2363
|
+
return getComputedStyle(_this.root).getPropertyValue('direction') === 'rtl';
|
|
2364
|
+
},
|
|
2365
|
+
setTransformOrigin: function (origin) {
|
|
2366
|
+
var propertyName = util.getCorrectPropertyName(window, 'transform') + "-origin";
|
|
2367
|
+
_this.root.style.setProperty(propertyName, origin);
|
|
2368
|
+
},
|
|
2369
|
+
isFocused: function () { return document.activeElement === _this.root; },
|
|
2370
|
+
saveFocus: function () {
|
|
2371
|
+
_this.previousFocus =
|
|
2372
|
+
document.activeElement;
|
|
2373
|
+
},
|
|
2374
|
+
restoreFocus: function () {
|
|
2375
|
+
if (_this.root.contains(document.activeElement)) {
|
|
2376
|
+
if (_this.previousFocus && _this.previousFocus.focus) {
|
|
2377
|
+
_this.previousFocus.focus();
|
|
2378
|
+
}
|
|
2379
|
+
}
|
|
2380
|
+
},
|
|
2381
|
+
getInnerDimensions: function () {
|
|
2382
|
+
return {
|
|
2383
|
+
width: _this.root.offsetWidth,
|
|
2384
|
+
height: _this.root.offsetHeight
|
|
2385
|
+
};
|
|
2386
|
+
},
|
|
2387
|
+
getAnchorDimensions: function () { return _this.anchorElement ?
|
|
2388
|
+
_this.anchorElement.getBoundingClientRect() :
|
|
2389
|
+
null; },
|
|
2390
|
+
getWindowDimensions: function () {
|
|
2391
|
+
return { width: window.innerWidth, height: window.innerHeight };
|
|
2392
|
+
},
|
|
2393
|
+
getBodyDimensions: function () {
|
|
2394
|
+
return { width: document.body.clientWidth, height: document.body.clientHeight };
|
|
2395
|
+
},
|
|
2396
|
+
getWindowScroll: function () {
|
|
2397
|
+
return { x: window.pageXOffset, y: window.pageYOffset };
|
|
2398
|
+
},
|
|
2399
|
+
setPosition: function (position) {
|
|
2400
|
+
var rootHTML = _this.root;
|
|
2401
|
+
rootHTML.style.left = 'left' in position ? position.left + "px" : '';
|
|
2402
|
+
rootHTML.style.right = 'right' in position ? position.right + "px" : '';
|
|
2403
|
+
rootHTML.style.top = 'top' in position ? position.top + "px" : '';
|
|
2404
|
+
rootHTML.style.bottom =
|
|
2405
|
+
'bottom' in position ? position.bottom + "px" : '';
|
|
2406
|
+
},
|
|
2407
|
+
setMaxHeight: function (height) {
|
|
2408
|
+
_this.root.style.maxHeight = height;
|
|
2409
|
+
},
|
|
2410
|
+
};
|
|
2411
|
+
// tslint:enable:object-literal-sort-keys
|
|
2412
|
+
return new MDCMenuSurfaceFoundation(adapter);
|
|
2413
|
+
};
|
|
2414
|
+
return MDCMenuSurface;
|
|
2415
|
+
}(component.MDCComponent));
|
|
2416
|
+
|
|
1496
2417
|
exports.MDCList = MDCList;
|
|
1497
2418
|
exports.MDCListFoundation = MDCListFoundation;
|
|
2419
|
+
exports.MDCMenuSurface = MDCMenuSurface;
|
|
2420
|
+
exports.MDCMenuSurfaceFoundation = MDCMenuSurfaceFoundation;
|
|
1498
2421
|
exports.cssClasses = cssClasses;
|
|
1499
2422
|
exports.numbers = numbers;
|
|
1500
2423
|
exports.strings = strings;
|
|
1501
2424
|
|
|
1502
|
-
//# sourceMappingURL=component-
|
|
2425
|
+
//# sourceMappingURL=component-66df95e7.js.map
|