@warp-ds/elements 2.1.1 → 2.2.0-next.10

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 (233) hide show
  1. package/README.md +27 -17
  2. package/dist/.storybook/utilities.d.ts +28 -0
  3. package/dist/api.js +1 -49
  4. package/dist/api.js.map +4 -4
  5. package/dist/custom-elements.json +4282 -0
  6. package/dist/index.css +2 -0
  7. package/dist/index.css.map +7 -0
  8. package/dist/index.js +4561 -6638
  9. package/dist/index.js.map +4 -4
  10. package/dist/packages/affix/affix.stories.d.ts +10 -0
  11. package/dist/packages/affix/affix.test.d.ts +1 -0
  12. package/dist/packages/affix/index.d.ts +52 -24
  13. package/dist/packages/affix/index.js +2571 -2240
  14. package/dist/packages/affix/index.js.map +4 -4
  15. package/dist/packages/affix/react.d.ts +2 -0
  16. package/dist/packages/affix/styles.d.ts +1 -0
  17. package/dist/packages/alert/alert.stories.d.ts +15 -0
  18. package/dist/packages/alert/alert.test.d.ts +1 -0
  19. package/dist/packages/alert/index.d.ts +27 -17
  20. package/dist/packages/alert/index.js +2568 -2446
  21. package/dist/packages/alert/index.js.map +4 -4
  22. package/dist/packages/alert/react.d.ts +2 -0
  23. package/dist/packages/alert/styles.d.ts +1 -0
  24. package/dist/packages/attention/attention.stories.d.ts +15 -0
  25. package/dist/packages/attention/attention.test.d.ts +1 -0
  26. package/dist/packages/attention/index.d.ts +62 -90
  27. package/dist/packages/attention/index.js +3497 -3984
  28. package/dist/packages/attention/index.js.map +4 -4
  29. package/dist/packages/attention/layout-styles.d.ts +1 -0
  30. package/dist/packages/attention/react.d.ts +1 -0
  31. package/dist/packages/attention/styles.d.ts +1 -0
  32. package/dist/packages/badge/badge.stories.d.ts +17 -0
  33. package/dist/packages/badge/badge.test.d.ts +1 -0
  34. package/dist/packages/badge/index.d.ts +17 -11
  35. package/dist/packages/badge/index.js +2550 -300
  36. package/dist/packages/badge/index.js.map +4 -4
  37. package/dist/packages/badge/react.d.ts +2 -0
  38. package/dist/packages/badge/styles.d.ts +1 -0
  39. package/dist/packages/box/box.stories.d.ts +14 -0
  40. package/dist/packages/box/box.test.d.ts +1 -0
  41. package/dist/packages/box/index.d.ts +22 -20
  42. package/dist/packages/box/index.js +2550 -304
  43. package/dist/packages/box/index.js.map +4 -4
  44. package/dist/packages/box/react.d.ts +2 -0
  45. package/dist/packages/box/slot.test.d.ts +1 -0
  46. package/dist/packages/box/styles.d.ts +1 -0
  47. package/dist/packages/breadcrumbs/breadcrumbs.stories.d.ts +12 -0
  48. package/dist/packages/breadcrumbs/breadcrumbs.test.d.ts +1 -0
  49. package/dist/packages/breadcrumbs/index.d.ts +24 -16
  50. package/dist/packages/breadcrumbs/index.js +2511 -2051
  51. package/dist/packages/breadcrumbs/index.js.map +4 -4
  52. package/dist/packages/breadcrumbs/react.d.ts +2 -0
  53. package/dist/packages/breadcrumbs/styles.d.ts +1 -0
  54. package/dist/packages/button/button.stories.d.ts +21 -0
  55. package/dist/packages/button/button.test.d.ts +1 -0
  56. package/dist/packages/button/index.d.ts +111 -56
  57. package/dist/packages/button/index.js +2735 -2130
  58. package/dist/packages/button/index.js.map +4 -4
  59. package/dist/packages/button/react.d.ts +2 -0
  60. package/dist/packages/button/styles.d.ts +1 -0
  61. package/dist/packages/card/card.stories.d.ts +15 -0
  62. package/dist/packages/card/card.test.d.ts +1 -0
  63. package/dist/packages/card/index.d.ts +33 -16
  64. package/dist/packages/card/index.js +2530 -2078
  65. package/dist/packages/card/index.js.map +4 -4
  66. package/dist/packages/card/react.d.ts +2 -0
  67. package/dist/packages/card/styles.d.ts +1 -0
  68. package/dist/packages/datepicker/DatePicker.test.d.ts +1 -0
  69. package/dist/packages/datepicker/datepicker.d.ts +107 -0
  70. package/dist/packages/datepicker/datepicker.js +2929 -0
  71. package/dist/packages/datepicker/datepicker.js.map +7 -0
  72. package/dist/packages/datepicker/datepicker.stories.d.ts +11 -0
  73. package/dist/packages/datepicker/datepicker.test.d.ts +2 -0
  74. package/dist/packages/datepicker/index.d.ts +1 -0
  75. package/dist/packages/datepicker/index.js +2929 -0
  76. package/dist/packages/datepicker/index.js.map +7 -0
  77. package/dist/packages/datepicker/locales/da/messages.d.mts +1 -0
  78. package/dist/packages/datepicker/locales/en/messages.d.mts +1 -0
  79. package/dist/packages/datepicker/locales/fi/messages.d.mts +1 -0
  80. package/dist/packages/datepicker/locales/nb/messages.d.mts +1 -0
  81. package/dist/packages/datepicker/locales/sv/messages.d.mts +1 -0
  82. package/dist/packages/datepicker/react.d.ts +2 -0
  83. package/dist/packages/datepicker/styles/w-datepicker-calendar.styles.d.ts +1 -0
  84. package/dist/packages/datepicker/styles/w-datepicker-day.styles.d.ts +1 -0
  85. package/dist/packages/datepicker/styles/w-datepicker-month.styles.d.ts +1 -0
  86. package/dist/packages/datepicker/styles/w-datepicker.styles.d.ts +1 -0
  87. package/dist/packages/datepicker/utils.d.ts +13 -0
  88. package/dist/packages/dead-toggle/dead-toggle.stories.d.ts +10 -0
  89. package/dist/packages/dead-toggle/dead-toggle.test.d.ts +1 -0
  90. package/dist/packages/dead-toggle/index.d.ts +21 -0
  91. package/dist/packages/dead-toggle/index.js +2610 -0
  92. package/dist/packages/dead-toggle/index.js.map +7 -0
  93. package/dist/packages/dead-toggle/react.d.ts +2 -0
  94. package/dist/packages/expandable/expandable.stories.d.ts +19 -0
  95. package/dist/packages/expandable/expandable.test.d.ts +1 -0
  96. package/dist/packages/expandable/index.d.ts +55 -50
  97. package/dist/packages/expandable/index.js +2545 -2293
  98. package/dist/packages/expandable/index.js.map +4 -4
  99. package/dist/packages/expandable/react.d.ts +2 -0
  100. package/dist/packages/expandable/styles.d.ts +1 -0
  101. package/dist/packages/link/index.d.ts +39 -0
  102. package/dist/packages/link/index.js +2769 -0
  103. package/dist/packages/link/index.js.map +7 -0
  104. package/dist/packages/link/link.stories.d.ts +20 -0
  105. package/dist/packages/link/link.test.d.ts +1 -0
  106. package/dist/packages/link/react.d.ts +2 -0
  107. package/dist/packages/link/styles.d.ts +1 -0
  108. package/dist/packages/modal/index.d.ts +4 -5
  109. package/dist/packages/modal/index.js +2765 -2569
  110. package/dist/packages/modal/index.js.map +4 -4
  111. package/dist/packages/modal/modal-footer.d.ts +18 -11
  112. package/dist/packages/modal/modal-footer.js +2499 -0
  113. package/dist/packages/modal/modal-footer.js.map +7 -0
  114. package/dist/packages/modal/modal-header.d.ts +30 -31
  115. package/dist/packages/modal/modal-header.js +2700 -0
  116. package/dist/packages/modal/modal-header.js.map +7 -0
  117. package/dist/packages/modal/modal-main.d.ts +32 -31
  118. package/dist/packages/modal/modal-main.js +2681 -0
  119. package/dist/packages/modal/modal-main.js.map +7 -0
  120. package/dist/packages/modal/modal.stories.d.ts +19 -0
  121. package/dist/packages/modal/react.d.ts +4 -0
  122. package/dist/packages/modal/util.d.ts +7 -17
  123. package/dist/packages/pageindicator/index.d.ts +14 -0
  124. package/dist/packages/pageindicator/index.js +169 -0
  125. package/dist/packages/pageindicator/index.js.map +7 -0
  126. package/dist/packages/pageindicator/pageindicator.stories.d.ts +32 -0
  127. package/dist/packages/pageindicator/react.d.ts +2 -0
  128. package/dist/packages/pageindicator/style.d.ts +1 -0
  129. package/dist/packages/pagination/index.d.ts +37 -0
  130. package/dist/packages/pagination/index.js +2610 -0
  131. package/dist/packages/pagination/index.js.map +7 -0
  132. package/dist/packages/pagination/locales/da/messages.d.mts +1 -0
  133. package/dist/packages/pagination/locales/en/messages.d.mts +1 -0
  134. package/dist/packages/pagination/locales/fi/messages.d.mts +1 -0
  135. package/dist/packages/pagination/locales/nb/messages.d.mts +1 -0
  136. package/dist/packages/pagination/locales/sv/messages.d.mts +1 -0
  137. package/dist/packages/pagination/pagination.stories.d.ts +14 -0
  138. package/dist/packages/pagination/pagination.test.d.ts +1 -0
  139. package/dist/packages/pagination/react.d.ts +2 -0
  140. package/dist/packages/pagination/styles.d.ts +1 -0
  141. package/dist/packages/pill/index.d.ts +44 -23
  142. package/dist/packages/pill/index.js +2524 -2175
  143. package/dist/packages/pill/index.js.map +4 -4
  144. package/dist/packages/pill/pill.stories.d.ts +12 -0
  145. package/dist/packages/pill/pill.test.d.ts +1 -0
  146. package/dist/packages/pill/styles.d.ts +1 -0
  147. package/dist/packages/rip-and-tear-checkbox/checkbox.d.ts +64 -0
  148. package/dist/packages/rip-and-tear-checkbox/index.css +2 -0
  149. package/dist/packages/rip-and-tear-checkbox/index.css.map +7 -0
  150. package/dist/packages/rip-and-tear-checkbox/index.d.ts +6 -0
  151. package/dist/packages/rip-and-tear-checkbox/index.js +187 -0
  152. package/dist/packages/rip-and-tear-checkbox/index.js.map +7 -0
  153. package/dist/packages/rip-and-tear-radio/base-element.d.ts +46 -0
  154. package/dist/packages/rip-and-tear-radio/custom-error-validator.d.ts +6 -0
  155. package/dist/packages/rip-and-tear-radio/form-associated-element.d.ts +103 -0
  156. package/dist/packages/rip-and-tear-radio/index.css +2 -0
  157. package/dist/packages/rip-and-tear-radio/index.css.map +7 -0
  158. package/dist/packages/rip-and-tear-radio/index.d.ts +8 -0
  159. package/dist/packages/rip-and-tear-radio/index.js +157 -0
  160. package/dist/packages/rip-and-tear-radio/index.js.map +7 -0
  161. package/dist/packages/rip-and-tear-radio/invalid.d.ts +8 -0
  162. package/dist/packages/rip-and-tear-radio/math.d.ts +1 -0
  163. package/dist/packages/rip-and-tear-radio/radio-group.d.ts +72 -0
  164. package/dist/packages/rip-and-tear-radio/radio.d.ts +38 -0
  165. package/dist/packages/rip-and-tear-radio/required-validator.d.ts +11 -0
  166. package/dist/packages/rip-and-tear-radio/slot.d.ts +20 -0
  167. package/dist/packages/rip-and-tear-radio/watch.d.ts +26 -0
  168. package/dist/packages/select/index.d.ts +59 -48
  169. package/dist/packages/select/index.js +2565 -2236
  170. package/dist/packages/select/index.js.map +4 -4
  171. package/dist/packages/select/react.d.ts +2 -0
  172. package/dist/packages/select/select.stories.d.ts +10 -0
  173. package/dist/packages/select/select.test.d.ts +1 -0
  174. package/dist/packages/select/styles.d.ts +1 -0
  175. package/dist/packages/steps/index.d.ts +43 -0
  176. package/dist/packages/steps/index.js +2581 -0
  177. package/dist/packages/steps/index.js.map +7 -0
  178. package/dist/packages/steps/locales/da/messages.d.mts +1 -0
  179. package/dist/packages/steps/locales/en/messages.d.mts +1 -0
  180. package/dist/packages/steps/locales/fi/messages.d.mts +1 -0
  181. package/dist/packages/steps/locales/nb/messages.d.mts +1 -0
  182. package/dist/packages/steps/locales/sv/messages.d.mts +1 -0
  183. package/dist/packages/steps/react.d.ts +3 -0
  184. package/dist/packages/steps/steps.stories.d.ts +12 -0
  185. package/dist/packages/steps/styles.d.ts +1 -0
  186. package/dist/packages/styles.d.ts +2 -0
  187. package/dist/packages/switch/index.d.ts +20 -0
  188. package/dist/packages/switch/index.js +2564 -0
  189. package/dist/packages/switch/index.js.map +7 -0
  190. package/dist/packages/switch/react.d.ts +2 -0
  191. package/dist/packages/switch/styles.d.ts +1 -0
  192. package/dist/packages/switch/switch.stories.d.ts +9 -0
  193. package/dist/packages/tabs/index.d.ts +4 -0
  194. package/dist/packages/tabs/index.js +2579 -0
  195. package/dist/packages/tabs/index.js.map +7 -0
  196. package/dist/packages/tabs/react.d.ts +4 -0
  197. package/dist/packages/tabs/styles.d.ts +1 -0
  198. package/dist/packages/tabs/tab-panel.d.ts +20 -0
  199. package/dist/packages/tabs/tab.d.ts +23 -0
  200. package/dist/packages/tabs/tabs.d.ts +38 -0
  201. package/dist/packages/tabs/tabs.stories.d.ts +8 -0
  202. package/dist/packages/textfield/index.d.ts +72 -74
  203. package/dist/packages/textfield/index.js +2572 -413
  204. package/dist/packages/textfield/index.js.map +4 -4
  205. package/dist/packages/textfield/react.d.ts +2 -0
  206. package/dist/packages/textfield/styles.d.ts +1 -0
  207. package/dist/packages/textfield/textfield.stories.d.ts +17 -0
  208. package/dist/packages/textfield/textfield.test.d.ts +1 -0
  209. package/dist/packages/toast/api.d.ts +4 -45
  210. package/dist/packages/toast/index.d.ts +3 -0
  211. package/dist/packages/toast/index.js +2610 -2787
  212. package/dist/packages/toast/index.js.map +4 -4
  213. package/dist/packages/toast/styles.d.ts +1 -0
  214. package/dist/packages/toast/toast-container.d.ts +12 -63
  215. package/dist/packages/toast/toast.d.ts +34 -29
  216. package/dist/packages/toast/toast.stories.d.ts +12 -0
  217. package/dist/packages/toast/types.d.ts +15 -0
  218. package/dist/packages/utils/expand-transition.d.ts +3 -2
  219. package/dist/packages/utils/index.d.ts +1 -1
  220. package/dist/packages/utils/index.js +27 -0
  221. package/dist/packages/utils/index.js.map +7 -0
  222. package/dist/packages/utils/unstyled-heading.d.ts +4 -3
  223. package/dist/setup-tests.d.ts +1 -0
  224. package/dist/styles.css +1 -0
  225. package/dist/vscode.css-custom-data.json +6 -0
  226. package/dist/vscode.html-custom-data.json +421 -0
  227. package/dist/web-types.json +949 -0
  228. package/package.json +74 -28
  229. package/dist/index.d.ts +0 -19
  230. package/dist/packages/broadcast/component.d.ts +0 -36
  231. package/dist/packages/broadcast/index.d.ts +0 -2
  232. package/dist/packages/broadcast/index.js +0 -87
  233. package/dist/packages/broadcast/index.js.map +0 -7
package/dist/packages/card/react.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import { WarpCard } from './index.js';
2
+ export declare const Card: import("@lit/react").ReactWebComponent<WarpCard, {}>;
package/dist/packages/card/styles.d.ts ADDED
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
package/dist/packages/datepicker/DatePicker.test.d.ts ADDED
@@ -0,0 +1 @@
1
+ import '../button/index.js';
package/dist/packages/datepicker/datepicker.d.ts ADDED
@@ -0,0 +1,107 @@
1
+ import { LitElement } from 'lit';
2
+ import { Locale } from 'date-fns';
3
+ import '@warp-ds/icons/elements/calendar-16';
4
+ import '@warp-ds/icons/elements/chevron-left-16';
5
+ import '@warp-ds/icons/elements/chevron-right-16';
6
+ declare const WarpDatepicker_base: import("@open-wc/form-control").Constructor<import("@open-wc/form-control").FormControlInterface> & typeof LitElement;
7
+ /**
8
+ * An input for dates.
9
+ *
10
+ * Uses the `lang` attribute on either the element or on `<html>` to determine the locale options.
11
+ *
12
+ * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-datepicker--docs)
13
+ */
14
+ declare class WarpDatepicker extends WarpDatepicker_base {
15
+ #private;
16
+ static shadowRootOptions: {
17
+ delegatesFocus: boolean;
18
+ mode: ShadowRootMode;
19
+ serializable?: boolean;
20
+ slotAssignment?: SlotAssignmentMode;
21
+ };
22
+ static styles: import("lit").CSSResult[];
23
+ label: string;
24
+ /** Takes precedence over the `<html>` lang attribute. */
25
+ lang: string;
26
+ name: string;
27
+ value: string;
28
+ /**
29
+ * Decides the format of the date as shown in the calendar header.
30
+ *
31
+ * The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
32
+ */
33
+ headerFormat: string;
34
+ /**
35
+ * Decides the format of the weekday as shown above the grid of dates in the calendar.
36
+ *
37
+ * The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
38
+ */
39
+ weekdayFormat: string;
40
+ /**
41
+ * Lets you control if a date in the calendar should be disabled.
42
+ *
43
+ * This needs to be set on the element instance in JavaScript, not as an HTML attribute.
44
+ *
45
+ * @example
46
+ * ```ts
47
+ * import type { WarpDatepicker } from "@warp-ds/elements";
48
+ * import { isBefore, startOfDay } from 'date-fns';
49
+ *
50
+ * const today = startOfDay(new Date());
51
+ * const datePicker = document.querySelector('w-datepicker') as WarpDatepicker;
52
+ * datePicker.isDayDisabled = (day: Date) => isBefore(startOfDay(day), today);
53
+ * ```
54
+ */
55
+ isDayDisabled: (day: Date) => boolean;
56
+ /**
57
+ * Decides the format of the day in the calendar as read to screen readers.
58
+ *
59
+ * The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
60
+ */
61
+ dayFormat: string;
62
+ isCalendarOpen: boolean;
63
+ navigationDate: Date;
64
+ /** @internal This gets picked up by the custom element manifest analyzer as a property for some reason */
65
+ locale: Locale;
66
+ get selectedDate(): Date | null;
67
+ get month(): Date;
68
+ get weeks(): import("date-fns").EachDayOfIntervalResult<{
69
+ start: Date;
70
+ end: Date;
71
+ }, undefined>[];
72
+ calendar: HTMLDivElement;
73
+ input: HTMLInputElement;
74
+ toggleButton: HTMLButtonElement;
75
+ wrapper: HTMLDivElement;
76
+ /**
77
+ * This is the first focusable element, needed for the modal focus trap.
78
+ *
79
+ * Don't cache this and other `@query` fields from inside the calendar modal.
80
+ * They work the first time, but once the calendar is closed and reopened
81
+ * the query will point to an element that doesn't exist anymore.
82
+ */
83
+ previousMonthButton: HTMLButtonElement;
84
+ todayCell: HTMLTableCellElement;
85
+ selectedCell: HTMLTableCellElement;
86
+ /**
87
+ * We can't use private fields (`#` prefix) for this method
88
+ * since we can't overwrite private field methods. We need
89
+ * to `.bind(this)` in the constructor because we need one
90
+ * stable method handler we can register and unregister on
91
+ * `document`, that has access to this specific instance
92
+ * of WarpDatepicker to control the calendar.
93
+ * @internal
94
+ */
95
+ private _onClickOutside;
96
+ constructor();
97
+ connectedCallback(): void;
98
+ disconnectedCallback(): void;
99
+ updated(changedProperties: Map<string, unknown>): void;
100
+ render(): import("lit").TemplateResult<1>;
101
+ }
102
+ declare global {
103
+ interface HTMLElementTagNameMap {
104
+ 'w-datepicker': WarpDatepicker;
105
+ }
106
+ }
107
+ export { WarpDatepicker };