@govflanders/vl-widget-global-header-types 1.0.33 → 1.0.34
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/README.md +1 -139
- package/dist/client.d.ts +64 -38
- package/docs/hierarchy.html +1 -1
- package/docs/index.html +3 -147
- package/docs/interfaces/AccessMenuConfig.html +2 -2
- package/docs/interfaces/AlertConfig.html +2 -2
- package/docs/interfaces/Application.html +2 -2
- package/docs/interfaces/ApplicationLink.html +2 -2
- package/docs/interfaces/BaseConfig.html +2 -2
- package/docs/interfaces/BrandingConfig.html +2 -2
- package/docs/interfaces/BrandingConfigColors.html +3 -3
- package/docs/interfaces/BrandingConfigHost.html +2 -2
- package/docs/interfaces/BrandingConfigUmbrella.html +3 -3
- package/docs/interfaces/Channel.html +2 -2
- package/docs/interfaces/CobrowseConfig.html +2 -2
- package/docs/interfaces/CobrowseConsentConfig.html +2 -2
- package/docs/interfaces/Config.html +2 -2
- package/docs/interfaces/ContactConfig.html +2 -2
- package/docs/interfaces/ContactOption.html +2 -2
- package/docs/interfaces/ContactOptionRef.html +2 -2
- package/docs/interfaces/EnrichedServicePoints.html +2 -2
- package/docs/interfaces/GlobalHeaderClient.html +66 -45
- package/docs/interfaces/I18n.html +2 -2
- package/docs/interfaces/IDPData.html +2 -2
- package/docs/interfaces/Image.html +2 -2
- package/docs/interfaces/Link.html +2 -2
- package/docs/interfaces/LinkWithTarget.html +2 -2
- package/docs/interfaces/MainLink.html +2 -2
- package/docs/interfaces/ProfileConfig.html +2 -2
- package/docs/interfaces/RecursiveRecord.html +1 -1
- package/docs/interfaces/ResolveOptions.html +2 -2
- package/docs/interfaces/ServicePoints.html +2 -2
- package/docs/interfaces/Session.html +2 -2
- package/docs/interfaces/Translations.html +2 -2
- package/docs/modules.html +2 -2
- package/docs/types/AlertModifier.html +1 -1
- package/docs/types/ApplicationMenuLink.html +1 -1
- package/docs/types/BrandingConfigLevel.html +2 -2
- package/docs/types/CapacityCode.html +1 -1
- package/docs/types/ChannelIcon.html +1 -1
- package/docs/types/ChannelType.html +1 -1
- package/docs/types/CobrowseChannel.html +1 -1
- package/docs/types/ContactOptionSocialPlatform.html +1 -1
- package/docs/types/ContactServiceEndpoints.html +1 -1
- package/docs/types/EnrichedServicePoint.html +1 -1
- package/docs/types/Language.html +1 -1
- package/docs/types/PluginTypeId.html +1 -1
- package/docs/types/ServicePoint.html +1 -1
- package/docs/types/Translatable.html +1 -1
- package/docs/variables/languages.html +1 -1
- package/package.json +2 -2
- package/docs/assets/typedoc-github-style.css +0 -435
package/README.md
CHANGED
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
# Global Header Widget types
|
|
2
|
-
|
|
3
1
|
The **`@govflanders/vl-widget-global-header-types`** package provides TypeScript types and interfaces for interacting with the **Global Header Widget**. This widget is embedded in customer web pages and exposes a client object (`window.globalHeaderClient`) that allows for dynamic configuration and interaction with the global header.
|
|
4
2
|
|
|
5
3
|
By using the types defined in this package, developers can ensure type-safe interactions with the widget while improving their development experience (DX) by utilizing autocompletion and built-in documentation.
|
|
@@ -105,142 +103,6 @@ The `window.globalHeaderClient` object offers several methods for interacting wi
|
|
|
105
103
|
|
|
106
104
|
Checkout the [GlobalHeaderClient](./interfaces/GlobalHeaderClient.html) here to see how to use it.
|
|
107
105
|
|
|
108
|
-
### getConfig(): Promise\<Config\>
|
|
109
|
-
Retrieve the current widget configuration.
|
|
110
|
-
|
|
111
|
-
### branding
|
|
112
|
-
|
|
113
|
-
The `branding` object contains methods for interacting with branding configurations.
|
|
114
|
-
|
|
115
|
-
- **getLevel(): Promise\<number\>**
|
|
116
|
-
Fetch the current branding level of the widget.
|
|
117
|
-
|
|
118
|
-
- **setLevel(level: number): Promise\<boolean\>**
|
|
119
|
-
Set the branding level of the widget.
|
|
120
|
-
|
|
121
|
-
- **getColor(colorKey: string): Promise\<string\>**
|
|
122
|
-
Fetch a specific branding color based on the provided color key.
|
|
123
|
-
|
|
124
|
-
- **setColor(colorConfig: { key: string, value: string }): Promise\<boolean\>**
|
|
125
|
-
Set a specific branding color for the widget.
|
|
126
|
-
|
|
127
|
-
- **getColors(): Promise\<BrandingConfigColors\>**
|
|
128
|
-
Fetch the entire set of branding colors.
|
|
129
|
-
|
|
130
|
-
- **setColors(colors: BrandingConfigColors): Promise\<boolean\>**
|
|
131
|
-
Set multiple branding colors for the widget.
|
|
132
|
-
|
|
133
|
-
- **getHost(): Promise\<Partial\<BrandingConfigHost\>\>**
|
|
134
|
-
Retrieve the host configuration for branding.
|
|
135
|
-
|
|
136
|
-
- **setHost(host: BrandingConfigHost): Promise\<boolean\>**
|
|
137
|
-
Set the host branding configuration.
|
|
138
|
-
|
|
139
|
-
- **getUmbrella(): Promise\<Partial\<BrandingConfigUmbrella\>\>**
|
|
140
|
-
Retrieve the umbrella configuration for branding.
|
|
141
|
-
|
|
142
|
-
- **setUmbrella(umbrella: BrandingConfigUmbrella): Promise\<boolean\>**
|
|
143
|
-
Set the umbrella branding configuration.
|
|
144
|
-
|
|
145
|
-
- **getVariables(): Promise\<Record\<string, string\>\>**
|
|
146
|
-
Fetch branding-related variables as a dictionary.
|
|
147
|
-
|
|
148
|
-
### contact
|
|
149
|
-
|
|
150
|
-
The `contact` object contains methods related to managing service points.
|
|
151
|
-
|
|
152
|
-
- **setServicePoints(servicePoints: Translatable\<ServicePoints\>): Promise\<Translatable\<ServicePoints\>\>**
|
|
153
|
-
Update the service points displayed in the widget.
|
|
154
|
-
|
|
155
|
-
- **getServicePoints(): Promise\<EnrichedServicePoints\>**
|
|
156
|
-
Fetch the current service points from the widget.
|
|
157
|
-
|
|
158
|
-
- **resetServicePoints(): Promise\<boolean\>**
|
|
159
|
-
Reset the service points to the initial values defined in the widget’s configuration.
|
|
160
|
-
|
|
161
|
-
- **open(): Promise\<boolean\>**
|
|
162
|
-
Opens the contact interface.
|
|
163
|
-
|
|
164
|
-
- **close(): Promise\<boolean\>**
|
|
165
|
-
Closes the contact interface.
|
|
166
|
-
|
|
167
|
-
- **toggle(): Promise\<boolean\>**
|
|
168
|
-
Toggles the visibility of the contact interface.
|
|
169
|
-
|
|
170
|
-
- **isOpen(): Promise\<boolean\>**
|
|
171
|
-
Checks whether the contact interface is currently open.
|
|
172
|
-
|
|
173
|
-
### accessMenu
|
|
174
|
-
|
|
175
|
-
The `accessMenu` object contains methods for managing the access menu's links and profile.
|
|
176
|
-
|
|
177
|
-
- **setProfile(profileConfig: Partial\<ProfileConfig\>): Promise\<boolean\>**
|
|
178
|
-
Set or update the profile configuration for the widget.
|
|
179
|
-
|
|
180
|
-
- **getProfile(): Promise\<Partial\<ProfileConfig\>\>**
|
|
181
|
-
Retrieve the current profile configuration for the widget.
|
|
182
|
-
|
|
183
|
-
- **setMainLinks(mainLinks: MainLink[]): Promise\<boolean\>**
|
|
184
|
-
Sets the main navigation links that are displayed within the widget. These links will only be visible for widgets that support sessions, and they are displayed only when the user is logged in.
|
|
185
|
-
|
|
186
|
-
- **addApplicationMenuLink(link: ApplicationMenuLink): Promise\<ApplicationMenuLink[]\>**
|
|
187
|
-
Add a single link to the application menu.
|
|
188
|
-
|
|
189
|
-
- **addApplicationMenuLinks(links: ApplicationMenuLink[]): Promise\<ApplicationMenuLink[]\>**
|
|
190
|
-
Add multiple links to the application menu.
|
|
191
|
-
|
|
192
|
-
- **setApplicationMenuLinks(links: ApplicationMenuLink[]): Promise\<ApplicationMenuLink[]\>**
|
|
193
|
-
Replace all application menu links.
|
|
194
|
-
|
|
195
|
-
### setNavigationEnabled(enabled: boolean): Promise\<boolean\>
|
|
196
|
-
|
|
197
|
-
Enable or disable the host and branding navigation.
|
|
198
|
-
|
|
199
|
-
### mount(element?: HTMLElement): Promise\<boolean\>
|
|
200
|
-
|
|
201
|
-
The `mount` method allows you to control where the **Global Header Widget** is rendered on the page. There are two main ways to integrate the widget, depending on whether you want to manually control its placement or let it render automatically:
|
|
202
|
-
|
|
203
|
-
1. **Using the 'entry' script**:
|
|
204
|
-
When you include the widget via the following script:
|
|
205
|
-
|
|
206
|
-
```html
|
|
207
|
-
<script src="https://prod.widgets.burgerprofiel.vlaanderen.be/api/v2/widget/__global_header_id__/entry"></script>
|
|
208
|
-
```
|
|
209
|
-
|
|
210
|
-
The widget is **not automatically rendered** on the page. Instead, you must call the `mount` method from the `window.globalHeaderClient` object to display it. This gives you control over where and when the widget is added. You can either:
|
|
211
|
-
|
|
212
|
-
- **Mount to a specific element**:
|
|
213
|
-
Pass an HTML element to the `mount` method to render the widget inside that element.
|
|
214
|
-
|
|
215
|
-
```typescript
|
|
216
|
-
const element = document.getElementById('customHeader');
|
|
217
|
-
window.globalHeaderClient.mount(element);
|
|
218
|
-
```
|
|
219
|
-
|
|
220
|
-
- **Mount without specifying an element**:
|
|
221
|
-
If no element is provided, the widget will automatically render at the top of the page.
|
|
222
|
-
|
|
223
|
-
```typescript
|
|
224
|
-
window.globalHeaderClient.mount();
|
|
225
|
-
```
|
|
226
|
-
|
|
227
|
-
2. **Using the 'embed' script**:
|
|
228
|
-
If you use this script instead:
|
|
229
|
-
|
|
230
|
-
```html
|
|
231
|
-
<script src="https://prod.widgets.burgerprofiel.vlaanderen.be/api/v2/widget/__global_header_id__/embed"></script>
|
|
232
|
-
```
|
|
233
|
-
|
|
234
|
-
The widget will **automatically render** as a `<div>` at the location where the script is placed in the HTML. No additional action is needed to mount the widget in this case. For accessibility reasons, the header is marked with `role="banner"`. If you prefer not to include this role (e.g., to avoid multiple banner roles on a page), use the mount method described above with a `<div>` element.
|
|
235
|
-
|
|
236
|
-
#### Return Value
|
|
237
|
-
|
|
238
|
-
The `mount` method returns a promise that resolves to `true` if the widget was successfully mounted, or `false` otherwise.
|
|
239
|
-
|
|
240
|
-
### unmount(): Promise\<boolean\>
|
|
241
|
-
|
|
242
|
-
The `unmount` method unmounts the widget from the element it's mounted at.
|
|
243
|
-
|
|
244
106
|
## Migration guide: Upgrading from v4 to v5
|
|
245
107
|
|
|
246
108
|
If you’re currently using version 4 of the Global Header Widget, please follow this guide to upgrade to version 5. This guide highlights the key changes and steps you need to take to ensure a smooth transition.
|
|
@@ -249,7 +111,7 @@ If you’re currently using version 4 of the Global Header Widget, please follow
|
|
|
249
111
|
|
|
250
112
|
No more client library or polyfill scripts: In version 5, you no longer need to include any additional client library or polyfill script links in your HTML. Access to the `window.globalHeaderClient` object is automatically provided when you include either the entry script or the embed script.
|
|
251
113
|
Action Required:
|
|
252
|
-
- Remove any `<script>` tags that reference client libraries or
|
|
114
|
+
- Remove any `<script>` tags that reference client libraries or polyfill libraries for the widget.
|
|
253
115
|
- Ensure that either the entry script or the embed script is included in your HTML.
|
|
254
116
|
|
|
255
117
|
### 2. Eliminate installable packages
|
package/dist/client.d.ts
CHANGED
|
@@ -1,8 +1,3 @@
|
|
|
1
|
-
import { Translatable } from './i18n';
|
|
2
|
-
import { MainLink, ProfileConfig } from './access-menu';
|
|
3
|
-
import { EnrichedServicePoints, ServicePoints } from './contact';
|
|
4
|
-
import { BrandingConfigColors, BrandingConfigHost, BrandingConfigUmbrella, Config } from './config';
|
|
5
|
-
import { ApplicationMenuLink } from './access-menu';
|
|
6
1
|
/**
|
|
7
2
|
* The `window.globalHeaderClient` object offers several methods for interacting with the widget.
|
|
8
3
|
* Each method is typed and returns promises, making asynchronous operations easier to handle.
|
|
@@ -13,13 +8,13 @@ export interface GlobalHeaderClient {
|
|
|
13
8
|
* Get the current service points
|
|
14
9
|
* @returns A promise that resolves to the current service points
|
|
15
10
|
*/
|
|
16
|
-
getServicePoints:
|
|
11
|
+
getServicePoints: ClientMethods['getServicePoints'];
|
|
17
12
|
/**
|
|
18
13
|
* Set the service points
|
|
19
14
|
* @param servicePoints The service points to set
|
|
20
15
|
* @returns A promise that resolves to the set service points
|
|
21
16
|
*/
|
|
22
|
-
setServicePoints:
|
|
17
|
+
setServicePoints: ClientMethods['setServicePoints'];
|
|
23
18
|
/**
|
|
24
19
|
* Reset the service points to the initial values from the configuration.
|
|
25
20
|
*
|
|
@@ -29,27 +24,27 @@ export interface GlobalHeaderClient {
|
|
|
29
24
|
*
|
|
30
25
|
* @returns A promise that resolves when the service points have been reset.
|
|
31
26
|
*/
|
|
32
|
-
resetServicePoints:
|
|
27
|
+
resetServicePoints: ClientMethods['resetServicePoints'];
|
|
33
28
|
/**
|
|
34
29
|
* Open the contact panel.
|
|
35
30
|
* @returns A promise that resolves to true if the contact panel was opened.
|
|
36
31
|
*/
|
|
37
|
-
open:
|
|
32
|
+
open: ClientMethods['openContact'];
|
|
38
33
|
/**
|
|
39
34
|
* Close the contact panel.
|
|
40
35
|
* @returns A promise that resolves to true if the contact panel was closed.
|
|
41
36
|
*/
|
|
42
|
-
close:
|
|
37
|
+
close: ClientMethods['closeContact'];
|
|
43
38
|
/**
|
|
44
39
|
* Toggle the contact panel.
|
|
45
40
|
* @returns A promise that resolves to true if the contact panel is now open.
|
|
46
41
|
*/
|
|
47
|
-
toggle:
|
|
42
|
+
toggle: ClientMethods['toggleContact'];
|
|
48
43
|
/**
|
|
49
44
|
* Check if the contact panel is open.
|
|
50
45
|
* @returns A promise that resolves to true if the contact panel is open.
|
|
51
46
|
*/
|
|
52
|
-
isOpen:
|
|
47
|
+
isOpen: ClientMethods['isContactOpen'];
|
|
53
48
|
};
|
|
54
49
|
accessMenu: {
|
|
55
50
|
/**
|
|
@@ -57,125 +52,156 @@ export interface GlobalHeaderClient {
|
|
|
57
52
|
* @param mainLinks The main links to set
|
|
58
53
|
* @returns A promise that resolves to true if the main links were set, false otherwise
|
|
59
54
|
*/
|
|
60
|
-
setMainLinks:
|
|
55
|
+
setMainLinks: ClientMethods['setMainLinks'];
|
|
61
56
|
/**
|
|
62
57
|
* Add an application menu link
|
|
63
58
|
* @param link The link to add
|
|
64
59
|
* @returns A promise that resolves to the updated application menu
|
|
65
60
|
*/
|
|
66
|
-
addApplicationMenuLink:
|
|
61
|
+
addApplicationMenuLink: ClientMethods['addApplicationMenuLink'];
|
|
67
62
|
/**
|
|
68
63
|
* Add multiple application menu links
|
|
69
64
|
* @param links The links to add
|
|
70
65
|
* @returns A promise that resolves to the updated application menu
|
|
71
66
|
*/
|
|
72
|
-
addApplicationMenuLinks:
|
|
67
|
+
addApplicationMenuLinks: ClientMethods['addApplicationMenuLinks'];
|
|
73
68
|
/**
|
|
74
69
|
* Set the application menu links
|
|
75
70
|
* @param links The links to set
|
|
76
71
|
* @returns A promise that resolves to the updated application menu
|
|
77
72
|
*/
|
|
78
|
-
setApplicationMenuLinks:
|
|
73
|
+
setApplicationMenuLinks: ClientMethods['setApplicationMenuLinks'];
|
|
79
74
|
/**
|
|
80
75
|
* Set the profile configuration
|
|
81
76
|
* @param profileConfig The profile configuration to set
|
|
82
77
|
* @returns A promise that resolves to true if the profile configuration was set, false otherwise
|
|
83
78
|
*/
|
|
84
|
-
setProfile:
|
|
79
|
+
setProfile: ClientMethods['setProfile'];
|
|
85
80
|
/**
|
|
86
81
|
* Get the profile configuration
|
|
87
82
|
* @returns A promise that resolves to the current profile configuration
|
|
88
83
|
*/
|
|
89
|
-
getProfile:
|
|
84
|
+
getProfile: ClientMethods['getProfile'];
|
|
90
85
|
};
|
|
91
86
|
branding: {
|
|
92
87
|
/**
|
|
93
88
|
* Get the level of branding
|
|
94
89
|
* @returns A promise that resolves to the branding level
|
|
95
90
|
*/
|
|
96
|
-
getLevel:
|
|
91
|
+
getLevel: ClientMethods['getBrandingLevel'];
|
|
97
92
|
/**
|
|
98
93
|
* Set the branding level
|
|
99
94
|
* @param level The level of branding to set
|
|
100
95
|
* @returns A promise that resolves to true if the branding level was set
|
|
101
96
|
*/
|
|
102
|
-
setLevel:
|
|
97
|
+
setLevel: ClientMethods['setBrandingLevel'];
|
|
103
98
|
/**
|
|
104
99
|
* Get the branding colors
|
|
105
100
|
* @returns A promise that resolves to the branding colors
|
|
106
101
|
*/
|
|
107
|
-
getColors:
|
|
102
|
+
getColors: ClientMethods['getBrandingColors'];
|
|
108
103
|
/**
|
|
109
104
|
* Get a specific branding color by type
|
|
110
105
|
* @param type The type of branding color to get
|
|
111
106
|
* @returns A promise that resolves to the branding color
|
|
112
107
|
*/
|
|
113
|
-
getColor:
|
|
108
|
+
getColor: ClientMethods['getBrandingColor'];
|
|
114
109
|
/**
|
|
115
110
|
* Set the branding colors
|
|
116
111
|
* @param colors The colors to set
|
|
117
112
|
* @returns A promise that resolves to true if the branding colors were set
|
|
118
113
|
*/
|
|
119
|
-
setColors:
|
|
114
|
+
setColors: ClientMethods['setBrandingColors'];
|
|
120
115
|
/**
|
|
121
116
|
* Set a specific branding color by type
|
|
122
117
|
* @param args The type of branding color and value to set
|
|
123
118
|
* @returns A promise that resolves to true if the branding color was set
|
|
124
119
|
*/
|
|
125
|
-
setColor:
|
|
126
|
-
type: keyof BrandingConfigColors;
|
|
127
|
-
value: string;
|
|
128
|
-
}) => Promise<boolean>;
|
|
120
|
+
setColor: ClientMethods['setBrandingColor'];
|
|
129
121
|
/**
|
|
130
122
|
* Get the host context
|
|
131
123
|
* @returns A promise that resolves to the branding host settings
|
|
132
124
|
*/
|
|
133
|
-
getHost:
|
|
125
|
+
getHost: ClientMethods['getBrandingHost'];
|
|
134
126
|
/**
|
|
135
127
|
* Set the host context
|
|
136
128
|
* @param host The branding host settings to set
|
|
137
129
|
* @returns A promise that resolves to true if the branding host was set
|
|
138
130
|
*/
|
|
139
|
-
setHost:
|
|
131
|
+
setHost: ClientMethods['setBrandingHost'];
|
|
140
132
|
/**
|
|
141
133
|
* Get the umbrella context
|
|
142
134
|
* @returns A promise that resolves to the branding umbrella settings
|
|
143
135
|
*/
|
|
144
|
-
getUmbrella:
|
|
136
|
+
getUmbrella: ClientMethods['getBrandingUmbrella'];
|
|
145
137
|
/**
|
|
146
138
|
* Set the umbrella context
|
|
147
139
|
* @param umbrella The branding umbrella settings to set
|
|
148
140
|
* @returns A promise that resolves to true if the branding umbrella was set
|
|
149
141
|
*/
|
|
150
|
-
setUmbrella:
|
|
142
|
+
setUmbrella: ClientMethods['setBrandingUmbrella'];
|
|
151
143
|
/**
|
|
152
144
|
* Get the branding CSS variables
|
|
153
145
|
* @returns A promise that resolves to the branding CSS variables
|
|
154
146
|
*/
|
|
155
|
-
getVariables:
|
|
147
|
+
getVariables: ClientMethods['getBrandingVariables'];
|
|
156
148
|
};
|
|
157
149
|
/**
|
|
158
150
|
* Set the navigation enabled state
|
|
159
151
|
* @param enabled The navigation enabled state
|
|
160
152
|
* @returns A promise that resolves to true if the navigation enabled state was set, false otherwise
|
|
161
153
|
*/
|
|
162
|
-
setNavigationEnabled:
|
|
154
|
+
setNavigationEnabled: ClientMethods['setNavigationEnabled'];
|
|
163
155
|
/**
|
|
164
156
|
* Get the current configuration
|
|
165
157
|
* @returns A promise that resolves to the current configuration
|
|
166
158
|
*/
|
|
167
|
-
getConfig:
|
|
159
|
+
getConfig: ClientMethods['getConfig'];
|
|
168
160
|
/**
|
|
169
|
-
*
|
|
161
|
+
* The `mount` method allows you to control where the **Global Header Widget** is rendered on the page. There are two main ways to integrate the widget, depending on whether you want to manually control its placement or let it render automatically:
|
|
162
|
+
*
|
|
163
|
+
* 1. **Using the 'entry' script**:
|
|
164
|
+
* When you include the widget via the following script:
|
|
165
|
+
*
|
|
166
|
+
* ```html
|
|
167
|
+
* <script src="https://prod.widgets.burgerprofiel.vlaanderen.be/api/v2/widget/__global_header_id__/entry"></script>
|
|
168
|
+
* ```
|
|
169
|
+
*
|
|
170
|
+
* The widget is **not automatically rendered** on the page. Instead, you must call the `mount` method from the `window.globalHeaderClient` object to display it. This gives you control over where and when the widget is added. You can either:
|
|
171
|
+
*
|
|
172
|
+
* - **Mount to a specific element**:
|
|
173
|
+
* Pass an HTML element to the `mount` method to render the widget inside that element.
|
|
174
|
+
*
|
|
175
|
+
* ```typescript
|
|
176
|
+
* const element = document.getElementById('customHeader');
|
|
177
|
+
* window.globalHeaderClient.mount(element);
|
|
178
|
+
* ```
|
|
179
|
+
*
|
|
180
|
+
* - **Mount without specifying an element**:
|
|
181
|
+
* If no element is provided, the widget will automatically render at the top of the page.
|
|
182
|
+
*
|
|
183
|
+
* ```typescript
|
|
184
|
+
* window.globalHeaderClient.mount();
|
|
185
|
+
* ```
|
|
186
|
+
*
|
|
187
|
+
* 2. **Using the 'embed' script**:
|
|
188
|
+
* If you use this script instead:
|
|
189
|
+
*
|
|
190
|
+
* ```html
|
|
191
|
+
* <script src="https://prod.widgets.burgerprofiel.vlaanderen.be/api/v2/widget/__global_header_id__/embed"></script>
|
|
192
|
+
* ```
|
|
193
|
+
*
|
|
194
|
+
* The widget will **automatically render** as a `<div>` at the location where the script is placed in the HTML. No additional action is needed to mount the widget in this case. For accessibility reasons, the header is marked with `role="banner"`. If you prefer not to include this role (e.g., to avoid multiple banner roles on a page), use the mount method described above with a `<div>` element.
|
|
195
|
+
*
|
|
170
196
|
* @param element The element to mount
|
|
171
|
-
* @returns A promise that resolves to true if the element was mounted, false otherwise
|
|
197
|
+
* @returns A promise that resolves to `true` if the element was mounted, `false` otherwise
|
|
172
198
|
*/
|
|
173
|
-
mount:
|
|
199
|
+
mount: ClientMethods['mount'];
|
|
174
200
|
/**
|
|
175
201
|
* Unmount an element
|
|
176
202
|
* @returns A promise that resolves to true if the element was unmounted, false otherwise
|
|
177
203
|
*/
|
|
178
|
-
unmount:
|
|
204
|
+
unmount: ClientMethods['unmount'];
|
|
179
205
|
}
|
|
180
206
|
declare global {
|
|
181
207
|
interface Window {
|
package/docs/hierarchy.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>Global Header Client</title><meta name="description" content="Documentation for Global Header Client"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="assets/style.css"/><link rel="stylesheet" href="assets/highlight.css"/><script defer src="assets/main.js"></script><script async src="assets/icons.js" id="tsd-icons-script"></script><script async src="assets/search.js" id="tsd-search-script"></script><script async src="assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base="."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="index.html" class="title">Global Header Client</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><h1>Global Header Client</h1></div><h2>Class Hierarchy</h2><ul class="tsd-full-hierarchy"><li><a id="Link" class="tsd-anchor"></a><a href="interfaces/Link.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-256"></use></svg>Link</a><ul><li><a id="LinkWithTarget" class="tsd-anchor"></a><a href="interfaces/LinkWithTarget.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-256"></use></svg>LinkWithTarget</a><ul><li><a id="BrandingConfigUmbrella" class="tsd-anchor"></a><a href="interfaces/BrandingConfigUmbrella.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-256"></use></svg>BrandingConfigUmbrella</a><ul></ul></li><li><a id="BrandingConfigHost" class="tsd-anchor"></a><a href="interfaces/BrandingConfigHost.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-256"></use></svg>BrandingConfigHost</a><ul></ul></li></ul></li></ul></li></ul><ul class="tsd-full-hierarchy"><li><a id="ServicePoints" class="tsd-anchor"></a><a href="interfaces/ServicePoints.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-256"></use></svg>ServicePoints</a><ul><li><a id="EnrichedServicePoints" class="tsd-anchor"></a><a href="interfaces/EnrichedServicePoints.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-256"></use></svg>EnrichedServicePoints</a><ul></ul></li></ul></li></ul></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html" class="current"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-1"></use></svg><span>Global Header Client</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base="."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
|