@warp-ds/elements 2.2.0-next.30 → 2.2.0-next.31
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 +0 -17
- package/dist/web-types.json +1 -1
- package/package.json +4 -4
- package/dist/vscode.css-custom-data.json +0 -6
- package/dist/vscode.html-custom-data.json +0 -296
package/README.md
CHANGED
|
@@ -216,23 +216,6 @@ and use the component
|
|
|
216
216
|
|
|
217
217
|
you should get intellisense when using Warp Elements.
|
|
218
218
|
|
|
219
|
-
#### CustomData fallback
|
|
220
|
-
|
|
221
|
-
`@warp-ds/elements` also includes [Custom HTML and CSS data for Visual Studio Code](https://code.visualstudio.com/blogs/2020/02/24/custom-data-format).
|
|
222
|
-
|
|
223
|
-
If you can't get the Web Components Language Server to work, add the following snippet to `.vscode/settings.json`, then restart VS Code.
|
|
224
|
-
|
|
225
|
-
```json
|
|
226
|
-
{
|
|
227
|
-
"html.customData": [
|
|
228
|
-
"./node_modules/@warp-ds/elements/dist/vscode.html-custom-data.json"
|
|
229
|
-
],
|
|
230
|
-
"css.customData": [
|
|
231
|
-
"./node_modules/@warp-ds/elements/dist/vscode.css-custom-data.json"
|
|
232
|
-
]
|
|
233
|
-
}
|
|
234
|
-
```
|
|
235
|
-
|
|
236
219
|
#### JetBrains products
|
|
237
220
|
|
|
238
221
|
We ship `web-types.json` which should get picked up automatically by JetBrains IDEA and similar products.
|
package/dist/web-types.json
CHANGED
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@warp-ds/elements",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "2.2.0-next.
|
|
5
|
-
"packageManager": "pnpm@10.
|
|
4
|
+
"version": "2.2.0-next.31",
|
|
5
|
+
"packageManager": "pnpm@10.20.0",
|
|
6
6
|
"description": "Custom elements for Warp",
|
|
7
7
|
"exports": {
|
|
8
8
|
".": {
|
|
@@ -47,13 +47,14 @@
|
|
|
47
47
|
"build:bundle": "tsc --project tsconfig.json --outDir .tmp --declaration false --sourceMap true && rollup -c ./build/bundle.js && rimraf .tmp",
|
|
48
48
|
"build:cloak": "node ./build/cloak.js",
|
|
49
49
|
"build:components": "node ./build/components.js",
|
|
50
|
+
"build:eik-components-backwards-compat": "node ./build/components-eik.js",
|
|
50
51
|
"build:editor": "node ./build/editor.js",
|
|
51
52
|
"build:entrypoint": "node ./build/entrypoint.js",
|
|
52
53
|
"build:manifest": "custom-elements-manifest analyze --config .cem/custom-element-manifest.config.js",
|
|
53
54
|
"build:polyfill": "node ./build/polyfill.js",
|
|
54
55
|
"build:storybook": "pnpm run messages:compile && tsc && pnpm run build:manifest && pnpm run build:entrypoint && storybook build && pnpm run build:polyfill && touch ./storybook-static/.nojekyll",
|
|
55
56
|
"build:styles": "node ./build/styles.js",
|
|
56
|
-
"build": "rimraf dist && rimraf eik && pnpm messages:compile && tsc && pnpm build:manifest && pnpm build:editor && pnpm build:components && pnpm run build:cloak && pnpm build:bundle && pnpm run build:polyfill",
|
|
57
|
+
"build": "rimraf dist && rimraf eik && pnpm messages:compile && tsc && pnpm build:manifest && pnpm build:editor && pnpm build:components && pnpm run build:cloak && pnpm build:bundle && pnpm build:eik-components-backwards-compat && pnpm run build:polyfill",
|
|
57
58
|
"check": "pnpm biome check --write .",
|
|
58
59
|
"clean": "rimraf .pnpm-store node_modules dist eik storybook-static entrypoint.js",
|
|
59
60
|
"commit": "cz",
|
|
@@ -110,7 +111,6 @@
|
|
|
110
111
|
"@wc-toolkit/storybook-helpers": "^9.0.1",
|
|
111
112
|
"@wc-toolkit/type-parser": "^1.2.0",
|
|
112
113
|
"custom-element-jet-brains-integration": "^1.7.0",
|
|
113
|
-
"custom-element-vs-code-integration": "^1.5.0",
|
|
114
114
|
"cz-conventional-changelog": "3.3.0",
|
|
115
115
|
"element-collapse": "1.1.0",
|
|
116
116
|
"esbuild": "0.25.10",
|
|
@@ -1,296 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$schema": "https://raw.githubusercontent.com/microsoft/vscode-html-languageservice/main/docs/customData.schema.json",
|
|
3
|
-
"version": 1.1,
|
|
4
|
-
"tags": [
|
|
5
|
-
{
|
|
6
|
-
"name": "w-affix",
|
|
7
|
-
"description": "This component is usually used in other components like form elements to show a prefix or suffix. See for example `w-textfield`.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-affix--docs)\n\n---\n\n",
|
|
8
|
-
"attributes": [
|
|
9
|
-
{ "name": "aria-label", "values": [] },
|
|
10
|
-
{
|
|
11
|
-
"name": "clear",
|
|
12
|
-
"description": "Add this property to render a clickable Warp close icon.\n\nSet an `aria-label` that explains the action when using this.",
|
|
13
|
-
"values": []
|
|
14
|
-
},
|
|
15
|
-
{
|
|
16
|
-
"name": "search",
|
|
17
|
-
"description": "Add this property to render a clickable Warp search icon.\n\nSet an `aria-label` that explains the action when using this.",
|
|
18
|
-
"values": []
|
|
19
|
-
},
|
|
20
|
-
{ "name": "label", "values": [] }
|
|
21
|
-
],
|
|
22
|
-
"references": []
|
|
23
|
-
},
|
|
24
|
-
{
|
|
25
|
-
"name": "w-alert",
|
|
26
|
-
"description": "Alert is an inline component used for displaying different types of messages.\n\nFor accessibility reasons, alert should appear close to the element that triggered it.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/feedback-alert--docs)\n\n---\n\n",
|
|
27
|
-
"attributes": [
|
|
28
|
-
{
|
|
29
|
-
"name": "variant",
|
|
30
|
-
"values": [
|
|
31
|
-
{ "name": "negative" },
|
|
32
|
-
{ "name": "positive" },
|
|
33
|
-
{ "name": "warning" },
|
|
34
|
-
{ "name": "info" }
|
|
35
|
-
]
|
|
36
|
-
},
|
|
37
|
-
{ "name": "show", "values": [] },
|
|
38
|
-
{ "name": "role", "values": [] }
|
|
39
|
-
],
|
|
40
|
-
"references": []
|
|
41
|
-
},
|
|
42
|
-
{
|
|
43
|
-
"name": "w-button",
|
|
44
|
-
"description": "Buttons are used to perform actions, widh different visuals for different needs.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-button--docs)\n\n---\n\n",
|
|
45
|
-
"attributes": [
|
|
46
|
-
{
|
|
47
|
-
"name": "type",
|
|
48
|
-
"values": [
|
|
49
|
-
{ "name": "button" },
|
|
50
|
-
{ "name": "submit" },
|
|
51
|
-
{ "name": "reset" }
|
|
52
|
-
]
|
|
53
|
-
},
|
|
54
|
-
{ "name": "autofocus", "values": [] },
|
|
55
|
-
{
|
|
56
|
-
"name": "variant",
|
|
57
|
-
"values": [
|
|
58
|
-
{ "name": "negative" },
|
|
59
|
-
{ "name": "primary" },
|
|
60
|
-
{ "name": "secondary" },
|
|
61
|
-
{ "name": "utility" },
|
|
62
|
-
{ "name": "pill" },
|
|
63
|
-
{ "name": "link" }
|
|
64
|
-
]
|
|
65
|
-
},
|
|
66
|
-
{ "name": "quiet", "values": [] },
|
|
67
|
-
{ "name": "small", "values": [] },
|
|
68
|
-
{ "name": "loading", "values": [] },
|
|
69
|
-
{ "name": "href", "values": [] },
|
|
70
|
-
{ "name": "target", "values": [] },
|
|
71
|
-
{ "name": "rel", "values": [] },
|
|
72
|
-
{ "name": "full-width", "values": [] },
|
|
73
|
-
{ "name": "button-class", "values": [] },
|
|
74
|
-
{ "name": "name", "values": [] },
|
|
75
|
-
{ "name": "value", "values": [] }
|
|
76
|
-
],
|
|
77
|
-
"references": []
|
|
78
|
-
},
|
|
79
|
-
{
|
|
80
|
-
"name": "w-attention",
|
|
81
|
-
"description": "\n\n---\n\n",
|
|
82
|
-
"attributes": [
|
|
83
|
-
{ "name": "show", "values": [] },
|
|
84
|
-
{ "name": "placement", "values": [{ "name": "Directions" }] },
|
|
85
|
-
{ "name": "tooltip", "values": [] },
|
|
86
|
-
{ "name": "callout", "values": [] },
|
|
87
|
-
{ "name": "popover", "values": [] },
|
|
88
|
-
{ "name": "highlight", "values": [] },
|
|
89
|
-
{ "name": "can-close", "values": [] },
|
|
90
|
-
{ "name": "no-arrow", "values": [] },
|
|
91
|
-
{ "name": "distance", "values": [] },
|
|
92
|
-
{ "name": "skidding", "values": [] },
|
|
93
|
-
{ "name": "flip", "values": [] },
|
|
94
|
-
{ "name": "cross-axis", "values": [] },
|
|
95
|
-
{
|
|
96
|
-
"name": "fallback-placements",
|
|
97
|
-
"values": [{ "name": "Directions[]" }]
|
|
98
|
-
}
|
|
99
|
-
],
|
|
100
|
-
"references": []
|
|
101
|
-
},
|
|
102
|
-
{
|
|
103
|
-
"name": "w-badge",
|
|
104
|
-
"description": "`w-badge` is used for showing a small amount of non-interactive color-categorized metadata, like a status or count.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/layout-badge--docs)\n\n---\n\n",
|
|
105
|
-
"attributes": [
|
|
106
|
-
{
|
|
107
|
-
"name": "variant",
|
|
108
|
-
"values": [
|
|
109
|
-
{ "name": "neutral" },
|
|
110
|
-
{ "name": "info" },
|
|
111
|
-
{ "name": "positive" },
|
|
112
|
-
{ "name": "warning" },
|
|
113
|
-
{ "name": "negative" },
|
|
114
|
-
{ "name": "disabled" },
|
|
115
|
-
{ "name": "price" },
|
|
116
|
-
{ "name": "sponsored" }
|
|
117
|
-
]
|
|
118
|
-
},
|
|
119
|
-
{
|
|
120
|
-
"name": "position",
|
|
121
|
-
"values": [
|
|
122
|
-
{ "name": "top-left" },
|
|
123
|
-
{ "name": "top-right" },
|
|
124
|
-
{ "name": "bottom-right" },
|
|
125
|
-
{ "name": "bottom-left" }
|
|
126
|
-
]
|
|
127
|
-
}
|
|
128
|
-
],
|
|
129
|
-
"references": []
|
|
130
|
-
},
|
|
131
|
-
{
|
|
132
|
-
"name": "w-box",
|
|
133
|
-
"description": "Box is a layout component used for separating content areas on a page.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/layout-box--docs)\n\n---\n\n",
|
|
134
|
-
"attributes": [
|
|
135
|
-
{ "name": "bleed", "values": [] },
|
|
136
|
-
{ "name": "bordered", "values": [] },
|
|
137
|
-
{ "name": "info", "values": [] },
|
|
138
|
-
{ "name": "neutral", "values": [] },
|
|
139
|
-
{ "name": "role", "values": [] }
|
|
140
|
-
],
|
|
141
|
-
"references": []
|
|
142
|
-
},
|
|
143
|
-
{
|
|
144
|
-
"name": "w-breadcrumbs",
|
|
145
|
-
"description": "Breadcrumbs show the navigation structure for the current location.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-breadcrumbs--docs)\n\n---\n\n",
|
|
146
|
-
"attributes": [{ "name": "aria-label", "values": [] }],
|
|
147
|
-
"references": []
|
|
148
|
-
},
|
|
149
|
-
{
|
|
150
|
-
"name": "w-card",
|
|
151
|
-
"description": "Card is a layout component used for separating content areas on a page.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-card--docs)\n\n---\n\n",
|
|
152
|
-
"attributes": [
|
|
153
|
-
{ "name": "selected", "values": [] },
|
|
154
|
-
{ "name": "flat", "values": [] },
|
|
155
|
-
{ "name": "clickable", "values": [] }
|
|
156
|
-
],
|
|
157
|
-
"references": []
|
|
158
|
-
},
|
|
159
|
-
{
|
|
160
|
-
"name": "w-expandable",
|
|
161
|
-
"description": "Expandable is a layout component used for creating expandable content areas on a page.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/layout-expandable--docs)\n\n---\n\n\n\n### **Slots:**\n - **title** - Alternative to the `title` attribute should you need to provide some additional markup.",
|
|
162
|
-
"attributes": [
|
|
163
|
-
{ "name": "expanded", "values": [] },
|
|
164
|
-
{ "name": "title", "values": [] },
|
|
165
|
-
{ "name": "box", "values": [] },
|
|
166
|
-
{ "name": "bleed", "values": [] },
|
|
167
|
-
{ "name": "button-class", "values": [] },
|
|
168
|
-
{ "name": "content-class", "values": [] },
|
|
169
|
-
{ "name": "no-chevron", "values": [] },
|
|
170
|
-
{ "name": "animated", "values": [] },
|
|
171
|
-
{ "name": "heading-level", "values": [] },
|
|
172
|
-
{ "name": "_hasTitle", "values": [] },
|
|
173
|
-
{ "name": "_showChevronUp", "values": [] }
|
|
174
|
-
],
|
|
175
|
-
"references": []
|
|
176
|
-
},
|
|
177
|
-
{
|
|
178
|
-
"name": "w-pill",
|
|
179
|
-
"description": "Pill is a type of button that is often used as a filter, but can also be used as a rounded button for overlays, etc.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-pill--docs)\n\n---\n\n\n\n### **Events:**\n - **w-pill-click**\n- **w-pill-close**",
|
|
180
|
-
"attributes": [
|
|
181
|
-
{ "name": "can-close", "values": [] },
|
|
182
|
-
{ "name": "suggestion", "values": [] },
|
|
183
|
-
{ "name": "open-sr-label", "values": [] },
|
|
184
|
-
{ "name": "open-aria-label", "values": [] },
|
|
185
|
-
{ "name": "close-sr-label", "values": [] },
|
|
186
|
-
{ "name": "close-aria-label", "values": [] }
|
|
187
|
-
],
|
|
188
|
-
"references": []
|
|
189
|
-
},
|
|
190
|
-
{
|
|
191
|
-
"name": "w-select",
|
|
192
|
-
"description": "A dropdown component for selecting a single value.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-select--docs)\n\n---\n\n",
|
|
193
|
-
"attributes": [
|
|
194
|
-
{
|
|
195
|
-
"name": "auto-focus",
|
|
196
|
-
"description": "Whether the element should receive focus on render",
|
|
197
|
-
"values": []
|
|
198
|
-
},
|
|
199
|
-
{
|
|
200
|
-
"name": "invalid",
|
|
201
|
-
"description": "Renders the field in an invalid state. Often paired with `hint` to provide feedback about the error",
|
|
202
|
-
"values": []
|
|
203
|
-
},
|
|
204
|
-
{
|
|
205
|
-
"name": "always",
|
|
206
|
-
"description": "Whether to always show a hint",
|
|
207
|
-
"values": []
|
|
208
|
-
},
|
|
209
|
-
{
|
|
210
|
-
"name": "hint",
|
|
211
|
-
"description": "The content displayed as the help text",
|
|
212
|
-
"values": []
|
|
213
|
-
},
|
|
214
|
-
{
|
|
215
|
-
"name": "label",
|
|
216
|
-
"description": "The content to disply as the label",
|
|
217
|
-
"values": []
|
|
218
|
-
},
|
|
219
|
-
{
|
|
220
|
-
"name": "optional",
|
|
221
|
-
"description": "Whether to show optional text",
|
|
222
|
-
"values": []
|
|
223
|
-
},
|
|
224
|
-
{
|
|
225
|
-
"name": "disabled",
|
|
226
|
-
"description": "Renders the field in a disabled state.",
|
|
227
|
-
"values": []
|
|
228
|
-
},
|
|
229
|
-
{
|
|
230
|
-
"name": "read-only",
|
|
231
|
-
"description": "Renders the field in a readonly state.",
|
|
232
|
-
"values": []
|
|
233
|
-
},
|
|
234
|
-
{ "name": "name", "values": [] },
|
|
235
|
-
{ "name": "value", "values": [] }
|
|
236
|
-
],
|
|
237
|
-
"references": []
|
|
238
|
-
},
|
|
239
|
-
{
|
|
240
|
-
"name": "w-textfield",
|
|
241
|
-
"description": "A single line text input element.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-textfield--docs)\n\n---\n\n",
|
|
242
|
-
"attributes": [
|
|
243
|
-
{ "name": "disabled", "values": [] },
|
|
244
|
-
{ "name": "invalid", "values": [] },
|
|
245
|
-
{ "name": "id", "values": [] },
|
|
246
|
-
{ "name": "label", "values": [] },
|
|
247
|
-
{ "name": "help-text", "values": [] },
|
|
248
|
-
{ "name": "size", "values": [] },
|
|
249
|
-
{ "name": "max", "values": [] },
|
|
250
|
-
{ "name": "min", "values": [] },
|
|
251
|
-
{ "name": "min-length", "values": [] },
|
|
252
|
-
{ "name": "max-length", "values": [] },
|
|
253
|
-
{ "name": "pattern", "values": [] },
|
|
254
|
-
{ "name": "placeholder", "values": [] },
|
|
255
|
-
{ "name": "read-only", "values": [] },
|
|
256
|
-
{ "name": "required", "values": [] },
|
|
257
|
-
{ "name": "type", "values": [] },
|
|
258
|
-
{ "name": "value", "values": [] },
|
|
259
|
-
{ "name": "name", "values": [] }
|
|
260
|
-
],
|
|
261
|
-
"references": []
|
|
262
|
-
},
|
|
263
|
-
{
|
|
264
|
-
"name": "w-modal-footer",
|
|
265
|
-
"description": "The footer section of a modal, typically where you place actions.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/overlays-modal--docs)\n\n---\n\n",
|
|
266
|
-
"attributes": [],
|
|
267
|
-
"references": []
|
|
268
|
-
},
|
|
269
|
-
{
|
|
270
|
-
"name": "w-modal-header",
|
|
271
|
-
"description": "The header section of a modal, typically where you place the title and a close button.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/overlays-modal--docs)\n\n---\n\n\n\n### **Events:**\n - **backClicked**\n\n### **Slots:**\n - **top** - Customize the title bar, for example to have a header image that reaches the modal's edges. See the With Image story for an example.",
|
|
272
|
-
"attributes": [
|
|
273
|
-
{ "name": "title", "values": [] },
|
|
274
|
-
{ "name": "back", "values": [] },
|
|
275
|
-
{ "name": "no-close", "values": [] }
|
|
276
|
-
],
|
|
277
|
-
"references": []
|
|
278
|
-
},
|
|
279
|
-
{
|
|
280
|
-
"name": "w-modal",
|
|
281
|
-
"description": "Modals (or dialogs) display important information that users need to acknowledge.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/overlays-modal--docs)\n\n---\n\n\n\n### **Events:**\n - **shown**\n- **hidden**\n\n### **Slots:**\n - **header** - Typically where you would use the `w-modal-header` component.\n- **content** - The main content of the modal.\n- **footer** - Typically where you would use the `w-modal-footer` component, for things like actions.",
|
|
282
|
-
"attributes": [
|
|
283
|
-
{ "name": "show", "values": [] },
|
|
284
|
-
{ "name": "content-id", "values": [] },
|
|
285
|
-
{ "name": "ignore-backdrop-clicks", "values": [] }
|
|
286
|
-
],
|
|
287
|
-
"references": []
|
|
288
|
-
},
|
|
289
|
-
{
|
|
290
|
-
"name": "w-toast-container",
|
|
291
|
-
"description": "\n\n---\n\n",
|
|
292
|
-
"attributes": [],
|
|
293
|
-
"references": []
|
|
294
|
-
}
|
|
295
|
-
]
|
|
296
|
-
}
|