@genesislcap/foundation-header 14.15.2 → 14.17.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.
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
module.exports = {
|
|
2
|
+
/** Globs to analyze */
|
|
3
|
+
globs: ['src/**/*.ts'],
|
|
4
|
+
/** Directory to output CEM to */
|
|
5
|
+
outdir: './dist',
|
|
6
|
+
/** Run in dev mode, provides extra logging */
|
|
7
|
+
dev: false,
|
|
8
|
+
/** Enable special handling for FastElement */
|
|
9
|
+
fast: true,
|
|
10
|
+
/** Include third party custom elements manifests */
|
|
11
|
+
dependencies: true,
|
|
12
|
+
/** Output CEM path to `package.json`, defaults to true */
|
|
13
|
+
packagejson: true,
|
|
14
|
+
};
|
|
@@ -0,0 +1,567 @@
|
|
|
1
|
+
{
|
|
2
|
+
"schemaVersion": "1.0.0",
|
|
3
|
+
"readme": "",
|
|
4
|
+
"modules": [
|
|
5
|
+
{
|
|
6
|
+
"kind": "javascript-module",
|
|
7
|
+
"path": "src/index.federated.ts",
|
|
8
|
+
"declarations": [],
|
|
9
|
+
"exports": []
|
|
10
|
+
},
|
|
11
|
+
{
|
|
12
|
+
"kind": "javascript-module",
|
|
13
|
+
"path": "src/index.ts",
|
|
14
|
+
"declarations": [],
|
|
15
|
+
"exports": [
|
|
16
|
+
{
|
|
17
|
+
"kind": "js",
|
|
18
|
+
"name": "*",
|
|
19
|
+
"declaration": {
|
|
20
|
+
"name": "*",
|
|
21
|
+
"package": "./main/index"
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
]
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
"kind": "javascript-module",
|
|
28
|
+
"path": "src/components/components.ts",
|
|
29
|
+
"declarations": [
|
|
30
|
+
{
|
|
31
|
+
"kind": "function",
|
|
32
|
+
"name": "loadZeroDesignSystem"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"kind": "function",
|
|
36
|
+
"name": "loadRemotes",
|
|
37
|
+
"description": "Load the wp5 module federation remote versions, or fallback to code split bundled versions.\nYou would really be targeting the client's design system, components etc here. For now just targeting zero."
|
|
38
|
+
}
|
|
39
|
+
],
|
|
40
|
+
"exports": [
|
|
41
|
+
{
|
|
42
|
+
"kind": "js",
|
|
43
|
+
"name": "loadZeroDesignSystem",
|
|
44
|
+
"declaration": {
|
|
45
|
+
"name": "loadZeroDesignSystem",
|
|
46
|
+
"module": "src/components/components.ts"
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"kind": "js",
|
|
51
|
+
"name": "loadRemotes",
|
|
52
|
+
"declaration": {
|
|
53
|
+
"name": "loadRemotes",
|
|
54
|
+
"module": "src/components/components.ts"
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
]
|
|
58
|
+
},
|
|
59
|
+
{
|
|
60
|
+
"kind": "javascript-module",
|
|
61
|
+
"path": "src/components/index.ts",
|
|
62
|
+
"declarations": [],
|
|
63
|
+
"exports": [
|
|
64
|
+
{
|
|
65
|
+
"kind": "js",
|
|
66
|
+
"name": "*",
|
|
67
|
+
"declaration": {
|
|
68
|
+
"name": "*",
|
|
69
|
+
"package": "./components"
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
]
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
"kind": "javascript-module",
|
|
76
|
+
"path": "src/styles/colors.ts",
|
|
77
|
+
"declarations": [
|
|
78
|
+
{
|
|
79
|
+
"kind": "function",
|
|
80
|
+
"name": "getWebRGBA",
|
|
81
|
+
"parameters": [
|
|
82
|
+
{
|
|
83
|
+
"name": "rgb",
|
|
84
|
+
"type": {
|
|
85
|
+
"text": "ColorRGBA64"
|
|
86
|
+
}
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
"name": "alpha",
|
|
90
|
+
"default": "1.0",
|
|
91
|
+
"type": {
|
|
92
|
+
"text": "number"
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
]
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
"kind": "variable",
|
|
99
|
+
"name": "defaultBackgroundHover"
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
"kind": "variable",
|
|
103
|
+
"name": "defaultBackgroundItem"
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
"kind": "variable",
|
|
107
|
+
"name": "backgroundNavOption"
|
|
108
|
+
}
|
|
109
|
+
],
|
|
110
|
+
"exports": [
|
|
111
|
+
{
|
|
112
|
+
"kind": "js",
|
|
113
|
+
"name": "getWebRGBA",
|
|
114
|
+
"declaration": {
|
|
115
|
+
"name": "getWebRGBA",
|
|
116
|
+
"module": "src/styles/colors.ts"
|
|
117
|
+
}
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
"kind": "js",
|
|
121
|
+
"name": "defaultBackgroundHover",
|
|
122
|
+
"declaration": {
|
|
123
|
+
"name": "defaultBackgroundHover",
|
|
124
|
+
"module": "src/styles/colors.ts"
|
|
125
|
+
}
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
"kind": "js",
|
|
129
|
+
"name": "defaultBackgroundItem",
|
|
130
|
+
"declaration": {
|
|
131
|
+
"name": "defaultBackgroundItem",
|
|
132
|
+
"module": "src/styles/colors.ts"
|
|
133
|
+
}
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
"kind": "js",
|
|
137
|
+
"name": "backgroundNavOption",
|
|
138
|
+
"declaration": {
|
|
139
|
+
"name": "backgroundNavOption",
|
|
140
|
+
"module": "src/styles/colors.ts"
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
]
|
|
144
|
+
},
|
|
145
|
+
{
|
|
146
|
+
"kind": "javascript-module",
|
|
147
|
+
"path": "src/styles/index.ts",
|
|
148
|
+
"declarations": [],
|
|
149
|
+
"exports": [
|
|
150
|
+
{
|
|
151
|
+
"kind": "js",
|
|
152
|
+
"name": "*",
|
|
153
|
+
"declaration": {
|
|
154
|
+
"name": "*",
|
|
155
|
+
"package": "./colors"
|
|
156
|
+
}
|
|
157
|
+
},
|
|
158
|
+
{
|
|
159
|
+
"kind": "js",
|
|
160
|
+
"name": "*",
|
|
161
|
+
"declaration": {
|
|
162
|
+
"name": "*",
|
|
163
|
+
"package": "./styles"
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
]
|
|
167
|
+
},
|
|
168
|
+
{
|
|
169
|
+
"kind": "javascript-module",
|
|
170
|
+
"path": "src/styles/styles.ts",
|
|
171
|
+
"declarations": [
|
|
172
|
+
{
|
|
173
|
+
"kind": "function",
|
|
174
|
+
"name": "mixinScreen",
|
|
175
|
+
"parameters": [
|
|
176
|
+
{
|
|
177
|
+
"name": "display",
|
|
178
|
+
"default": "'block'",
|
|
179
|
+
"type": {
|
|
180
|
+
"text": "string"
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
],
|
|
184
|
+
"description": "TODO: Bring all the style and typography mixins into the design system package"
|
|
185
|
+
},
|
|
186
|
+
{
|
|
187
|
+
"kind": "function",
|
|
188
|
+
"name": "genesisLogo",
|
|
189
|
+
"parameters": [
|
|
190
|
+
{
|
|
191
|
+
"name": "slot",
|
|
192
|
+
"default": "'start'"
|
|
193
|
+
}
|
|
194
|
+
],
|
|
195
|
+
"description": "TODO"
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
"kind": "function",
|
|
199
|
+
"name": "settingsIcon",
|
|
200
|
+
"parameters": [
|
|
201
|
+
{
|
|
202
|
+
"name": "slot",
|
|
203
|
+
"default": "'start'"
|
|
204
|
+
}
|
|
205
|
+
]
|
|
206
|
+
}
|
|
207
|
+
],
|
|
208
|
+
"exports": [
|
|
209
|
+
{
|
|
210
|
+
"kind": "js",
|
|
211
|
+
"name": "mixinScreen",
|
|
212
|
+
"declaration": {
|
|
213
|
+
"name": "mixinScreen",
|
|
214
|
+
"module": "src/styles/styles.ts"
|
|
215
|
+
}
|
|
216
|
+
},
|
|
217
|
+
{
|
|
218
|
+
"kind": "js",
|
|
219
|
+
"name": "genesisLogo",
|
|
220
|
+
"declaration": {
|
|
221
|
+
"name": "genesisLogo",
|
|
222
|
+
"module": "src/styles/styles.ts"
|
|
223
|
+
}
|
|
224
|
+
},
|
|
225
|
+
{
|
|
226
|
+
"kind": "js",
|
|
227
|
+
"name": "settingsIcon",
|
|
228
|
+
"declaration": {
|
|
229
|
+
"name": "settingsIcon",
|
|
230
|
+
"module": "src/styles/styles.ts"
|
|
231
|
+
}
|
|
232
|
+
}
|
|
233
|
+
]
|
|
234
|
+
},
|
|
235
|
+
{
|
|
236
|
+
"kind": "javascript-module",
|
|
237
|
+
"path": "src/main/index.ts",
|
|
238
|
+
"declarations": [],
|
|
239
|
+
"exports": [
|
|
240
|
+
{
|
|
241
|
+
"kind": "js",
|
|
242
|
+
"name": "*",
|
|
243
|
+
"declaration": {
|
|
244
|
+
"name": "*",
|
|
245
|
+
"package": "./main.styles"
|
|
246
|
+
}
|
|
247
|
+
},
|
|
248
|
+
{
|
|
249
|
+
"kind": "js",
|
|
250
|
+
"name": "NavTemplate",
|
|
251
|
+
"declaration": {
|
|
252
|
+
"name": "NavTemplate",
|
|
253
|
+
"module": "./main.template"
|
|
254
|
+
}
|
|
255
|
+
},
|
|
256
|
+
{
|
|
257
|
+
"kind": "js",
|
|
258
|
+
"name": "*",
|
|
259
|
+
"declaration": {
|
|
260
|
+
"name": "*",
|
|
261
|
+
"package": "./main"
|
|
262
|
+
}
|
|
263
|
+
}
|
|
264
|
+
]
|
|
265
|
+
},
|
|
266
|
+
{
|
|
267
|
+
"kind": "javascript-module",
|
|
268
|
+
"path": "src/main/main.styles.ts",
|
|
269
|
+
"declarations": [
|
|
270
|
+
{
|
|
271
|
+
"kind": "variable",
|
|
272
|
+
"name": "MainStyles",
|
|
273
|
+
"default": "css`\n :host {\n display: flex;\n flex-direction: row;\n\n --primary-gradient-angle: -113.5deg;\n --design-unit: 2.5;\n }\n\n zero-design-system-provider,\n .dynamic-template {\n width: 100%;\n }\n\n .nav-listbox {\n background: ${neutralLayer2};\n display: flex;\n flex: 1;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n box-shadow: 0 0 15px 0 rgb(0 0 0 / 30%);\n }\n\n fast-listbox {\n border-color: var(--rapid-ag-background-color);\n }\n\n .nav-leftside {\n background: ${neutralLayer2};\n flex: 1;\n flex-direction: row;\n align-items: center;\n margin-left: calc(var(--design-unit) * 6px);\n display: flex;\n }\n\n .nav-leftside:focus-within {\n box-shadow: none;\n }\n\n ::slotted(fast-option),\n .nav-listbox fast-option {\n margin: 0 calc(var(--design-unit) * 2px);\n padding: 0 calc(var(--design-unit) * 6px);\n\n --focus-stroke-width: 0;\n }\n\n ::slotted(fast-option.selected),\n .nav-listbox fast-option.selected {\n background: ${backgroundNavOption};\n color: ${ColorHEX.white};\n }\n\n ::slotted(fast-option:not(.selected)),\n .nav-listbox fast-option:not(.selected) {\n background-color: ${defaultBackgroundItem};\n color: #c9c9c9;\n }\n\n ::slotted(fast-option:not(.selected):hover),\n .nav-listbox fast-option:not(.selected):hover {\n background-color: ${defaultBackgroundHover};\n color: ${ColorHEX.white};\n }\n\n .top-layout zero-icon {\n position: absolute;\n right: calc(var(--design-unit) * 6px);\n top: 50%;\n transform: translateY(-50%);\n font-size: 25px;\n opacity: 80%;\n cursor: pointer;\n }\n\n .logout-container zero-icon {\n padding: 0 calc(var(--design-unit) * 3px);\n }\n\n .nav-listbox .bars-container {\n margin-right: calc(var(--design-unit) * 3px);\n }\n\n .user-container zero-icon {\n font-size: 20px;\n margin-right: calc(var(--design-unit) * 2px);\n color: #879ba6;\n }\n\n .group-container zero-icon {\n padding-right: 10px;\n color: #879ba6;\n }\n\n .nav-listbox .bars-container zero-icon {\n cursor: pointer;\n font-size: calc(var(--design-unit) * 8px);\n background: linear-gradient(\n var(--primary-gradient-angle),\n ${PrimaryRapidColorHEX.blue} 0%,\n ${PrimaryRapidColorHEX.purple} 100%\n )\n top/100% 1px,\n linear-gradient(\n var(--primary-gradient-angle),\n ${PrimaryRapidColorHEX.blue} 0%,\n ${PrimaryRapidColorHEX.purple} 100%\n )\n bottom/100% 1px;\n /* stylelint-disable-next-line property-no-vendor-prefix */\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n }\n\n .logo-container {\n display: flex;\n align-items: center;\n margin-right: calc(var(--design-unit) * 3px);\n }\n\n .logo {\n height: calc(var(--design-unit) * 8px);\n width: calc(var(--design-unit) * 10px);\n }\n\n .nav-rightside {\n display: flex;\n flex: 1;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n margin-right: calc(var(--design-unit) * 6px);\n color: #c9c9c9;\n }\n\n .user-container {\n background-color: ${defaultBackgroundItem};\n padding: calc(var(--design-unit) * 1px);\n font-size: 14px;\n display: flex;\n align-items: center;\n border-radius: calc(var(--control-corner-radius) * 1px);\n cursor: pointer;\n }\n\n .icon-container {\n font-size: 20px;\n padding: calc(var(--design-unit) * 3px);\n margin-right: calc(var(--design-unit) * 4px);\n color: #879ba6;\n cursor: pointer;\n }\n\n .open-nav {\n width: 300px;\n }\n\n .top-layout {\n background: linear-gradient(\n var(--primary-gradient-angle),\n ${PrimaryRapidColorHEX.blue} 0%,\n ${PrimaryRapidColorHEX.purple} 100%\n )\n top/100% 1px,\n linear-gradient(\n var(--primary-gradient-angle),\n ${PrimaryRapidColorHEX.blue} 0%,\n ${PrimaryRapidColorHEX.purple} 100%\n )\n bottom/100% 1px;\n background-origin: border-box;\n background-size: cover;\n background-repeat: no-repeat;\n width: 100%;\n height: 15%;\n max-height: 120px;\n display: flex;\n flex-direction: row;\n align-items: center;\n position: relative;\n }\n\n .top-layout img {\n width: 50px;\n margin-left: calc(var(--design-unit) * 6px);\n }\n\n .top-layout zero-icon:hover {\n opacity: 100%;\n }\n\n .group-container {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n\n ::slotted(zero-tree-view) {\n --type-ramp-base-font-size: 12px;\n }\n\n ::slotted(div) {\n color: ${PrimaryRapidColorHEX.blue};\n font-size: var(--type-ramp-minus-1-font-size);\n margin-bottom: calc(var(--design-unit) * 4px);\n padding-left: calc(var(--design-unit) * 4px);\n padding-right: calc(var(--design-unit) * 4px);\n }\n\n .nav-preferences {\n width: 100%;\n height: 25%;\n max-height: 250px;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n }\n\n .logout-container {\n align-items: center;\n background-color: var(--neutral-fill-rest);\n border: calc(var(--stroke-width) * 1px) solid ${defaultBackgroundItem};\n cursor: pointer;\n display: flex;\n flex-direction: row;\n height: 8%;\n max-height: 80px;\n padding: 3%;\n }\n\n .logout-container:hover {\n background-color: var(--neutral-fill-hover);\n }\n`",
|
|
274
|
+
"description": "Base styles for the foundation-header",
|
|
275
|
+
"return": {
|
|
276
|
+
"type": {
|
|
277
|
+
"text": ""
|
|
278
|
+
}
|
|
279
|
+
},
|
|
280
|
+
"privacy": "public"
|
|
281
|
+
}
|
|
282
|
+
],
|
|
283
|
+
"exports": [
|
|
284
|
+
{
|
|
285
|
+
"kind": "js",
|
|
286
|
+
"name": "MainStyles",
|
|
287
|
+
"declaration": {
|
|
288
|
+
"name": "MainStyles",
|
|
289
|
+
"module": "src/main/main.styles.ts"
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
]
|
|
293
|
+
},
|
|
294
|
+
{
|
|
295
|
+
"kind": "javascript-module",
|
|
296
|
+
"path": "src/main/main.template.ts",
|
|
297
|
+
"declarations": [
|
|
298
|
+
{
|
|
299
|
+
"kind": "variable",
|
|
300
|
+
"name": "NavTemplate",
|
|
301
|
+
"default": "html<Navigation>`\n ${when((x) => !x.hideSideBar, sideNavTemplate)}\n <div class=\"nav-listbox\" data-test-id=\"nav-bar\">\n <div class=\"nav-leftside\">\n ${when(\n (x) => !x.hideSideBar,\n html<Navigation>`\n <div\n class=\"bars-container\"\n @click=${(x) => x.toggleNavVisibility()}\n data-test-id=\"hamburger-menu\"\n >\n <zero-icon name=\"bars\"></zero-icon>\n </div>\n `\n )}\n <div class=\"logo-container\">\n <img src=${(x) => x.logoSrc} class=\"logo\" part=\"logo\" data-test-id=\"nav-bar-logo\" />\n </div>\n <slot name=\"routes\" data-test-id=\"route-buttons\">\n ${(x) => (x.routeButtons ? routeButtonsTemplate : defaultRouteButtonsTemplate)}\n </slot>\n </div>\n <div class=\"nav-rightside\">\n ${when(\n (x) => x.showLuminanceToggleButton,\n html<Navigation>`\n <div class=\"icon-container\" data-test-id=\"luminance-toggle-button\">\n <zero-icon\n @click=${(x) => x.luminanceIconEvent()}\n variant=\"regular\"\n name=\"moon\"\n ></zero-icon>\n </div>\n `\n )}\n ${when(\n (x) => x.showMiscToggleButton,\n html<Navigation>`\n <div class=\"icon-container\" data-test-id=\"misc-toggle-button\">\n <zero-icon @click=${(x) => x.miscIconEvent()} name=\"th\"></zero-icon>\n </div>\n `\n )}\n ${when(\n (x) => x.showNotificationsButton,\n html<Navigation>`\n <div class=\"icon-container\" data-test-id=\"notifications-button\">\n <zero-icon\n variant=\"regular\"\n @click=${(x) => x.notificationIconEvent()}\n name=\"bell\"\n ></zero-icon>\n </div>\n `\n )}\n <zero-button appearance=\"neutral-grey\" data-test-id=\"user-button\">\n <zero-icon name=\"user-circle\"></zero-icon>\n ${(x) => x.userName}\n </zero-button>\n </div>\n </div>\n`",
|
|
302
|
+
"description": "Template for Navigation class",
|
|
303
|
+
"return": {
|
|
304
|
+
"type": {
|
|
305
|
+
"text": ""
|
|
306
|
+
}
|
|
307
|
+
},
|
|
308
|
+
"privacy": "public"
|
|
309
|
+
}
|
|
310
|
+
],
|
|
311
|
+
"exports": [
|
|
312
|
+
{
|
|
313
|
+
"kind": "js",
|
|
314
|
+
"name": "NavTemplate",
|
|
315
|
+
"declaration": {
|
|
316
|
+
"name": "NavTemplate",
|
|
317
|
+
"module": "src/main/main.template.ts"
|
|
318
|
+
}
|
|
319
|
+
}
|
|
320
|
+
]
|
|
321
|
+
},
|
|
322
|
+
{
|
|
323
|
+
"kind": "javascript-module",
|
|
324
|
+
"path": "src/main/main.ts",
|
|
325
|
+
"declarations": [
|
|
326
|
+
{
|
|
327
|
+
"kind": "class",
|
|
328
|
+
"description": "Navigation micro-frontend includes navigation bar and flyout menu",
|
|
329
|
+
"name": "Navigation",
|
|
330
|
+
"members": [
|
|
331
|
+
{
|
|
332
|
+
"kind": "field",
|
|
333
|
+
"name": "auth",
|
|
334
|
+
"type": {
|
|
335
|
+
"text": "Auth"
|
|
336
|
+
}
|
|
337
|
+
},
|
|
338
|
+
{
|
|
339
|
+
"kind": "field",
|
|
340
|
+
"name": "credentialManager",
|
|
341
|
+
"type": {
|
|
342
|
+
"text": "CredentialManager"
|
|
343
|
+
}
|
|
344
|
+
},
|
|
345
|
+
{
|
|
346
|
+
"kind": "field",
|
|
347
|
+
"name": "provider",
|
|
348
|
+
"type": {
|
|
349
|
+
"text": "any"
|
|
350
|
+
}
|
|
351
|
+
},
|
|
352
|
+
{
|
|
353
|
+
"kind": "field",
|
|
354
|
+
"name": "ready",
|
|
355
|
+
"type": {
|
|
356
|
+
"text": "boolean"
|
|
357
|
+
},
|
|
358
|
+
"default": "false"
|
|
359
|
+
},
|
|
360
|
+
{
|
|
361
|
+
"kind": "field",
|
|
362
|
+
"name": "userName",
|
|
363
|
+
"type": {
|
|
364
|
+
"text": "string"
|
|
365
|
+
},
|
|
366
|
+
"privacy": "public",
|
|
367
|
+
"description": "Username of the logged in user"
|
|
368
|
+
},
|
|
369
|
+
{
|
|
370
|
+
"kind": "field",
|
|
371
|
+
"name": "sideNavOpen",
|
|
372
|
+
"type": {
|
|
373
|
+
"text": "boolean"
|
|
374
|
+
},
|
|
375
|
+
"default": "false"
|
|
376
|
+
},
|
|
377
|
+
{
|
|
378
|
+
"kind": "field",
|
|
379
|
+
"name": "logoSrc",
|
|
380
|
+
"type": {
|
|
381
|
+
"text": "any"
|
|
382
|
+
},
|
|
383
|
+
"default": "logo",
|
|
384
|
+
"description": "Optional attribute which controls the icon to show on the navigation bar and flyout\nControl via `logo-src`"
|
|
385
|
+
},
|
|
386
|
+
{
|
|
387
|
+
"kind": "field",
|
|
388
|
+
"name": "showLuminanceToggleButton",
|
|
389
|
+
"type": {
|
|
390
|
+
"text": "boolean"
|
|
391
|
+
},
|
|
392
|
+
"description": "Boolean attribute which controls whether to show the luminance (moon) icon on the navigation bar\nControl via`show-luminance-toggle-button`"
|
|
393
|
+
},
|
|
394
|
+
{
|
|
395
|
+
"kind": "field",
|
|
396
|
+
"name": "showMiscToggleButton",
|
|
397
|
+
"type": {
|
|
398
|
+
"text": "boolean"
|
|
399
|
+
},
|
|
400
|
+
"description": "Boolean attribute which controls whether to show the miscellaneous (menu) icon on the navigation bar\nControl via `show-luminance-toggle-button`"
|
|
401
|
+
},
|
|
402
|
+
{
|
|
403
|
+
"kind": "field",
|
|
404
|
+
"name": "showNotificationsButton",
|
|
405
|
+
"type": {
|
|
406
|
+
"text": "boolean"
|
|
407
|
+
},
|
|
408
|
+
"description": "Boolean attribute which controls whether to show the notification (bell) icon on the navigation bar\nControl via `show-notification-button`"
|
|
409
|
+
},
|
|
410
|
+
{
|
|
411
|
+
"kind": "field",
|
|
412
|
+
"name": "hideSideBar",
|
|
413
|
+
"type": {
|
|
414
|
+
"text": "boolean"
|
|
415
|
+
},
|
|
416
|
+
"description": "Boolean attribute which controls whether to include the sideNav component\nControl via`hide-side-bar`"
|
|
417
|
+
},
|
|
418
|
+
{
|
|
419
|
+
"kind": "field",
|
|
420
|
+
"name": "routeButtons",
|
|
421
|
+
"type": {
|
|
422
|
+
"text": "Array<{\n index: number;\n path: string;\n title: string;\n icon: string;\n variant: string;\n }>"
|
|
423
|
+
},
|
|
424
|
+
"description": "If present the defined route buttons will be rendered in the header 'routes' slot"
|
|
425
|
+
},
|
|
426
|
+
{
|
|
427
|
+
"kind": "method",
|
|
428
|
+
"name": "selectTemplate"
|
|
429
|
+
},
|
|
430
|
+
{
|
|
431
|
+
"kind": "method",
|
|
432
|
+
"name": "logout",
|
|
433
|
+
"privacy": "public",
|
|
434
|
+
"description": "Logs the user out of their session"
|
|
435
|
+
},
|
|
436
|
+
{
|
|
437
|
+
"kind": "method",
|
|
438
|
+
"name": "navigateTo",
|
|
439
|
+
"privacy": "public",
|
|
440
|
+
"parameters": [
|
|
441
|
+
{
|
|
442
|
+
"name": "path",
|
|
443
|
+
"type": {
|
|
444
|
+
"text": "string"
|
|
445
|
+
},
|
|
446
|
+
"description": "string represeting the new route to move to"
|
|
447
|
+
}
|
|
448
|
+
],
|
|
449
|
+
"description": "Changes the route of the current page"
|
|
450
|
+
}
|
|
451
|
+
],
|
|
452
|
+
"attributes": [
|
|
453
|
+
{
|
|
454
|
+
"name": "logo-src",
|
|
455
|
+
"type": {
|
|
456
|
+
"text": "any"
|
|
457
|
+
},
|
|
458
|
+
"default": "logo",
|
|
459
|
+
"description": "Optional attribute which controls the icon to show on the navigation bar and flyout\nControl via `logo-src`",
|
|
460
|
+
"resolveInitializer": {
|
|
461
|
+
"module": "/src/assets/logo.svg"
|
|
462
|
+
},
|
|
463
|
+
"fieldName": "logoSrc"
|
|
464
|
+
},
|
|
465
|
+
{
|
|
466
|
+
"name": "show-luminance-toggle-button",
|
|
467
|
+
"type": {
|
|
468
|
+
"text": "boolean"
|
|
469
|
+
},
|
|
470
|
+
"description": "Boolean attribute which controls whether to show the luminance (moon) icon on the navigation bar\nControl via`show-luminance-toggle-button`",
|
|
471
|
+
"fieldName": "showLuminanceToggleButton"
|
|
472
|
+
},
|
|
473
|
+
{
|
|
474
|
+
"name": "show-misc-toggle-button",
|
|
475
|
+
"type": {
|
|
476
|
+
"text": "boolean"
|
|
477
|
+
},
|
|
478
|
+
"description": "Boolean attribute which controls whether to show the miscellaneous (menu) icon on the navigation bar\nControl via `show-luminance-toggle-button`",
|
|
479
|
+
"fieldName": "showMiscToggleButton"
|
|
480
|
+
},
|
|
481
|
+
{
|
|
482
|
+
"name": "show-notification-button",
|
|
483
|
+
"type": {
|
|
484
|
+
"text": "boolean"
|
|
485
|
+
},
|
|
486
|
+
"description": "Boolean attribute which controls whether to show the notification (bell) icon on the navigation bar\nControl via `show-notification-button`",
|
|
487
|
+
"fieldName": "showNotificationsButton"
|
|
488
|
+
},
|
|
489
|
+
{
|
|
490
|
+
"name": "hide-side-bar",
|
|
491
|
+
"type": {
|
|
492
|
+
"text": "boolean"
|
|
493
|
+
},
|
|
494
|
+
"description": "Boolean attribute which controls whether to include the sideNav component\nControl via`hide-side-bar`",
|
|
495
|
+
"fieldName": "hideSideBar"
|
|
496
|
+
}
|
|
497
|
+
],
|
|
498
|
+
"mixins": [
|
|
499
|
+
{
|
|
500
|
+
"name": "EventEmitter",
|
|
501
|
+
"package": "@genesislcap/foundation-events"
|
|
502
|
+
}
|
|
503
|
+
],
|
|
504
|
+
"superclass": {
|
|
505
|
+
"name": "FASTElement",
|
|
506
|
+
"package": "@microsoft/fast-element"
|
|
507
|
+
},
|
|
508
|
+
"tagName": "foundation-header",
|
|
509
|
+
"customElement": true
|
|
510
|
+
}
|
|
511
|
+
],
|
|
512
|
+
"exports": [
|
|
513
|
+
{
|
|
514
|
+
"kind": "js",
|
|
515
|
+
"name": "Navigation",
|
|
516
|
+
"declaration": {
|
|
517
|
+
"name": "Navigation",
|
|
518
|
+
"module": "src/main/main.ts"
|
|
519
|
+
}
|
|
520
|
+
},
|
|
521
|
+
{
|
|
522
|
+
"kind": "custom-element-definition",
|
|
523
|
+
"name": "foundation-header",
|
|
524
|
+
"declaration": {
|
|
525
|
+
"name": "Navigation",
|
|
526
|
+
"module": "src/main/main.ts"
|
|
527
|
+
}
|
|
528
|
+
}
|
|
529
|
+
]
|
|
530
|
+
},
|
|
531
|
+
{
|
|
532
|
+
"kind": "javascript-module",
|
|
533
|
+
"path": "src/utils/index.ts",
|
|
534
|
+
"declarations": [],
|
|
535
|
+
"exports": [
|
|
536
|
+
{
|
|
537
|
+
"kind": "js",
|
|
538
|
+
"name": "*",
|
|
539
|
+
"declaration": {
|
|
540
|
+
"name": "*",
|
|
541
|
+
"package": "./logger"
|
|
542
|
+
}
|
|
543
|
+
}
|
|
544
|
+
]
|
|
545
|
+
},
|
|
546
|
+
{
|
|
547
|
+
"kind": "javascript-module",
|
|
548
|
+
"path": "src/utils/logger.ts",
|
|
549
|
+
"declarations": [
|
|
550
|
+
{
|
|
551
|
+
"kind": "variable",
|
|
552
|
+
"name": "logger"
|
|
553
|
+
}
|
|
554
|
+
],
|
|
555
|
+
"exports": [
|
|
556
|
+
{
|
|
557
|
+
"kind": "js",
|
|
558
|
+
"name": "logger",
|
|
559
|
+
"declaration": {
|
|
560
|
+
"name": "logger",
|
|
561
|
+
"module": "src/utils/logger.ts"
|
|
562
|
+
}
|
|
563
|
+
}
|
|
564
|
+
]
|
|
565
|
+
}
|
|
566
|
+
]
|
|
567
|
+
}
|
package/dist/dts/main/main.d.ts
CHANGED
|
@@ -71,7 +71,14 @@ declare const Navigation_base: new (...args: any[]) => {
|
|
|
71
71
|
getAttributeNode(qualifiedName: string): Attr;
|
|
72
72
|
getAttributeNodeNS(namespace: string, localName: string): Attr;
|
|
73
73
|
getBoundingClientRect(): DOMRect;
|
|
74
|
-
getClientRects(): DOMRectList;
|
|
74
|
+
getClientRects(): DOMRectList; /**
|
|
75
|
+
* Boolean attribute which controls whether to show the miscellaneous (menu) icon on the navigation bar
|
|
76
|
+
* Control via `show-luminance-toggle-button`
|
|
77
|
+
*
|
|
78
|
+
* @remarks
|
|
79
|
+
*
|
|
80
|
+
* If the user clicks the icon when shown then this class will emit the 'misc-icon-clicked' event
|
|
81
|
+
*/
|
|
75
82
|
getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
|
|
76
83
|
getElementsByTagName<K_5 extends keyof HTMLElementTagNameMap>(qualifiedName: K_5): HTMLCollectionOf<HTMLElementTagNameMap[K_5]>;
|
|
77
84
|
getElementsByTagName<K_6 extends keyof SVGElementTagNameMap>(qualifiedName: K_6): HTMLCollectionOf<SVGElementTagNameMap[K_6]>;
|
|
@@ -83,6 +90,9 @@ declare const Navigation_base: new (...args: any[]) => {
|
|
|
83
90
|
hasAttributeNS(namespace: string, localName: string): boolean;
|
|
84
91
|
hasAttributes(): boolean;
|
|
85
92
|
hasPointerCapture(pointerId: number): boolean;
|
|
93
|
+
/**
|
|
94
|
+
* If present the defined route buttons will be rendered in the header 'routes' slot
|
|
95
|
+
*/
|
|
86
96
|
insertAdjacentElement(where: InsertPosition, element: Element): Element;
|
|
87
97
|
insertAdjacentHTML(position: InsertPosition, text: string): void;
|
|
88
98
|
insertAdjacentText(where: InsertPosition, data: string): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../../src/main/main.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAgB,MAAM,+BAA+B,CAAC;
|
|
1
|
+
{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../../src/main/main.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAgB,MAAM,+BAA+B,CAAC;AAUtF;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,wBAAwB,EAAE,IAAI,CAAC;IAC/B,mBAAmB,EAAE,IAAI,CAAC;IAC1B,2BAA2B,EAAE,IAAI,CAAC;CACnC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mCAyEA;;;;;;;OAOG;;;;;;;;;;;;IAsBH;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAnGL;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAKa,UAAW,SAAQ,eAAmC;IAC3D,IAAI,EAAG,IAAI,CAAC;IACC,iBAAiB,EAAG,iBAAiB,CAAC;IAC7C,QAAQ,EAAG,GAAG,CAAC;IACf,KAAK,EAAE,OAAO,CAAS;IAEnC;;OAEG;IACgB,QAAQ,EAAE,MAAM,CAAC;IAExB,WAAW,UAAS;IAEnB,iBAAiB;IAU9B;;;;;;;OAOG;IAC8B,OAAO,EAAE,GAAG,CAAQ;IAErD;;;;;;;OAOG;IAEH,yBAAyB,EAAE,OAAO,CAAC;IAEnC;;;;;;;OAOG;IAC8D,oBAAoB,EAAE,OAAO,CAAC;IAE/F;;;;;;;OAOG;IAEH,uBAAuB,EAAE,OAAO,CAAC;IAEjC;;;;OAIG;IAEH,WAAW,EAAE,OAAO,CAAC;IAErB;;OAEG;IACS,YAAY,EAAE,KAAK,CAAC;QAC9B,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC,CAAC;IAEH;;;;;;;;OAQG;IACG,WAAW;IAKjB,cAAc;IAId;;;;;;;;;OASG;IACU,MAAM;IAgBnB;;;;;;;;;;OAUG;IACI,UAAU,CAAC,IAAI,EAAE,MAAM;IAS9B;;;;;;;;;OASG;IACH,mBAAmB;IAInB;;;;;;;;;OASG;IACH,kBAAkB;IAIlB;;;;;;;;;OASG;IACH,aAAa;IAIb;;;;;;;;;OASG;IACH,qBAAqB;CAGtB"}
|
package/dist/esm/main/main.js
CHANGED
|
@@ -8,7 +8,6 @@ import * as Components from '../components';
|
|
|
8
8
|
import { logger } from '../utils';
|
|
9
9
|
import { MainStyles as styles } from './main.styles';
|
|
10
10
|
import { DynamicTemplate as template, LoadingTemplate, MainTemplate } from './main.template';
|
|
11
|
-
const name = 'foundation-header';
|
|
12
11
|
/**
|
|
13
12
|
* Navigation micro-frontend includes navigation bar and flyout menu
|
|
14
13
|
*
|
|
@@ -49,7 +48,7 @@ let Navigation = class Navigation extends EventEmitter(FASTElement) {
|
|
|
49
48
|
});
|
|
50
49
|
return __awaiter(this, void 0, void 0, function* () {
|
|
51
50
|
_super.connectedCallback.call(this);
|
|
52
|
-
logger.debug(
|
|
51
|
+
logger.debug(`foundation-header is now connected to the DOM`);
|
|
53
52
|
yield this.loadRemotes();
|
|
54
53
|
this.userName = this.auth.loggedUserResult
|
|
55
54
|
? this.auth.loggedUserResult.username
|
|
@@ -213,7 +212,7 @@ __decorate([
|
|
|
213
212
|
], Navigation.prototype, "routeButtons", void 0);
|
|
214
213
|
Navigation = __decorate([
|
|
215
214
|
customElement({
|
|
216
|
-
name,
|
|
215
|
+
name: 'foundation-header',
|
|
217
216
|
template,
|
|
218
217
|
styles,
|
|
219
218
|
})
|
|
@@ -250,7 +250,14 @@ declare const Navigation_base: new (...args: any[]) => {
|
|
|
250
250
|
getAttributeNode(qualifiedName: string): Attr;
|
|
251
251
|
getAttributeNodeNS(namespace: string, localName: string): Attr;
|
|
252
252
|
getBoundingClientRect(): DOMRect;
|
|
253
|
-
getClientRects(): DOMRectList;
|
|
253
|
+
getClientRects(): DOMRectList; /**
|
|
254
|
+
* Boolean attribute which controls whether to show the miscellaneous (menu) icon on the navigation bar
|
|
255
|
+
* Control via `show-luminance-toggle-button`
|
|
256
|
+
*
|
|
257
|
+
* @remarks
|
|
258
|
+
*
|
|
259
|
+
* If the user clicks the icon when shown then this class will emit the 'misc-icon-clicked' event
|
|
260
|
+
*/
|
|
254
261
|
getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
|
|
255
262
|
getElementsByTagName<K_5 extends keyof HTMLElementTagNameMap>(qualifiedName: K_5): HTMLCollectionOf<HTMLElementTagNameMap[K_5]>;
|
|
256
263
|
getElementsByTagName<K_6 extends keyof SVGElementTagNameMap>(qualifiedName: K_6): HTMLCollectionOf<SVGElementTagNameMap[K_6]>;
|
|
@@ -262,6 +269,9 @@ declare const Navigation_base: new (...args: any[]) => {
|
|
|
262
269
|
hasAttributeNS(namespace: string, localName: string): boolean;
|
|
263
270
|
hasAttributes(): boolean;
|
|
264
271
|
hasPointerCapture(pointerId: number): boolean;
|
|
272
|
+
/**
|
|
273
|
+
* If present the defined route buttons will be rendered in the header 'routes' slot
|
|
274
|
+
*/
|
|
265
275
|
insertAdjacentElement(where: InsertPosition, element: Element): Element;
|
|
266
276
|
insertAdjacentHTML(position: InsertPosition, text: string): void;
|
|
267
277
|
insertAdjacentText(where: InsertPosition, data: string): void;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@genesislcap/foundation-header",
|
|
3
3
|
"description": "Genesis Foundation Header",
|
|
4
|
-
"version": "14.
|
|
4
|
+
"version": "14.17.0",
|
|
5
5
|
"license": "SEE LICENSE IN license.txt",
|
|
6
6
|
"main": "dist/esm/index.js",
|
|
7
7
|
"types": "dist/foundation-header.d.ts",
|
|
@@ -19,21 +19,22 @@
|
|
|
19
19
|
"./package.json": "./package.json"
|
|
20
20
|
},
|
|
21
21
|
"scripts": {
|
|
22
|
-
"api": "npm run api:extract && npm run api:document",
|
|
23
|
-
"api:extract": "api-extractor run",
|
|
22
|
+
"api": "npm run api:extract && npm run api:document && npm run cem:analyze",
|
|
24
23
|
"api:document": "api-documenter markdown -i dist -o docs/api",
|
|
24
|
+
"api:extract": "api-extractor run",
|
|
25
25
|
"build": "npm run clean && npm run build:tsc && npm run copy-files && npm run api",
|
|
26
26
|
"build:tsc": "tsc -b ./tsconfig.json",
|
|
27
27
|
"build:webpack": "cross-env NODE_ENV=production webpack",
|
|
28
28
|
"build:webpack:make-federated-types": "make-federated-types",
|
|
29
29
|
"build:webpack:stats": "cross-env ANALYZE=1 npm run build:webpack",
|
|
30
|
+
"cem:analyze": "cem analyze --config custom-elements-manifest.config.js",
|
|
30
31
|
"clean": "genx clean dist tsconfig.tsbuildinfo",
|
|
31
32
|
"copy-files": "copyfiles -u 1 src/**/*.{css,scss,ttf,png,svg} ./dist/esm",
|
|
32
33
|
"dev": "npm run dev:webpack -- --open",
|
|
33
34
|
"dev:no-open": "npm run dev:webpack -- --no-open",
|
|
34
35
|
"dev:webpack": "cross-env NODE_ENV=development webpack serve",
|
|
35
36
|
"dev:webpack:https": "npm run dev:webpack -- --https",
|
|
36
|
-
"serve": "serve
|
|
37
|
+
"serve": "genx serve",
|
|
37
38
|
"test": "npm run test:unit",
|
|
38
39
|
"test:coverage": "c8 --include=src npm run test:unit",
|
|
39
40
|
"test:coverage:report": "npm run test:coverage && c8 report --reporter=text-lcov > coverage.lcov",
|
|
@@ -50,8 +51,9 @@
|
|
|
50
51
|
"test:unit:watch": "watchlist src test -- npm run test:unit"
|
|
51
52
|
},
|
|
52
53
|
"devDependencies": {
|
|
53
|
-
"@
|
|
54
|
-
"@genesislcap/
|
|
54
|
+
"@custom-elements-manifest/analyzer": "^0.8.2",
|
|
55
|
+
"@genesislcap/foundation-testing": "^14.17.0",
|
|
56
|
+
"@genesislcap/genx": "^14.17.0",
|
|
55
57
|
"@microsoft/api-documenter": "^7.19.13",
|
|
56
58
|
"@microsoft/api-extractor": "^7.31.1",
|
|
57
59
|
"@playwright/test": "^1.18.1",
|
|
@@ -76,7 +78,6 @@
|
|
|
76
78
|
"postcss-import": "^14.0.0",
|
|
77
79
|
"postcss-loader": "^6.2.1",
|
|
78
80
|
"postcss-preset-env": "^7.0.1",
|
|
79
|
-
"serve": "^14.1.2",
|
|
80
81
|
"terser-webpack-plugin": "^5.3.1",
|
|
81
82
|
"to-string-loader": "^1.2.0",
|
|
82
83
|
"ts-loader": "9.3.1",
|
|
@@ -92,10 +93,10 @@
|
|
|
92
93
|
"webpack-merge": "^5.7.3"
|
|
93
94
|
},
|
|
94
95
|
"dependencies": {
|
|
95
|
-
"@genesislcap/foundation-comms": "^14.
|
|
96
|
-
"@genesislcap/foundation-events": "^14.
|
|
97
|
-
"@genesislcap/foundation-utils": "^14.
|
|
98
|
-
"@genesislcap/foundation-zero": "^14.
|
|
96
|
+
"@genesislcap/foundation-comms": "^14.17.0",
|
|
97
|
+
"@genesislcap/foundation-events": "^14.17.0",
|
|
98
|
+
"@genesislcap/foundation-utils": "^14.17.0",
|
|
99
|
+
"@genesislcap/foundation-zero": "^14.17.0",
|
|
99
100
|
"@microsoft/fast-colors": "^5.1.4",
|
|
100
101
|
"@microsoft/fast-components": "^2.21.3",
|
|
101
102
|
"@microsoft/fast-element": "^1.7.0",
|
|
@@ -106,5 +107,6 @@
|
|
|
106
107
|
"publishConfig": {
|
|
107
108
|
"access": "public"
|
|
108
109
|
},
|
|
109
|
-
"
|
|
110
|
+
"customElements": "dist/custom-elements.json",
|
|
111
|
+
"gitHead": "45aa1d24a4fabc0d90c868f8e77f71df24609180"
|
|
110
112
|
}
|