@skyux/popovers 6.18.0 → 6.19.0
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/documentation.json +55 -571
- package/esm2020/lib/modules/dropdown/dropdown-menu.component.mjs +3 -1
- package/esm2020/lib/modules/dropdown/dropdown.component.mjs +13 -9
- package/esm2020/lib/modules/dropdown/types/dropdown-button-type.mjs +2 -0
- package/esm2020/lib/modules/dropdown/types/dropdown-horizontal-alignment.mjs +1 -1
- package/esm2020/lib/modules/dropdown/types/dropdown-menu-change.mjs +1 -1
- package/esm2020/lib/modules/dropdown/types/dropdown-message-type.mjs +2 -1
- package/esm2020/lib/modules/dropdown/types/dropdown-message.mjs +1 -1
- package/fesm2015/skyux-popovers.mjs +16 -9
- package/fesm2015/skyux-popovers.mjs.map +1 -1
- package/fesm2020/skyux-popovers.mjs +16 -9
- package/fesm2020/skyux-popovers.mjs.map +1 -1
- package/lib/modules/dropdown/dropdown-menu.component.d.ts +3 -1
- package/lib/modules/dropdown/dropdown.component.d.ts +7 -6
- package/lib/modules/dropdown/types/dropdown-button-type.d.ts +1 -0
- package/lib/modules/dropdown/types/dropdown-horizontal-alignment.d.ts +1 -2
- package/lib/modules/dropdown/types/dropdown-menu-change.d.ts +1 -0
- package/lib/modules/dropdown/types/dropdown-message-type.d.ts +1 -0
- package/lib/modules/dropdown/types/dropdown-message.d.ts +1 -0
- package/package.json +6 -6
package/documentation.json
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
{
|
|
2
2
|
"anchorIds": {
|
|
3
|
-
"SkyDropdownMessageType": "enumeration-skydropdownmessagetype",
|
|
4
3
|
"SkyPopoverMessageType": "enumeration-skypopovermessagetype",
|
|
5
4
|
"SkyDropdownModule": "class-skydropdownmodule",
|
|
6
5
|
"SkyPopoverModule": "class-skypopovermodule",
|
|
@@ -10,8 +9,6 @@
|
|
|
10
9
|
"SkyDropdownMenuComponent": "class-skydropdownmenucomponent",
|
|
11
10
|
"SkyPopoverComponent": "class-skypopovercomponent",
|
|
12
11
|
"SkyPopoverDirective": "class-skypopoverdirective",
|
|
13
|
-
"SkyDropdownMenuChange": "interface-skydropdownmenuchange",
|
|
14
|
-
"SkyDropdownMessage": "interface-skydropdownmessage",
|
|
15
12
|
"SkyPopoverMessage": "interface-skypopovermessage",
|
|
16
13
|
"SkyDropdownHorizontalAlignment": "type-alias-skydropdownhorizontalalignment",
|
|
17
14
|
"SkyDropdownTriggerType": "type-alias-skydropdowntriggertype",
|
|
@@ -28,185 +25,6 @@
|
|
|
28
25
|
"flags": {},
|
|
29
26
|
"originalName": "",
|
|
30
27
|
"children": [
|
|
31
|
-
{
|
|
32
|
-
"id": 343,
|
|
33
|
-
"name": "SkyDropdownMessageType",
|
|
34
|
-
"kind": 8,
|
|
35
|
-
"kindString": "Enumeration",
|
|
36
|
-
"flags": {},
|
|
37
|
-
"comment": {
|
|
38
|
-
"shortText": "Specifies the type of message to send."
|
|
39
|
-
},
|
|
40
|
-
"children": [
|
|
41
|
-
{
|
|
42
|
-
"id": 345,
|
|
43
|
-
"name": "Close",
|
|
44
|
-
"kind": 16,
|
|
45
|
-
"kindString": "Enumeration member",
|
|
46
|
-
"flags": {},
|
|
47
|
-
"comment": {
|
|
48
|
-
"shortText": " Closes the dropdown menu."
|
|
49
|
-
},
|
|
50
|
-
"sources": [
|
|
51
|
-
{
|
|
52
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
53
|
-
"line": 13,
|
|
54
|
-
"character": 2
|
|
55
|
-
}
|
|
56
|
-
],
|
|
57
|
-
"defaultValue": "1"
|
|
58
|
-
},
|
|
59
|
-
{
|
|
60
|
-
"id": 350,
|
|
61
|
-
"name": "FocusFirstItem",
|
|
62
|
-
"kind": 16,
|
|
63
|
-
"kindString": "Enumeration member",
|
|
64
|
-
"flags": {},
|
|
65
|
-
"comment": {
|
|
66
|
-
"shortText": "Puts focus on the first item in the dropdown menu."
|
|
67
|
-
},
|
|
68
|
-
"sources": [
|
|
69
|
-
{
|
|
70
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
71
|
-
"line": 39,
|
|
72
|
-
"character": 2
|
|
73
|
-
}
|
|
74
|
-
],
|
|
75
|
-
"defaultValue": "6"
|
|
76
|
-
},
|
|
77
|
-
{
|
|
78
|
-
"id": 351,
|
|
79
|
-
"name": "FocusLastItem",
|
|
80
|
-
"kind": 16,
|
|
81
|
-
"kindString": "Enumeration member",
|
|
82
|
-
"flags": {},
|
|
83
|
-
"comment": {
|
|
84
|
-
"shortText": "Puts focus on the last item in the dropdown menu."
|
|
85
|
-
},
|
|
86
|
-
"sources": [
|
|
87
|
-
{
|
|
88
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
89
|
-
"line": 44,
|
|
90
|
-
"character": 2
|
|
91
|
-
}
|
|
92
|
-
],
|
|
93
|
-
"defaultValue": "7"
|
|
94
|
-
},
|
|
95
|
-
{
|
|
96
|
-
"id": 347,
|
|
97
|
-
"name": "FocusNextItem",
|
|
98
|
-
"kind": 16,
|
|
99
|
-
"kindString": "Enumeration member",
|
|
100
|
-
"flags": {},
|
|
101
|
-
"comment": {
|
|
102
|
-
"shortText": "Puts focus on the next item in the dropdown menu."
|
|
103
|
-
},
|
|
104
|
-
"sources": [
|
|
105
|
-
{
|
|
106
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
107
|
-
"line": 23,
|
|
108
|
-
"character": 2
|
|
109
|
-
}
|
|
110
|
-
],
|
|
111
|
-
"defaultValue": "3"
|
|
112
|
-
},
|
|
113
|
-
{
|
|
114
|
-
"id": 348,
|
|
115
|
-
"name": "FocusPreviousItem",
|
|
116
|
-
"kind": 16,
|
|
117
|
-
"kindString": "Enumeration member",
|
|
118
|
-
"flags": {},
|
|
119
|
-
"comment": {
|
|
120
|
-
"shortText": "Puts focus on the previous item in the dropdown menu."
|
|
121
|
-
},
|
|
122
|
-
"sources": [
|
|
123
|
-
{
|
|
124
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
125
|
-
"line": 28,
|
|
126
|
-
"character": 2
|
|
127
|
-
}
|
|
128
|
-
],
|
|
129
|
-
"defaultValue": "4"
|
|
130
|
-
},
|
|
131
|
-
{
|
|
132
|
-
"id": 346,
|
|
133
|
-
"name": "FocusTriggerButton",
|
|
134
|
-
"kind": 16,
|
|
135
|
-
"kindString": "Enumeration member",
|
|
136
|
-
"flags": {},
|
|
137
|
-
"comment": {
|
|
138
|
-
"shortText": "Puts focus on the dropdown button."
|
|
139
|
-
},
|
|
140
|
-
"sources": [
|
|
141
|
-
{
|
|
142
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
143
|
-
"line": 18,
|
|
144
|
-
"character": 2
|
|
145
|
-
}
|
|
146
|
-
],
|
|
147
|
-
"defaultValue": "2"
|
|
148
|
-
},
|
|
149
|
-
{
|
|
150
|
-
"id": 344,
|
|
151
|
-
"name": "Open",
|
|
152
|
-
"kind": 16,
|
|
153
|
-
"kindString": "Enumeration member",
|
|
154
|
-
"flags": {},
|
|
155
|
-
"comment": {
|
|
156
|
-
"shortText": "Opens the dropdown menu."
|
|
157
|
-
},
|
|
158
|
-
"sources": [
|
|
159
|
-
{
|
|
160
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
161
|
-
"line": 8,
|
|
162
|
-
"character": 2
|
|
163
|
-
}
|
|
164
|
-
],
|
|
165
|
-
"defaultValue": "0"
|
|
166
|
-
},
|
|
167
|
-
{
|
|
168
|
-
"id": 349,
|
|
169
|
-
"name": "Reposition",
|
|
170
|
-
"kind": 16,
|
|
171
|
-
"kindString": "Enumeration member",
|
|
172
|
-
"flags": {},
|
|
173
|
-
"comment": {
|
|
174
|
-
"shortText": "Repositions the dropdown menu next to the dropdown button. This is useful for when the\ndropdown menu's width and height change while it is open."
|
|
175
|
-
},
|
|
176
|
-
"sources": [
|
|
177
|
-
{
|
|
178
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
179
|
-
"line": 34,
|
|
180
|
-
"character": 2
|
|
181
|
-
}
|
|
182
|
-
],
|
|
183
|
-
"defaultValue": "5"
|
|
184
|
-
}
|
|
185
|
-
],
|
|
186
|
-
"groups": [
|
|
187
|
-
{
|
|
188
|
-
"title": "Enumeration members",
|
|
189
|
-
"kind": 16,
|
|
190
|
-
"children": [
|
|
191
|
-
345,
|
|
192
|
-
350,
|
|
193
|
-
351,
|
|
194
|
-
347,
|
|
195
|
-
348,
|
|
196
|
-
346,
|
|
197
|
-
344,
|
|
198
|
-
349
|
|
199
|
-
]
|
|
200
|
-
}
|
|
201
|
-
],
|
|
202
|
-
"sources": [
|
|
203
|
-
{
|
|
204
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message-type.ts",
|
|
205
|
-
"line": 4,
|
|
206
|
-
"character": 12
|
|
207
|
-
}
|
|
208
|
-
]
|
|
209
|
-
},
|
|
210
28
|
{
|
|
211
29
|
"id": 362,
|
|
212
30
|
"name": "SkyPopoverMessageType",
|
|
@@ -909,7 +727,7 @@
|
|
|
909
727
|
"sources": [
|
|
910
728
|
{
|
|
911
729
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
912
|
-
"line":
|
|
730
|
+
"line": 231,
|
|
913
731
|
"character": 2
|
|
914
732
|
}
|
|
915
733
|
],
|
|
@@ -1001,7 +819,7 @@
|
|
|
1001
819
|
"sources": [
|
|
1002
820
|
{
|
|
1003
821
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1004
|
-
"line":
|
|
822
|
+
"line": 187,
|
|
1005
823
|
"character": 9
|
|
1006
824
|
}
|
|
1007
825
|
],
|
|
@@ -1022,7 +840,7 @@
|
|
|
1022
840
|
"sources": [
|
|
1023
841
|
{
|
|
1024
842
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1025
|
-
"line":
|
|
843
|
+
"line": 189,
|
|
1026
844
|
"character": 9
|
|
1027
845
|
}
|
|
1028
846
|
],
|
|
@@ -1058,7 +876,7 @@
|
|
|
1058
876
|
"sources": [
|
|
1059
877
|
{
|
|
1060
878
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1061
|
-
"line":
|
|
879
|
+
"line": 112,
|
|
1062
880
|
"character": 9
|
|
1063
881
|
}
|
|
1064
882
|
],
|
|
@@ -1078,7 +896,7 @@
|
|
|
1078
896
|
"sources": [
|
|
1079
897
|
{
|
|
1080
898
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1081
|
-
"line":
|
|
899
|
+
"line": 193,
|
|
1082
900
|
"character": 9
|
|
1083
901
|
}
|
|
1084
902
|
],
|
|
@@ -1098,7 +916,7 @@
|
|
|
1098
916
|
"sources": [
|
|
1099
917
|
{
|
|
1100
918
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1101
|
-
"line":
|
|
919
|
+
"line": 191,
|
|
1102
920
|
"character": 9
|
|
1103
921
|
}
|
|
1104
922
|
],
|
|
@@ -1107,51 +925,6 @@
|
|
|
1107
925
|
"name": "string"
|
|
1108
926
|
}
|
|
1109
927
|
},
|
|
1110
|
-
{
|
|
1111
|
-
"id": 59,
|
|
1112
|
-
"name": "messageStream",
|
|
1113
|
-
"kind": 1024,
|
|
1114
|
-
"kindString": "Property",
|
|
1115
|
-
"flags": {
|
|
1116
|
-
"isPublic": true
|
|
1117
|
-
},
|
|
1118
|
-
"comment": {
|
|
1119
|
-
"shortText": "Provides an observable to send commands to the dropdown. The commands should respect\nthe [[SkyDropdownMessage]] type."
|
|
1120
|
-
},
|
|
1121
|
-
"decorators": [
|
|
1122
|
-
{
|
|
1123
|
-
"name": "Input",
|
|
1124
|
-
"type": {
|
|
1125
|
-
"type": "reference",
|
|
1126
|
-
"qualifiedName": "InputDecorator",
|
|
1127
|
-
"package": "@angular/core",
|
|
1128
|
-
"name": "Input"
|
|
1129
|
-
},
|
|
1130
|
-
"arguments": {}
|
|
1131
|
-
}
|
|
1132
|
-
],
|
|
1133
|
-
"sources": [
|
|
1134
|
-
{
|
|
1135
|
-
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1136
|
-
"line": 131,
|
|
1137
|
-
"character": 9
|
|
1138
|
-
}
|
|
1139
|
-
],
|
|
1140
|
-
"type": {
|
|
1141
|
-
"type": "reference",
|
|
1142
|
-
"typeArguments": [
|
|
1143
|
-
{
|
|
1144
|
-
"type": "reference",
|
|
1145
|
-
"id": 341,
|
|
1146
|
-
"name": "SkyDropdownMessage"
|
|
1147
|
-
}
|
|
1148
|
-
],
|
|
1149
|
-
"qualifiedName": "Subject",
|
|
1150
|
-
"package": "rxjs",
|
|
1151
|
-
"name": "Subject"
|
|
1152
|
-
},
|
|
1153
|
-
"defaultValue": "..."
|
|
1154
|
-
},
|
|
1155
928
|
{
|
|
1156
929
|
"id": 60,
|
|
1157
930
|
"name": "title",
|
|
@@ -1178,7 +951,7 @@
|
|
|
1178
951
|
"sources": [
|
|
1179
952
|
{
|
|
1180
953
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1181
|
-
"line":
|
|
954
|
+
"line": 141,
|
|
1182
955
|
"character": 9
|
|
1183
956
|
}
|
|
1184
957
|
],
|
|
@@ -1210,7 +983,7 @@
|
|
|
1210
983
|
"sources": [
|
|
1211
984
|
{
|
|
1212
985
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1213
|
-
"line":
|
|
986
|
+
"line": 51,
|
|
1214
987
|
"character": 13
|
|
1215
988
|
}
|
|
1216
989
|
],
|
|
@@ -1295,7 +1068,7 @@
|
|
|
1295
1068
|
"sources": [
|
|
1296
1069
|
{
|
|
1297
1070
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1298
|
-
"line":
|
|
1071
|
+
"line": 69,
|
|
1299
1072
|
"character": 13
|
|
1300
1073
|
}
|
|
1301
1074
|
],
|
|
@@ -1307,7 +1080,7 @@
|
|
|
1307
1080
|
"kindString": "Get signature",
|
|
1308
1081
|
"flags": {},
|
|
1309
1082
|
"comment": {
|
|
1310
|
-
"shortText": "Specifies the type of button to render as the dropdown's trigger element. To display a button\nwith text and a caret, specify `select` and then enter the button text in a\n`sky-dropdown-button` element. To display a round button with an ellipsis, specify\n`context-menu`. And to display a button with a [Font Awesome icon](http://fontawesome.io/icons/), specify the icon's class name.\nFor example, to display the `fa-filter` icon, specify `filter`.",
|
|
1083
|
+
"shortText": "Specifies the type of button to render as the dropdown's trigger element. To display a button\nwith text and a caret, specify `'select'` and then enter the button text in a\n`sky-dropdown-button` element. To display a round button with an ellipsis, specify\n`'context-menu'`. And to display a button with a [Font Awesome icon](http://fontawesome.io/icons/), specify the icon's class name.\nFor example, to display the `'fa-filter'` icon, specify `'filter'`.",
|
|
1311
1084
|
"tags": [
|
|
1312
1085
|
{
|
|
1313
1086
|
"tag": "default",
|
|
@@ -1329,7 +1102,7 @@
|
|
|
1329
1102
|
"kindString": "Set signature",
|
|
1330
1103
|
"flags": {},
|
|
1331
1104
|
"comment": {
|
|
1332
|
-
"shortText": "Specifies the type of button to render as the dropdown's trigger element. To display a button\nwith text and a caret, specify `select` and then enter the button text in a\n`sky-dropdown-button` element. To display a round button with an ellipsis, specify\n`context-menu`. And to display a button with a [Font Awesome icon](http://fontawesome.io/icons/), specify the icon's class name.\nFor example, to display the `fa-filter` icon, specify `filter`.",
|
|
1105
|
+
"shortText": "Specifies the type of button to render as the dropdown's trigger element. To display a button\nwith text and a caret, specify `'select'` and then enter the button text in a\n`sky-dropdown-button` element. To display a round button with an ellipsis, specify\n`'context-menu'`. And to display a button with a [Font Awesome icon](http://fontawesome.io/icons/), specify the icon's class name.\nFor example, to display the `'fa-filter'` icon, specify `'filter'`.",
|
|
1333
1106
|
"tags": [
|
|
1334
1107
|
{
|
|
1335
1108
|
"tag": "default",
|
|
@@ -1380,7 +1153,7 @@
|
|
|
1380
1153
|
"sources": [
|
|
1381
1154
|
{
|
|
1382
1155
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1383
|
-
"line":
|
|
1156
|
+
"line": 82,
|
|
1384
1157
|
"character": 13
|
|
1385
1158
|
}
|
|
1386
1159
|
],
|
|
@@ -1465,7 +1238,7 @@
|
|
|
1465
1238
|
"sources": [
|
|
1466
1239
|
{
|
|
1467
1240
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1468
|
-
"line":
|
|
1241
|
+
"line": 95,
|
|
1469
1242
|
"character": 13
|
|
1470
1243
|
}
|
|
1471
1244
|
],
|
|
@@ -1550,7 +1323,7 @@
|
|
|
1550
1323
|
"sources": [
|
|
1551
1324
|
{
|
|
1552
1325
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1553
|
-
"line":
|
|
1326
|
+
"line": 119,
|
|
1554
1327
|
"character": 13
|
|
1555
1328
|
}
|
|
1556
1329
|
],
|
|
@@ -1572,7 +1345,8 @@
|
|
|
1572
1345
|
},
|
|
1573
1346
|
"type": {
|
|
1574
1347
|
"type": "reference",
|
|
1575
|
-
"
|
|
1348
|
+
"id": 336,
|
|
1349
|
+
"name": "SkyDropdownHorizontalAlignment"
|
|
1576
1350
|
}
|
|
1577
1351
|
}
|
|
1578
1352
|
],
|
|
@@ -1601,7 +1375,8 @@
|
|
|
1601
1375
|
"flags": {},
|
|
1602
1376
|
"type": {
|
|
1603
1377
|
"type": "reference",
|
|
1604
|
-
"
|
|
1378
|
+
"id": 336,
|
|
1379
|
+
"name": "SkyDropdownHorizontalAlignment"
|
|
1605
1380
|
}
|
|
1606
1381
|
}
|
|
1607
1382
|
],
|
|
@@ -1623,7 +1398,7 @@
|
|
|
1623
1398
|
"sources": [
|
|
1624
1399
|
{
|
|
1625
1400
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1626
|
-
"line":
|
|
1401
|
+
"line": 162,
|
|
1627
1402
|
"character": 13
|
|
1628
1403
|
}
|
|
1629
1404
|
],
|
|
@@ -1693,7 +1468,7 @@
|
|
|
1693
1468
|
"sources": [
|
|
1694
1469
|
{
|
|
1695
1470
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1696
|
-
"line":
|
|
1471
|
+
"line": 174,
|
|
1697
1472
|
"character": 13
|
|
1698
1473
|
}
|
|
1699
1474
|
],
|
|
@@ -1776,7 +1551,7 @@
|
|
|
1776
1551
|
"sources": [
|
|
1777
1552
|
{
|
|
1778
1553
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1779
|
-
"line":
|
|
1554
|
+
"line": 154,
|
|
1780
1555
|
"character": 13
|
|
1781
1556
|
}
|
|
1782
1557
|
],
|
|
@@ -1792,7 +1567,7 @@
|
|
|
1792
1567
|
"tags": [
|
|
1793
1568
|
{
|
|
1794
1569
|
"tag": "deprecated",
|
|
1795
|
-
"text": "We recommend against using this property. If you choose to use the deprecated\n`hover` value anyway, we recommend that you not use it in combination with the `title`\nproperty.
|
|
1570
|
+
"text": "We recommend against using this property. If you choose to use the deprecated\n`hover` value anyway, we recommend that you not use it in combination with the `title`\nproperty."
|
|
1796
1571
|
},
|
|
1797
1572
|
{
|
|
1798
1573
|
"tag": "default",
|
|
@@ -1819,7 +1594,7 @@
|
|
|
1819
1594
|
"tags": [
|
|
1820
1595
|
{
|
|
1821
1596
|
"tag": "deprecated",
|
|
1822
|
-
"text": "We recommend against using this property. If you choose to use the deprecated\n`hover` value anyway, we recommend that you not use it in combination with the `title`\nproperty.
|
|
1597
|
+
"text": "We recommend against using this property. If you choose to use the deprecated\n`hover` value anyway, we recommend that you not use it in combination with the `title`\nproperty."
|
|
1823
1598
|
},
|
|
1824
1599
|
{
|
|
1825
1600
|
"tag": "default",
|
|
@@ -1859,7 +1634,7 @@
|
|
|
1859
1634
|
"sources": [
|
|
1860
1635
|
{
|
|
1861
1636
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1862
|
-
"line":
|
|
1637
|
+
"line": 255,
|
|
1863
1638
|
"character": 9
|
|
1864
1639
|
}
|
|
1865
1640
|
],
|
|
@@ -1896,7 +1671,7 @@
|
|
|
1896
1671
|
"sources": [
|
|
1897
1672
|
{
|
|
1898
1673
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1899
|
-
"line":
|
|
1674
|
+
"line": 238,
|
|
1900
1675
|
"character": 9
|
|
1901
1676
|
}
|
|
1902
1677
|
],
|
|
@@ -1940,7 +1715,6 @@
|
|
|
1940
1715
|
54,
|
|
1941
1716
|
76,
|
|
1942
1717
|
75,
|
|
1943
|
-
59,
|
|
1944
1718
|
60
|
|
1945
1719
|
]
|
|
1946
1720
|
},
|
|
@@ -1970,7 +1744,7 @@
|
|
|
1970
1744
|
"sources": [
|
|
1971
1745
|
{
|
|
1972
1746
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown.component.ts",
|
|
1973
|
-
"line":
|
|
1747
|
+
"line": 43,
|
|
1974
1748
|
"character": 13
|
|
1975
1749
|
}
|
|
1976
1750
|
],
|
|
@@ -2022,7 +1796,7 @@
|
|
|
2022
1796
|
"sources": [
|
|
2023
1797
|
{
|
|
2024
1798
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2025
|
-
"line":
|
|
1799
|
+
"line": 129,
|
|
2026
1800
|
"character": 2
|
|
2027
1801
|
}
|
|
2028
1802
|
],
|
|
@@ -2108,7 +1882,7 @@
|
|
|
2108
1882
|
"isPublic": true
|
|
2109
1883
|
},
|
|
2110
1884
|
"comment": {
|
|
2111
|
-
"shortText": "Specifies the HTML element ID
|
|
1885
|
+
"shortText": "Specifies the HTML element ID of the element that labels\nthe dropdown menu. This sets the dropdown menu's `aria-labelledby` attribute\n[to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility)."
|
|
2112
1886
|
},
|
|
2113
1887
|
"decorators": [
|
|
2114
1888
|
{
|
|
@@ -2145,7 +1919,7 @@
|
|
|
2145
1919
|
"sources": [
|
|
2146
1920
|
{
|
|
2147
1921
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2148
|
-
"line":
|
|
1922
|
+
"line": 95,
|
|
2149
1923
|
"character": 9
|
|
2150
1924
|
}
|
|
2151
1925
|
],
|
|
@@ -2155,51 +1929,6 @@
|
|
|
2155
1929
|
},
|
|
2156
1930
|
"defaultValue": "..."
|
|
2157
1931
|
},
|
|
2158
|
-
{
|
|
2159
|
-
"id": 129,
|
|
2160
|
-
"name": "menuChanges",
|
|
2161
|
-
"kind": 1024,
|
|
2162
|
-
"kindString": "Property",
|
|
2163
|
-
"flags": {
|
|
2164
|
-
"isPublic": true
|
|
2165
|
-
},
|
|
2166
|
-
"comment": {
|
|
2167
|
-
"shortText": "Fires when the dropdown menu's active index or selected item changes. This event provides an\nobservable to emit changes, and the response is of\nthe SkyDropdownMenuChange type."
|
|
2168
|
-
},
|
|
2169
|
-
"decorators": [
|
|
2170
|
-
{
|
|
2171
|
-
"name": "Output",
|
|
2172
|
-
"type": {
|
|
2173
|
-
"type": "reference",
|
|
2174
|
-
"qualifiedName": "OutputDecorator",
|
|
2175
|
-
"package": "@angular/core",
|
|
2176
|
-
"name": "Output"
|
|
2177
|
-
},
|
|
2178
|
-
"arguments": {}
|
|
2179
|
-
}
|
|
2180
|
-
],
|
|
2181
|
-
"sources": [
|
|
2182
|
-
{
|
|
2183
|
-
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2184
|
-
"line": 91,
|
|
2185
|
-
"character": 9
|
|
2186
|
-
}
|
|
2187
|
-
],
|
|
2188
|
-
"type": {
|
|
2189
|
-
"type": "reference",
|
|
2190
|
-
"typeArguments": [
|
|
2191
|
-
{
|
|
2192
|
-
"type": "reference",
|
|
2193
|
-
"id": 337,
|
|
2194
|
-
"name": "SkyDropdownMenuChange"
|
|
2195
|
-
}
|
|
2196
|
-
],
|
|
2197
|
-
"qualifiedName": "EventEmitter",
|
|
2198
|
-
"package": "@angular/core",
|
|
2199
|
-
"name": "EventEmitter"
|
|
2200
|
-
},
|
|
2201
|
-
"defaultValue": "..."
|
|
2202
|
-
},
|
|
2203
1932
|
{
|
|
2204
1933
|
"id": 137,
|
|
2205
1934
|
"name": "menuItems",
|
|
@@ -2226,7 +1955,7 @@
|
|
|
2226
1955
|
"sources": [
|
|
2227
1956
|
{
|
|
2228
1957
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2229
|
-
"line":
|
|
1958
|
+
"line": 119,
|
|
2230
1959
|
"character": 9
|
|
2231
1960
|
}
|
|
2232
1961
|
],
|
|
@@ -2340,7 +2069,7 @@
|
|
|
2340
2069
|
"sources": [
|
|
2341
2070
|
{
|
|
2342
2071
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2343
|
-
"line":
|
|
2072
|
+
"line": 102,
|
|
2344
2073
|
"character": 13
|
|
2345
2074
|
}
|
|
2346
2075
|
],
|
|
@@ -2384,91 +2113,6 @@
|
|
|
2384
2113
|
}
|
|
2385
2114
|
]
|
|
2386
2115
|
},
|
|
2387
|
-
{
|
|
2388
|
-
"id": 125,
|
|
2389
|
-
"name": "useNativeFocus",
|
|
2390
|
-
"kind": 262144,
|
|
2391
|
-
"kindString": "Accessor",
|
|
2392
|
-
"flags": {
|
|
2393
|
-
"isPublic": true
|
|
2394
|
-
},
|
|
2395
|
-
"decorators": [
|
|
2396
|
-
{
|
|
2397
|
-
"name": "Input",
|
|
2398
|
-
"type": {
|
|
2399
|
-
"type": "reference",
|
|
2400
|
-
"qualifiedName": "InputDecorator",
|
|
2401
|
-
"package": "@angular/core",
|
|
2402
|
-
"name": "Input"
|
|
2403
|
-
},
|
|
2404
|
-
"arguments": {}
|
|
2405
|
-
}
|
|
2406
|
-
],
|
|
2407
|
-
"sources": [
|
|
2408
|
-
{
|
|
2409
|
-
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2410
|
-
"line": 73,
|
|
2411
|
-
"character": 13
|
|
2412
|
-
}
|
|
2413
|
-
],
|
|
2414
|
-
"getSignature": [
|
|
2415
|
-
{
|
|
2416
|
-
"id": 126,
|
|
2417
|
-
"name": "useNativeFocus",
|
|
2418
|
-
"kind": 524288,
|
|
2419
|
-
"kindString": "Get signature",
|
|
2420
|
-
"flags": {},
|
|
2421
|
-
"comment": {
|
|
2422
|
-
"shortText": "Indicates whether to use the browser's native focus function when users navigate through menu\nitems with the keyboard. To disable the native focus function, set this property to `false`.\nFor example, to let users interact with the dropdown menu but keep the keyboard focus on a\ndifferent element, set this property to `false`.",
|
|
2423
|
-
"tags": [
|
|
2424
|
-
{
|
|
2425
|
-
"tag": "default",
|
|
2426
|
-
"text": "true\n"
|
|
2427
|
-
}
|
|
2428
|
-
]
|
|
2429
|
-
},
|
|
2430
|
-
"type": {
|
|
2431
|
-
"type": "intrinsic",
|
|
2432
|
-
"name": "boolean"
|
|
2433
|
-
}
|
|
2434
|
-
}
|
|
2435
|
-
],
|
|
2436
|
-
"setSignature": [
|
|
2437
|
-
{
|
|
2438
|
-
"id": 127,
|
|
2439
|
-
"name": "useNativeFocus",
|
|
2440
|
-
"kind": 1048576,
|
|
2441
|
-
"kindString": "Set signature",
|
|
2442
|
-
"flags": {},
|
|
2443
|
-
"comment": {
|
|
2444
|
-
"shortText": "Indicates whether to use the browser's native focus function when users navigate through menu\nitems with the keyboard. To disable the native focus function, set this property to `false`.\nFor example, to let users interact with the dropdown menu but keep the keyboard focus on a\ndifferent element, set this property to `false`.",
|
|
2445
|
-
"tags": [
|
|
2446
|
-
{
|
|
2447
|
-
"tag": "default",
|
|
2448
|
-
"text": "true\n"
|
|
2449
|
-
}
|
|
2450
|
-
]
|
|
2451
|
-
},
|
|
2452
|
-
"parameters": [
|
|
2453
|
-
{
|
|
2454
|
-
"id": 128,
|
|
2455
|
-
"name": "value",
|
|
2456
|
-
"kind": 32768,
|
|
2457
|
-
"kindString": "Parameter",
|
|
2458
|
-
"flags": {},
|
|
2459
|
-
"type": {
|
|
2460
|
-
"type": "intrinsic",
|
|
2461
|
-
"name": "boolean"
|
|
2462
|
-
}
|
|
2463
|
-
}
|
|
2464
|
-
],
|
|
2465
|
-
"type": {
|
|
2466
|
-
"type": "intrinsic",
|
|
2467
|
-
"name": "void"
|
|
2468
|
-
}
|
|
2469
|
-
}
|
|
2470
|
-
]
|
|
2471
|
-
},
|
|
2472
2116
|
{
|
|
2473
2117
|
"id": 146,
|
|
2474
2118
|
"name": "focusFirstItem",
|
|
@@ -2480,7 +2124,7 @@
|
|
|
2480
2124
|
"sources": [
|
|
2481
2125
|
{
|
|
2482
2126
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2483
|
-
"line":
|
|
2127
|
+
"line": 202,
|
|
2484
2128
|
"character": 9
|
|
2485
2129
|
}
|
|
2486
2130
|
],
|
|
@@ -2509,7 +2153,7 @@
|
|
|
2509
2153
|
"sources": [
|
|
2510
2154
|
{
|
|
2511
2155
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2512
|
-
"line":
|
|
2156
|
+
"line": 217,
|
|
2513
2157
|
"character": 9
|
|
2514
2158
|
}
|
|
2515
2159
|
],
|
|
@@ -2538,7 +2182,7 @@
|
|
|
2538
2182
|
"sources": [
|
|
2539
2183
|
{
|
|
2540
2184
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2541
|
-
"line":
|
|
2185
|
+
"line": 247,
|
|
2542
2186
|
"character": 9
|
|
2543
2187
|
}
|
|
2544
2188
|
],
|
|
@@ -2567,7 +2211,7 @@
|
|
|
2567
2211
|
"sources": [
|
|
2568
2212
|
{
|
|
2569
2213
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2570
|
-
"line":
|
|
2214
|
+
"line": 232,
|
|
2571
2215
|
"character": 9
|
|
2572
2216
|
}
|
|
2573
2217
|
],
|
|
@@ -2596,7 +2240,7 @@
|
|
|
2596
2240
|
"sources": [
|
|
2597
2241
|
{
|
|
2598
2242
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2599
|
-
"line":
|
|
2243
|
+
"line": 135,
|
|
2600
2244
|
"character": 9
|
|
2601
2245
|
}
|
|
2602
2246
|
],
|
|
@@ -2633,7 +2277,7 @@
|
|
|
2633
2277
|
"sources": [
|
|
2634
2278
|
{
|
|
2635
2279
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2636
|
-
"line":
|
|
2280
|
+
"line": 197,
|
|
2637
2281
|
"character": 9
|
|
2638
2282
|
}
|
|
2639
2283
|
],
|
|
@@ -2670,7 +2314,7 @@
|
|
|
2670
2314
|
"sources": [
|
|
2671
2315
|
{
|
|
2672
2316
|
"fileName": "projects/popovers/src/modules/dropdown/dropdown-menu.component.ts",
|
|
2673
|
-
"line":
|
|
2317
|
+
"line": 262,
|
|
2674
2318
|
"character": 9
|
|
2675
2319
|
}
|
|
2676
2320
|
],
|
|
@@ -2703,7 +2347,6 @@
|
|
|
2703
2347
|
"children": [
|
|
2704
2348
|
120,
|
|
2705
2349
|
130,
|
|
2706
|
-
129,
|
|
2707
2350
|
137
|
|
2708
2351
|
]
|
|
2709
2352
|
},
|
|
@@ -2712,8 +2355,7 @@
|
|
|
2712
2355
|
"kind": 262144,
|
|
2713
2356
|
"children": [
|
|
2714
2357
|
121,
|
|
2715
|
-
133
|
|
2716
|
-
125
|
|
2358
|
+
133
|
|
2717
2359
|
]
|
|
2718
2360
|
},
|
|
2719
2361
|
{
|
|
@@ -3907,162 +3549,6 @@
|
|
|
3907
3549
|
}
|
|
3908
3550
|
]
|
|
3909
3551
|
},
|
|
3910
|
-
{
|
|
3911
|
-
"id": 337,
|
|
3912
|
-
"name": "SkyDropdownMenuChange",
|
|
3913
|
-
"kind": 256,
|
|
3914
|
-
"kindString": "Interface",
|
|
3915
|
-
"flags": {},
|
|
3916
|
-
"comment": {
|
|
3917
|
-
"shortText": "Specifies menu items, including the selected one."
|
|
3918
|
-
},
|
|
3919
|
-
"children": [
|
|
3920
|
-
{
|
|
3921
|
-
"id": 338,
|
|
3922
|
-
"name": "activeIndex",
|
|
3923
|
-
"kind": 1024,
|
|
3924
|
-
"kindString": "Property",
|
|
3925
|
-
"flags": {
|
|
3926
|
-
"isOptional": true
|
|
3927
|
-
},
|
|
3928
|
-
"comment": {
|
|
3929
|
-
"shortText": "Indicates the active menu index."
|
|
3930
|
-
},
|
|
3931
|
-
"sources": [
|
|
3932
|
-
{
|
|
3933
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-menu-change.ts",
|
|
3934
|
-
"line": 10,
|
|
3935
|
-
"character": 2
|
|
3936
|
-
}
|
|
3937
|
-
],
|
|
3938
|
-
"type": {
|
|
3939
|
-
"type": "intrinsic",
|
|
3940
|
-
"name": "number"
|
|
3941
|
-
}
|
|
3942
|
-
},
|
|
3943
|
-
{
|
|
3944
|
-
"id": 339,
|
|
3945
|
-
"name": "items",
|
|
3946
|
-
"kind": 1024,
|
|
3947
|
-
"kindString": "Property",
|
|
3948
|
-
"flags": {
|
|
3949
|
-
"isOptional": true
|
|
3950
|
-
},
|
|
3951
|
-
"comment": {
|
|
3952
|
-
"shortText": "Indicates the items in the menu."
|
|
3953
|
-
},
|
|
3954
|
-
"sources": [
|
|
3955
|
-
{
|
|
3956
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-menu-change.ts",
|
|
3957
|
-
"line": 15,
|
|
3958
|
-
"character": 2
|
|
3959
|
-
}
|
|
3960
|
-
],
|
|
3961
|
-
"type": {
|
|
3962
|
-
"type": "array",
|
|
3963
|
-
"elementType": {
|
|
3964
|
-
"type": "reference",
|
|
3965
|
-
"id": 3,
|
|
3966
|
-
"name": "SkyDropdownItemComponent"
|
|
3967
|
-
}
|
|
3968
|
-
}
|
|
3969
|
-
},
|
|
3970
|
-
{
|
|
3971
|
-
"id": 340,
|
|
3972
|
-
"name": "selectedItem",
|
|
3973
|
-
"kind": 1024,
|
|
3974
|
-
"kindString": "Property",
|
|
3975
|
-
"flags": {
|
|
3976
|
-
"isOptional": true
|
|
3977
|
-
},
|
|
3978
|
-
"comment": {
|
|
3979
|
-
"shortText": "Indicates the selected item in the menu."
|
|
3980
|
-
},
|
|
3981
|
-
"sources": [
|
|
3982
|
-
{
|
|
3983
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-menu-change.ts",
|
|
3984
|
-
"line": 20,
|
|
3985
|
-
"character": 2
|
|
3986
|
-
}
|
|
3987
|
-
],
|
|
3988
|
-
"type": {
|
|
3989
|
-
"type": "reference",
|
|
3990
|
-
"id": 3,
|
|
3991
|
-
"name": "SkyDropdownItemComponent"
|
|
3992
|
-
}
|
|
3993
|
-
}
|
|
3994
|
-
],
|
|
3995
|
-
"groups": [
|
|
3996
|
-
{
|
|
3997
|
-
"title": "Properties",
|
|
3998
|
-
"kind": 1024,
|
|
3999
|
-
"children": [
|
|
4000
|
-
338,
|
|
4001
|
-
339,
|
|
4002
|
-
340
|
|
4003
|
-
]
|
|
4004
|
-
}
|
|
4005
|
-
],
|
|
4006
|
-
"sources": [
|
|
4007
|
-
{
|
|
4008
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-menu-change.ts",
|
|
4009
|
-
"line": 6,
|
|
4010
|
-
"character": 17
|
|
4011
|
-
}
|
|
4012
|
-
]
|
|
4013
|
-
},
|
|
4014
|
-
{
|
|
4015
|
-
"id": 341,
|
|
4016
|
-
"name": "SkyDropdownMessage",
|
|
4017
|
-
"kind": 256,
|
|
4018
|
-
"kindString": "Interface",
|
|
4019
|
-
"flags": {},
|
|
4020
|
-
"comment": {
|
|
4021
|
-
"shortText": "Specifies the type of message to send to the dropdown component."
|
|
4022
|
-
},
|
|
4023
|
-
"children": [
|
|
4024
|
-
{
|
|
4025
|
-
"id": 342,
|
|
4026
|
-
"name": "type",
|
|
4027
|
-
"kind": 1024,
|
|
4028
|
-
"kindString": "Property",
|
|
4029
|
-
"flags": {
|
|
4030
|
-
"isOptional": true
|
|
4031
|
-
},
|
|
4032
|
-
"comment": {
|
|
4033
|
-
"shortText": "Indicates the type of message to send."
|
|
4034
|
-
},
|
|
4035
|
-
"sources": [
|
|
4036
|
-
{
|
|
4037
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message.ts",
|
|
4038
|
-
"line": 10,
|
|
4039
|
-
"character": 2
|
|
4040
|
-
}
|
|
4041
|
-
],
|
|
4042
|
-
"type": {
|
|
4043
|
-
"type": "reference",
|
|
4044
|
-
"id": 343,
|
|
4045
|
-
"name": "SkyDropdownMessageType"
|
|
4046
|
-
}
|
|
4047
|
-
}
|
|
4048
|
-
],
|
|
4049
|
-
"groups": [
|
|
4050
|
-
{
|
|
4051
|
-
"title": "Properties",
|
|
4052
|
-
"kind": 1024,
|
|
4053
|
-
"children": [
|
|
4054
|
-
342
|
|
4055
|
-
]
|
|
4056
|
-
}
|
|
4057
|
-
],
|
|
4058
|
-
"sources": [
|
|
4059
|
-
{
|
|
4060
|
-
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-message.ts",
|
|
4061
|
-
"line": 6,
|
|
4062
|
-
"character": 17
|
|
4063
|
-
}
|
|
4064
|
-
]
|
|
4065
|
-
},
|
|
4066
3552
|
{
|
|
4067
3553
|
"id": 360,
|
|
4068
3554
|
"name": "SkyPopoverMessage",
|
|
@@ -4127,13 +3613,26 @@
|
|
|
4127
3613
|
"sources": [
|
|
4128
3614
|
{
|
|
4129
3615
|
"fileName": "projects/popovers/src/modules/dropdown/types/dropdown-horizontal-alignment.ts",
|
|
4130
|
-
"line":
|
|
3616
|
+
"line": 4,
|
|
4131
3617
|
"character": 12
|
|
4132
3618
|
}
|
|
4133
3619
|
],
|
|
4134
3620
|
"type": {
|
|
4135
|
-
"type": "
|
|
4136
|
-
"
|
|
3621
|
+
"type": "union",
|
|
3622
|
+
"types": [
|
|
3623
|
+
{
|
|
3624
|
+
"type": "literal",
|
|
3625
|
+
"value": "left"
|
|
3626
|
+
},
|
|
3627
|
+
{
|
|
3628
|
+
"type": "literal",
|
|
3629
|
+
"value": "center"
|
|
3630
|
+
},
|
|
3631
|
+
{
|
|
3632
|
+
"type": "literal",
|
|
3633
|
+
"value": "right"
|
|
3634
|
+
}
|
|
3635
|
+
]
|
|
4137
3636
|
}
|
|
4138
3637
|
},
|
|
4139
3638
|
{
|
|
@@ -4369,21 +3868,6 @@
|
|
|
4369
3868
|
"filePath": "/projects/popovers/documentation/code-examples/dropdown/basic/dropdown-demo.module.ts",
|
|
4370
3869
|
"rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyDropdownModule } from '@skyux/popovers';\n\nimport { DropdownDemoComponent } from './dropdown-demo.component';\n\n@NgModule({\n imports: [CommonModule, SkyDropdownModule],\n exports: [DropdownDemoComponent],\n declarations: [DropdownDemoComponent],\n})\nexport class DropdownDemoModule {}\n"
|
|
4371
3870
|
},
|
|
4372
|
-
{
|
|
4373
|
-
"fileName": "dropdown-demo.component.html",
|
|
4374
|
-
"filePath": "/projects/popovers/documentation/code-examples/dropdown/remote/dropdown-demo.component.html",
|
|
4375
|
-
"rawContents": "<p>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"openDropdown()\"\n >\n Open dropdown\n </button>\n\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"closeDropdown()\"\n >\n Close dropdown\n </button>\n\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"focusTriggerButton()\"\n >\n Focus trigger button\n </button>\n\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"focusNextItem()\"\n >\n Focus next item\n </button>\n\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"focusPreviousItem()\"\n >\n Focus previous item\n </button>\n\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"removeItem()\"\n >\n Remove last item\n </button>\n</p>\n\n<sky-dropdown\n buttonStyle=\"primary\"\n [dismissOnBlur]=\"false\"\n [messageStream]=\"dropdownController\"\n>\n <sky-dropdown-button> Open </sky-dropdown-button>\n <sky-dropdown-menu\n [useNativeFocus]=\"false\"\n (menuChanges)=\"onMenuChanges($event)\"\n >\n <sky-dropdown-item *ngFor=\"let item of items\">\n <button\n type=\"button\"\n [attr.disabled]=\"item.disabled ? '' : null\"\n (click)=\"actionClicked(item.name)\"\n >\n {{ item.name }}\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n</sky-dropdown>\n\n<p>\n This menu does not bring the active items to focus; this is useful for custom\n implementations where the focus should remain on a different control.\n</p>\n"
|
|
4376
|
-
},
|
|
4377
|
-
{
|
|
4378
|
-
"fileName": "dropdown-demo.component.ts",
|
|
4379
|
-
"filePath": "/projects/popovers/documentation/code-examples/dropdown/remote/dropdown-demo.component.ts",
|
|
4380
|
-
"rawContents": "import { ChangeDetectorRef, Component } from '@angular/core';\nimport {\n SkyDropdownMenuChange,\n SkyDropdownMessage,\n SkyDropdownMessageType,\n} from '@skyux/popovers';\n\nimport { Subject } from 'rxjs';\n\n@Component({\n selector: 'app-dropdown-demo',\n templateUrl: './dropdown-demo.component.html',\n})\nexport class DropdownDemoComponent {\n public dropdownController = new Subject<SkyDropdownMessage>();\n\n public items: any[] = [\n { name: 'Option 1', disabled: false },\n { name: 'Disabled option', disabled: true },\n { name: 'Option 3', disabled: false },\n { name: 'Option 4', disabled: false },\n { name: 'Option 5', disabled: false },\n ];\n\n constructor(private changeDetector: ChangeDetectorRef) {}\n\n public actionClicked(action: string): void {\n alert(`You selected ${action}.`);\n }\n\n public openDropdown(): void {\n this.sendMessage(SkyDropdownMessageType.Open);\n }\n\n public closeDropdown(): void {\n this.sendMessage(SkyDropdownMessageType.Close);\n }\n\n public focusTriggerButton(): void {\n this.sendMessage(SkyDropdownMessageType.FocusTriggerButton);\n }\n\n public focusNextItem(): void {\n this.sendMessage(SkyDropdownMessageType.FocusNextItem);\n }\n\n public focusPreviousItem(): void {\n this.sendMessage(SkyDropdownMessageType.FocusPreviousItem);\n }\n\n public removeItem(): void {\n if (this.items.length > 1) {\n this.items.pop();\n this.changeDetector.detectChanges();\n }\n }\n\n public onMenuChanges(change: SkyDropdownMenuChange): void {\n if (change.activeIndex !== undefined) {\n console.log(`The menu's active index changed to: ${change.activeIndex}.`);\n }\n }\n\n private sendMessage(type: SkyDropdownMessageType): void {\n const message: SkyDropdownMessage = { type };\n this.dropdownController.next(message);\n }\n}\n"
|
|
4381
|
-
},
|
|
4382
|
-
{
|
|
4383
|
-
"fileName": "dropdown-demo.module.ts",
|
|
4384
|
-
"filePath": "/projects/popovers/documentation/code-examples/dropdown/remote/dropdown-demo.module.ts",
|
|
4385
|
-
"rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyDropdownModule } from '@skyux/popovers';\n\nimport { DropdownDemoComponent } from './dropdown-demo.component';\n\n@NgModule({\n imports: [CommonModule, SkyDropdownModule],\n exports: [DropdownDemoComponent],\n declarations: [DropdownDemoComponent],\n})\nexport class DropdownDemoModule {}\n"
|
|
4386
|
-
},
|
|
4387
3871
|
{
|
|
4388
3872
|
"fileName": "popover-demo.component.html",
|
|
4389
3873
|
"filePath": "/projects/popovers/documentation/code-examples/popover/basic/popover-demo.component.html",
|