@warp-ds/elements 2.2.0-next.7 → 2.2.0-next.9

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.
Files changed (67) hide show
  1. package/dist/api.js +1 -1
  2. package/dist/api.js.map +4 -4
  3. package/dist/custom-elements.json +1826 -1424
  4. package/dist/index.d.ts +1 -0
  5. package/dist/index.js +1256 -137
  6. package/dist/index.js.map +4 -4
  7. package/dist/packages/alert/index.js.map +1 -1
  8. package/dist/packages/alert/react.js.map +1 -1
  9. package/dist/packages/attention/attention.stories.d.ts +5 -0
  10. package/dist/packages/attention/attention.test.d.ts +1 -0
  11. package/dist/packages/attention/index.d.ts +48 -89
  12. package/dist/packages/attention/index.js +3354 -16
  13. package/dist/packages/attention/index.js.map +4 -4
  14. package/dist/packages/attention/layout-styles.d.ts +1 -0
  15. package/dist/packages/attention/react.d.ts +1 -0
  16. package/dist/packages/attention/react.js +3405 -0
  17. package/dist/packages/attention/react.js.map +7 -0
  18. package/dist/packages/attention/styles.d.ts +1 -0
  19. package/dist/packages/button/index.d.ts +1 -0
  20. package/dist/packages/button/index.js +214 -9
  21. package/dist/packages/button/index.js.map +4 -4
  22. package/dist/packages/button/react.js +213 -8
  23. package/dist/packages/button/react.js.map +4 -4
  24. package/dist/packages/datepicker/DatePicker.test.d.ts +1 -0
  25. package/dist/packages/datepicker/datepicker.d.ts +9 -0
  26. package/dist/packages/datepicker/index.js +87 -83
  27. package/dist/packages/datepicker/index.js.map +3 -3
  28. package/dist/packages/datepicker/react.d.ts +2 -0
  29. package/dist/packages/datepicker/react.js +2805 -0
  30. package/dist/packages/datepicker/react.js.map +7 -0
  31. package/dist/packages/link/index.d.ts +39 -0
  32. package/dist/packages/link/index.js +2646 -0
  33. package/dist/packages/link/index.js.map +7 -0
  34. package/dist/packages/link/link.stories.d.ts +20 -0
  35. package/dist/packages/link/link.test.d.ts +1 -0
  36. package/dist/packages/link/react.d.ts +2 -0
  37. package/dist/packages/link/react.js +2666 -0
  38. package/dist/packages/link/react.js.map +7 -0
  39. package/dist/packages/link/styles.d.ts +1 -0
  40. package/dist/packages/steps/index.d.ts +43 -0
  41. package/dist/packages/steps/index.js +2465 -0
  42. package/dist/packages/steps/index.js.map +7 -0
  43. package/dist/packages/steps/locales/da/messages.d.mts +1 -0
  44. package/dist/packages/steps/locales/en/messages.d.mts +1 -0
  45. package/dist/packages/steps/locales/fi/messages.d.mts +1 -0
  46. package/dist/packages/steps/locales/nb/messages.d.mts +1 -0
  47. package/dist/packages/steps/locales/sv/messages.d.mts +1 -0
  48. package/dist/packages/steps/react.d.ts +3 -0
  49. package/dist/packages/steps/react.js +2485 -0
  50. package/dist/packages/steps/react.js.map +7 -0
  51. package/dist/packages/steps/steps.stories.d.ts +12 -0
  52. package/dist/packages/steps/styles.d.ts +1 -0
  53. package/dist/packages/textfield/index.js +1 -1
  54. package/dist/packages/textfield/index.js.map +2 -2
  55. package/dist/packages/textfield/react.js +1 -1
  56. package/dist/packages/textfield/react.js.map +2 -2
  57. package/dist/packages/toast/api.d.ts +4 -45
  58. package/dist/packages/toast/index.d.ts +3 -3
  59. package/dist/packages/toast/index.js +2461 -22
  60. package/dist/packages/toast/index.js.map +4 -4
  61. package/dist/packages/toast/styles.d.ts +1 -0
  62. package/dist/packages/toast/toast-container.d.ts +12 -78
  63. package/dist/packages/toast/toast.d.ts +16 -29
  64. package/dist/packages/toast/types.d.ts +15 -0
  65. package/dist/vscode.html-custom-data.json +86 -34
  66. package/dist/web-types.json +199 -99
  67. package/package.json +11 -9
@@ -2,105 +2,6 @@
2
2
  "schemaVersion": "1.0.0",
3
3
  "readme": "",
4
4
  "modules": [
5
- {
6
- "kind": "javascript-module",
7
- "path": "packages/alert/index.ts",
8
- "declarations": [
9
- {
10
- "kind": "class",
11
- "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)",
12
- "name": "WarpAlert",
13
- "members": [
14
- {
15
- "kind": "field",
16
- "name": "variant",
17
- "type": {
18
- "text": "AlertVariants"
19
- },
20
- "default": "'info'",
21
- "attribute": "variant",
22
- "reflects": true,
23
- "parsedType": {
24
- "text": "'negative' | 'positive' | 'warning' | 'info'"
25
- }
26
- },
27
- {
28
- "kind": "field",
29
- "name": "show",
30
- "type": {
31
- "text": "boolean"
32
- },
33
- "default": "false",
34
- "attribute": "show",
35
- "reflects": true
36
- },
37
- {
38
- "kind": "field",
39
- "name": "role",
40
- "type": {
41
- "text": "string"
42
- },
43
- "default": "'alert'",
44
- "attribute": "role",
45
- "reflects": true
46
- }
47
- ],
48
- "attributes": [
49
- {
50
- "name": "variant",
51
- "type": {
52
- "text": "AlertVariants"
53
- },
54
- "default": "'info'",
55
- "fieldName": "variant",
56
- "parsedType": {
57
- "text": "'negative' | 'positive' | 'warning' | 'info'"
58
- }
59
- },
60
- {
61
- "name": "show",
62
- "type": {
63
- "text": "boolean"
64
- },
65
- "default": "false",
66
- "fieldName": "show"
67
- },
68
- {
69
- "name": "role",
70
- "type": {
71
- "text": "string"
72
- },
73
- "default": "'alert'",
74
- "fieldName": "role"
75
- }
76
- ],
77
- "superclass": {
78
- "name": "LitElement",
79
- "package": "lit"
80
- },
81
- "tagName": "w-alert",
82
- "customElement": true
83
- }
84
- ],
85
- "exports": [
86
- {
87
- "kind": "custom-element-definition",
88
- "name": "w-alert",
89
- "declaration": {
90
- "name": "WarpAlert",
91
- "module": "packages/alert/index.ts"
92
- }
93
- },
94
- {
95
- "kind": "js",
96
- "name": "WarpAlert",
97
- "declaration": {
98
- "name": "WarpAlert",
99
- "module": "packages/alert/index.ts"
100
- }
101
- }
102
- ]
103
- },
104
5
  {
105
6
  "kind": "javascript-module",
106
7
  "path": "packages/affix/index.ts",
@@ -242,120 +143,34 @@
242
143
  },
243
144
  {
244
145
  "kind": "javascript-module",
245
- "path": "packages/badge/index.ts",
146
+ "path": "packages/alert/index.ts",
246
147
  "declarations": [
247
148
  {
248
149
  "kind": "class",
249
- "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)",
250
- "name": "WarpBadge",
150
+ "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)",
151
+ "name": "WarpAlert",
251
152
  "members": [
252
153
  {
253
154
  "kind": "field",
254
155
  "name": "variant",
255
156
  "type": {
256
- "text": "'neutral' | 'info' | 'positive' | 'warning' | 'negative' | 'disabled' | 'price' | 'sponsored'"
157
+ "text": "AlertVariants"
257
158
  },
258
- "default": "'neutral'",
159
+ "default": "'info'",
259
160
  "attribute": "variant",
260
- "reflects": true
261
- },
262
- {
263
- "kind": "field",
264
- "name": "position",
265
- "type": {
266
- "text": "'top-left' | 'top-right' | 'bottom-right' | 'bottom-left'"
267
- },
268
- "attribute": "position",
269
- "reflects": true
270
- }
271
- ],
272
- "attributes": [
273
- {
274
- "name": "variant",
275
- "type": {
276
- "text": "'neutral' | 'info' | 'positive' | 'warning' | 'negative' | 'disabled' | 'price' | 'sponsored'"
277
- },
278
- "default": "'neutral'",
279
- "fieldName": "variant"
280
- },
281
- {
282
- "name": "position",
283
- "type": {
284
- "text": "'top-left' | 'top-right' | 'bottom-right' | 'bottom-left'"
285
- },
286
- "fieldName": "position"
287
- }
288
- ],
289
- "superclass": {
290
- "name": "LitElement",
291
- "package": "lit"
292
- },
293
- "tagName": "w-badge",
294
- "customElement": true
295
- }
296
- ],
297
- "exports": [
298
- {
299
- "kind": "custom-element-definition",
300
- "name": "w-badge",
301
- "declaration": {
302
- "name": "WarpBadge",
303
- "module": "packages/badge/index.ts"
304
- }
305
- },
306
- {
307
- "kind": "js",
308
- "name": "WarpBadge",
309
- "declaration": {
310
- "name": "WarpBadge",
311
- "module": "packages/badge/index.ts"
312
- }
313
- }
314
- ]
315
- },
316
- {
317
- "kind": "javascript-module",
318
- "path": "packages/box/index.ts",
319
- "declarations": [
320
- {
321
- "kind": "class",
322
- "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)",
323
- "name": "WarpBox",
324
- "members": [
325
- {
326
- "kind": "field",
327
- "name": "bleed",
328
- "type": {
329
- "text": "boolean"
330
- },
331
- "attribute": "bleed",
332
- "reflects": true
333
- },
334
- {
335
- "kind": "field",
336
- "name": "bordered",
337
- "type": {
338
- "text": "boolean"
339
- },
340
- "attribute": "bordered",
341
- "reflects": true
342
- },
343
- {
344
- "kind": "field",
345
- "name": "info",
346
- "type": {
347
- "text": "boolean"
348
- },
349
- "attribute": "info",
350
- "reflects": true
161
+ "reflects": true,
162
+ "parsedType": {
163
+ "text": "'negative' | 'positive' | 'warning' | 'info'"
164
+ }
351
165
  },
352
166
  {
353
167
  "kind": "field",
354
- "name": "neutral",
168
+ "name": "show",
355
169
  "type": {
356
170
  "text": "boolean"
357
171
  },
358
- "attribute": "neutral",
172
+ "default": "false",
173
+ "attribute": "show",
359
174
  "reflects": true
360
175
  },
361
176
  {
@@ -364,44 +179,37 @@
364
179
  "type": {
365
180
  "text": "string"
366
181
  },
182
+ "default": "'alert'",
367
183
  "attribute": "role",
368
184
  "reflects": true
369
185
  }
370
186
  ],
371
187
  "attributes": [
372
188
  {
373
- "name": "bleed",
374
- "type": {
375
- "text": "boolean"
376
- },
377
- "fieldName": "bleed"
378
- },
379
- {
380
- "name": "bordered",
381
- "type": {
382
- "text": "boolean"
383
- },
384
- "fieldName": "bordered"
385
- },
386
- {
387
- "name": "info",
189
+ "name": "variant",
388
190
  "type": {
389
- "text": "boolean"
191
+ "text": "AlertVariants"
390
192
  },
391
- "fieldName": "info"
193
+ "default": "'info'",
194
+ "fieldName": "variant",
195
+ "parsedType": {
196
+ "text": "'negative' | 'positive' | 'warning' | 'info'"
197
+ }
392
198
  },
393
199
  {
394
- "name": "neutral",
200
+ "name": "show",
395
201
  "type": {
396
202
  "text": "boolean"
397
203
  },
398
- "fieldName": "neutral"
204
+ "default": "false",
205
+ "fieldName": "show"
399
206
  },
400
207
  {
401
208
  "name": "role",
402
209
  "type": {
403
210
  "text": "string"
404
211
  },
212
+ "default": "'alert'",
405
213
  "fieldName": "role"
406
214
  }
407
215
  ],
@@ -409,605 +217,1460 @@
409
217
  "name": "LitElement",
410
218
  "package": "lit"
411
219
  },
412
- "tagName": "w-box",
220
+ "tagName": "w-alert",
413
221
  "customElement": true
414
222
  }
415
223
  ],
416
224
  "exports": [
417
225
  {
418
226
  "kind": "custom-element-definition",
419
- "name": "w-box",
227
+ "name": "w-alert",
420
228
  "declaration": {
421
- "name": "WarpBox",
422
- "module": "packages/box/index.ts"
229
+ "name": "WarpAlert",
230
+ "module": "packages/alert/index.ts"
423
231
  }
424
232
  },
425
233
  {
426
234
  "kind": "js",
427
- "name": "WarpBox",
235
+ "name": "WarpAlert",
428
236
  "declaration": {
429
- "name": "WarpBox",
430
- "module": "packages/box/index.ts"
237
+ "name": "WarpAlert",
238
+ "module": "packages/alert/index.ts"
431
239
  }
432
240
  }
433
241
  ]
434
242
  },
435
243
  {
436
244
  "kind": "javascript-module",
437
- "path": "packages/breadcrumbs/index.ts",
245
+ "path": "packages/utils/index.js",
438
246
  "declarations": [
439
247
  {
440
- "kind": "variable",
441
- "name": "ccBreadcrumbs",
442
- "type": {
443
- "text": "object"
444
- },
445
- "default": "{ wrapper: 'flex space-x-8', text: 's-text', link: 's-text-link', separator: 'select-none s-icon', a11y: 'sr-only', }"
446
- },
447
- {
448
- "kind": "class",
449
- "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)",
450
- "name": "WarpBreadcrumbs",
248
+ "kind": "mixin",
249
+ "description": "",
250
+ "name": "kebabCaseAttributes",
451
251
  "members": [
452
252
  {
453
- "kind": "field",
454
- "name": "ariaLabel",
455
- "type": {
456
- "text": "string"
457
- },
458
- "attribute": "aria-label"
253
+ "kind": "method",
254
+ "name": "createProperty",
255
+ "static": true,
256
+ "parameters": [
257
+ {
258
+ "name": "name"
259
+ },
260
+ {
261
+ "name": "options"
262
+ }
263
+ ]
459
264
  }
460
265
  ],
461
- "attributes": [
266
+ "parameters": [
462
267
  {
463
- "name": "aria-label",
464
- "type": {
465
- "text": "string"
466
- },
467
- "fieldName": "ariaLabel"
268
+ "name": "constructor"
468
269
  }
469
- ],
470
- "superclass": {
471
- "name": "LitElement",
472
- "package": "lit"
473
- },
474
- "tagName": "w-breadcrumbs",
475
- "customElement": true
270
+ ]
271
+ },
272
+ {
273
+ "kind": "function",
274
+ "name": "classes",
275
+ "parameters": [
276
+ {
277
+ "name": "defn"
278
+ }
279
+ ]
280
+ },
281
+ {
282
+ "kind": "function",
283
+ "name": "fclasses",
284
+ "parameters": [
285
+ {
286
+ "name": "definition"
287
+ }
288
+ ]
289
+ },
290
+ {
291
+ "kind": "function",
292
+ "name": "generateRandomId"
476
293
  }
477
294
  ],
478
295
  "exports": [
479
296
  {
480
297
  "kind": "js",
481
- "name": "ccBreadcrumbs",
298
+ "name": "kebabCaseAttributes",
482
299
  "declaration": {
483
- "name": "ccBreadcrumbs",
484
- "module": "packages/breadcrumbs/index.ts"
300
+ "name": "kebabCaseAttributes",
301
+ "module": "packages/utils/index.js"
485
302
  }
486
303
  },
487
304
  {
488
- "kind": "custom-element-definition",
489
- "name": "w-breadcrumbs",
305
+ "kind": "js",
306
+ "name": "classes",
490
307
  "declaration": {
491
- "name": "WarpBreadcrumbs",
492
- "module": "packages/breadcrumbs/index.ts"
308
+ "name": "classes",
309
+ "module": "packages/utils/index.js"
493
310
  }
494
311
  },
495
312
  {
496
313
  "kind": "js",
497
- "name": "WarpBreadcrumbs",
314
+ "name": "fclasses",
498
315
  "declaration": {
499
- "name": "WarpBreadcrumbs",
500
- "module": "packages/breadcrumbs/index.ts"
316
+ "name": "fclasses",
317
+ "module": "packages/utils/index.js"
318
+ }
319
+ },
320
+ {
321
+ "kind": "js",
322
+ "name": "generateRandomId",
323
+ "declaration": {
324
+ "name": "generateRandomId",
325
+ "module": "packages/utils/index.js"
501
326
  }
502
327
  }
503
328
  ]
504
329
  },
505
330
  {
506
331
  "kind": "javascript-module",
507
- "path": "packages/button/index.ts",
332
+ "path": "packages/attention/index.ts",
508
333
  "declarations": [
509
334
  {
510
335
  "kind": "variable",
511
- "name": "ccButton",
336
+ "name": "ccAttention",
512
337
  "type": {
513
338
  "text": "object"
514
339
  },
515
- "default": "{ // Buttontypes secondary: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonColors.secondary}`, // .button--secondary, .button--default, .button secondaryHref: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonColors.secondary}`, secondaryDisabled: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonVariants.isDisabled}`, secondarySmall: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonTypes.secondary} ${buttonColors.secondary}`, secondarySmallDisabled: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonTypes.secondary} ${buttonVariants.isDisabled}`, secondaryQuiet: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonColors.quiet}`, secondaryQuietDisabled: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, secondarySmallQuiet: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonVariants.quiet} ${buttonColors.quiet}`, secondarySmallQuietDisabled: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, secondaryLoading: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonVariants.inProgress}`, secondarySmallLoading: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonTypes.secondary} ${buttonVariants.inProgress}`, secondarySmallQuietLoading: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.inProgress}`, secondaryQuietLoading: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.inProgress}`, primary: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.primary} ${buttonColors.primary}`, // .button--primary, .button--cta primaryDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.isDisabled} ${buttonTypes.primary}`, primarySmall: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonTypes.primary} ${buttonColors.primary}`, primarySmallDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.isDisabled} ${buttonTypes.primary} `, primaryQuiet: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonColors.quiet}`, primaryQuietDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, primarySmallQuiet: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.quiet} ${buttonColors.quiet}`, primarySmallQuietDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, primaryLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.inProgress} ${buttonTypes.primary}`, primarySmallLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.inProgress} ${buttonTypes.primary}`, primarySmallQuietLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.inProgress} ${buttonTypes.primary}`, primaryQuietLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.inProgress}`, utility: `${buttonSizes.utility} ${buttonTextSizes.medium} ${buttonTypes.utility} ${buttonColors.utility}`, // .button--utility utilityDisabled: `${buttonSizes.utility} ${buttonTextSizes.medium} ${buttonTypes.utility} ${buttonVariants.isDisabled}`, utilityQuiet: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.utilityQuiet} ${buttonColors.utilityQuiet}`, // .button--utility-flat utilityQuietDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.utilityQuiet} ${buttonVariants.isDisabled}`, utilitySmall: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonTypes.utility} ${buttonColors.utility}`, utilitySmallDisabled: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonTypes.utility} ${buttonVariants.isDisabled}`, utilitySmallQuiet: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonVariants.utilityQuiet} ${buttonColors.utilityQuiet}`, utilitySmallQuietDisabled: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonVariants.utilityQuiet} ${buttonVariants.isDisabled}`, utilityLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.utility} ${buttonVariants.inProgress}`, utilitySmallLoading: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonTypes.utility} ${buttonVariants.inProgress}`, utilityQuietLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.inProgress} ${buttonVariants.utilityQuiet}`, utilitySmallQuietLoading: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonVariants.inProgress} ${buttonVariants.utilityQuiet}`, negative: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.negative} ${buttonColors.destructive}`, // .button--destructive negativeDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.negative} ${buttonVariants.isDisabled}`, negativeQuiet: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.negativeQuiet} ${buttonColors.negativeQuiet}`, // .button--destructive-flat negativeQuietDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.negativeQuiet}${buttonVariants.isDisabled}`, negativeSmall: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonTypes.negative} ${buttonColors.destructive}`, negativeSmallDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonTypes.negative} ${buttonVariants.isDisabled}`, negativeSmallQuiet: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.negativeQuiet} ${buttonColors.negativeQuiet}`, negativeSmallQuietDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.negativeQuiet} ${buttonVariants.isDisabled}`, negativeLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.negative} ${buttonVariants.inProgress}`, negativeSmallLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.inProgress} ${buttonTypes.negative}`, negativeQuietLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.negativeQuiet} ${buttonTypes.negative} ${buttonVariants.inProgress}`, negativeSmallQuietLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.negativeQuiet} ${buttonVariants.inProgress}`, pill: `${buttonSizes.pill} ${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonColors.pill}`, // .button--pill pillSmall: `${buttonSizes.pillSmall} ${buttonTextSizes.xsmall} ${buttonTypes.pill} ${buttonColors.pill}`, pillLoading: `${buttonSizes.pill} ${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonVariants.inProgress}`, pillSmallLoading: `${buttonSizes.pillSmall} ${buttonTextSizes.xsmall} ${buttonTypes.pill} ${buttonVariants.inProgress}`, link: `${buttonSizes.link} ${buttonTextSizes.medium} ${buttonTypes.link}`, linkSmall: `${buttonSizes.link} ${buttonTextSizes.xsmall} ${buttonTypes.link}`, linkAsButton: 'inline-block active:no-underline hover:no-underline focus:no-underline text-center', a11y: 'sr-only', fullWidth: 'w-full max-w-full', contentWidth: 'max-w-max', }"
340
+ "default": "{ base: 'border-2 relative flex items-start', tooltip: 's-bg-inverted border-[--w-s-color-background-inverted] shadow-m s-text-inverted-static rounded-4 py-6 px-8', callout: 'bg-[--w-color-callout-background] border-[--w-color-callout-border] s-text py-8 px-16 rounded-8', highlight: 'bg-[--w-color-callout-background] border-[--w-color-callout-border] s-text py-8 px-16 rounded-8 drop-shadow-m translate-z-0', popover: 'bg-[--w-s-color-surface-elevated-300] border-[--w-s-color-surface-elevated-300] s-text rounded-8 p-16 drop-shadow-m translate-z-0', arrowBase: 'absolute h-[14px] w-[14px] border-2 border-b-0 border-r-0 rounded-tl-4 transform', arrowDirectionLeftStart: '-left-[8px]', arrowDirectionLeft: '-left-[8px]', arrowDirectionLeftEnd: '-left-[8px]', arrowDirectionRightStart: '-right-[8px]', arrowDirectionRight: '-right-[8px]', arrowDirectionRightEnd: '-right-[8px]', arrowDirectionBottomStart: '-bottom-[8px]', arrowDirectionBottom: '-bottom-[8px]', arrowDirectionBottomEnd: '-bottom-[8px]', arrowDirectionTopStart: '-top-[8px]', arrowDirectionTop: '-top-[8px]', arrowDirectionTopEnd: '-top-[8px]', arrowTooltip: 's-bg-inverted border-[--w-s-color-background-inverted]', arrowCallout: 'bg-[--w-color-callout-background] border-[--w-color-callout-border]', arrowPopover: 'bg-[--w-s-color-surface-elevated-300] border-[--w-s-color-surface-elevated-300]', arrowHighlight: 'bg-[--w-color-callout-background] border-[--w-color-callout-border]', content: 'last-child:mb-0', notCallout: 'absolute z-50', closeBtn: `${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonColors.pill} justify-self-end -mr-8 ml-8`, }"
516
341
  },
517
342
  {
518
343
  "kind": "class",
519
- "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)",
520
- "name": "WarpButton",
344
+ "description": "",
345
+ "name": "WarpAttention",
521
346
  "members": [
522
347
  {
523
348
  "kind": "field",
524
- "name": "shadowRootOptions",
349
+ "name": "show",
525
350
  "type": {
526
- "text": "object"
351
+ "text": "boolean"
527
352
  },
528
- "static": true,
529
- "default": "{ ...WarpElement.shadowRootOptions, delegatesFocus: true, }"
353
+ "default": "false",
354
+ "attribute": "show",
355
+ "reflects": true
530
356
  },
531
357
  {
532
358
  "kind": "field",
533
- "name": "type",
359
+ "name": "placement",
534
360
  "type": {
535
- "text": "ButtonType"
361
+ "text": "Directions"
536
362
  },
537
- "default": "'button'",
538
- "attribute": "type",
539
- "reflects": true,
540
- "parsedType": {
541
- "text": "'button' | 'submit' | 'reset'"
542
- }
363
+ "default": "'bottom'",
364
+ "attribute": "placement",
365
+ "reflects": true
543
366
  },
544
367
  {
545
368
  "kind": "field",
546
- "name": "autofocus",
369
+ "name": "tooltip",
547
370
  "type": {
548
371
  "text": "boolean"
549
372
  },
550
- "attribute": "autofocus",
373
+ "default": "false",
374
+ "attribute": "tooltip",
551
375
  "reflects": true
552
376
  },
553
377
  {
554
378
  "kind": "field",
555
- "name": "variant",
379
+ "name": "callout",
556
380
  "type": {
557
- "text": "ButtonVariant"
381
+ "text": "boolean"
558
382
  },
559
- "default": "'secondary'",
560
- "attribute": "variant",
561
- "reflects": true,
562
- "parsedType": {
563
- "text": "'negative' | 'primary' | 'secondary' | 'utility' | 'pill' | 'link'"
564
- }
383
+ "default": "false",
384
+ "attribute": "callout",
385
+ "reflects": true
565
386
  },
566
387
  {
567
388
  "kind": "field",
568
- "name": "quiet",
389
+ "name": "popover",
569
390
  "type": {
570
391
  "text": "boolean"
571
392
  },
572
- "attribute": "quiet",
393
+ "default": "false",
394
+ "attribute": "popover",
573
395
  "reflects": true
574
396
  },
575
397
  {
576
398
  "kind": "field",
577
- "name": "small",
399
+ "name": "highlight",
578
400
  "type": {
579
401
  "text": "boolean"
580
402
  },
581
- "attribute": "small",
403
+ "default": "false",
404
+ "attribute": "highlight",
582
405
  "reflects": true
583
406
  },
584
407
  {
585
408
  "kind": "field",
586
- "name": "loading",
409
+ "name": "canClose",
587
410
  "type": {
588
411
  "text": "boolean"
589
412
  },
590
- "attribute": "loading",
413
+ "default": "false",
414
+ "attribute": "can-close",
591
415
  "reflects": true
592
416
  },
593
417
  {
594
418
  "kind": "field",
595
- "name": "href",
419
+ "name": "noArrow",
596
420
  "type": {
597
- "text": "string"
421
+ "text": "boolean"
598
422
  },
599
- "attribute": "href",
423
+ "default": "false",
424
+ "attribute": "no-arrow",
600
425
  "reflects": true
601
426
  },
602
427
  {
603
428
  "kind": "field",
604
- "name": "target",
429
+ "name": "distance",
605
430
  "type": {
606
- "text": "string"
431
+ "text": "number"
607
432
  },
608
- "attribute": "target",
433
+ "default": "8",
434
+ "attribute": "distance",
609
435
  "reflects": true
610
436
  },
611
437
  {
612
438
  "kind": "field",
613
- "name": "rel",
439
+ "name": "skidding",
614
440
  "type": {
615
- "text": "string"
441
+ "text": "number"
616
442
  },
617
- "attribute": "rel",
443
+ "default": "0",
444
+ "attribute": "skidding",
618
445
  "reflects": true
619
446
  },
620
447
  {
621
448
  "kind": "field",
622
- "name": "fullWidth",
449
+ "name": "flip",
623
450
  "type": {
624
451
  "text": "boolean"
625
452
  },
626
- "attribute": "full-width",
453
+ "default": "false",
454
+ "attribute": "flip",
627
455
  "reflects": true
628
456
  },
629
457
  {
630
458
  "kind": "field",
631
- "name": "buttonClass",
459
+ "name": "crossAxis",
632
460
  "type": {
633
- "text": "string"
461
+ "text": "boolean"
634
462
  },
635
- "attribute": "button-class",
463
+ "default": "false",
464
+ "attribute": "cross-axis",
636
465
  "reflects": true
637
466
  },
638
467
  {
639
468
  "kind": "field",
640
- "name": "name",
469
+ "name": "fallbackPlacements",
641
470
  "type": {
642
- "text": "string"
471
+ "text": "Directions[]"
643
472
  },
644
- "attribute": "name",
473
+ "attribute": "fallback-placements",
645
474
  "reflects": true
646
475
  },
476
+ {
477
+ "kind": "method",
478
+ "name": "handleDone"
479
+ },
480
+ {
481
+ "kind": "method",
482
+ "name": "pointingAtDirection"
483
+ },
484
+ {
485
+ "kind": "method",
486
+ "name": "activeAttentionType"
487
+ },
488
+ {
489
+ "kind": "method",
490
+ "name": "defaultAriaLabel"
491
+ },
492
+ {
493
+ "kind": "method",
494
+ "name": "setAriaLabels"
495
+ },
496
+ {
497
+ "kind": "method",
498
+ "name": "close"
499
+ },
500
+ {
501
+ "kind": "method",
502
+ "name": "keypressed",
503
+ "parameters": [
504
+ {
505
+ "name": "e",
506
+ "type": {
507
+ "text": "KeyboardEvent"
508
+ }
509
+ }
510
+ ]
511
+ },
647
512
  {
648
513
  "kind": "field",
649
- "name": "value",
650
- "type": {
651
- "text": "string"
652
- },
653
- "attribute": "value",
654
- "reflects": true
514
+ "name": "_initialPlacement"
655
515
  },
656
516
  {
657
517
  "kind": "field",
658
- "name": "ariaValueTextLoading"
518
+ "name": "_actualDirection"
659
519
  }
660
520
  ],
661
521
  "attributes": [
662
522
  {
663
- "name": "type",
523
+ "name": "show",
664
524
  "type": {
665
- "text": "ButtonType"
525
+ "text": "boolean"
666
526
  },
667
- "default": "'button'",
668
- "fieldName": "type",
669
- "parsedType": {
670
- "text": "'button' | 'submit' | 'reset'"
671
- }
527
+ "default": "false",
528
+ "fieldName": "show"
672
529
  },
673
530
  {
674
- "name": "autofocus",
531
+ "name": "placement",
675
532
  "type": {
676
- "text": "boolean"
533
+ "text": "Directions"
677
534
  },
678
- "fieldName": "autofocus"
535
+ "default": "'bottom'",
536
+ "fieldName": "placement"
679
537
  },
680
538
  {
681
- "name": "variant",
539
+ "name": "tooltip",
682
540
  "type": {
683
- "text": "ButtonVariant"
541
+ "text": "boolean"
684
542
  },
685
- "default": "'secondary'",
686
- "fieldName": "variant",
687
- "parsedType": {
688
- "text": "'negative' | 'primary' | 'secondary' | 'utility' | 'pill' | 'link'"
689
- }
543
+ "default": "false",
544
+ "fieldName": "tooltip"
690
545
  },
691
546
  {
692
- "name": "quiet",
547
+ "name": "callout",
693
548
  "type": {
694
549
  "text": "boolean"
695
550
  },
696
- "fieldName": "quiet"
551
+ "default": "false",
552
+ "fieldName": "callout"
697
553
  },
698
554
  {
699
- "name": "small",
555
+ "name": "popover",
700
556
  "type": {
701
557
  "text": "boolean"
702
558
  },
703
- "fieldName": "small"
559
+ "default": "false",
560
+ "fieldName": "popover"
704
561
  },
705
562
  {
706
- "name": "loading",
563
+ "name": "highlight",
707
564
  "type": {
708
565
  "text": "boolean"
709
566
  },
710
- "fieldName": "loading"
567
+ "default": "false",
568
+ "fieldName": "highlight"
711
569
  },
712
570
  {
713
- "name": "href",
571
+ "name": "can-close",
714
572
  "type": {
715
- "text": "string"
573
+ "text": "boolean"
716
574
  },
717
- "fieldName": "href"
575
+ "default": "false",
576
+ "fieldName": "canClose"
718
577
  },
719
578
  {
720
- "name": "target",
579
+ "name": "no-arrow",
721
580
  "type": {
722
- "text": "string"
581
+ "text": "boolean"
723
582
  },
724
- "fieldName": "target"
583
+ "default": "false",
584
+ "fieldName": "noArrow"
725
585
  },
726
586
  {
727
- "name": "rel",
587
+ "name": "distance",
728
588
  "type": {
729
- "text": "string"
589
+ "text": "number"
730
590
  },
731
- "fieldName": "rel"
591
+ "default": "8",
592
+ "fieldName": "distance"
732
593
  },
733
594
  {
734
- "name": "full-width",
595
+ "name": "skidding",
735
596
  "type": {
736
- "text": "boolean"
597
+ "text": "number"
737
598
  },
738
- "fieldName": "fullWidth"
599
+ "default": "0",
600
+ "fieldName": "skidding"
739
601
  },
740
602
  {
741
- "name": "button-class",
603
+ "name": "flip",
742
604
  "type": {
743
- "text": "string"
605
+ "text": "boolean"
744
606
  },
745
- "fieldName": "buttonClass"
607
+ "default": "false",
608
+ "fieldName": "flip"
746
609
  },
747
610
  {
748
- "name": "name",
611
+ "name": "cross-axis",
749
612
  "type": {
750
- "text": "string"
613
+ "text": "boolean"
751
614
  },
752
- "fieldName": "name"
615
+ "default": "false",
616
+ "fieldName": "crossAxis"
753
617
  },
754
618
  {
755
- "name": "value",
619
+ "name": "fallback-placements",
756
620
  "type": {
757
- "text": "string"
621
+ "text": "Directions[]"
758
622
  },
759
- "fieldName": "value"
760
- }
761
- ],
762
- "mixins": [
763
- {
764
- "name": "FormControlMixin",
765
- "package": "@open-wc/form-control"
623
+ "fieldName": "fallbackPlacements"
766
624
  }
767
625
  ],
768
626
  "superclass": {
769
627
  "name": "LitElement",
770
628
  "package": "lit"
771
629
  },
772
- "tagName": "w-button",
630
+ "tagName": "w-attention",
773
631
  "customElement": true
774
632
  }
775
633
  ],
776
634
  "exports": [
777
635
  {
778
636
  "kind": "js",
779
- "name": "ccButton",
637
+ "name": "ccAttention",
780
638
  "declaration": {
781
- "name": "ccButton",
782
- "module": "packages/button/index.ts"
639
+ "name": "ccAttention",
640
+ "module": "packages/attention/index.ts"
783
641
  }
784
642
  },
785
643
  {
786
644
  "kind": "custom-element-definition",
787
- "name": "w-button",
645
+ "name": "w-attention",
788
646
  "declaration": {
789
- "name": "WarpButton",
790
- "module": "packages/button/index.ts"
647
+ "name": "WarpAttention",
648
+ "module": "packages/attention/index.ts"
791
649
  }
792
650
  },
793
651
  {
794
652
  "kind": "js",
795
- "name": "WarpButton",
653
+ "name": "WarpAttention",
796
654
  "declaration": {
797
- "name": "WarpButton",
798
- "module": "packages/button/index.ts"
655
+ "name": "WarpAttention",
656
+ "module": "packages/attention/index.ts"
799
657
  }
800
658
  }
801
659
  ]
802
660
  },
803
661
  {
804
662
  "kind": "javascript-module",
805
- "path": "packages/card/index.ts",
663
+ "path": "packages/badge/index.ts",
806
664
  "declarations": [
807
- {
808
- "kind": "variable",
809
- "name": "ccCard",
810
- "type": {
811
- "text": "object"
812
- },
813
- "default": "{ base: 'cursor-pointer overflow-hidden relative transition-all', shadow: 'group rounded-8 s-surface-elevated-200 hover:s-surface-elevated-200-hover active:s-surface-elevated-200-active', selected: '!s-bg-selected !hover:s-bg-selected-hover !active:s-bg-selected-active', outline: 'absolute border-2 rounded-8 inset-0 transition-all', outlineUnselected: 'border-transparent group-active:s-border-active', outlineSelected: 's-border-selected group-hover:s-border-selected-hover group-active:s-border-selected-active', flat: 'border-2 rounded-4', flatUnselected: 's-bg hover:s-bg-hover active:s-bg-active s-border hover:s-border-hover active:s-border-active', flatSelected: 's-bg-selected hover:s-bg-selected-hover active:s-bg-selected-active s-border-selected hover:s-border-selected-hover active:s-border-selected-active', a11y: 'sr-only', }"
814
- },
815
665
  {
816
666
  "kind": "class",
817
- "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)",
818
- "name": "WarpCard",
667
+ "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)",
668
+ "name": "WarpBadge",
819
669
  "members": [
820
670
  {
821
671
  "kind": "field",
822
- "name": "selected",
672
+ "name": "variant",
823
673
  "type": {
824
- "text": "boolean"
674
+ "text": "'neutral' | 'info' | 'positive' | 'warning' | 'negative' | 'disabled' | 'price' | 'sponsored'"
825
675
  },
826
- "default": "false",
827
- "attribute": "selected",
676
+ "default": "'neutral'",
677
+ "attribute": "variant",
828
678
  "reflects": true
829
679
  },
830
680
  {
831
681
  "kind": "field",
832
- "name": "flat",
833
- "type": {
834
- "text": "boolean"
835
- },
836
- "default": "false",
837
- "attribute": "flat"
838
- },
839
- {
840
- "kind": "field",
841
- "name": "clickable",
682
+ "name": "position",
842
683
  "type": {
843
- "text": "boolean"
684
+ "text": "'top-left' | 'top-right' | 'bottom-right' | 'bottom-left'"
844
685
  },
845
- "default": "false",
846
- "attribute": "clickable"
847
- },
848
- {
849
- "kind": "method",
850
- "name": "keypressed",
851
- "parameters": [
852
- {
853
- "name": "e",
854
- "type": {
855
- "text": "KeyboardEvent"
856
- }
857
- }
858
- ]
859
- },
860
- {
861
- "kind": "field",
862
- "name": "buttonText"
686
+ "attribute": "position",
687
+ "reflects": true
863
688
  }
864
689
  ],
865
690
  "attributes": [
866
691
  {
867
- "name": "selected",
868
- "type": {
869
- "text": "boolean"
870
- },
871
- "default": "false",
872
- "fieldName": "selected"
873
- },
874
- {
875
- "name": "flat",
692
+ "name": "variant",
876
693
  "type": {
877
- "text": "boolean"
694
+ "text": "'neutral' | 'info' | 'positive' | 'warning' | 'negative' | 'disabled' | 'price' | 'sponsored'"
878
695
  },
879
- "default": "false",
880
- "fieldName": "flat"
696
+ "default": "'neutral'",
697
+ "fieldName": "variant"
881
698
  },
882
699
  {
883
- "name": "clickable",
700
+ "name": "position",
884
701
  "type": {
885
- "text": "boolean"
702
+ "text": "'top-left' | 'top-right' | 'bottom-right' | 'bottom-left'"
886
703
  },
887
- "default": "false",
888
- "fieldName": "clickable"
704
+ "fieldName": "position"
889
705
  }
890
706
  ],
891
707
  "superclass": {
892
708
  "name": "LitElement",
893
709
  "package": "lit"
894
710
  },
895
- "tagName": "w-card",
711
+ "tagName": "w-badge",
896
712
  "customElement": true
897
713
  }
898
714
  ],
899
715
  "exports": [
900
- {
901
- "kind": "js",
902
- "name": "ccCard",
903
- "declaration": {
904
- "name": "ccCard",
905
- "module": "packages/card/index.ts"
906
- }
907
- },
908
716
  {
909
717
  "kind": "custom-element-definition",
910
- "name": "w-card",
718
+ "name": "w-badge",
911
719
  "declaration": {
912
- "name": "WarpCard",
913
- "module": "packages/card/index.ts"
720
+ "name": "WarpBadge",
721
+ "module": "packages/badge/index.ts"
914
722
  }
915
723
  },
916
724
  {
917
725
  "kind": "js",
918
- "name": "WarpCard",
726
+ "name": "WarpBadge",
919
727
  "declaration": {
920
- "name": "WarpCard",
921
- "module": "packages/card/index.ts"
728
+ "name": "WarpBadge",
729
+ "module": "packages/badge/index.ts"
922
730
  }
923
731
  }
924
732
  ]
925
733
  },
926
734
  {
927
735
  "kind": "javascript-module",
928
- "path": "packages/datepicker/datepicker.ts",
736
+ "path": "packages/box/index.ts",
929
737
  "declarations": [
930
738
  {
931
739
  "kind": "class",
932
- "description": "An input for dates.\n\nUses the `lang` attribute on either the element or on `<html>` to determine the locale options.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-datepicker--docs)",
933
- "name": "WarpDatepicker",
740
+ "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)",
741
+ "name": "WarpBox",
934
742
  "members": [
935
743
  {
936
744
  "kind": "field",
937
- "name": "shadowRootOptions",
745
+ "name": "bleed",
938
746
  "type": {
939
- "text": "object"
747
+ "text": "boolean"
940
748
  },
941
- "static": true,
942
- "default": "{ ...WarpElement.shadowRootOptions, delegatesFocus: true, }"
749
+ "attribute": "bleed",
750
+ "reflects": true
943
751
  },
944
752
  {
945
753
  "kind": "field",
946
- "name": "label",
754
+ "name": "bordered",
947
755
  "type": {
948
- "text": "string"
756
+ "text": "boolean"
949
757
  },
950
- "attribute": "label",
758
+ "attribute": "bordered",
951
759
  "reflects": true
952
760
  },
953
761
  {
954
762
  "kind": "field",
955
- "name": "lang",
763
+ "name": "info",
956
764
  "type": {
957
- "text": "string"
765
+ "text": "boolean"
958
766
  },
959
- "description": "Takes precedence over the `<html>` lang attribute.",
960
- "attribute": "lang",
767
+ "attribute": "info",
961
768
  "reflects": true
962
769
  },
963
770
  {
964
771
  "kind": "field",
965
- "name": "name",
772
+ "name": "neutral",
966
773
  "type": {
967
- "text": "string"
774
+ "text": "boolean"
968
775
  },
969
- "attribute": "name",
776
+ "attribute": "neutral",
970
777
  "reflects": true
971
778
  },
972
779
  {
973
780
  "kind": "field",
974
- "name": "value",
781
+ "name": "role",
975
782
  "type": {
976
783
  "text": "string"
977
784
  },
978
- "attribute": "value",
785
+ "attribute": "role",
979
786
  "reflects": true
980
- },
787
+ }
788
+ ],
789
+ "attributes": [
981
790
  {
982
- "kind": "field",
983
- "name": "headerFormat",
791
+ "name": "bleed",
984
792
  "type": {
985
- "text": "string"
793
+ "text": "boolean"
986
794
  },
987
- "default": "'MMMM yyyy'",
988
- "description": "Decides the format of the date as shown in the calendar header.\n\nThe syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).",
989
- "attribute": "header-format"
795
+ "fieldName": "bleed"
990
796
  },
991
797
  {
992
- "kind": "field",
993
- "name": "weekdayFormat",
798
+ "name": "bordered",
994
799
  "type": {
995
- "text": "string"
800
+ "text": "boolean"
996
801
  },
997
- "default": "'EEEEEE'",
998
- "description": "Decides the format of the weekday as shown above the grid of dates in the calendar.\n\nThe syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).",
999
- "attribute": "weekday-format"
802
+ "fieldName": "bordered"
1000
803
  },
1001
804
  {
1002
- "kind": "field",
1003
- "name": "isDayDisabled",
805
+ "name": "info",
1004
806
  "type": {
1005
- "text": "(day: Date) => boolean"
807
+ "text": "boolean"
1006
808
  },
1007
- "description": "Lets you control if a date in the calendar should be disabled.\n\nThis needs to be set on the element instance in JavaScript, not as an HTML attribute."
809
+ "fieldName": "info"
1008
810
  },
1009
811
  {
1010
- "kind": "field",
812
+ "name": "neutral",
813
+ "type": {
814
+ "text": "boolean"
815
+ },
816
+ "fieldName": "neutral"
817
+ },
818
+ {
819
+ "name": "role",
820
+ "type": {
821
+ "text": "string"
822
+ },
823
+ "fieldName": "role"
824
+ }
825
+ ],
826
+ "superclass": {
827
+ "name": "LitElement",
828
+ "package": "lit"
829
+ },
830
+ "tagName": "w-box",
831
+ "customElement": true
832
+ }
833
+ ],
834
+ "exports": [
835
+ {
836
+ "kind": "custom-element-definition",
837
+ "name": "w-box",
838
+ "declaration": {
839
+ "name": "WarpBox",
840
+ "module": "packages/box/index.ts"
841
+ }
842
+ },
843
+ {
844
+ "kind": "js",
845
+ "name": "WarpBox",
846
+ "declaration": {
847
+ "name": "WarpBox",
848
+ "module": "packages/box/index.ts"
849
+ }
850
+ }
851
+ ]
852
+ },
853
+ {
854
+ "kind": "javascript-module",
855
+ "path": "packages/breadcrumbs/index.ts",
856
+ "declarations": [
857
+ {
858
+ "kind": "variable",
859
+ "name": "ccBreadcrumbs",
860
+ "type": {
861
+ "text": "object"
862
+ },
863
+ "default": "{ wrapper: 'flex space-x-8', text: 's-text', link: 's-text-link', separator: 'select-none s-icon', a11y: 'sr-only', }"
864
+ },
865
+ {
866
+ "kind": "class",
867
+ "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)",
868
+ "name": "WarpBreadcrumbs",
869
+ "members": [
870
+ {
871
+ "kind": "field",
872
+ "name": "ariaLabel",
873
+ "type": {
874
+ "text": "string"
875
+ },
876
+ "attribute": "aria-label"
877
+ }
878
+ ],
879
+ "attributes": [
880
+ {
881
+ "name": "aria-label",
882
+ "type": {
883
+ "text": "string"
884
+ },
885
+ "fieldName": "ariaLabel"
886
+ }
887
+ ],
888
+ "superclass": {
889
+ "name": "LitElement",
890
+ "package": "lit"
891
+ },
892
+ "tagName": "w-breadcrumbs",
893
+ "customElement": true
894
+ }
895
+ ],
896
+ "exports": [
897
+ {
898
+ "kind": "js",
899
+ "name": "ccBreadcrumbs",
900
+ "declaration": {
901
+ "name": "ccBreadcrumbs",
902
+ "module": "packages/breadcrumbs/index.ts"
903
+ }
904
+ },
905
+ {
906
+ "kind": "custom-element-definition",
907
+ "name": "w-breadcrumbs",
908
+ "declaration": {
909
+ "name": "WarpBreadcrumbs",
910
+ "module": "packages/breadcrumbs/index.ts"
911
+ }
912
+ },
913
+ {
914
+ "kind": "js",
915
+ "name": "WarpBreadcrumbs",
916
+ "declaration": {
917
+ "name": "WarpBreadcrumbs",
918
+ "module": "packages/breadcrumbs/index.ts"
919
+ }
920
+ }
921
+ ]
922
+ },
923
+ {
924
+ "kind": "javascript-module",
925
+ "path": "packages/link/index.ts",
926
+ "declarations": [
927
+ {
928
+ "kind": "class",
929
+ "description": "Buttons are used to perform actions, with different visuals for different needs.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-link--docs)",
930
+ "name": "WarpLink",
931
+ "members": [
932
+ {
933
+ "kind": "field",
934
+ "name": "shadowRootOptions",
935
+ "type": {
936
+ "text": "object"
937
+ },
938
+ "static": true,
939
+ "default": "{ ...WarpElement.shadowRootOptions, delegatesFocus: true, }"
940
+ },
941
+ {
942
+ "kind": "field",
943
+ "name": "autofocus",
944
+ "type": {
945
+ "text": "boolean"
946
+ },
947
+ "attribute": "autofocus",
948
+ "reflects": true
949
+ },
950
+ {
951
+ "kind": "field",
952
+ "name": "variant",
953
+ "type": {
954
+ "text": "ButtonVariant"
955
+ },
956
+ "default": "'secondary'",
957
+ "attribute": "variant",
958
+ "reflects": true,
959
+ "parsedType": {
960
+ "text": "'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'pill' | 'link' | 'quiet' | 'utilityQuiet'"
961
+ }
962
+ },
963
+ {
964
+ "kind": "field",
965
+ "name": "quiet",
966
+ "type": {
967
+ "text": "boolean"
968
+ },
969
+ "attribute": "quiet",
970
+ "reflects": true
971
+ },
972
+ {
973
+ "kind": "field",
974
+ "name": "small",
975
+ "type": {
976
+ "text": "boolean"
977
+ },
978
+ "attribute": "small",
979
+ "reflects": true
980
+ },
981
+ {
982
+ "kind": "field",
983
+ "name": "href",
984
+ "type": {
985
+ "text": "string"
986
+ },
987
+ "attribute": "href",
988
+ "reflects": true
989
+ },
990
+ {
991
+ "kind": "field",
992
+ "name": "disabled",
993
+ "type": {
994
+ "text": "boolean"
995
+ },
996
+ "attribute": "disabled",
997
+ "reflects": true
998
+ },
999
+ {
1000
+ "kind": "field",
1001
+ "name": "target",
1002
+ "type": {
1003
+ "text": "string"
1004
+ },
1005
+ "attribute": "target",
1006
+ "reflects": true
1007
+ },
1008
+ {
1009
+ "kind": "field",
1010
+ "name": "rel",
1011
+ "type": {
1012
+ "text": "string"
1013
+ },
1014
+ "attribute": "rel",
1015
+ "reflects": true
1016
+ },
1017
+ {
1018
+ "kind": "field",
1019
+ "name": "fullWidth",
1020
+ "type": {
1021
+ "text": "boolean"
1022
+ },
1023
+ "attribute": "full-width",
1024
+ "reflects": true
1025
+ },
1026
+ {
1027
+ "kind": "field",
1028
+ "name": "buttonClass",
1029
+ "type": {
1030
+ "text": "string"
1031
+ },
1032
+ "attribute": "button-class",
1033
+ "reflects": true
1034
+ },
1035
+ {
1036
+ "kind": "field",
1037
+ "name": "name",
1038
+ "type": {
1039
+ "text": "string"
1040
+ },
1041
+ "attribute": "name",
1042
+ "reflects": true
1043
+ },
1044
+ {
1045
+ "kind": "field",
1046
+ "name": "classes",
1047
+ "type": {
1048
+ "text": "string"
1049
+ }
1050
+ }
1051
+ ],
1052
+ "attributes": [
1053
+ {
1054
+ "name": "autofocus",
1055
+ "type": {
1056
+ "text": "boolean"
1057
+ },
1058
+ "fieldName": "autofocus"
1059
+ },
1060
+ {
1061
+ "name": "variant",
1062
+ "type": {
1063
+ "text": "ButtonVariant"
1064
+ },
1065
+ "default": "'secondary'",
1066
+ "fieldName": "variant",
1067
+ "parsedType": {
1068
+ "text": "'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'pill' | 'link' | 'quiet' | 'utilityQuiet'"
1069
+ }
1070
+ },
1071
+ {
1072
+ "name": "quiet",
1073
+ "type": {
1074
+ "text": "boolean"
1075
+ },
1076
+ "fieldName": "quiet"
1077
+ },
1078
+ {
1079
+ "name": "small",
1080
+ "type": {
1081
+ "text": "boolean"
1082
+ },
1083
+ "fieldName": "small"
1084
+ },
1085
+ {
1086
+ "name": "href",
1087
+ "type": {
1088
+ "text": "string"
1089
+ },
1090
+ "fieldName": "href"
1091
+ },
1092
+ {
1093
+ "name": "disabled",
1094
+ "type": {
1095
+ "text": "boolean"
1096
+ },
1097
+ "fieldName": "disabled"
1098
+ },
1099
+ {
1100
+ "name": "target",
1101
+ "type": {
1102
+ "text": "string"
1103
+ },
1104
+ "fieldName": "target"
1105
+ },
1106
+ {
1107
+ "name": "rel",
1108
+ "type": {
1109
+ "text": "string"
1110
+ },
1111
+ "fieldName": "rel"
1112
+ },
1113
+ {
1114
+ "name": "full-width",
1115
+ "type": {
1116
+ "text": "boolean"
1117
+ },
1118
+ "fieldName": "fullWidth"
1119
+ },
1120
+ {
1121
+ "name": "button-class",
1122
+ "type": {
1123
+ "text": "string"
1124
+ },
1125
+ "fieldName": "buttonClass"
1126
+ },
1127
+ {
1128
+ "name": "name",
1129
+ "type": {
1130
+ "text": "string"
1131
+ },
1132
+ "fieldName": "name"
1133
+ }
1134
+ ],
1135
+ "mixins": [
1136
+ {
1137
+ "name": "FormControlMixin",
1138
+ "package": "@open-wc/form-control"
1139
+ }
1140
+ ],
1141
+ "superclass": {
1142
+ "name": "LitElement",
1143
+ "package": "lit"
1144
+ },
1145
+ "tagName": "w-link",
1146
+ "customElement": true
1147
+ }
1148
+ ],
1149
+ "exports": [
1150
+ {
1151
+ "kind": "custom-element-definition",
1152
+ "name": "w-link",
1153
+ "declaration": {
1154
+ "name": "WarpLink",
1155
+ "module": "packages/link/index.ts"
1156
+ }
1157
+ },
1158
+ {
1159
+ "kind": "js",
1160
+ "name": "WarpLink",
1161
+ "declaration": {
1162
+ "name": "WarpLink",
1163
+ "module": "packages/link/index.ts"
1164
+ }
1165
+ }
1166
+ ]
1167
+ },
1168
+ {
1169
+ "kind": "javascript-module",
1170
+ "path": "packages/button/index.ts",
1171
+ "declarations": [
1172
+ {
1173
+ "kind": "variable",
1174
+ "name": "ccButton",
1175
+ "type": {
1176
+ "text": "object"
1177
+ },
1178
+ "default": "{ // Buttontypes secondary: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonColors.secondary}`, // .button--secondary, .button--default, .button secondaryHref: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonColors.secondary}`, secondaryDisabled: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonVariants.isDisabled}`, secondarySmall: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonTypes.secondary} ${buttonColors.secondary}`, secondarySmallDisabled: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonTypes.secondary} ${buttonVariants.isDisabled}`, secondaryQuiet: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonColors.quiet}`, secondaryQuietDisabled: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, secondarySmallQuiet: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonVariants.quiet} ${buttonColors.quiet}`, secondarySmallQuietDisabled: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, secondaryLoading: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonTypes.secondary} ${buttonVariants.inProgress}`, secondarySmallLoading: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonTypes.secondary} ${buttonVariants.inProgress}`, secondarySmallQuietLoading: `${buttonTextSizes.xsmall} ${buttonSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.inProgress}`, secondaryQuietLoading: `${buttonSizes.medium} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.inProgress}`, primary: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.primary} ${buttonColors.primary}`, // .button--primary, .button--cta primaryDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.isDisabled} ${buttonTypes.primary}`, primarySmall: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonTypes.primary} ${buttonColors.primary}`, primarySmallDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.isDisabled} ${buttonTypes.primary} `, primaryQuiet: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonColors.quiet}`, primaryQuietDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, primarySmallQuiet: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.quiet} ${buttonColors.quiet}`, primarySmallQuietDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.isDisabled}`, primaryLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.inProgress} ${buttonTypes.primary}`, primarySmallLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.inProgress} ${buttonTypes.primary}`, primarySmallQuietLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.quiet} ${buttonVariants.inProgress} ${buttonTypes.primary}`, primaryQuietLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.quiet} ${buttonVariants.inProgress}`, utility: `${buttonSizes.utility} ${buttonTextSizes.medium} ${buttonTypes.utility} ${buttonColors.utility}`, // .button--utility utilityDisabled: `${buttonSizes.utility} ${buttonTextSizes.medium} ${buttonTypes.utility} ${buttonVariants.isDisabled}`, utilityQuiet: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.utilityQuiet} ${buttonColors.utilityQuiet}`, // .button--utility-flat utilityQuietDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.utilityQuiet} ${buttonVariants.isDisabled}`, utilitySmall: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonTypes.utility} ${buttonColors.utility}`, utilitySmallDisabled: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonTypes.utility} ${buttonVariants.isDisabled}`, utilitySmallQuiet: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonVariants.utilityQuiet} ${buttonColors.utilityQuiet}`, utilitySmallQuietDisabled: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonVariants.utilityQuiet} ${buttonVariants.isDisabled}`, utilityLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.utility} ${buttonVariants.inProgress}`, utilitySmallLoading: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonTypes.utility} ${buttonVariants.inProgress}`, utilityQuietLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.inProgress} ${buttonVariants.utilityQuiet}`, utilitySmallQuietLoading: `${buttonSizes.smallUtility} ${buttonTextSizes.xsmall} ${buttonVariants.inProgress} ${buttonVariants.utilityQuiet}`, negative: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.negative} ${buttonColors.destructive}`, // .button--destructive negativeDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.negative} ${buttonVariants.isDisabled}`, negativeQuiet: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.negativeQuiet} ${buttonColors.negativeQuiet}`, // .button--destructive-flat negativeQuietDisabled: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.negativeQuiet}${buttonVariants.isDisabled}`, negativeSmall: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonTypes.negative} ${buttonColors.destructive}`, negativeSmallDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonTypes.negative} ${buttonVariants.isDisabled}`, negativeSmallQuiet: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.negativeQuiet} ${buttonColors.negativeQuiet}`, negativeSmallQuietDisabled: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.negativeQuiet} ${buttonVariants.isDisabled}`, negativeLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonTypes.negative} ${buttonVariants.inProgress}`, negativeSmallLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.inProgress} ${buttonTypes.negative}`, negativeQuietLoading: `${buttonSizes.large} ${buttonTextSizes.medium} ${buttonVariants.negativeQuiet} ${buttonTypes.negative} ${buttonVariants.inProgress}`, negativeSmallQuietLoading: `${buttonSizes.small} ${buttonTextSizes.xsmall} ${buttonVariants.negativeQuiet} ${buttonVariants.inProgress}`, pill: `${buttonSizes.pill} ${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonColors.pill}`, // .button--pill pillSmall: `${buttonSizes.pillSmall} ${buttonTextSizes.xsmall} ${buttonTypes.pill} ${buttonColors.pill}`, pillLoading: `${buttonSizes.pill} ${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonVariants.inProgress}`, pillSmallLoading: `${buttonSizes.pillSmall} ${buttonTextSizes.xsmall} ${buttonTypes.pill} ${buttonVariants.inProgress}`, link: `${buttonSizes.link} ${buttonTextSizes.medium} ${buttonTypes.link}`, linkSmall: `${buttonSizes.link} ${buttonTextSizes.xsmall} ${buttonTypes.link}`, linkAsButton: 'inline-block active:no-underline hover:no-underline focus:no-underline text-center', a11y: 'sr-only', fullWidth: 'w-full max-w-full', contentWidth: 'max-w-max', }"
1179
+ },
1180
+ {
1181
+ "kind": "class",
1182
+ "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)",
1183
+ "name": "WarpButton",
1184
+ "members": [
1185
+ {
1186
+ "kind": "field",
1187
+ "name": "shadowRootOptions",
1188
+ "type": {
1189
+ "text": "object"
1190
+ },
1191
+ "static": true,
1192
+ "default": "{ ...WarpElement.shadowRootOptions, delegatesFocus: true, }"
1193
+ },
1194
+ {
1195
+ "kind": "field",
1196
+ "name": "type",
1197
+ "type": {
1198
+ "text": "ButtonType"
1199
+ },
1200
+ "default": "'button'",
1201
+ "attribute": "type",
1202
+ "reflects": true,
1203
+ "parsedType": {
1204
+ "text": "'button' | 'submit' | 'reset'"
1205
+ }
1206
+ },
1207
+ {
1208
+ "kind": "field",
1209
+ "name": "autofocus",
1210
+ "type": {
1211
+ "text": "boolean"
1212
+ },
1213
+ "attribute": "autofocus",
1214
+ "reflects": true
1215
+ },
1216
+ {
1217
+ "kind": "field",
1218
+ "name": "variant",
1219
+ "type": {
1220
+ "text": "ButtonVariant"
1221
+ },
1222
+ "default": "'secondary'",
1223
+ "attribute": "variant",
1224
+ "reflects": true,
1225
+ "parsedType": {
1226
+ "text": "'negative' | 'primary' | 'secondary' | 'utility' | 'pill' | 'link'"
1227
+ }
1228
+ },
1229
+ {
1230
+ "kind": "field",
1231
+ "name": "quiet",
1232
+ "type": {
1233
+ "text": "boolean"
1234
+ },
1235
+ "attribute": "quiet",
1236
+ "reflects": true
1237
+ },
1238
+ {
1239
+ "kind": "field",
1240
+ "name": "small",
1241
+ "type": {
1242
+ "text": "boolean"
1243
+ },
1244
+ "attribute": "small",
1245
+ "reflects": true
1246
+ },
1247
+ {
1248
+ "kind": "field",
1249
+ "name": "loading",
1250
+ "type": {
1251
+ "text": "boolean"
1252
+ },
1253
+ "attribute": "loading",
1254
+ "reflects": true
1255
+ },
1256
+ {
1257
+ "kind": "field",
1258
+ "name": "href",
1259
+ "type": {
1260
+ "text": "string"
1261
+ },
1262
+ "attribute": "href",
1263
+ "reflects": true
1264
+ },
1265
+ {
1266
+ "kind": "field",
1267
+ "name": "target",
1268
+ "type": {
1269
+ "text": "string"
1270
+ },
1271
+ "attribute": "target",
1272
+ "reflects": true
1273
+ },
1274
+ {
1275
+ "kind": "field",
1276
+ "name": "rel",
1277
+ "type": {
1278
+ "text": "string"
1279
+ },
1280
+ "attribute": "rel",
1281
+ "reflects": true
1282
+ },
1283
+ {
1284
+ "kind": "field",
1285
+ "name": "fullWidth",
1286
+ "type": {
1287
+ "text": "boolean"
1288
+ },
1289
+ "attribute": "full-width",
1290
+ "reflects": true
1291
+ },
1292
+ {
1293
+ "kind": "field",
1294
+ "name": "buttonClass",
1295
+ "type": {
1296
+ "text": "string"
1297
+ },
1298
+ "attribute": "button-class",
1299
+ "reflects": true
1300
+ },
1301
+ {
1302
+ "kind": "field",
1303
+ "name": "name",
1304
+ "type": {
1305
+ "text": "string"
1306
+ },
1307
+ "attribute": "name",
1308
+ "reflects": true
1309
+ },
1310
+ {
1311
+ "kind": "field",
1312
+ "name": "value",
1313
+ "type": {
1314
+ "text": "string"
1315
+ },
1316
+ "attribute": "value",
1317
+ "reflects": true
1318
+ },
1319
+ {
1320
+ "kind": "field",
1321
+ "name": "ariaValueTextLoading"
1322
+ }
1323
+ ],
1324
+ "attributes": [
1325
+ {
1326
+ "name": "type",
1327
+ "type": {
1328
+ "text": "ButtonType"
1329
+ },
1330
+ "default": "'button'",
1331
+ "fieldName": "type",
1332
+ "parsedType": {
1333
+ "text": "'button' | 'submit' | 'reset'"
1334
+ }
1335
+ },
1336
+ {
1337
+ "name": "autofocus",
1338
+ "type": {
1339
+ "text": "boolean"
1340
+ },
1341
+ "fieldName": "autofocus"
1342
+ },
1343
+ {
1344
+ "name": "variant",
1345
+ "type": {
1346
+ "text": "ButtonVariant"
1347
+ },
1348
+ "default": "'secondary'",
1349
+ "fieldName": "variant",
1350
+ "parsedType": {
1351
+ "text": "'negative' | 'primary' | 'secondary' | 'utility' | 'pill' | 'link'"
1352
+ }
1353
+ },
1354
+ {
1355
+ "name": "quiet",
1356
+ "type": {
1357
+ "text": "boolean"
1358
+ },
1359
+ "fieldName": "quiet"
1360
+ },
1361
+ {
1362
+ "name": "small",
1363
+ "type": {
1364
+ "text": "boolean"
1365
+ },
1366
+ "fieldName": "small"
1367
+ },
1368
+ {
1369
+ "name": "loading",
1370
+ "type": {
1371
+ "text": "boolean"
1372
+ },
1373
+ "fieldName": "loading"
1374
+ },
1375
+ {
1376
+ "name": "href",
1377
+ "type": {
1378
+ "text": "string"
1379
+ },
1380
+ "fieldName": "href"
1381
+ },
1382
+ {
1383
+ "name": "target",
1384
+ "type": {
1385
+ "text": "string"
1386
+ },
1387
+ "fieldName": "target"
1388
+ },
1389
+ {
1390
+ "name": "rel",
1391
+ "type": {
1392
+ "text": "string"
1393
+ },
1394
+ "fieldName": "rel"
1395
+ },
1396
+ {
1397
+ "name": "full-width",
1398
+ "type": {
1399
+ "text": "boolean"
1400
+ },
1401
+ "fieldName": "fullWidth"
1402
+ },
1403
+ {
1404
+ "name": "button-class",
1405
+ "type": {
1406
+ "text": "string"
1407
+ },
1408
+ "fieldName": "buttonClass"
1409
+ },
1410
+ {
1411
+ "name": "name",
1412
+ "type": {
1413
+ "text": "string"
1414
+ },
1415
+ "fieldName": "name"
1416
+ },
1417
+ {
1418
+ "name": "value",
1419
+ "type": {
1420
+ "text": "string"
1421
+ },
1422
+ "fieldName": "value"
1423
+ }
1424
+ ],
1425
+ "mixins": [
1426
+ {
1427
+ "name": "FormControlMixin",
1428
+ "package": "@open-wc/form-control"
1429
+ }
1430
+ ],
1431
+ "superclass": {
1432
+ "name": "LitElement",
1433
+ "package": "lit"
1434
+ },
1435
+ "tagName": "w-button",
1436
+ "customElement": true
1437
+ }
1438
+ ],
1439
+ "exports": [
1440
+ {
1441
+ "kind": "js",
1442
+ "name": "ccButton",
1443
+ "declaration": {
1444
+ "name": "ccButton",
1445
+ "module": "packages/button/index.ts"
1446
+ }
1447
+ },
1448
+ {
1449
+ "kind": "custom-element-definition",
1450
+ "name": "w-button",
1451
+ "declaration": {
1452
+ "name": "WarpButton",
1453
+ "module": "packages/button/index.ts"
1454
+ }
1455
+ },
1456
+ {
1457
+ "kind": "js",
1458
+ "name": "WarpButton",
1459
+ "declaration": {
1460
+ "name": "WarpButton",
1461
+ "module": "packages/button/index.ts"
1462
+ }
1463
+ }
1464
+ ]
1465
+ },
1466
+ {
1467
+ "kind": "javascript-module",
1468
+ "path": "packages/card/index.ts",
1469
+ "declarations": [
1470
+ {
1471
+ "kind": "variable",
1472
+ "name": "ccCard",
1473
+ "type": {
1474
+ "text": "object"
1475
+ },
1476
+ "default": "{ base: 'cursor-pointer overflow-hidden relative transition-all', shadow: 'group rounded-8 s-surface-elevated-200 hover:s-surface-elevated-200-hover active:s-surface-elevated-200-active', selected: '!s-bg-selected !hover:s-bg-selected-hover !active:s-bg-selected-active', outline: 'absolute border-2 rounded-8 inset-0 transition-all', outlineUnselected: 'border-transparent group-active:s-border-active', outlineSelected: 's-border-selected group-hover:s-border-selected-hover group-active:s-border-selected-active', flat: 'border-2 rounded-4', flatUnselected: 's-bg hover:s-bg-hover active:s-bg-active s-border hover:s-border-hover active:s-border-active', flatSelected: 's-bg-selected hover:s-bg-selected-hover active:s-bg-selected-active s-border-selected hover:s-border-selected-hover active:s-border-selected-active', a11y: 'sr-only', }"
1477
+ },
1478
+ {
1479
+ "kind": "class",
1480
+ "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)",
1481
+ "name": "WarpCard",
1482
+ "members": [
1483
+ {
1484
+ "kind": "field",
1485
+ "name": "selected",
1486
+ "type": {
1487
+ "text": "boolean"
1488
+ },
1489
+ "default": "false",
1490
+ "attribute": "selected",
1491
+ "reflects": true
1492
+ },
1493
+ {
1494
+ "kind": "field",
1495
+ "name": "flat",
1496
+ "type": {
1497
+ "text": "boolean"
1498
+ },
1499
+ "default": "false",
1500
+ "attribute": "flat"
1501
+ },
1502
+ {
1503
+ "kind": "field",
1504
+ "name": "clickable",
1505
+ "type": {
1506
+ "text": "boolean"
1507
+ },
1508
+ "default": "false",
1509
+ "attribute": "clickable"
1510
+ },
1511
+ {
1512
+ "kind": "method",
1513
+ "name": "keypressed",
1514
+ "parameters": [
1515
+ {
1516
+ "name": "e",
1517
+ "type": {
1518
+ "text": "KeyboardEvent"
1519
+ }
1520
+ }
1521
+ ]
1522
+ },
1523
+ {
1524
+ "kind": "field",
1525
+ "name": "buttonText"
1526
+ }
1527
+ ],
1528
+ "attributes": [
1529
+ {
1530
+ "name": "selected",
1531
+ "type": {
1532
+ "text": "boolean"
1533
+ },
1534
+ "default": "false",
1535
+ "fieldName": "selected"
1536
+ },
1537
+ {
1538
+ "name": "flat",
1539
+ "type": {
1540
+ "text": "boolean"
1541
+ },
1542
+ "default": "false",
1543
+ "fieldName": "flat"
1544
+ },
1545
+ {
1546
+ "name": "clickable",
1547
+ "type": {
1548
+ "text": "boolean"
1549
+ },
1550
+ "default": "false",
1551
+ "fieldName": "clickable"
1552
+ }
1553
+ ],
1554
+ "superclass": {
1555
+ "name": "LitElement",
1556
+ "package": "lit"
1557
+ },
1558
+ "tagName": "w-card",
1559
+ "customElement": true
1560
+ }
1561
+ ],
1562
+ "exports": [
1563
+ {
1564
+ "kind": "js",
1565
+ "name": "ccCard",
1566
+ "declaration": {
1567
+ "name": "ccCard",
1568
+ "module": "packages/card/index.ts"
1569
+ }
1570
+ },
1571
+ {
1572
+ "kind": "custom-element-definition",
1573
+ "name": "w-card",
1574
+ "declaration": {
1575
+ "name": "WarpCard",
1576
+ "module": "packages/card/index.ts"
1577
+ }
1578
+ },
1579
+ {
1580
+ "kind": "js",
1581
+ "name": "WarpCard",
1582
+ "declaration": {
1583
+ "name": "WarpCard",
1584
+ "module": "packages/card/index.ts"
1585
+ }
1586
+ }
1587
+ ]
1588
+ },
1589
+ {
1590
+ "kind": "javascript-module",
1591
+ "path": "packages/datepicker/datepicker.ts",
1592
+ "declarations": [
1593
+ {
1594
+ "kind": "class",
1595
+ "description": "An input for dates.\n\nUses the `lang` attribute on either the element or on `<html>` to determine the locale options.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-datepicker--docs)",
1596
+ "name": "WarpDatepicker",
1597
+ "members": [
1598
+ {
1599
+ "kind": "field",
1600
+ "name": "shadowRootOptions",
1601
+ "type": {
1602
+ "text": "object"
1603
+ },
1604
+ "static": true,
1605
+ "default": "{ ...WarpElement.shadowRootOptions, delegatesFocus: true, }"
1606
+ },
1607
+ {
1608
+ "kind": "field",
1609
+ "name": "label",
1610
+ "type": {
1611
+ "text": "string"
1612
+ },
1613
+ "attribute": "label",
1614
+ "reflects": true
1615
+ },
1616
+ {
1617
+ "kind": "field",
1618
+ "name": "lang",
1619
+ "type": {
1620
+ "text": "string"
1621
+ },
1622
+ "description": "Takes precedence over the `<html>` lang attribute.",
1623
+ "attribute": "lang",
1624
+ "reflects": true
1625
+ },
1626
+ {
1627
+ "kind": "field",
1628
+ "name": "name",
1629
+ "type": {
1630
+ "text": "string"
1631
+ },
1632
+ "attribute": "name",
1633
+ "reflects": true
1634
+ },
1635
+ {
1636
+ "kind": "field",
1637
+ "name": "value",
1638
+ "type": {
1639
+ "text": "string"
1640
+ },
1641
+ "attribute": "value",
1642
+ "reflects": true
1643
+ },
1644
+ {
1645
+ "kind": "field",
1646
+ "name": "headerFormat",
1647
+ "type": {
1648
+ "text": "string"
1649
+ },
1650
+ "default": "'MMMM yyyy'",
1651
+ "description": "Decides the format of the date as shown in the calendar header.\n\nThe syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).",
1652
+ "attribute": "header-format"
1653
+ },
1654
+ {
1655
+ "kind": "field",
1656
+ "name": "weekdayFormat",
1657
+ "type": {
1658
+ "text": "string"
1659
+ },
1660
+ "default": "'EEEEEE'",
1661
+ "description": "Decides the format of the weekday as shown above the grid of dates in the calendar.\n\nThe syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).",
1662
+ "attribute": "weekday-format"
1663
+ },
1664
+ {
1665
+ "kind": "field",
1666
+ "name": "isDayDisabled",
1667
+ "type": {
1668
+ "text": "(day: Date) => boolean"
1669
+ },
1670
+ "description": "Lets you control if a date in the calendar should be disabled.\n\nThis needs to be set on the element instance in JavaScript, not as an HTML attribute."
1671
+ },
1672
+ {
1673
+ "kind": "field",
1011
1674
  "name": "dayFormat",
1012
1675
  "type": {
1013
1676
  "text": "string"
@@ -1077,6 +1740,21 @@
1077
1740
  "text": "HTMLDivElement"
1078
1741
  }
1079
1742
  },
1743
+ {
1744
+ "kind": "field",
1745
+ "name": "previousMonthButton",
1746
+ "type": {
1747
+ "text": "HTMLButtonElement"
1748
+ },
1749
+ "description": "This is the first focusable element, needed for the modal focus trap.\n\nDon't cache this and other `@query` fields from inside the calendar modal.\nThey work the first time, but once the calendar is closed and reopened\nthe query will point to an element that doesn't exist anymore."
1750
+ },
1751
+ {
1752
+ "kind": "field",
1753
+ "name": "todayCell",
1754
+ "type": {
1755
+ "text": "HTMLTableCellElement"
1756
+ }
1757
+ },
1080
1758
  {
1081
1759
  "kind": "field",
1082
1760
  "name": "selectedCell",
@@ -2286,678 +2964,266 @@
2286
2964
  "default": "1",
2287
2965
  "fieldName": "currentPageNumber"
2288
2966
  },
2289
- {
2290
- "name": "visible-pages",
2291
- "type": {
2292
- "text": "number"
2293
- },
2294
- "default": "7",
2295
- "fieldName": "visiblePages"
2296
- }
2297
- ],
2298
- "superclass": {
2299
- "name": "LitElement",
2300
- "package": "lit"
2301
- },
2302
- "tagName": "w-pagination",
2303
- "customElement": true
2304
- }
2305
- ],
2306
- "exports": [
2307
- {
2308
- "kind": "custom-element-definition",
2309
- "name": "w-pagination",
2310
- "declaration": {
2311
- "name": "WarpPagination",
2312
- "module": "packages/pagination/index.ts"
2313
- }
2314
- },
2315
- {
2316
- "kind": "js",
2317
- "name": "WarpPagination",
2318
- "declaration": {
2319
- "name": "WarpPagination",
2320
- "module": "packages/pagination/index.ts"
2321
- }
2322
- }
2323
- ]
2324
- },
2325
- {
2326
- "kind": "javascript-module",
2327
- "path": "packages/pill/index.ts",
2328
- "declarations": [
2329
- {
2330
- "kind": "variable",
2331
- "name": "pillStyles",
2332
- "type": {
2333
- "text": "object"
2334
- },
2335
- "default": "{ wrapper: 'flex items-center', button: 'inline-flex items-center focusable text-xs transition-all', suggestion: 'bg-[--w-color-pill-suggestion-background] hover:bg-[--w-color-pill-suggestion-background-hover] active:bg-[--w-color-pill-suggestion-background-active] s-text font-bold', filter: 's-bg-primary hover:s-bg-primary-hover active:s-bg-primary-active s-text-inverted', label: 'pl-12 py-8 rounded-l-full', labelWithoutClose: 'pr-12 rounded-r-full', labelWithClose: 'pr-2', close: 'pr-12 pl-4 py-8 rounded-r-full', closeIcon: 'h-16', a11y: 'sr-only', }"
2336
- },
2337
- {
2338
- "kind": "class",
2339
- "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)",
2340
- "name": "WarpPill",
2341
- "members": [
2342
- {
2343
- "kind": "field",
2344
- "name": "canClose",
2345
- "type": {
2346
- "text": "boolean"
2347
- },
2348
- "default": "false",
2349
- "attribute": "can-close"
2350
- },
2351
- {
2352
- "kind": "field",
2353
- "name": "suggestion",
2354
- "type": {
2355
- "text": "boolean"
2356
- },
2357
- "default": "false",
2358
- "attribute": "suggestion"
2359
- },
2360
- {
2361
- "kind": "field",
2362
- "name": "openSrLabel",
2363
- "type": {
2364
- "text": "string"
2365
- },
2366
- "deprecated": "Used \"open-arial-label\" instead.",
2367
- "attribute": "open-sr-label"
2368
- },
2369
- {
2370
- "kind": "field",
2371
- "name": "openAriaLabel",
2372
- "type": {
2373
- "text": "string"
2374
- },
2375
- "attribute": "open-aria-label"
2376
- },
2377
- {
2378
- "kind": "field",
2379
- "name": "closeSrLabel",
2380
- "type": {
2381
- "text": "string"
2382
- },
2383
- "deprecated": "Used \"close-arial-label\" instead.",
2384
- "attribute": "close-sr-label"
2385
- },
2386
- {
2387
- "kind": "field",
2388
- "name": "closeAriaLabel",
2389
- "type": {
2390
- "text": "string"
2391
- },
2392
- "attribute": "close-aria-label"
2393
- },
2394
- {
2395
- "kind": "field",
2396
- "name": "openFilterSrText"
2397
- },
2398
- {
2399
- "kind": "field",
2400
- "name": "removeFilterSrText"
2401
- }
2402
- ],
2403
- "events": [
2404
- {
2405
- "name": "w-pill-click",
2406
- "type": {
2407
- "text": "CustomEvent"
2408
- }
2409
- },
2410
- {
2411
- "name": "w-pill-close",
2412
- "type": {
2413
- "text": "CustomEvent"
2414
- }
2415
- }
2416
- ],
2417
- "attributes": [
2418
- {
2419
- "name": "can-close",
2420
- "type": {
2421
- "text": "boolean"
2422
- },
2423
- "default": "false",
2424
- "fieldName": "canClose"
2425
- },
2426
- {
2427
- "name": "suggestion",
2428
- "type": {
2429
- "text": "boolean"
2430
- },
2431
- "default": "false",
2432
- "fieldName": "suggestion"
2433
- },
2434
- {
2435
- "name": "open-sr-label",
2436
- "type": {
2437
- "text": "string"
2438
- },
2439
- "deprecated": "Used \"open-arial-label\" instead.",
2440
- "fieldName": "openSrLabel"
2441
- },
2442
- {
2443
- "name": "open-aria-label",
2444
- "type": {
2445
- "text": "string"
2446
- },
2447
- "fieldName": "openAriaLabel"
2448
- },
2449
- {
2450
- "name": "close-sr-label",
2451
- "type": {
2452
- "text": "string"
2453
- },
2454
- "deprecated": "Used \"close-arial-label\" instead.",
2455
- "fieldName": "closeSrLabel"
2456
- },
2457
- {
2458
- "name": "close-aria-label",
2459
- "type": {
2460
- "text": "string"
2461
- },
2462
- "fieldName": "closeAriaLabel"
2463
- }
2464
- ],
2465
- "superclass": {
2466
- "name": "LitElement",
2467
- "package": "lit"
2468
- },
2469
- "tagName": "w-pill",
2470
- "customElement": true
2471
- }
2472
- ],
2473
- "exports": [
2474
- {
2475
- "kind": "js",
2476
- "name": "pillStyles",
2477
- "declaration": {
2478
- "name": "pillStyles",
2479
- "module": "packages/pill/index.ts"
2480
- }
2481
- },
2482
- {
2483
- "kind": "custom-element-definition",
2484
- "name": "w-pill",
2485
- "declaration": {
2486
- "name": "WarpPill",
2487
- "module": "packages/pill/index.ts"
2488
- }
2489
- },
2490
- {
2491
- "kind": "js",
2492
- "name": "WarpPill",
2493
- "declaration": {
2494
- "name": "WarpPill",
2495
- "module": "packages/pill/index.ts"
2496
- }
2497
- }
2498
- ]
2499
- },
2500
- {
2501
- "kind": "javascript-module",
2502
- "path": "packages/rip-and-tear-checkbox/index.ts",
2503
- "declarations": [],
2504
- "exports": [
2505
- {
2506
- "kind": "custom-element-definition",
2507
- "name": "w-checkbox",
2508
- "declaration": {
2509
- "name": "WCheckbox",
2510
- "module": "/packages/rip-and-tear-checkbox/checkbox"
2511
- }
2967
+ {
2968
+ "name": "visible-pages",
2969
+ "type": {
2970
+ "text": "number"
2971
+ },
2972
+ "default": "7",
2973
+ "fieldName": "visiblePages"
2974
+ }
2975
+ ],
2976
+ "superclass": {
2977
+ "name": "LitElement",
2978
+ "package": "lit"
2979
+ },
2980
+ "tagName": "w-pagination",
2981
+ "customElement": true
2512
2982
  }
2513
- ]
2514
- },
2515
- {
2516
- "kind": "javascript-module",
2517
- "path": "packages/rip-and-tear-radio/index.ts",
2518
- "declarations": [],
2983
+ ],
2519
2984
  "exports": [
2520
2985
  {
2521
2986
  "kind": "custom-element-definition",
2522
- "name": "w-radio",
2987
+ "name": "w-pagination",
2523
2988
  "declaration": {
2524
- "name": "WRadio",
2525
- "module": "/packages/rip-and-tear-radio/radio"
2989
+ "name": "WarpPagination",
2990
+ "module": "packages/pagination/index.ts"
2526
2991
  }
2527
2992
  },
2528
2993
  {
2529
- "kind": "custom-element-definition",
2530
- "name": "w-radio-group",
2994
+ "kind": "js",
2995
+ "name": "WarpPagination",
2531
2996
  "declaration": {
2532
- "name": "WRadioGroup",
2533
- "module": "/packages/rip-and-tear-radio/radio-group"
2997
+ "name": "WarpPagination",
2998
+ "module": "packages/pagination/index.ts"
2534
2999
  }
2535
3000
  }
2536
3001
  ]
2537
3002
  },
2538
3003
  {
2539
3004
  "kind": "javascript-module",
2540
- "path": "packages/select/index.ts",
3005
+ "path": "packages/pill/index.ts",
2541
3006
  "declarations": [
2542
3007
  {
2543
3008
  "kind": "variable",
2544
- "name": "ccSelect",
2545
- "type": {
2546
- "text": "object"
2547
- },
2548
- "default": "{ base: 'block text-m mb-0 py-12 pr-32 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] appearance-none cursor-pointer caret-current', default: 's-text s-bg pl-8 border-1 s-border hover:s-border-hover active:s-border-active', disabled: 's-text-disabled s-bg-disabled-subtle pl-8 border-1 s-border-disabled hover:s-border-disabled active:s-border-disabled pointer-events-none', invalid: 's-text s-bg pl-8 border-1 s-border-negative hover:s-border-negative-hover active:s-border-active outline-[--w-s-color-border-negative]!', readOnly: 's-text bg-transparent pl-0 border-0 pointer-events-none before:hidden', wrapper: 'relative', selectWrapper: `relative before:block before:absolute before:right-0 before:bottom-0 before:w-32 before:h-full before:pointer-events-none `, chevron: 'block absolute top-[30%] right-0 bottom-0 w-32 h-full s-icon pointer-events-none cursor-pointer', chevronDisabled: 'opacity-25', }"
2549
- },
2550
- {
2551
- "kind": "variable",
2552
- "name": "ccLabel",
2553
- "type": {
2554
- "text": "object"
2555
- },
2556
- "default": "{ base: 'antialiased block relative text-s font-bold pb-4 cursor-pointer s-text', optional: 'pl-8 font-normal text-s s-text-subtle', }"
2557
- },
2558
- {
2559
- "kind": "variable",
2560
- "name": "ccHelpText",
3009
+ "name": "pillStyles",
2561
3010
  "type": {
2562
3011
  "text": "object"
2563
3012
  },
2564
- "default": "{ base: 'text-xs mt-4 block', color: 's-text-subtle', colorInvalid: 's-text-negative', }"
3013
+ "default": "{ wrapper: 'flex items-center', button: 'inline-flex items-center focusable text-xs transition-all', suggestion: 'bg-[--w-color-pill-suggestion-background] hover:bg-[--w-color-pill-suggestion-background-hover] active:bg-[--w-color-pill-suggestion-background-active] s-text font-bold', filter: 's-bg-primary hover:s-bg-primary-hover active:s-bg-primary-active s-text-inverted', label: 'pl-12 py-8 rounded-l-full', labelWithoutClose: 'pr-12 rounded-r-full', labelWithClose: 'pr-2', close: 'pr-12 pl-4 py-8 rounded-r-full', closeIcon: 'h-16', a11y: 'sr-only', }"
2565
3014
  },
2566
3015
  {
2567
3016
  "kind": "class",
2568
- "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)",
2569
- "name": "WarpSelect",
3017
+ "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)",
3018
+ "name": "WarpPill",
2570
3019
  "members": [
2571
3020
  {
2572
3021
  "kind": "field",
2573
- "name": "autoFocus",
2574
- "type": {
2575
- "text": "boolean"
2576
- },
2577
- "description": "Whether the element should receive focus on render",
2578
- "attribute": "auto-focus",
2579
- "reflects": true
2580
- },
2581
- {
2582
- "kind": "field",
2583
- "name": "invalid",
3022
+ "name": "canClose",
2584
3023
  "type": {
2585
3024
  "text": "boolean"
2586
3025
  },
2587
- "description": "Renders the field in an invalid state. Often paired with `hint` to provide feedback about the error",
2588
- "attribute": "invalid",
2589
- "reflects": true
3026
+ "default": "false",
3027
+ "attribute": "can-close"
2590
3028
  },
2591
3029
  {
2592
3030
  "kind": "field",
2593
- "name": "always",
3031
+ "name": "suggestion",
2594
3032
  "type": {
2595
3033
  "text": "boolean"
2596
3034
  },
2597
- "description": "Whether to always show a hint",
2598
- "attribute": "always",
2599
- "reflects": true
3035
+ "default": "false",
3036
+ "attribute": "suggestion"
2600
3037
  },
2601
3038
  {
2602
3039
  "kind": "field",
2603
- "name": "hint",
3040
+ "name": "openSrLabel",
2604
3041
  "type": {
2605
3042
  "text": "string"
2606
3043
  },
2607
- "description": "The content displayed as the help text",
2608
- "attribute": "hint",
2609
- "reflects": true
3044
+ "deprecated": "Used \"open-arial-label\" instead.",
3045
+ "attribute": "open-sr-label"
2610
3046
  },
2611
3047
  {
2612
3048
  "kind": "field",
2613
- "name": "label",
3049
+ "name": "openAriaLabel",
2614
3050
  "type": {
2615
3051
  "text": "string"
2616
3052
  },
2617
- "description": "The content to disply as the label",
2618
- "attribute": "label",
2619
- "reflects": true
2620
- },
2621
- {
2622
- "kind": "field",
2623
- "name": "optional",
2624
- "type": {
2625
- "text": "boolean"
2626
- },
2627
- "description": "Whether to show optional text",
2628
- "attribute": "optional",
2629
- "reflects": true
2630
- },
2631
- {
2632
- "kind": "field",
2633
- "name": "disabled",
2634
- "type": {
2635
- "text": "boolean"
2636
- },
2637
- "description": "Renders the field in a disabled state.",
2638
- "attribute": "disabled",
2639
- "reflects": true
2640
- },
2641
- {
2642
- "kind": "field",
2643
- "name": "readOnly",
2644
- "type": {
2645
- "text": "boolean"
2646
- },
2647
- "description": "Renders the field in a readonly state.",
2648
- "attribute": "read-only",
2649
- "reflects": true
3053
+ "attribute": "open-aria-label"
2650
3054
  },
2651
3055
  {
2652
3056
  "kind": "field",
2653
- "name": "name",
3057
+ "name": "closeSrLabel",
2654
3058
  "type": {
2655
3059
  "text": "string"
2656
3060
  },
2657
- "attribute": "name",
2658
- "reflects": true
3061
+ "deprecated": "Used \"close-arial-label\" instead.",
3062
+ "attribute": "close-sr-label"
2659
3063
  },
2660
3064
  {
2661
3065
  "kind": "field",
2662
- "name": "value",
3066
+ "name": "closeAriaLabel",
2663
3067
  "type": {
2664
3068
  "text": "string"
2665
3069
  },
2666
- "attribute": "value",
2667
- "reflects": true
2668
- },
2669
- {
2670
- "kind": "method",
2671
- "name": "handleKeyDown",
2672
- "parameters": [
2673
- {
2674
- "name": "event",
2675
- "type": {
2676
- "text": "KeyboardEvent"
2677
- }
2678
- }
2679
- ]
2680
- },
2681
- {
2682
- "kind": "field",
2683
- "name": "#classes",
2684
- "privacy": "private",
2685
- "readonly": true
2686
- },
2687
- {
2688
- "kind": "field",
2689
- "name": "#helpTextClasses",
2690
- "privacy": "private",
2691
- "readonly": true
2692
- },
2693
- {
2694
- "kind": "field",
2695
- "name": "#chevronClasses",
2696
- "privacy": "private",
2697
- "readonly": true
2698
- },
2699
- {
2700
- "kind": "field",
2701
- "name": "#id",
2702
- "privacy": "private",
2703
- "readonly": true
3070
+ "attribute": "close-aria-label"
2704
3071
  },
2705
3072
  {
2706
3073
  "kind": "field",
2707
- "name": "#helpId",
2708
- "privacy": "private",
2709
- "readonly": true
2710
- },
2711
- {
2712
- "kind": "method",
2713
- "name": "onChange",
2714
- "parameters": [
2715
- {
2716
- "name": "{ target }"
2717
- }
2718
- ]
3074
+ "name": "openFilterSrText"
2719
3075
  },
2720
3076
  {
2721
3077
  "kind": "field",
2722
- "name": "_options",
2723
- "attribute": "_options"
3078
+ "name": "removeFilterSrText"
2724
3079
  }
2725
3080
  ],
2726
- "attributes": [
2727
- {
2728
- "name": "auto-focus",
2729
- "type": {
2730
- "text": "boolean"
2731
- },
2732
- "description": "Whether the element should receive focus on render",
2733
- "fieldName": "autoFocus"
2734
- },
2735
- {
2736
- "name": "invalid",
2737
- "type": {
2738
- "text": "boolean"
2739
- },
2740
- "description": "Renders the field in an invalid state. Often paired with `hint` to provide feedback about the error",
2741
- "fieldName": "invalid"
2742
- },
2743
- {
2744
- "name": "always",
2745
- "type": {
2746
- "text": "boolean"
2747
- },
2748
- "description": "Whether to always show a hint",
2749
- "fieldName": "always"
2750
- },
3081
+ "events": [
2751
3082
  {
2752
- "name": "hint",
3083
+ "name": "w-pill-click",
2753
3084
  "type": {
2754
- "text": "string"
2755
- },
2756
- "description": "The content displayed as the help text",
2757
- "fieldName": "hint"
3085
+ "text": "CustomEvent"
3086
+ }
2758
3087
  },
2759
3088
  {
2760
- "name": "label",
3089
+ "name": "w-pill-close",
2761
3090
  "type": {
2762
- "text": "string"
2763
- },
2764
- "description": "The content to disply as the label",
2765
- "fieldName": "label"
2766
- },
3091
+ "text": "CustomEvent"
3092
+ }
3093
+ }
3094
+ ],
3095
+ "attributes": [
2767
3096
  {
2768
- "name": "optional",
3097
+ "name": "can-close",
2769
3098
  "type": {
2770
3099
  "text": "boolean"
2771
3100
  },
2772
- "description": "Whether to show optional text",
2773
- "fieldName": "optional"
3101
+ "default": "false",
3102
+ "fieldName": "canClose"
2774
3103
  },
2775
3104
  {
2776
- "name": "disabled",
3105
+ "name": "suggestion",
2777
3106
  "type": {
2778
3107
  "text": "boolean"
2779
3108
  },
2780
- "description": "Renders the field in a disabled state.",
2781
- "fieldName": "disabled"
3109
+ "default": "false",
3110
+ "fieldName": "suggestion"
2782
3111
  },
2783
3112
  {
2784
- "name": "read-only",
3113
+ "name": "open-sr-label",
2785
3114
  "type": {
2786
- "text": "boolean"
3115
+ "text": "string"
2787
3116
  },
2788
- "description": "Renders the field in a readonly state.",
2789
- "fieldName": "readOnly"
3117
+ "deprecated": "Used \"open-arial-label\" instead.",
3118
+ "fieldName": "openSrLabel"
2790
3119
  },
2791
3120
  {
2792
- "name": "_options",
2793
- "fieldName": "_options"
3121
+ "name": "open-aria-label",
3122
+ "type": {
3123
+ "text": "string"
3124
+ },
3125
+ "fieldName": "openAriaLabel"
2794
3126
  },
2795
3127
  {
2796
- "name": "name",
3128
+ "name": "close-sr-label",
2797
3129
  "type": {
2798
3130
  "text": "string"
2799
3131
  },
2800
- "fieldName": "name"
3132
+ "deprecated": "Used \"close-arial-label\" instead.",
3133
+ "fieldName": "closeSrLabel"
2801
3134
  },
2802
3135
  {
2803
- "name": "value",
3136
+ "name": "close-aria-label",
2804
3137
  "type": {
2805
3138
  "text": "string"
2806
3139
  },
2807
- "fieldName": "value"
2808
- }
2809
- ],
2810
- "mixins": [
2811
- {
2812
- "name": "FormControlMixin",
2813
- "package": "@open-wc/form-control"
3140
+ "fieldName": "closeAriaLabel"
2814
3141
  }
2815
3142
  ],
2816
3143
  "superclass": {
2817
3144
  "name": "LitElement",
2818
3145
  "package": "lit"
2819
3146
  },
2820
- "tagName": "w-select",
3147
+ "tagName": "w-pill",
2821
3148
  "customElement": true
2822
3149
  }
2823
3150
  ],
2824
3151
  "exports": [
2825
3152
  {
2826
3153
  "kind": "js",
2827
- "name": "ccSelect",
2828
- "declaration": {
2829
- "name": "ccSelect",
2830
- "module": "packages/select/index.ts"
2831
- }
2832
- },
2833
- {
2834
- "kind": "js",
2835
- "name": "ccLabel",
3154
+ "name": "pillStyles",
2836
3155
  "declaration": {
2837
- "name": "ccLabel",
2838
- "module": "packages/select/index.ts"
3156
+ "name": "pillStyles",
3157
+ "module": "packages/pill/index.ts"
2839
3158
  }
2840
3159
  },
2841
3160
  {
2842
- "kind": "js",
2843
- "name": "ccHelpText",
3161
+ "kind": "custom-element-definition",
3162
+ "name": "w-pill",
2844
3163
  "declaration": {
2845
- "name": "ccHelpText",
2846
- "module": "packages/select/index.ts"
3164
+ "name": "WarpPill",
3165
+ "module": "packages/pill/index.ts"
2847
3166
  }
2848
3167
  },
2849
3168
  {
2850
3169
  "kind": "js",
2851
- "name": "WarpSelect",
3170
+ "name": "WarpPill",
2852
3171
  "declaration": {
2853
- "name": "WarpSelect",
2854
- "module": "packages/select/index.ts"
3172
+ "name": "WarpPill",
3173
+ "module": "packages/pill/index.ts"
2855
3174
  }
2856
- },
3175
+ }
3176
+ ]
3177
+ },
3178
+ {
3179
+ "kind": "javascript-module",
3180
+ "path": "packages/rip-and-tear-checkbox/index.ts",
3181
+ "declarations": [],
3182
+ "exports": [
2857
3183
  {
2858
3184
  "kind": "custom-element-definition",
2859
- "name": "w-select",
3185
+ "name": "w-checkbox",
2860
3186
  "declaration": {
2861
- "name": "WarpSelect",
2862
- "module": "packages/select/index.ts"
3187
+ "name": "WCheckbox",
3188
+ "module": "/packages/rip-and-tear-checkbox/checkbox"
2863
3189
  }
2864
3190
  }
2865
3191
  ]
2866
3192
  },
2867
3193
  {
2868
3194
  "kind": "javascript-module",
2869
- "path": "packages/switch/index.ts",
2870
- "declarations": [
2871
- {
2872
- "kind": "class",
2873
- "description": "",
2874
- "name": "WarpSwitch",
2875
- "members": [
2876
- {
2877
- "kind": "field",
2878
- "name": "value",
2879
- "type": {
2880
- "text": "boolean"
2881
- },
2882
- "default": "false",
2883
- "attribute": "value",
2884
- "reflects": true
2885
- },
2886
- {
2887
- "kind": "field",
2888
- "name": "disabled",
2889
- "type": {
2890
- "text": "boolean"
2891
- },
2892
- "default": "false",
2893
- "attribute": "disabled",
2894
- "reflects": true
2895
- }
2896
- ],
2897
- "events": [
2898
- {
2899
- "name": "change",
2900
- "type": {
2901
- "text": "CustomEvent"
2902
- }
2903
- }
2904
- ],
2905
- "attributes": [
2906
- {
2907
- "name": "value",
2908
- "type": {
2909
- "text": "boolean"
2910
- },
2911
- "default": "false",
2912
- "fieldName": "value"
2913
- },
2914
- {
2915
- "name": "disabled",
2916
- "type": {
2917
- "text": "boolean"
2918
- },
2919
- "default": "false",
2920
- "fieldName": "disabled"
2921
- }
2922
- ],
2923
- "superclass": {
2924
- "name": "LitElement",
2925
- "package": "lit"
2926
- },
2927
- "tagName": "w-switch",
2928
- "customElement": true
2929
- }
2930
- ],
3195
+ "path": "packages/rip-and-tear-radio/index.ts",
3196
+ "declarations": [],
2931
3197
  "exports": [
2932
3198
  {
2933
- "kind": "js",
2934
- "name": "WarpSwitch",
3199
+ "kind": "custom-element-definition",
3200
+ "name": "w-radio",
2935
3201
  "declaration": {
2936
- "name": "WarpSwitch",
2937
- "module": "packages/switch/index.ts"
3202
+ "name": "WRadio",
3203
+ "module": "/packages/rip-and-tear-radio/radio"
2938
3204
  }
2939
3205
  },
2940
3206
  {
2941
3207
  "kind": "custom-element-definition",
2942
- "name": "w-switch",
3208
+ "name": "w-radio-group",
2943
3209
  "declaration": {
2944
- "name": "WarpSwitch",
2945
- "module": "packages/switch/index.ts"
3210
+ "name": "WRadioGroup",
3211
+ "module": "/packages/rip-and-tear-radio/radio-group"
2946
3212
  }
2947
3213
  }
2948
3214
  ]
2949
3215
  },
2950
3216
  {
2951
3217
  "kind": "javascript-module",
2952
- "path": "packages/textfield/index.ts",
3218
+ "path": "packages/select/index.ts",
2953
3219
  "declarations": [
2954
3220
  {
2955
3221
  "kind": "variable",
2956
- "name": "ccinput",
3222
+ "name": "ccSelect",
2957
3223
  "type": {
2958
3224
  "text": "object"
2959
3225
  },
2960
- "default": "{ // wrapper classes wrapper: 'relative', // input classes base: 'block text-m leading-m mb-0 px-8 py-12 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] caret-current', // true default: 'border-1 s-text s-bg s-border hover:s-border-hover active:s-border-selected', // !isInvalid && !isDisabled && !isReadOnly disabled: 'border-1 s-text-disabled s-bg-disabled-subtle s-border-disabled pointer-events-none', // !isInvalid && isDisabled && !isReadOnly invalid: 'border-1 s-text-negative s-bg s-border-negative hover:s-border-negative-hover outline-[--w-s-color-border-negative]!', // isInvalid && !isDisabled && !isReadOnly readOnly: 'pl-0 bg-transparent pointer-events-none', // !isInvalid && !isDisabled && isReadOnly placeholder: 'placeholder:s-text-placeholder', suffix: 'pr-40', prefix: 'pl-[var(--w-prefix-width,_40px)]', // textarea classes textArea: 'min-h-[42] sm:min-h-[45]', }"
3226
+ "default": "{ base: 'block text-m mb-0 py-12 pr-32 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] appearance-none cursor-pointer caret-current', default: 's-text s-bg pl-8 border-1 s-border hover:s-border-hover active:s-border-active', disabled: 's-text-disabled s-bg-disabled-subtle pl-8 border-1 s-border-disabled hover:s-border-disabled active:s-border-disabled pointer-events-none', invalid: 's-text s-bg pl-8 border-1 s-border-negative hover:s-border-negative-hover active:s-border-active outline-[--w-s-color-border-negative]!', readOnly: 's-text bg-transparent pl-0 border-0 pointer-events-none before:hidden', wrapper: 'relative', selectWrapper: `relative before:block before:absolute before:right-0 before:bottom-0 before:w-32 before:h-full before:pointer-events-none `, chevron: 'block absolute top-[30%] right-0 bottom-0 w-32 h-full s-icon pointer-events-none cursor-pointer', chevronDisabled: 'opacity-25', }"
2961
3227
  },
2962
3228
  {
2963
3229
  "kind": "variable",
@@ -2977,25 +3243,17 @@
2977
3243
  },
2978
3244
  {
2979
3245
  "kind": "class",
2980
- "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)",
2981
- "name": "WarpTextField",
3246
+ "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)",
3247
+ "name": "WarpSelect",
2982
3248
  "members": [
2983
3249
  {
2984
3250
  "kind": "field",
2985
- "name": "shadowRootOptions",
2986
- "type": {
2987
- "text": "object"
2988
- },
2989
- "static": true,
2990
- "default": "{ ...WarpElement.shadowRootOptions, delegatesFocus: true, }"
2991
- },
2992
- {
2993
- "kind": "field",
2994
- "name": "disabled",
3251
+ "name": "autoFocus",
2995
3252
  "type": {
2996
3253
  "text": "boolean"
2997
3254
  },
2998
- "attribute": "disabled",
3255
+ "description": "Whether the element should receive focus on render",
3256
+ "attribute": "auto-focus",
2999
3257
  "reflects": true
3000
3258
  },
3001
3259
  {
@@ -3004,795 +3262,939 @@
3004
3262
  "type": {
3005
3263
  "text": "boolean"
3006
3264
  },
3265
+ "description": "Renders the field in an invalid state. Often paired with `hint` to provide feedback about the error",
3007
3266
  "attribute": "invalid",
3008
3267
  "reflects": true
3009
3268
  },
3010
3269
  {
3011
3270
  "kind": "field",
3012
- "name": "id",
3013
- "type": {
3014
- "text": "string"
3015
- },
3016
- "attribute": "id",
3017
- "reflects": true
3018
- },
3019
- {
3020
- "kind": "field",
3021
- "name": "label",
3022
- "type": {
3023
- "text": "string"
3024
- },
3025
- "attribute": "label",
3026
- "reflects": true
3027
- },
3028
- {
3029
- "kind": "field",
3030
- "name": "helpText",
3031
- "type": {
3032
- "text": "string"
3033
- },
3034
- "attribute": "helpText",
3035
- "reflects": true
3036
- },
3037
- {
3038
- "kind": "field",
3039
- "name": "size",
3040
- "type": {
3041
- "text": "string"
3042
- },
3043
- "attribute": "size",
3044
- "reflects": true
3045
- },
3046
- {
3047
- "kind": "field",
3048
- "name": "max",
3049
- "type": {
3050
- "text": "number"
3051
- },
3052
- "attribute": "max",
3053
- "reflects": true
3054
- },
3055
- {
3056
- "kind": "field",
3057
- "name": "min",
3058
- "type": {
3059
- "text": "number"
3060
- },
3061
- "attribute": "min",
3062
- "reflects": true
3063
- },
3064
- {
3065
- "kind": "field",
3066
- "name": "minLength",
3067
- "type": {
3068
- "text": "number"
3069
- },
3070
- "attribute": "min-length",
3071
- "reflects": true
3072
- },
3073
- {
3074
- "kind": "field",
3075
- "name": "maxLength",
3271
+ "name": "always",
3076
3272
  "type": {
3077
- "text": "number"
3273
+ "text": "boolean"
3078
3274
  },
3079
- "attribute": "max-length",
3275
+ "description": "Whether to always show a hint",
3276
+ "attribute": "always",
3080
3277
  "reflects": true
3081
3278
  },
3082
3279
  {
3083
3280
  "kind": "field",
3084
- "name": "pattern",
3281
+ "name": "hint",
3085
3282
  "type": {
3086
3283
  "text": "string"
3087
3284
  },
3088
- "attribute": "pattern",
3285
+ "description": "The content displayed as the help text",
3286
+ "attribute": "hint",
3089
3287
  "reflects": true
3090
3288
  },
3091
3289
  {
3092
3290
  "kind": "field",
3093
- "name": "placeholder",
3291
+ "name": "label",
3094
3292
  "type": {
3095
3293
  "text": "string"
3096
3294
  },
3097
- "attribute": "placeholder",
3295
+ "description": "The content to disply as the label",
3296
+ "attribute": "label",
3098
3297
  "reflects": true
3099
3298
  },
3100
3299
  {
3101
3300
  "kind": "field",
3102
- "name": "readOnly",
3301
+ "name": "optional",
3103
3302
  "type": {
3104
3303
  "text": "boolean"
3105
3304
  },
3106
- "attribute": "read-only",
3305
+ "description": "Whether to show optional text",
3306
+ "attribute": "optional",
3107
3307
  "reflects": true
3108
3308
  },
3109
3309
  {
3110
3310
  "kind": "field",
3111
- "name": "required",
3311
+ "name": "disabled",
3112
3312
  "type": {
3113
3313
  "text": "boolean"
3114
3314
  },
3115
- "attribute": "required",
3315
+ "description": "Renders the field in a disabled state.",
3316
+ "attribute": "disabled",
3116
3317
  "reflects": true
3117
3318
  },
3118
3319
  {
3119
3320
  "kind": "field",
3120
- "name": "type",
3321
+ "name": "readOnly",
3121
3322
  "type": {
3122
- "text": "string"
3323
+ "text": "boolean"
3123
3324
  },
3124
- "default": "'text'",
3125
- "attribute": "type",
3325
+ "description": "Renders the field in a readonly state.",
3326
+ "attribute": "read-only",
3126
3327
  "reflects": true
3127
3328
  },
3128
3329
  {
3129
3330
  "kind": "field",
3130
- "name": "value",
3331
+ "name": "name",
3131
3332
  "type": {
3132
3333
  "text": "string"
3133
3334
  },
3134
- "attribute": "value",
3335
+ "attribute": "name",
3135
3336
  "reflects": true
3136
3337
  },
3137
3338
  {
3138
3339
  "kind": "field",
3139
- "name": "name",
3340
+ "name": "value",
3140
3341
  "type": {
3141
3342
  "text": "string"
3142
3343
  },
3143
- "attribute": "name",
3344
+ "attribute": "value",
3144
3345
  "reflects": true
3145
3346
  },
3146
3347
  {
3147
3348
  "kind": "method",
3148
- "name": "handler",
3349
+ "name": "handleKeyDown",
3149
3350
  "parameters": [
3150
3351
  {
3151
- "name": "e",
3352
+ "name": "event",
3152
3353
  "type": {
3153
- "text": "Event"
3354
+ "text": "KeyboardEvent"
3154
3355
  }
3155
3356
  }
3156
3357
  ]
3157
3358
  },
3158
3359
  {
3159
- "kind": "method",
3160
- "name": "prefixSlotChange"
3360
+ "kind": "field",
3361
+ "name": "#classes",
3362
+ "privacy": "private",
3363
+ "readonly": true
3364
+ },
3365
+ {
3366
+ "kind": "field",
3367
+ "name": "#helpTextClasses",
3368
+ "privacy": "private",
3369
+ "readonly": true
3370
+ },
3371
+ {
3372
+ "kind": "field",
3373
+ "name": "#chevronClasses",
3374
+ "privacy": "private",
3375
+ "readonly": true
3376
+ },
3377
+ {
3378
+ "kind": "field",
3379
+ "name": "#id",
3380
+ "privacy": "private",
3381
+ "readonly": true
3382
+ },
3383
+ {
3384
+ "kind": "field",
3385
+ "name": "#helpId",
3386
+ "privacy": "private",
3387
+ "readonly": true
3161
3388
  },
3162
3389
  {
3163
3390
  "kind": "method",
3164
- "name": "suffixSlotChange"
3391
+ "name": "onChange",
3392
+ "parameters": [
3393
+ {
3394
+ "name": "{ target }"
3395
+ }
3396
+ ]
3397
+ },
3398
+ {
3399
+ "kind": "field",
3400
+ "name": "_options",
3401
+ "attribute": "_options"
3165
3402
  }
3166
3403
  ],
3167
3404
  "attributes": [
3168
3405
  {
3169
- "name": "disabled",
3406
+ "name": "auto-focus",
3170
3407
  "type": {
3171
3408
  "text": "boolean"
3172
3409
  },
3173
- "fieldName": "disabled"
3410
+ "description": "Whether the element should receive focus on render",
3411
+ "fieldName": "autoFocus"
3174
3412
  },
3175
3413
  {
3176
3414
  "name": "invalid",
3177
3415
  "type": {
3178
3416
  "text": "boolean"
3179
3417
  },
3418
+ "description": "Renders the field in an invalid state. Often paired with `hint` to provide feedback about the error",
3180
3419
  "fieldName": "invalid"
3181
3420
  },
3182
3421
  {
3183
- "name": "id",
3422
+ "name": "always",
3423
+ "type": {
3424
+ "text": "boolean"
3425
+ },
3426
+ "description": "Whether to always show a hint",
3427
+ "fieldName": "always"
3428
+ },
3429
+ {
3430
+ "name": "hint",
3184
3431
  "type": {
3185
3432
  "text": "string"
3186
3433
  },
3187
- "fieldName": "id"
3434
+ "description": "The content displayed as the help text",
3435
+ "fieldName": "hint"
3188
3436
  },
3189
3437
  {
3190
3438
  "name": "label",
3191
3439
  "type": {
3192
3440
  "text": "string"
3193
3441
  },
3442
+ "description": "The content to disply as the label",
3194
3443
  "fieldName": "label"
3195
3444
  },
3196
3445
  {
3197
- "name": "helpText",
3446
+ "name": "optional",
3198
3447
  "type": {
3199
- "text": "string"
3448
+ "text": "boolean"
3200
3449
  },
3201
- "fieldName": "helpText"
3450
+ "description": "Whether to show optional text",
3451
+ "fieldName": "optional"
3202
3452
  },
3203
3453
  {
3204
- "name": "size",
3454
+ "name": "disabled",
3205
3455
  "type": {
3206
- "text": "string"
3456
+ "text": "boolean"
3207
3457
  },
3208
- "fieldName": "size"
3458
+ "description": "Renders the field in a disabled state.",
3459
+ "fieldName": "disabled"
3209
3460
  },
3210
3461
  {
3211
- "name": "max",
3462
+ "name": "read-only",
3212
3463
  "type": {
3213
- "text": "number"
3464
+ "text": "boolean"
3214
3465
  },
3215
- "fieldName": "max"
3466
+ "description": "Renders the field in a readonly state.",
3467
+ "fieldName": "readOnly"
3216
3468
  },
3217
3469
  {
3218
- "name": "min",
3470
+ "name": "_options",
3471
+ "fieldName": "_options"
3472
+ },
3473
+ {
3474
+ "name": "name",
3219
3475
  "type": {
3220
- "text": "number"
3476
+ "text": "string"
3221
3477
  },
3222
- "fieldName": "min"
3478
+ "fieldName": "name"
3223
3479
  },
3224
3480
  {
3225
- "name": "min-length",
3481
+ "name": "value",
3226
3482
  "type": {
3227
- "text": "number"
3483
+ "text": "string"
3228
3484
  },
3229
- "fieldName": "minLength"
3230
- },
3485
+ "fieldName": "value"
3486
+ }
3487
+ ],
3488
+ "mixins": [
3231
3489
  {
3232
- "name": "max-length",
3490
+ "name": "FormControlMixin",
3491
+ "package": "@open-wc/form-control"
3492
+ }
3493
+ ],
3494
+ "superclass": {
3495
+ "name": "LitElement",
3496
+ "package": "lit"
3497
+ },
3498
+ "tagName": "w-select",
3499
+ "customElement": true
3500
+ }
3501
+ ],
3502
+ "exports": [
3503
+ {
3504
+ "kind": "js",
3505
+ "name": "ccSelect",
3506
+ "declaration": {
3507
+ "name": "ccSelect",
3508
+ "module": "packages/select/index.ts"
3509
+ }
3510
+ },
3511
+ {
3512
+ "kind": "js",
3513
+ "name": "ccLabel",
3514
+ "declaration": {
3515
+ "name": "ccLabel",
3516
+ "module": "packages/select/index.ts"
3517
+ }
3518
+ },
3519
+ {
3520
+ "kind": "js",
3521
+ "name": "ccHelpText",
3522
+ "declaration": {
3523
+ "name": "ccHelpText",
3524
+ "module": "packages/select/index.ts"
3525
+ }
3526
+ },
3527
+ {
3528
+ "kind": "js",
3529
+ "name": "WarpSelect",
3530
+ "declaration": {
3531
+ "name": "WarpSelect",
3532
+ "module": "packages/select/index.ts"
3533
+ }
3534
+ },
3535
+ {
3536
+ "kind": "custom-element-definition",
3537
+ "name": "w-select",
3538
+ "declaration": {
3539
+ "name": "WarpSelect",
3540
+ "module": "packages/select/index.ts"
3541
+ }
3542
+ }
3543
+ ]
3544
+ },
3545
+ {
3546
+ "kind": "javascript-module",
3547
+ "path": "packages/steps/index.ts",
3548
+ "declarations": [
3549
+ {
3550
+ "kind": "class",
3551
+ "description": "Steps are used to show progress through a process or to guide users through a multi-step task.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/components-steps--docs)",
3552
+ "name": "WarpSteps",
3553
+ "members": [
3554
+ {
3555
+ "kind": "field",
3556
+ "name": "horizontal",
3233
3557
  "type": {
3234
- "text": "number"
3558
+ "text": "boolean"
3235
3559
  },
3236
- "fieldName": "maxLength"
3560
+ "default": "false",
3561
+ "attribute": "horizontal",
3562
+ "reflects": true
3237
3563
  },
3238
3564
  {
3239
- "name": "pattern",
3565
+ "kind": "field",
3566
+ "name": "right",
3240
3567
  "type": {
3241
- "text": "string"
3568
+ "text": "boolean"
3242
3569
  },
3243
- "fieldName": "pattern"
3570
+ "default": "false",
3571
+ "attribute": "right",
3572
+ "reflects": true
3244
3573
  },
3245
3574
  {
3246
- "name": "placeholder",
3575
+ "kind": "method",
3576
+ "name": "updateStepsContext"
3577
+ }
3578
+ ],
3579
+ "attributes": [
3580
+ {
3581
+ "name": "horizontal",
3247
3582
  "type": {
3248
- "text": "string"
3583
+ "text": "boolean"
3249
3584
  },
3250
- "fieldName": "placeholder"
3585
+ "default": "false",
3586
+ "fieldName": "horizontal"
3251
3587
  },
3252
3588
  {
3253
- "name": "read-only",
3589
+ "name": "right",
3254
3590
  "type": {
3255
3591
  "text": "boolean"
3256
3592
  },
3257
- "fieldName": "readOnly"
3593
+ "default": "false",
3594
+ "fieldName": "right"
3595
+ }
3596
+ ],
3597
+ "superclass": {
3598
+ "name": "LitElement",
3599
+ "package": "lit"
3600
+ },
3601
+ "tagName": "w-steps",
3602
+ "customElement": true
3603
+ },
3604
+ {
3605
+ "kind": "class",
3606
+ "description": "Individual step component that shows a single step in a process",
3607
+ "name": "WarpStep",
3608
+ "members": [
3609
+ {
3610
+ "kind": "field",
3611
+ "name": "active",
3612
+ "type": {
3613
+ "text": "boolean"
3614
+ },
3615
+ "default": "false",
3616
+ "attribute": "active",
3617
+ "reflects": true
3258
3618
  },
3259
3619
  {
3260
- "name": "required",
3620
+ "kind": "field",
3621
+ "name": "completed",
3261
3622
  "type": {
3262
3623
  "text": "boolean"
3263
3624
  },
3264
- "fieldName": "required"
3625
+ "default": "false",
3626
+ "attribute": "completed",
3627
+ "reflects": true
3628
+ },
3629
+ {
3630
+ "kind": "field",
3631
+ "name": "_context",
3632
+ "type": {
3633
+ "text": "StepsContext"
3634
+ },
3635
+ "privacy": "private",
3636
+ "default": "{ horizontal: false, right: false, isLast: false, isFirst: false }"
3637
+ },
3638
+ {
3639
+ "kind": "method",
3640
+ "name": "setContext",
3641
+ "parameters": [
3642
+ {
3643
+ "name": "context",
3644
+ "type": {
3645
+ "text": "StepsContext"
3646
+ }
3647
+ }
3648
+ ]
3265
3649
  },
3266
3650
  {
3267
- "name": "type",
3268
- "type": {
3269
- "text": "string"
3270
- },
3271
- "default": "'text'",
3272
- "fieldName": "type"
3273
- },
3651
+ "kind": "method",
3652
+ "name": "getAriaLabel"
3653
+ }
3654
+ ],
3655
+ "attributes": [
3274
3656
  {
3275
- "name": "value",
3657
+ "name": "active",
3276
3658
  "type": {
3277
- "text": "string"
3659
+ "text": "boolean"
3278
3660
  },
3279
- "fieldName": "value"
3661
+ "default": "false",
3662
+ "fieldName": "active"
3280
3663
  },
3281
3664
  {
3282
- "name": "name",
3665
+ "name": "completed",
3283
3666
  "type": {
3284
- "text": "string"
3667
+ "text": "boolean"
3285
3668
  },
3286
- "fieldName": "name"
3287
- }
3288
- ],
3289
- "mixins": [
3290
- {
3291
- "name": "FormControlMixin",
3292
- "package": "@open-wc/form-control"
3669
+ "default": "false",
3670
+ "fieldName": "completed"
3293
3671
  }
3294
3672
  ],
3295
3673
  "superclass": {
3296
3674
  "name": "LitElement",
3297
3675
  "package": "lit"
3298
3676
  },
3299
- "tagName": "w-textfield",
3677
+ "tagName": "w-step",
3300
3678
  "customElement": true
3301
3679
  }
3302
3680
  ],
3303
3681
  "exports": [
3304
3682
  {
3305
- "kind": "js",
3306
- "name": "ccinput",
3683
+ "kind": "custom-element-definition",
3684
+ "name": "w-steps",
3307
3685
  "declaration": {
3308
- "name": "ccinput",
3309
- "module": "packages/textfield/index.ts"
3686
+ "name": "WarpSteps",
3687
+ "module": "packages/steps/index.ts"
3310
3688
  }
3311
3689
  },
3312
3690
  {
3313
- "kind": "js",
3314
- "name": "ccLabel",
3691
+ "kind": "custom-element-definition",
3692
+ "name": "w-step",
3315
3693
  "declaration": {
3316
- "name": "ccLabel",
3317
- "module": "packages/textfield/index.ts"
3694
+ "name": "WarpStep",
3695
+ "module": "packages/steps/index.ts"
3318
3696
  }
3319
3697
  },
3320
3698
  {
3321
3699
  "kind": "js",
3322
- "name": "ccHelpText",
3323
- "declaration": {
3324
- "name": "ccHelpText",
3325
- "module": "packages/textfield/index.ts"
3326
- }
3327
- },
3328
- {
3329
- "kind": "custom-element-definition",
3330
- "name": "w-textfield",
3700
+ "name": "WarpSteps",
3331
3701
  "declaration": {
3332
- "name": "WarpTextField",
3333
- "module": "packages/textfield/index.ts"
3702
+ "name": "WarpSteps",
3703
+ "module": "packages/steps/index.ts"
3334
3704
  }
3335
3705
  },
3336
3706
  {
3337
3707
  "kind": "js",
3338
- "name": "WarpTextField",
3708
+ "name": "WarpStep",
3339
3709
  "declaration": {
3340
- "name": "WarpTextField",
3341
- "module": "packages/textfield/index.ts"
3710
+ "name": "WarpStep",
3711
+ "module": "packages/steps/index.ts"
3342
3712
  }
3343
3713
  }
3344
3714
  ]
3345
3715
  },
3346
3716
  {
3347
3717
  "kind": "javascript-module",
3348
- "path": "packages/utils/index.js",
3718
+ "path": "packages/switch/index.ts",
3349
3719
  "declarations": [
3350
3720
  {
3351
- "kind": "mixin",
3721
+ "kind": "class",
3352
3722
  "description": "",
3353
- "name": "kebabCaseAttributes",
3723
+ "name": "WarpSwitch",
3354
3724
  "members": [
3355
3725
  {
3356
- "kind": "method",
3357
- "name": "createProperty",
3358
- "static": true,
3359
- "parameters": [
3360
- {
3361
- "name": "name"
3362
- },
3363
- {
3364
- "name": "options"
3365
- }
3366
- ]
3726
+ "kind": "field",
3727
+ "name": "value",
3728
+ "type": {
3729
+ "text": "boolean"
3730
+ },
3731
+ "default": "false",
3732
+ "attribute": "value",
3733
+ "reflects": true
3734
+ },
3735
+ {
3736
+ "kind": "field",
3737
+ "name": "disabled",
3738
+ "type": {
3739
+ "text": "boolean"
3740
+ },
3741
+ "default": "false",
3742
+ "attribute": "disabled",
3743
+ "reflects": true
3367
3744
  }
3368
3745
  ],
3369
- "parameters": [
3746
+ "events": [
3370
3747
  {
3371
- "name": "constructor"
3748
+ "name": "change",
3749
+ "type": {
3750
+ "text": "CustomEvent"
3751
+ }
3372
3752
  }
3373
- ]
3374
- },
3375
- {
3376
- "kind": "function",
3377
- "name": "classes",
3378
- "parameters": [
3753
+ ],
3754
+ "attributes": [
3379
3755
  {
3380
- "name": "defn"
3381
- }
3382
- ]
3383
- },
3384
- {
3385
- "kind": "function",
3386
- "name": "fclasses",
3387
- "parameters": [
3756
+ "name": "value",
3757
+ "type": {
3758
+ "text": "boolean"
3759
+ },
3760
+ "default": "false",
3761
+ "fieldName": "value"
3762
+ },
3388
3763
  {
3389
- "name": "definition"
3764
+ "name": "disabled",
3765
+ "type": {
3766
+ "text": "boolean"
3767
+ },
3768
+ "default": "false",
3769
+ "fieldName": "disabled"
3390
3770
  }
3391
- ]
3392
- },
3393
- {
3394
- "kind": "function",
3395
- "name": "generateRandomId"
3771
+ ],
3772
+ "superclass": {
3773
+ "name": "LitElement",
3774
+ "package": "lit"
3775
+ },
3776
+ "tagName": "w-switch",
3777
+ "customElement": true
3396
3778
  }
3397
3779
  ],
3398
3780
  "exports": [
3399
3781
  {
3400
3782
  "kind": "js",
3401
- "name": "kebabCaseAttributes",
3402
- "declaration": {
3403
- "name": "kebabCaseAttributes",
3404
- "module": "packages/utils/index.js"
3405
- }
3406
- },
3407
- {
3408
- "kind": "js",
3409
- "name": "classes",
3410
- "declaration": {
3411
- "name": "classes",
3412
- "module": "packages/utils/index.js"
3413
- }
3414
- },
3415
- {
3416
- "kind": "js",
3417
- "name": "fclasses",
3783
+ "name": "WarpSwitch",
3418
3784
  "declaration": {
3419
- "name": "fclasses",
3420
- "module": "packages/utils/index.js"
3785
+ "name": "WarpSwitch",
3786
+ "module": "packages/switch/index.ts"
3421
3787
  }
3422
3788
  },
3423
3789
  {
3424
- "kind": "js",
3425
- "name": "generateRandomId",
3790
+ "kind": "custom-element-definition",
3791
+ "name": "w-switch",
3426
3792
  "declaration": {
3427
- "name": "generateRandomId",
3428
- "module": "packages/utils/index.js"
3793
+ "name": "WarpSwitch",
3794
+ "module": "packages/switch/index.ts"
3429
3795
  }
3430
3796
  }
3431
3797
  ]
3432
3798
  },
3433
3799
  {
3434
3800
  "kind": "javascript-module",
3435
- "path": "packages/attention/index.js",
3801
+ "path": "packages/textfield/index.ts",
3436
3802
  "declarations": [
3803
+ {
3804
+ "kind": "variable",
3805
+ "name": "ccinput",
3806
+ "type": {
3807
+ "text": "object"
3808
+ },
3809
+ "default": "{ // wrapper classes wrapper: 'relative', // input classes base: 'block text-m leading-m mb-0 px-8 py-12 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] caret-current', // true default: 'border-1 s-text s-bg s-border hover:s-border-hover active:s-border-selected', // !isInvalid && !isDisabled && !isReadOnly disabled: 'border-1 s-text-disabled s-bg-disabled-subtle s-border-disabled pointer-events-none', // !isInvalid && isDisabled && !isReadOnly invalid: 'border-1 s-text-negative s-bg s-border-negative hover:s-border-negative-hover outline-[--w-s-color-border-negative]!', // isInvalid && !isDisabled && !isReadOnly readOnly: 'pl-0 bg-transparent pointer-events-none', // !isInvalid && !isDisabled && isReadOnly placeholder: 'placeholder:s-text-placeholder', suffix: 'pr-40', prefix: 'pl-[var(--w-prefix-width,_40px)]', // textarea classes textArea: 'min-h-[42] sm:min-h-[45]', }"
3810
+ },
3811
+ {
3812
+ "kind": "variable",
3813
+ "name": "ccLabel",
3814
+ "type": {
3815
+ "text": "object"
3816
+ },
3817
+ "default": "{ base: 'antialiased block relative text-s font-bold pb-4 cursor-pointer s-text', optional: 'pl-8 font-normal text-s s-text-subtle', }"
3818
+ },
3819
+ {
3820
+ "kind": "variable",
3821
+ "name": "ccHelpText",
3822
+ "type": {
3823
+ "text": "object"
3824
+ },
3825
+ "default": "{ base: 'text-xs mt-4 block', color: 's-text-subtle', colorInvalid: 's-text-negative', }"
3826
+ },
3437
3827
  {
3438
3828
  "kind": "class",
3439
- "description": "",
3440
- "name": "WarpAttention",
3829
+ "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)",
3830
+ "name": "WarpTextField",
3441
3831
  "members": [
3442
3832
  {
3443
- "kind": "method",
3444
- "name": "handleDone"
3445
- },
3446
- {
3447
- "kind": "method",
3448
- "name": "pointingAtDirection"
3449
- },
3450
- {
3451
- "kind": "method",
3452
- "name": "activeAttentionType"
3453
- },
3454
- {
3455
- "kind": "method",
3456
- "name": "defaultAriaLabel"
3457
- },
3458
- {
3459
- "kind": "method",
3460
- "name": "setAriaLabels"
3833
+ "kind": "field",
3834
+ "name": "shadowRootOptions",
3835
+ "type": {
3836
+ "text": "object"
3837
+ },
3838
+ "static": true,
3839
+ "default": "{ ...WarpElement.shadowRootOptions, delegatesFocus: true, }"
3461
3840
  },
3462
3841
  {
3463
- "kind": "method",
3464
- "name": "close"
3842
+ "kind": "field",
3843
+ "name": "disabled",
3844
+ "type": {
3845
+ "text": "boolean"
3846
+ },
3847
+ "attribute": "disabled",
3848
+ "reflects": true
3465
3849
  },
3466
3850
  {
3467
- "kind": "method",
3468
- "name": "keypressed",
3469
- "parameters": [
3470
- {
3471
- "name": "e"
3472
- }
3473
- ]
3851
+ "kind": "field",
3852
+ "name": "invalid",
3853
+ "type": {
3854
+ "text": "boolean"
3855
+ },
3856
+ "attribute": "invalid",
3857
+ "reflects": true
3474
3858
  },
3475
3859
  {
3476
3860
  "kind": "field",
3477
- "name": "show",
3478
- "privacy": "public",
3861
+ "name": "id",
3479
3862
  "type": {
3480
- "text": "boolean"
3863
+ "text": "string"
3481
3864
  },
3482
- "default": "false",
3483
- "attribute": "show",
3865
+ "attribute": "id",
3484
3866
  "reflects": true
3485
3867
  },
3486
3868
  {
3487
3869
  "kind": "field",
3488
- "name": "placement",
3489
- "privacy": "public",
3870
+ "name": "label",
3490
3871
  "type": {
3491
3872
  "text": "string"
3492
3873
  },
3493
- "default": "'bottom'",
3494
- "attribute": "placement",
3874
+ "attribute": "label",
3495
3875
  "reflects": true
3496
3876
  },
3497
3877
  {
3498
3878
  "kind": "field",
3499
- "name": "tooltip",
3500
- "privacy": "public",
3879
+ "name": "helpText",
3501
3880
  "type": {
3502
- "text": "boolean"
3881
+ "text": "string"
3503
3882
  },
3504
- "default": "false",
3505
- "attribute": "tooltip",
3883
+ "attribute": "help-text",
3506
3884
  "reflects": true
3507
3885
  },
3508
3886
  {
3509
3887
  "kind": "field",
3510
- "name": "callout",
3511
- "privacy": "public",
3888
+ "name": "size",
3512
3889
  "type": {
3513
- "text": "boolean"
3890
+ "text": "string"
3514
3891
  },
3515
- "default": "false",
3516
- "attribute": "callout",
3892
+ "attribute": "size",
3517
3893
  "reflects": true
3518
3894
  },
3519
3895
  {
3520
3896
  "kind": "field",
3521
- "name": "popover",
3522
- "privacy": "public",
3897
+ "name": "max",
3523
3898
  "type": {
3524
- "text": "boolean"
3899
+ "text": "number"
3525
3900
  },
3526
- "default": "false",
3527
- "attribute": "popover",
3901
+ "attribute": "max",
3528
3902
  "reflects": true
3529
3903
  },
3530
3904
  {
3531
3905
  "kind": "field",
3532
- "name": "highlight",
3533
- "privacy": "public",
3906
+ "name": "min",
3534
3907
  "type": {
3535
- "text": "boolean"
3908
+ "text": "number"
3536
3909
  },
3537
- "default": "false",
3538
- "attribute": "highlight",
3910
+ "attribute": "min",
3539
3911
  "reflects": true
3540
3912
  },
3541
3913
  {
3542
3914
  "kind": "field",
3543
- "name": "canClose",
3544
- "privacy": "public",
3915
+ "name": "minLength",
3545
3916
  "type": {
3546
- "text": "boolean"
3917
+ "text": "number"
3547
3918
  },
3548
- "default": "false",
3549
- "attribute": "canClose",
3919
+ "attribute": "min-length",
3550
3920
  "reflects": true
3551
3921
  },
3552
3922
  {
3553
3923
  "kind": "field",
3554
- "name": "noArrow",
3555
- "privacy": "public",
3924
+ "name": "maxLength",
3556
3925
  "type": {
3557
- "text": "boolean"
3926
+ "text": "number"
3558
3927
  },
3559
- "default": "false",
3560
- "attribute": "noArrow",
3928
+ "attribute": "max-length",
3561
3929
  "reflects": true
3562
3930
  },
3563
3931
  {
3564
3932
  "kind": "field",
3565
- "name": "distance",
3566
- "privacy": "public",
3933
+ "name": "pattern",
3567
3934
  "type": {
3568
- "text": "number"
3935
+ "text": "string"
3569
3936
  },
3570
- "default": "8",
3571
- "attribute": "distance",
3937
+ "attribute": "pattern",
3572
3938
  "reflects": true
3573
3939
  },
3574
3940
  {
3575
3941
  "kind": "field",
3576
- "name": "skidding",
3577
- "privacy": "public",
3942
+ "name": "placeholder",
3578
3943
  "type": {
3579
- "text": "number"
3944
+ "text": "string"
3580
3945
  },
3581
- "default": "0",
3582
- "attribute": "skidding",
3946
+ "attribute": "placeholder",
3583
3947
  "reflects": true
3584
3948
  },
3585
3949
  {
3586
3950
  "kind": "field",
3587
- "name": "flip",
3588
- "privacy": "public",
3951
+ "name": "readOnly",
3589
3952
  "type": {
3590
3953
  "text": "boolean"
3591
3954
  },
3592
- "default": "false",
3593
- "attribute": "flip",
3955
+ "attribute": "read-only",
3594
3956
  "reflects": true
3595
3957
  },
3596
3958
  {
3597
3959
  "kind": "field",
3598
- "name": "crossAxis",
3599
- "privacy": "public",
3960
+ "name": "required",
3600
3961
  "type": {
3601
3962
  "text": "boolean"
3602
3963
  },
3603
- "default": "false",
3604
- "attribute": "crossAxis",
3964
+ "attribute": "required",
3605
3965
  "reflects": true
3606
3966
  },
3607
3967
  {
3608
3968
  "kind": "field",
3609
- "name": "_initialPlacement"
3969
+ "name": "type",
3970
+ "type": {
3971
+ "text": "string"
3972
+ },
3973
+ "default": "'text'",
3974
+ "attribute": "type",
3975
+ "reflects": true
3610
3976
  },
3611
3977
  {
3612
3978
  "kind": "field",
3613
- "name": "_actualDirection"
3979
+ "name": "value",
3980
+ "type": {
3981
+ "text": "string"
3982
+ },
3983
+ "attribute": "value",
3984
+ "reflects": true
3614
3985
  },
3615
3986
  {
3616
3987
  "kind": "field",
3617
- "name": "fallbackPlacements",
3618
- "privacy": "public",
3988
+ "name": "name",
3619
3989
  "type": {
3620
- "text": "array"
3990
+ "text": "string"
3621
3991
  },
3622
- "attribute": "fallbackPlacements",
3992
+ "attribute": "name",
3623
3993
  "reflects": true
3624
3994
  },
3625
3995
  {
3626
3996
  "kind": "method",
3627
- "name": "createProperty",
3628
- "static": true,
3997
+ "name": "handler",
3629
3998
  "parameters": [
3630
3999
  {
3631
- "name": "name"
3632
- },
3633
- {
3634
- "name": "options"
4000
+ "name": "e",
4001
+ "type": {
4002
+ "text": "Event"
4003
+ }
3635
4004
  }
3636
- ],
3637
- "inheritedFrom": {
3638
- "name": "kebabCaseAttributes",
3639
- "module": "packages/utils/index.js"
3640
- }
4005
+ ]
4006
+ },
4007
+ {
4008
+ "kind": "method",
4009
+ "name": "prefixSlotChange"
4010
+ },
4011
+ {
4012
+ "kind": "method",
4013
+ "name": "suffixSlotChange"
3641
4014
  }
3642
4015
  ],
3643
4016
  "attributes": [
3644
4017
  {
3645
- "name": "show",
4018
+ "name": "disabled",
3646
4019
  "type": {
3647
4020
  "text": "boolean"
3648
4021
  },
3649
- "default": "false",
3650
- "fieldName": "show"
4022
+ "fieldName": "disabled"
3651
4023
  },
3652
4024
  {
3653
- "name": "placement",
4025
+ "name": "invalid",
3654
4026
  "type": {
3655
- "text": "string"
4027
+ "text": "boolean"
3656
4028
  },
3657
- "default": "'bottom'",
3658
- "fieldName": "placement"
4029
+ "fieldName": "invalid"
3659
4030
  },
3660
4031
  {
3661
- "name": "tooltip",
4032
+ "name": "id",
3662
4033
  "type": {
3663
- "text": "boolean"
4034
+ "text": "string"
3664
4035
  },
3665
- "default": "false",
3666
- "fieldName": "tooltip"
4036
+ "fieldName": "id"
3667
4037
  },
3668
4038
  {
3669
- "name": "callout",
4039
+ "name": "label",
3670
4040
  "type": {
3671
- "text": "boolean"
4041
+ "text": "string"
3672
4042
  },
3673
- "default": "false",
3674
- "fieldName": "callout"
4043
+ "fieldName": "label"
3675
4044
  },
3676
4045
  {
3677
- "name": "popover",
4046
+ "name": "help-text",
3678
4047
  "type": {
3679
- "text": "boolean"
4048
+ "text": "string"
3680
4049
  },
3681
- "default": "false",
3682
- "fieldName": "popover"
4050
+ "fieldName": "helpText"
3683
4051
  },
3684
4052
  {
3685
- "name": "highlight",
4053
+ "name": "size",
3686
4054
  "type": {
3687
- "text": "boolean"
4055
+ "text": "string"
3688
4056
  },
3689
- "default": "false",
3690
- "fieldName": "highlight"
4057
+ "fieldName": "size"
3691
4058
  },
3692
4059
  {
3693
- "name": "canClose",
4060
+ "name": "max",
3694
4061
  "type": {
3695
- "text": "boolean"
4062
+ "text": "number"
3696
4063
  },
3697
- "default": "false",
3698
- "fieldName": "canClose"
4064
+ "fieldName": "max"
3699
4065
  },
3700
4066
  {
3701
- "name": "noArrow",
4067
+ "name": "min",
3702
4068
  "type": {
3703
- "text": "boolean"
4069
+ "text": "number"
3704
4070
  },
3705
- "default": "false",
3706
- "fieldName": "noArrow"
4071
+ "fieldName": "min"
3707
4072
  },
3708
4073
  {
3709
- "name": "distance",
4074
+ "name": "min-length",
3710
4075
  "type": {
3711
4076
  "text": "number"
3712
4077
  },
3713
- "default": "8",
3714
- "fieldName": "distance"
4078
+ "fieldName": "minLength"
3715
4079
  },
3716
4080
  {
3717
- "name": "skidding",
4081
+ "name": "max-length",
3718
4082
  "type": {
3719
4083
  "text": "number"
3720
4084
  },
3721
- "default": "0",
3722
- "fieldName": "skidding"
4085
+ "fieldName": "maxLength"
3723
4086
  },
3724
4087
  {
3725
- "name": "flip",
4088
+ "name": "pattern",
4089
+ "type": {
4090
+ "text": "string"
4091
+ },
4092
+ "fieldName": "pattern"
4093
+ },
4094
+ {
4095
+ "name": "placeholder",
4096
+ "type": {
4097
+ "text": "string"
4098
+ },
4099
+ "fieldName": "placeholder"
4100
+ },
4101
+ {
4102
+ "name": "read-only",
3726
4103
  "type": {
3727
4104
  "text": "boolean"
3728
4105
  },
3729
- "default": "false",
3730
- "fieldName": "flip"
4106
+ "fieldName": "readOnly"
3731
4107
  },
3732
4108
  {
3733
- "name": "crossAxis",
4109
+ "name": "required",
3734
4110
  "type": {
3735
4111
  "text": "boolean"
3736
4112
  },
3737
- "default": "false",
3738
- "fieldName": "crossAxis"
4113
+ "fieldName": "required"
3739
4114
  },
3740
4115
  {
3741
- "name": "fallbackPlacements",
4116
+ "name": "type",
3742
4117
  "type": {
3743
- "text": "array"
4118
+ "text": "string"
3744
4119
  },
3745
- "fieldName": "fallbackPlacements"
4120
+ "default": "'text'",
4121
+ "fieldName": "type"
4122
+ },
4123
+ {
4124
+ "name": "value",
4125
+ "type": {
4126
+ "text": "string"
4127
+ },
4128
+ "fieldName": "value"
4129
+ },
4130
+ {
4131
+ "name": "name",
4132
+ "type": {
4133
+ "text": "string"
4134
+ },
4135
+ "fieldName": "name"
3746
4136
  }
3747
4137
  ],
3748
4138
  "mixins": [
3749
4139
  {
3750
- "name": "kebabCaseAttributes",
3751
- "module": "/packages/utils/index.js"
4140
+ "name": "FormControlMixin",
4141
+ "package": "@open-wc/form-control"
3752
4142
  }
3753
4143
  ],
3754
4144
  "superclass": {
3755
- "name": "WarpElement",
3756
- "package": "@warp-ds/elements-core"
4145
+ "name": "LitElement",
4146
+ "package": "lit"
3757
4147
  },
3758
- "tagName": "w-attention",
4148
+ "tagName": "w-textfield",
3759
4149
  "customElement": true
3760
4150
  }
3761
4151
  ],
3762
4152
  "exports": [
4153
+ {
4154
+ "kind": "js",
4155
+ "name": "ccinput",
4156
+ "declaration": {
4157
+ "name": "ccinput",
4158
+ "module": "packages/textfield/index.ts"
4159
+ }
4160
+ },
4161
+ {
4162
+ "kind": "js",
4163
+ "name": "ccLabel",
4164
+ "declaration": {
4165
+ "name": "ccLabel",
4166
+ "module": "packages/textfield/index.ts"
4167
+ }
4168
+ },
4169
+ {
4170
+ "kind": "js",
4171
+ "name": "ccHelpText",
4172
+ "declaration": {
4173
+ "name": "ccHelpText",
4174
+ "module": "packages/textfield/index.ts"
4175
+ }
4176
+ },
3763
4177
  {
3764
4178
  "kind": "custom-element-definition",
3765
- "name": "w-attention",
4179
+ "name": "w-textfield",
3766
4180
  "declaration": {
3767
- "name": "WarpAttention",
3768
- "module": "packages/attention/index.js"
4181
+ "name": "WarpTextField",
4182
+ "module": "packages/textfield/index.ts"
3769
4183
  }
3770
4184
  },
3771
4185
  {
3772
4186
  "kind": "js",
3773
- "name": "WarpAttention",
4187
+ "name": "WarpTextField",
3774
4188
  "declaration": {
3775
- "name": "WarpAttention",
3776
- "module": "packages/attention/index.js"
4189
+ "name": "WarpTextField",
4190
+ "module": "packages/textfield/index.ts"
3777
4191
  }
3778
4192
  }
3779
4193
  ]
3780
4194
  },
3781
4195
  {
3782
4196
  "kind": "javascript-module",
3783
- "path": "packages/toast/toast.js",
3784
- "declarations": [],
3785
- "exports": []
3786
- },
3787
- {
3788
- "kind": "javascript-module",
3789
- "path": "packages/toast/toast-container.js",
3790
- "declarations": [],
3791
- "exports": []
3792
- },
3793
- {
3794
- "kind": "javascript-module",
3795
- "path": "packages/toast/index.js",
4197
+ "path": "packages/toast/index.ts",
3796
4198
  "declarations": [],
3797
4199
  "exports": [
3798
4200
  {