@vaadin/side-nav 24.4.0-alpha1 → 24.4.0-dev.223e39f050
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/package.json +8 -7
- package/web-types.json +0 -191
- package/web-types.lit.json +0 -104
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/side-nav",
|
|
3
|
-
"version": "24.4.0-
|
|
3
|
+
"version": "24.4.0-dev.223e39f050",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -34,11 +34,12 @@
|
|
|
34
34
|
"web-component"
|
|
35
35
|
],
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@
|
|
38
|
-
"@vaadin/
|
|
39
|
-
"@vaadin/
|
|
40
|
-
"@vaadin/vaadin-
|
|
41
|
-
"@vaadin/vaadin-
|
|
37
|
+
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
38
|
+
"@vaadin/a11y-base": "24.4.0-dev.223e39f050",
|
|
39
|
+
"@vaadin/component-base": "24.4.0-dev.223e39f050",
|
|
40
|
+
"@vaadin/vaadin-lumo-styles": "24.4.0-dev.223e39f050",
|
|
41
|
+
"@vaadin/vaadin-material-styles": "24.4.0-dev.223e39f050",
|
|
42
|
+
"@vaadin/vaadin-themable-mixin": "24.4.0-dev.223e39f050",
|
|
42
43
|
"lit": "^3.0.0"
|
|
43
44
|
},
|
|
44
45
|
"devDependencies": {
|
|
@@ -51,5 +52,5 @@
|
|
|
51
52
|
"web-types.json",
|
|
52
53
|
"web-types.lit.json"
|
|
53
54
|
],
|
|
54
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "5e2e3bfc811c95aed9354235fab93fdbf43eb354"
|
|
55
56
|
}
|
package/web-types.json
DELETED
|
@@ -1,191 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$schema": "https://json.schemastore.org/web-types",
|
|
3
|
-
"name": "@vaadin/side-nav",
|
|
4
|
-
"version": "24.4.0-alpha1",
|
|
5
|
-
"description-markup": "markdown",
|
|
6
|
-
"contributions": {
|
|
7
|
-
"html": {
|
|
8
|
-
"elements": [
|
|
9
|
-
{
|
|
10
|
-
"name": "vaadin-side-nav-item",
|
|
11
|
-
"description": "A navigation item to be used within `<vaadin-side-nav>`. Represents a navigation target.\nNot intended to be used separately.\n\n```html\n<vaadin-side-nav-item>\n Item 1\n <vaadin-side-nav-item path=\"/path1\" slot=\"children\">\n Child item 1\n </vaadin-side-nav-item>\n <vaadin-side-nav-item path=\"/path2\" slot=\"children\">\n Child item 2\n </vaadin-side-nav-item>\n</vaadin-side-nav-item>\n```\n\n### Customization\n\nYou can configure the item by using `slot` names.\n\nSlot name | Description\n----------|-------------\n`prefix` | A slot for content before the label (e.g. an icon).\n`suffix` | A slot for content after the label (e.g. an icon).\n\n#### Example\n\n```html\n<vaadin-side-nav-item>\n <vaadin-icon icon=\"vaadin:chart\" slot=\"prefix\"></vaadin-icon>\n Item\n <span theme=\"badge primary\" slot=\"suffix\">Suffix</span>\n</vaadin-side-nav-item>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n----------------|----------------\n`content` | The element that wraps link and toggle button\n`children` | The element that wraps child items\n`link` | The clickable anchor used for navigation\n`toggle-button` | The toggle button\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n---------------|-------------\n`disabled` | Set when the element is disabled.\n`expanded` | Set when the element is expanded.\n`has-children` | Set when the element has child items.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
|
|
12
|
-
"attributes": [
|
|
13
|
-
{
|
|
14
|
-
"name": "disabled",
|
|
15
|
-
"description": "If true, the user cannot interact with this element.",
|
|
16
|
-
"value": {
|
|
17
|
-
"type": [
|
|
18
|
-
"boolean",
|
|
19
|
-
"null",
|
|
20
|
-
"undefined"
|
|
21
|
-
]
|
|
22
|
-
}
|
|
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
|
-
{
|
|
36
|
-
"name": "expanded",
|
|
37
|
-
"description": "Whether to show the child items or not",
|
|
38
|
-
"value": {
|
|
39
|
-
"type": [
|
|
40
|
-
"boolean"
|
|
41
|
-
]
|
|
42
|
-
}
|
|
43
|
-
},
|
|
44
|
-
{
|
|
45
|
-
"name": "theme",
|
|
46
|
-
"description": "The theme variants to apply to the component.",
|
|
47
|
-
"value": {
|
|
48
|
-
"type": [
|
|
49
|
-
"string",
|
|
50
|
-
"null",
|
|
51
|
-
"undefined"
|
|
52
|
-
]
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
],
|
|
56
|
-
"js": {
|
|
57
|
-
"properties": [
|
|
58
|
-
{
|
|
59
|
-
"name": "disabled",
|
|
60
|
-
"description": "If true, the user cannot interact with this element.",
|
|
61
|
-
"value": {
|
|
62
|
-
"type": [
|
|
63
|
-
"boolean",
|
|
64
|
-
"null",
|
|
65
|
-
"undefined"
|
|
66
|
-
]
|
|
67
|
-
}
|
|
68
|
-
},
|
|
69
|
-
{
|
|
70
|
-
"name": "i18n",
|
|
71
|
-
"description": "The object used to localize this component.\n\nTo change the default localization, replace the entire\n`i18n` object with a custom one.\n\nThe object has the following structure and default values:\n```\n{\n toggle: 'Toggle child items'\n}\n```",
|
|
72
|
-
"value": {
|
|
73
|
-
"type": [
|
|
74
|
-
"SideNavI18n"
|
|
75
|
-
]
|
|
76
|
-
}
|
|
77
|
-
},
|
|
78
|
-
{
|
|
79
|
-
"name": "path",
|
|
80
|
-
"description": "The path to navigate to",
|
|
81
|
-
"value": {
|
|
82
|
-
"type": [
|
|
83
|
-
"string",
|
|
84
|
-
"null",
|
|
85
|
-
"undefined"
|
|
86
|
-
]
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
"name": "pathAliases",
|
|
91
|
-
"description": "The list of alternative paths matching this item",
|
|
92
|
-
"value": {
|
|
93
|
-
"type": [
|
|
94
|
-
"Array.<string>"
|
|
95
|
-
]
|
|
96
|
-
}
|
|
97
|
-
},
|
|
98
|
-
{
|
|
99
|
-
"name": "expanded",
|
|
100
|
-
"description": "Whether to show the child items or not",
|
|
101
|
-
"value": {
|
|
102
|
-
"type": [
|
|
103
|
-
"boolean"
|
|
104
|
-
]
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
],
|
|
108
|
-
"events": [
|
|
109
|
-
{
|
|
110
|
-
"name": "expanded-changed",
|
|
111
|
-
"description": "Fired when the `expanded` property changes."
|
|
112
|
-
}
|
|
113
|
-
]
|
|
114
|
-
}
|
|
115
|
-
},
|
|
116
|
-
{
|
|
117
|
-
"name": "vaadin-side-nav",
|
|
118
|
-
"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.",
|
|
119
|
-
"attributes": [
|
|
120
|
-
{
|
|
121
|
-
"name": "collapsible",
|
|
122
|
-
"description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
|
|
123
|
-
"value": {
|
|
124
|
-
"type": [
|
|
125
|
-
"boolean"
|
|
126
|
-
]
|
|
127
|
-
}
|
|
128
|
-
},
|
|
129
|
-
{
|
|
130
|
-
"name": "collapsed",
|
|
131
|
-
"description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
|
|
132
|
-
"value": {
|
|
133
|
-
"type": [
|
|
134
|
-
"boolean"
|
|
135
|
-
]
|
|
136
|
-
}
|
|
137
|
-
},
|
|
138
|
-
{
|
|
139
|
-
"name": "theme",
|
|
140
|
-
"description": "The theme variants to apply to the component.",
|
|
141
|
-
"value": {
|
|
142
|
-
"type": [
|
|
143
|
-
"string",
|
|
144
|
-
"null",
|
|
145
|
-
"undefined"
|
|
146
|
-
]
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
],
|
|
150
|
-
"js": {
|
|
151
|
-
"properties": [
|
|
152
|
-
{
|
|
153
|
-
"name": "i18n",
|
|
154
|
-
"description": "The object used to localize this component.\n\nTo change the default localization, replace the entire\n`i18n` object with a custom one.\n\nThe object has the following structure and default values:\n```\n{\n toggle: 'Toggle child items'\n}\n```",
|
|
155
|
-
"value": {
|
|
156
|
-
"type": [
|
|
157
|
-
"SideNavI18n"
|
|
158
|
-
]
|
|
159
|
-
}
|
|
160
|
-
},
|
|
161
|
-
{
|
|
162
|
-
"name": "collapsible",
|
|
163
|
-
"description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
|
|
164
|
-
"value": {
|
|
165
|
-
"type": [
|
|
166
|
-
"boolean"
|
|
167
|
-
]
|
|
168
|
-
}
|
|
169
|
-
},
|
|
170
|
-
{
|
|
171
|
-
"name": "collapsed",
|
|
172
|
-
"description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
|
|
173
|
-
"value": {
|
|
174
|
-
"type": [
|
|
175
|
-
"boolean"
|
|
176
|
-
]
|
|
177
|
-
}
|
|
178
|
-
}
|
|
179
|
-
],
|
|
180
|
-
"events": [
|
|
181
|
-
{
|
|
182
|
-
"name": "collapsed-changed",
|
|
183
|
-
"description": "Fired when the `collapsed` property changes."
|
|
184
|
-
}
|
|
185
|
-
]
|
|
186
|
-
}
|
|
187
|
-
}
|
|
188
|
-
]
|
|
189
|
-
}
|
|
190
|
-
}
|
|
191
|
-
}
|
package/web-types.lit.json
DELETED
|
@@ -1,104 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$schema": "https://json.schemastore.org/web-types",
|
|
3
|
-
"name": "@vaadin/side-nav",
|
|
4
|
-
"version": "24.4.0-alpha1",
|
|
5
|
-
"description-markup": "markdown",
|
|
6
|
-
"framework": "lit",
|
|
7
|
-
"framework-config": {
|
|
8
|
-
"enable-when": {
|
|
9
|
-
"node-packages": [
|
|
10
|
-
"lit"
|
|
11
|
-
]
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
"contributions": {
|
|
15
|
-
"html": {
|
|
16
|
-
"elements": [
|
|
17
|
-
{
|
|
18
|
-
"name": "vaadin-side-nav-item",
|
|
19
|
-
"description": "A navigation item to be used within `<vaadin-side-nav>`. Represents a navigation target.\nNot intended to be used separately.\n\n```html\n<vaadin-side-nav-item>\n Item 1\n <vaadin-side-nav-item path=\"/path1\" slot=\"children\">\n Child item 1\n </vaadin-side-nav-item>\n <vaadin-side-nav-item path=\"/path2\" slot=\"children\">\n Child item 2\n </vaadin-side-nav-item>\n</vaadin-side-nav-item>\n```\n\n### Customization\n\nYou can configure the item by using `slot` names.\n\nSlot name | Description\n----------|-------------\n`prefix` | A slot for content before the label (e.g. an icon).\n`suffix` | A slot for content after the label (e.g. an icon).\n\n#### Example\n\n```html\n<vaadin-side-nav-item>\n <vaadin-icon icon=\"vaadin:chart\" slot=\"prefix\"></vaadin-icon>\n Item\n <span theme=\"badge primary\" slot=\"suffix\">Suffix</span>\n</vaadin-side-nav-item>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n----------------|----------------\n`content` | The element that wraps link and toggle button\n`children` | The element that wraps child items\n`link` | The clickable anchor used for navigation\n`toggle-button` | The toggle button\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n---------------|-------------\n`disabled` | Set when the element is disabled.\n`expanded` | Set when the element is expanded.\n`has-children` | Set when the element has child items.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
|
|
20
|
-
"extension": true,
|
|
21
|
-
"attributes": [
|
|
22
|
-
{
|
|
23
|
-
"name": "?disabled",
|
|
24
|
-
"description": "If true, the user cannot interact with this element.",
|
|
25
|
-
"value": {
|
|
26
|
-
"kind": "expression"
|
|
27
|
-
}
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
"name": "?expanded",
|
|
31
|
-
"description": "Whether to show the child items or not",
|
|
32
|
-
"value": {
|
|
33
|
-
"kind": "expression"
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
{
|
|
37
|
-
"name": ".i18n",
|
|
38
|
-
"description": "The object used to localize this component.\n\nTo change the default localization, replace the entire\n`i18n` object with a custom one.\n\nThe object has the following structure and default values:\n```\n{\n toggle: 'Toggle child items'\n}\n```",
|
|
39
|
-
"value": {
|
|
40
|
-
"kind": "expression"
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
"name": ".path",
|
|
45
|
-
"description": "The path to navigate to",
|
|
46
|
-
"value": {
|
|
47
|
-
"kind": "expression"
|
|
48
|
-
}
|
|
49
|
-
},
|
|
50
|
-
{
|
|
51
|
-
"name": ".pathAliases",
|
|
52
|
-
"description": "The list of alternative paths matching this item",
|
|
53
|
-
"value": {
|
|
54
|
-
"kind": "expression"
|
|
55
|
-
}
|
|
56
|
-
},
|
|
57
|
-
{
|
|
58
|
-
"name": "@expanded-changed",
|
|
59
|
-
"description": "Fired when the `expanded` property changes.",
|
|
60
|
-
"value": {
|
|
61
|
-
"kind": "expression"
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
]
|
|
65
|
-
},
|
|
66
|
-
{
|
|
67
|
-
"name": "vaadin-side-nav",
|
|
68
|
-
"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.",
|
|
69
|
-
"extension": true,
|
|
70
|
-
"attributes": [
|
|
71
|
-
{
|
|
72
|
-
"name": "?collapsible",
|
|
73
|
-
"description": "Whether the side nav is collapsible. When enabled, the toggle icon is shown.",
|
|
74
|
-
"value": {
|
|
75
|
-
"kind": "expression"
|
|
76
|
-
}
|
|
77
|
-
},
|
|
78
|
-
{
|
|
79
|
-
"name": "?collapsed",
|
|
80
|
-
"description": "Whether the side nav is collapsed. When collapsed, the items are hidden.",
|
|
81
|
-
"value": {
|
|
82
|
-
"kind": "expression"
|
|
83
|
-
}
|
|
84
|
-
},
|
|
85
|
-
{
|
|
86
|
-
"name": ".i18n",
|
|
87
|
-
"description": "The object used to localize this component.\n\nTo change the default localization, replace the entire\n`i18n` object with a custom one.\n\nThe object has the following structure and default values:\n```\n{\n toggle: 'Toggle child items'\n}\n```",
|
|
88
|
-
"value": {
|
|
89
|
-
"kind": "expression"
|
|
90
|
-
}
|
|
91
|
-
},
|
|
92
|
-
{
|
|
93
|
-
"name": "@collapsed-changed",
|
|
94
|
-
"description": "Fired when the `collapsed` property changes.",
|
|
95
|
-
"value": {
|
|
96
|
-
"kind": "expression"
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
]
|
|
100
|
-
}
|
|
101
|
-
]
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
}
|