@vaadin/side-nav 25.1.0-alpha7 → 25.1.0-alpha9

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.
@@ -40,8 +40,39 @@
40
40
  "kind": "mixin",
41
41
  "description": "",
42
42
  "name": "SideNavChildrenMixin",
43
- "members": [],
44
- "attributes": [],
43
+ "members": [
44
+ {
45
+ "kind": "field",
46
+ "name": "i18n",
47
+ "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n toggle: 'Toggle child items'\n}\n```",
48
+ "return": {
49
+ "type": {
50
+ "text": "!SideNavI18n"
51
+ }
52
+ },
53
+ "parameters": [
54
+ {
55
+ "name": "value",
56
+ "type": {
57
+ "text": "Object"
58
+ }
59
+ }
60
+ ],
61
+ "inheritedFrom": {
62
+ "name": "I18nMixin",
63
+ "package": "@vaadin/component-base/src/i18n-mixin.js"
64
+ }
65
+ }
66
+ ],
67
+ "attributes": [
68
+ {
69
+ "name": "i18n",
70
+ "inheritedFrom": {
71
+ "name": "I18nMixin",
72
+ "package": "@vaadin/component-base/src/i18n-mixin.js"
73
+ }
74
+ }
75
+ ],
45
76
  "mixins": [
46
77
  {
47
78
  "name": "I18nMixin",
@@ -95,6 +126,28 @@
95
126
  "description": "Whether to show the child items or not",
96
127
  "attribute": "expanded"
97
128
  },
129
+ {
130
+ "kind": "field",
131
+ "name": "i18n",
132
+ "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n toggle: 'Toggle child items'\n}\n```",
133
+ "return": {
134
+ "type": {
135
+ "text": "!SideNavI18n"
136
+ }
137
+ },
138
+ "parameters": [
139
+ {
140
+ "name": "value",
141
+ "type": {
142
+ "text": "Object"
143
+ }
144
+ }
145
+ ],
146
+ "inheritedFrom": {
147
+ "name": "I18nMixin",
148
+ "package": "@vaadin/component-base/src/i18n-mixin.js"
149
+ }
150
+ },
98
151
  {
99
152
  "kind": "field",
100
153
  "name": "matchNested",
@@ -166,6 +219,13 @@
166
219
  "description": "Whether to show the child items or not",
167
220
  "fieldName": "expanded"
168
221
  },
222
+ {
223
+ "name": "i18n",
224
+ "inheritedFrom": {
225
+ "name": "I18nMixin",
226
+ "package": "@vaadin/component-base/src/i18n-mixin.js"
227
+ }
228
+ },
169
229
  {
170
230
  "name": "match-nested",
171
231
  "type": {
@@ -267,6 +327,28 @@
267
327
  "description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
268
328
  "attribute": "collapsible"
269
329
  },
330
+ {
331
+ "kind": "field",
332
+ "name": "i18n",
333
+ "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n toggle: 'Toggle child items'\n}\n```",
334
+ "return": {
335
+ "type": {
336
+ "text": "!SideNavI18n"
337
+ }
338
+ },
339
+ "parameters": [
340
+ {
341
+ "name": "value",
342
+ "type": {
343
+ "text": "Object"
344
+ }
345
+ }
346
+ ],
347
+ "inheritedFrom": {
348
+ "name": "I18nMixin",
349
+ "package": "@vaadin/component-base/src/i18n-mixin.js"
350
+ }
351
+ },
270
352
  {
271
353
  "kind": "field",
272
354
  "name": "location",
@@ -323,6 +405,13 @@
323
405
  "description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
324
406
  "fieldName": "collapsible"
325
407
  },
408
+ {
409
+ "name": "i18n",
410
+ "inheritedFrom": {
411
+ "name": "I18nMixin",
412
+ "package": "@vaadin/component-base/src/i18n-mixin.js"
413
+ }
414
+ },
326
415
  {
327
416
  "name": "location",
328
417
  "description": "A change to this property triggers an update of the highlighted item in the side navigation. While it typically\ncorresponds to the browser's URL, the specific value assigned to the property is irrelevant. The component has\nits own internal logic for determining which item is highlighted.\n\nThe main use case for this property is when the side navigation is used with a client-side router. In this case,\nthe component needs to be informed about route changes so it can update the highlighted item.",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/side-nav",
3
- "version": "25.1.0-alpha7",
3
+ "version": "25.1.0-alpha9",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -35,19 +35,19 @@
35
35
  ],
36
36
  "dependencies": {
37
37
  "@open-wc/dedupe-mixin": "^1.3.0",
38
- "@vaadin/a11y-base": "25.1.0-alpha7",
39
- "@vaadin/component-base": "25.1.0-alpha7",
40
- "@vaadin/vaadin-themable-mixin": "25.1.0-alpha7",
38
+ "@vaadin/a11y-base": "25.1.0-alpha9",
39
+ "@vaadin/component-base": "25.1.0-alpha9",
40
+ "@vaadin/vaadin-themable-mixin": "25.1.0-alpha9",
41
41
  "lit": "^3.0.0"
42
42
  },
43
43
  "devDependencies": {
44
- "@vaadin/aura": "25.1.0-alpha7",
45
- "@vaadin/chai-plugins": "25.1.0-alpha7",
46
- "@vaadin/icon": "25.1.0-alpha7",
47
- "@vaadin/icons": "25.1.0-alpha7",
48
- "@vaadin/test-runner-commands": "25.1.0-alpha7",
44
+ "@vaadin/aura": "25.1.0-alpha9",
45
+ "@vaadin/chai-plugins": "25.1.0-alpha9",
46
+ "@vaadin/icon": "25.1.0-alpha9",
47
+ "@vaadin/icons": "25.1.0-alpha9",
48
+ "@vaadin/test-runner-commands": "25.1.0-alpha9",
49
49
  "@vaadin/testing-helpers": "^2.0.0",
50
- "@vaadin/vaadin-lumo-styles": "25.1.0-alpha7",
50
+ "@vaadin/vaadin-lumo-styles": "25.1.0-alpha9",
51
51
  "lit": "^3.0.0",
52
52
  "sinon": "^21.0.0"
53
53
  },
@@ -56,5 +56,5 @@
56
56
  "web-types.json",
57
57
  "web-types.lit.json"
58
58
  ],
59
- "gitHead": "98c586125f769c8fefd307536965293668fda81d"
59
+ "gitHead": "ef432311376ba3dac4233cb23d393a49a425e0a4"
60
60
  }
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/side-nav",
4
- "version": "25.1.0-alpha7",
4
+ "version": "25.1.0-alpha9",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -21,17 +21,6 @@
21
21
  ]
22
22
  }
23
23
  },
24
- {
25
- "name": "path",
26
- "description": "The path to navigate to",
27
- "value": {
28
- "type": [
29
- "string",
30
- "null",
31
- "undefined"
32
- ]
33
- }
34
- },
35
24
  {
36
25
  "name": "expanded",
37
26
  "description": "Whether to show the child items or not",
@@ -51,8 +40,8 @@
51
40
  }
52
41
  },
53
42
  {
54
- "name": "target",
55
- "description": "The target of the link. Works only when `path` is set.",
43
+ "name": "path",
44
+ "description": "The path to navigate to",
56
45
  "value": {
57
46
  "type": [
58
47
  "string",
@@ -70,6 +59,17 @@
70
59
  ]
71
60
  }
72
61
  },
62
+ {
63
+ "name": "target",
64
+ "description": "The target of the link. Works only when `path` is set.",
65
+ "value": {
66
+ "type": [
67
+ "string",
68
+ "null",
69
+ "undefined"
70
+ ]
71
+ }
72
+ },
73
73
  {
74
74
  "name": "theme",
75
75
  "description": "The theme variants to apply to the component.",
@@ -95,6 +95,15 @@
95
95
  ]
96
96
  }
97
97
  },
98
+ {
99
+ "name": "expanded",
100
+ "description": "Whether to show the child items or not",
101
+ "value": {
102
+ "type": [
103
+ "boolean"
104
+ ]
105
+ }
106
+ },
98
107
  {
99
108
  "name": "i18n",
100
109
  "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n toggle: 'Toggle child items'\n}\n```",
@@ -104,6 +113,15 @@
104
113
  ]
105
114
  }
106
115
  },
116
+ {
117
+ "name": "matchNested",
118
+ "description": "Whether to also match nested paths / routes. `false` by default.\n\nWhen enabled, an item with the path `/path` is considered current when\nthe browser URL is `/path`, `/path/child`, `/path/child/grandchild`,\netc.\n\nNote that this only affects matching of the URLs path, not the base\norigin or query parameters.",
119
+ "value": {
120
+ "type": [
121
+ "boolean"
122
+ ]
123
+ }
124
+ },
107
125
  {
108
126
  "name": "path",
109
127
  "description": "The path to navigate to",
@@ -125,17 +143,8 @@
125
143
  }
126
144
  },
127
145
  {
128
- "name": "expanded",
129
- "description": "Whether to show the child items or not",
130
- "value": {
131
- "type": [
132
- "boolean"
133
- ]
134
- }
135
- },
136
- {
137
- "name": "matchNested",
138
- "description": "Whether to also match nested paths / routes. `false` by default.\n\nWhen enabled, an item with the path `/path` is considered current when\nthe browser URL is `/path`, `/path/child`, `/path/child/grandchild`,\netc.\n\nNote that this only affects matching of the URLs path, not the base\norigin or query parameters.",
146
+ "name": "routerIgnore",
147
+ "description": "Whether to exclude the item from client-side routing. When enabled,\nthis causes the item to behave like a regular anchor, causing a full\npage reload. This only works with supported routers, such as the one\nprovided in Vaadin apps, or when using the side nav `onNavigate` hook.",
139
148
  "value": {
140
149
  "type": [
141
150
  "boolean"
@@ -152,15 +161,6 @@
152
161
  "undefined"
153
162
  ]
154
163
  }
155
- },
156
- {
157
- "name": "routerIgnore",
158
- "description": "Whether to exclude the item from client-side routing. When enabled,\nthis causes the item to behave like a regular anchor, causing a full\npage reload. This only works with supported routers, such as the one\nprovided in Vaadin apps, or when using the side nav `onNavigate` hook.",
159
- "value": {
160
- "type": [
161
- "boolean"
162
- ]
163
- }
164
164
  }
165
165
  ],
166
166
  "events": [
@@ -175,15 +175,6 @@
175
175
  "name": "vaadin-side-nav",
176
176
  "description": "`<vaadin-side-nav>` is a Web Component for navigation menus.\n\n```html\n<vaadin-side-nav>\n <vaadin-side-nav-item>Item 1</vaadin-side-nav-item>\n <vaadin-side-nav-item>Item 2</vaadin-side-nav-item>\n <vaadin-side-nav-item>Item 3</vaadin-side-nav-item>\n <vaadin-side-nav-item>Item 4</vaadin-side-nav-item>\n</vaadin-side-nav>\n```\n\n### Customization\n\nYou can configure the component by using `slot` names.\n\nSlot name | Description\n----------|-------------\n`label` | The label (text) inside the side nav.\n\n#### Example\n\n```html\n<vaadin-side-nav>\n <span slot=\"label\">Main menu</span>\n <vaadin-side-nav-item>Item</vaadin-side-nav-item>\n</vaadin-side-nav>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n----------------|----------------\n`label` | The label element\n`children` | The element that wraps child items\n`toggle-button` | The toggle button\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------|-------------\n`collapsed` | Set when the element is collapsed.\n`focus-ring` | Set when the label is focused using the keyboard.\n`focused` | Set when the label is focused.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
177
177
  "attributes": [
178
- {
179
- "name": "collapsible",
180
- "description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
181
- "value": {
182
- "type": [
183
- "boolean"
184
- ]
185
- }
186
- },
187
178
  {
188
179
  "name": "collapsed",
189
180
  "description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
@@ -194,12 +185,11 @@
194
185
  }
195
186
  },
196
187
  {
197
- "name": "on-navigate",
198
- "description": "Callback function for router integration.\n\nWhen a side nav item link is clicked, this function is called and the default click action is cancelled.\nThis delegates the responsibility of navigation to the function's logic.\n\nThe click event action is not cancelled in the following cases:\n- The click event has a modifier (e.g. `metaKey`, `shiftKey`)\n- The click event is on an external link\n- The click event is on a link with `target=\"_blank\"`\n- The function explicitly returns `false`\n\nThe function receives an object with the properties of the clicked side-nav item:\n- `path`: The path of the navigation item.\n- `target`: The target of the navigation item.\n- `current`: A boolean indicating whether the navigation item is currently selected.\n- `expanded`: A boolean indicating whether the navigation item is expanded.\n- `pathAliases`: An array of path aliases for the navigation item.\n- `originalEvent`: The original DOM event that triggered the navigation.\n\nAlso see the `location` property for updating the highlighted navigation item on route change.",
188
+ "name": "collapsible",
189
+ "description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
199
190
  "value": {
200
191
  "type": [
201
- "function Object: boolean",
202
- "undefined"
192
+ "boolean"
203
193
  ]
204
194
  }
205
195
  },
@@ -223,6 +213,16 @@
223
213
  ]
224
214
  }
225
215
  },
216
+ {
217
+ "name": "on-navigate",
218
+ "description": "Callback function for router integration.\n\nWhen a side nav item link is clicked, this function is called and the default click action is cancelled.\nThis delegates the responsibility of navigation to the function's logic.\n\nThe click event action is not cancelled in the following cases:\n- The click event has a modifier (e.g. `metaKey`, `shiftKey`)\n- The click event is on an external link\n- The click event is on a link with `target=\"_blank\"`\n- The function explicitly returns `false`\n\nThe function receives an object with the properties of the clicked side-nav item:\n- `path`: The path of the navigation item.\n- `target`: The target of the navigation item.\n- `current`: A boolean indicating whether the navigation item is currently selected.\n- `expanded`: A boolean indicating whether the navigation item is expanded.\n- `pathAliases`: An array of path aliases for the navigation item.\n- `originalEvent`: The original DOM event that triggered the navigation.\n\nAlso see the `location` property for updating the highlighted navigation item on route change.",
219
+ "value": {
220
+ "type": [
221
+ "function Object: boolean",
222
+ "undefined"
223
+ ]
224
+ }
225
+ },
226
226
  {
227
227
  "name": "theme",
228
228
  "description": "The theme variants to apply to the component.",
@@ -238,11 +238,11 @@
238
238
  "js": {
239
239
  "properties": [
240
240
  {
241
- "name": "i18n",
242
- "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n toggle: 'Toggle child items'\n}\n```",
241
+ "name": "collapsed",
242
+ "description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
243
243
  "value": {
244
244
  "type": [
245
- "SideNavI18n"
245
+ "boolean"
246
246
  ]
247
247
  }
248
248
  },
@@ -256,21 +256,11 @@
256
256
  }
257
257
  },
258
258
  {
259
- "name": "collapsed",
260
- "description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
261
- "value": {
262
- "type": [
263
- "boolean"
264
- ]
265
- }
266
- },
267
- {
268
- "name": "onNavigate",
269
- "description": "Callback function for router integration.\n\nWhen a side nav item link is clicked, this function is called and the default click action is cancelled.\nThis delegates the responsibility of navigation to the function's logic.\n\nThe click event action is not cancelled in the following cases:\n- The click event has a modifier (e.g. `metaKey`, `shiftKey`)\n- The click event is on an external link\n- The click event is on a link with `target=\"_blank\"`\n- The function explicitly returns `false`\n\nThe function receives an object with the properties of the clicked side-nav item:\n- `path`: The path of the navigation item.\n- `target`: The target of the navigation item.\n- `current`: A boolean indicating whether the navigation item is currently selected.\n- `expanded`: A boolean indicating whether the navigation item is expanded.\n- `pathAliases`: An array of path aliases for the navigation item.\n- `originalEvent`: The original DOM event that triggered the navigation.\n\nAlso see the `location` property for updating the highlighted navigation item on route change.",
259
+ "name": "i18n",
260
+ "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n toggle: 'Toggle child items'\n}\n```",
270
261
  "value": {
271
262
  "type": [
272
- "function Object: boolean",
273
- "undefined"
263
+ "SideNavI18n"
274
264
  ]
275
265
  }
276
266
  },
@@ -293,6 +283,16 @@
293
283
  "undefined"
294
284
  ]
295
285
  }
286
+ },
287
+ {
288
+ "name": "onNavigate",
289
+ "description": "Callback function for router integration.\n\nWhen a side nav item link is clicked, this function is called and the default click action is cancelled.\nThis delegates the responsibility of navigation to the function's logic.\n\nThe click event action is not cancelled in the following cases:\n- The click event has a modifier (e.g. `metaKey`, `shiftKey`)\n- The click event is on an external link\n- The click event is on a link with `target=\"_blank\"`\n- The function explicitly returns `false`\n\nThe function receives an object with the properties of the clicked side-nav item:\n- `path`: The path of the navigation item.\n- `target`: The target of the navigation item.\n- `current`: A boolean indicating whether the navigation item is currently selected.\n- `expanded`: A boolean indicating whether the navigation item is expanded.\n- `pathAliases`: An array of path aliases for the navigation item.\n- `originalEvent`: The original DOM event that triggered the navigation.\n\nAlso see the `location` property for updating the highlighted navigation item on route change.",
290
+ "value": {
291
+ "type": [
292
+ "function Object: boolean",
293
+ "undefined"
294
+ ]
295
+ }
296
296
  }
297
297
  ],
298
298
  "events": [
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/side-nav",
4
- "version": "25.1.0-alpha7",
4
+ "version": "25.1.0-alpha9",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {
@@ -90,29 +90,29 @@
90
90
  "extension": true,
91
91
  "attributes": [
92
92
  {
93
- "name": "?collapsible",
94
- "description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
93
+ "name": "?collapsed",
94
+ "description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
95
95
  "value": {
96
96
  "kind": "expression"
97
97
  }
98
98
  },
99
99
  {
100
- "name": "?collapsed",
101
- "description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
100
+ "name": "?collapsible",
101
+ "description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
102
102
  "value": {
103
103
  "kind": "expression"
104
104
  }
105
105
  },
106
106
  {
107
- "name": "?onNavigate",
108
- "description": "Callback function for router integration.\n\nWhen a side nav item link is clicked, this function is called and the default click action is cancelled.\nThis delegates the responsibility of navigation to the function's logic.\n\nThe click event action is not cancelled in the following cases:\n- The click event has a modifier (e.g. `metaKey`, `shiftKey`)\n- The click event is on an external link\n- The click event is on a link with `target=\"_blank\"`\n- The function explicitly returns `false`\n\nThe function receives an object with the properties of the clicked side-nav item:\n- `path`: The path of the navigation item.\n- `target`: The target of the navigation item.\n- `current`: A boolean indicating whether the navigation item is currently selected.\n- `expanded`: A boolean indicating whether the navigation item is expanded.\n- `pathAliases`: An array of path aliases for the navigation item.\n- `originalEvent`: The original DOM event that triggered the navigation.\n\nAlso see the `location` property for updating the highlighted navigation item on route change.",
107
+ "name": "?noAutoExpand",
108
+ "description": "Whether to expand parent items of the nested matching item after initial\nrendering or navigation. By default, all the parent items are expanded.\nSet to true to disable this behavior.",
109
109
  "value": {
110
110
  "kind": "expression"
111
111
  }
112
112
  },
113
113
  {
114
- "name": "?noAutoExpand",
115
- "description": "Whether to expand parent items of the nested matching item after initial\nrendering or navigation. By default, all the parent items are expanded.\nSet to true to disable this behavior.",
114
+ "name": "?onNavigate",
115
+ "description": "Callback function for router integration.\n\nWhen a side nav item link is clicked, this function is called and the default click action is cancelled.\nThis delegates the responsibility of navigation to the function's logic.\n\nThe click event action is not cancelled in the following cases:\n- The click event has a modifier (e.g. `metaKey`, `shiftKey`)\n- The click event is on an external link\n- The click event is on a link with `target=\"_blank\"`\n- The function explicitly returns `false`\n\nThe function receives an object with the properties of the clicked side-nav item:\n- `path`: The path of the navigation item.\n- `target`: The target of the navigation item.\n- `current`: A boolean indicating whether the navigation item is currently selected.\n- `expanded`: A boolean indicating whether the navigation item is expanded.\n- `pathAliases`: An array of path aliases for the navigation item.\n- `originalEvent`: The original DOM event that triggered the navigation.\n\nAlso see the `location` property for updating the highlighted navigation item on route change.",
116
116
  "value": {
117
117
  "kind": "expression"
118
118
  }