@getmicdrop/svelte-components 5.17.4 → 5.19.0

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 (480) hide show
  1. package/dist/calendar/AboutShow/AboutShow.svelte +191 -187
  2. package/dist/calendar/AboutShow/AboutShow.svelte.d.ts +2 -2
  3. package/dist/calendar/AboutShow/AboutShow.svelte.d.ts.map +1 -1
  4. package/dist/calendar/Calendar/MiniMonthCalendar.svelte +801 -780
  5. package/dist/calendar/Calendar/MiniMonthCalendar.svelte.d.ts +4 -0
  6. package/dist/calendar/Calendar/MiniMonthCalendar.svelte.d.ts.map +1 -1
  7. package/dist/calendar/FAQs/FAQs.svelte +88 -77
  8. package/dist/calendar/FAQs/FAQs.svelte.d.ts +6 -4
  9. package/dist/calendar/FAQs/FAQs.svelte.d.ts.map +1 -1
  10. package/dist/calendar/MonthSwitcher/MonthSwitcher.svelte +140 -125
  11. package/dist/calendar/MonthSwitcher/MonthSwitcher.svelte.d.ts +2 -0
  12. package/dist/calendar/MonthSwitcher/MonthSwitcher.svelte.d.ts.map +1 -1
  13. package/dist/calendar/OrderSummary/OrderSummary.spec.js +3 -3
  14. package/dist/calendar/OrderSummary/OrderSummary.svelte +461 -457
  15. package/dist/calendar/OrderSummary/OrderSummary.svelte.d.ts +4 -2
  16. package/dist/calendar/OrderSummary/OrderSummary.svelte.d.ts.map +1 -1
  17. package/dist/calendar/PublicCard/PublicCard.svelte +164 -155
  18. package/dist/calendar/PublicCard/PublicCard.svelte.d.ts +4 -0
  19. package/dist/calendar/PublicCard/PublicCard.svelte.d.ts.map +1 -1
  20. package/dist/calendar/ShowCard/ShowCard.svelte +180 -166
  21. package/dist/calendar/ShowCard/ShowCard.svelte.d.ts +4 -0
  22. package/dist/calendar/ShowCard/ShowCard.svelte.d.ts.map +1 -1
  23. package/dist/calendar/ShowTimeCard/ShowTimeCard.svelte +80 -72
  24. package/dist/calendar/ShowTimeCard/ShowTimeCard.svelte.d.ts +4 -0
  25. package/dist/calendar/ShowTimeCard/ShowTimeCard.svelte.d.ts.map +1 -1
  26. package/dist/calendar/index.js +15 -15
  27. package/dist/components/Heading.spec.js +89 -89
  28. package/dist/components/Heading.svelte +60 -60
  29. package/dist/components/Layout/AppShell.svelte +104 -104
  30. package/dist/components/Layout/ContentSection.svelte +80 -80
  31. package/dist/components/Layout/Grid.svelte +101 -101
  32. package/dist/components/Layout/Heading.svelte +81 -81
  33. package/dist/components/Layout/PageContainer.svelte +69 -69
  34. package/dist/components/Layout/Responsive.svelte +75 -75
  35. package/dist/components/Layout/Section.svelte +80 -80
  36. package/dist/components/Layout/ShowOnDesktop.svelte +37 -37
  37. package/dist/components/Layout/ShowOnMobile.svelte +37 -37
  38. package/dist/components/Layout/Sidebar.svelte +108 -108
  39. package/dist/components/Layout/Stack.spec.js +1 -1
  40. package/dist/components/Layout/Stack.svelte +52 -52
  41. package/dist/components/Layout/Text.svelte +87 -87
  42. package/dist/components/Layout/TwoColumn.svelte +108 -108
  43. package/dist/components/Text.spec.js +89 -89
  44. package/dist/components/Text.svelte +53 -53
  45. package/dist/config.js +151 -151
  46. package/dist/config.spec.js +29 -29
  47. package/dist/constants/formOptions.js +48 -48
  48. package/dist/constants/validation.js +91 -91
  49. package/dist/constants/validation.spec.js +64 -64
  50. package/dist/datetime/README.md +323 -323
  51. package/dist/datetime/__tests__/format.test.js +1 -1
  52. package/dist/datetime/__tests__/parse.test.js +1 -1
  53. package/dist/datetime/__tests__/timezone.test.js +1 -1
  54. package/dist/datetime/parse.js +1 -1
  55. package/dist/forms/createFormStore.svelte.js +1 -0
  56. package/dist/forms/createFormStore.svelte.spec.js +1 -0
  57. package/dist/index.d.ts +1 -0
  58. package/dist/index.d.ts.map +1 -1
  59. package/dist/index.js +66 -57
  60. package/dist/index.spec.js +369 -369
  61. package/dist/patterns/chat/ChatActivityNotice.spec.js +59 -59
  62. package/dist/patterns/chat/ChatActivityNotice.svelte +41 -41
  63. package/dist/patterns/chat/ChatBubble.spec.js +91 -91
  64. package/dist/patterns/chat/ChatBubble.svelte +103 -95
  65. package/dist/patterns/chat/ChatBubble.svelte.d.ts +6 -4
  66. package/dist/patterns/chat/ChatBubble.svelte.d.ts.map +1 -1
  67. package/dist/patterns/chat/ChatContainer.spec.js +30 -30
  68. package/dist/patterns/chat/ChatContainer.svelte +46 -46
  69. package/dist/patterns/chat/ChatDateDivider.spec.js +30 -30
  70. package/dist/patterns/chat/ChatDateDivider.svelte +27 -27
  71. package/dist/patterns/chat/ChatInvitationBubble.spec.js +46 -46
  72. package/dist/patterns/chat/ChatInvitationBubble.svelte +46 -37
  73. package/dist/patterns/chat/ChatInvitationBubble.svelte.d.ts +6 -3
  74. package/dist/patterns/chat/ChatInvitationBubble.svelte.d.ts.map +1 -1
  75. package/dist/patterns/chat/ChatInvitationNotice.spec.js +32 -32
  76. package/dist/patterns/chat/ChatInvitationNotice.svelte +36 -27
  77. package/dist/patterns/chat/ChatInvitationNotice.svelte.d.ts +6 -3
  78. package/dist/patterns/chat/ChatInvitationNotice.svelte.d.ts.map +1 -1
  79. package/dist/patterns/chat/ChatMessageGroup.spec.js +58 -58
  80. package/dist/patterns/chat/ChatMessageGroup.svelte +57 -57
  81. package/dist/patterns/chat/ChatSlotUpdate.spec.js +65 -65
  82. package/dist/patterns/chat/ChatSlotUpdate.svelte +46 -46
  83. package/dist/patterns/chat/ChatStatusBadge.spec.js +79 -79
  84. package/dist/patterns/chat/ChatStatusBadge.svelte +91 -91
  85. package/dist/patterns/chat/ChatStatusTransition.spec.js +81 -81
  86. package/dist/patterns/chat/ChatStatusTransition.svelte +64 -64
  87. package/dist/patterns/chat/ChatTextBubble.spec.js +35 -35
  88. package/dist/patterns/chat/ChatTextBubble.svelte +41 -41
  89. package/dist/patterns/chat/index.js +22 -22
  90. package/dist/patterns/data/DataGrid.svelte +45 -45
  91. package/dist/patterns/data/DataList.svelte +24 -24
  92. package/dist/patterns/data/DataTable.svelte +45 -45
  93. package/dist/patterns/data/index.js +4 -4
  94. package/dist/patterns/forms/FormActions.spec.js +95 -95
  95. package/dist/patterns/forms/FormActions.stories.svelte +97 -97
  96. package/dist/patterns/forms/FormActions.svelte +46 -46
  97. package/dist/patterns/forms/FormGrid.svelte +33 -33
  98. package/dist/patterns/forms/FormSection.svelte +32 -32
  99. package/dist/patterns/forms/FormValidationSummary.stories.svelte +97 -97
  100. package/dist/patterns/forms/FormValidationSummary.svelte +82 -74
  101. package/dist/patterns/forms/FormValidationSummary.svelte.d.ts +5 -3
  102. package/dist/patterns/forms/FormValidationSummary.svelte.d.ts.map +1 -1
  103. package/dist/patterns/forms/index.js +5 -5
  104. package/dist/patterns/index.js +21 -21
  105. package/dist/patterns/layout/Sidebar.svelte +39 -39
  106. package/dist/patterns/layout/SidebarTestWrapper.svelte +34 -34
  107. package/dist/patterns/layout/SidebarTestWrapper.svelte.d.ts +1 -1
  108. package/dist/patterns/layout/Stack.svelte +61 -61
  109. package/dist/patterns/layout/index.js +29 -29
  110. package/dist/patterns/navigation/BottomNav.stories.svelte +117 -117
  111. package/dist/patterns/navigation/BottomNav.svelte +82 -74
  112. package/dist/patterns/navigation/BottomNav.svelte.d.ts +10 -9
  113. package/dist/patterns/navigation/BottomNav.svelte.d.ts.map +1 -1
  114. package/dist/patterns/navigation/Header.stories.svelte +77 -77
  115. package/dist/patterns/navigation/Header.svelte +263 -251
  116. package/dist/patterns/navigation/Header.svelte.d.ts +17 -9
  117. package/dist/patterns/navigation/Header.svelte.d.ts.map +1 -1
  118. package/dist/patterns/navigation/index.js +3 -3
  119. package/dist/patterns/page/PageHeader.svelte +49 -49
  120. package/dist/patterns/page/PageLayout.svelte +40 -40
  121. package/dist/patterns/page/PageLoader.spec.js +57 -57
  122. package/dist/patterns/page/PageLoader.stories.svelte +137 -137
  123. package/dist/patterns/page/PageLoader.svelte +62 -53
  124. package/dist/patterns/page/PageLoader.svelte.d.ts +6 -3
  125. package/dist/patterns/page/PageLoader.svelte.d.ts.map +1 -1
  126. package/dist/patterns/page/SectionHeader.svelte +51 -51
  127. package/dist/patterns/page/index.js +5 -5
  128. package/dist/presets/badges.js +112 -112
  129. package/dist/presets/buttons.js +76 -76
  130. package/dist/presets/index.js +9 -9
  131. package/dist/primitives/Accordion/Accordion.stories.svelte +75 -75
  132. package/dist/primitives/Accordion/Accordion.svelte +62 -62
  133. package/dist/primitives/Accordion/AccordionItem.svelte +103 -95
  134. package/dist/primitives/Accordion/AccordionItem.svelte.d.ts +6 -4
  135. package/dist/primitives/Accordion/AccordionItem.svelte.d.ts.map +1 -1
  136. package/dist/primitives/Accordion/AccordionItemWrapper.test.svelte +107 -107
  137. package/dist/primitives/Accordion/AccordionToggleWrapper.test.svelte +28 -28
  138. package/dist/primitives/Alert/Alert.spec.js +173 -173
  139. package/dist/primitives/Alert/Alert.stories.svelte +88 -88
  140. package/dist/primitives/Alert/Alert.svelte +72 -64
  141. package/dist/primitives/Alert/Alert.svelte.d.ts +6 -4
  142. package/dist/primitives/Alert/Alert.svelte.d.ts.map +1 -1
  143. package/dist/primitives/Avatar/Avatar.stories.svelte +94 -94
  144. package/dist/primitives/Avatar/Avatar.svelte +66 -66
  145. package/dist/primitives/AvatarButton/AvatarButton.svelte +57 -57
  146. package/dist/primitives/Badges/Badge.spec.js +144 -144
  147. package/dist/primitives/Badges/Badge.stories.svelte +86 -86
  148. package/dist/primitives/Badges/Badge.svelte +99 -99
  149. package/dist/primitives/BottomSheet/BottomSheet.spec.js +238 -238
  150. package/dist/primitives/BottomSheet/BottomSheet.stories.svelte +83 -83
  151. package/dist/primitives/BottomSheet/BottomSheet.svelte +115 -115
  152. package/dist/primitives/BottomSheet/BottomSheetWithActions.test.svelte +20 -20
  153. package/dist/primitives/Breadcrumb/Breadcrumb.spec.js +123 -123
  154. package/dist/primitives/Breadcrumb/Breadcrumb.stories.svelte +23 -23
  155. package/dist/primitives/Breadcrumb/Breadcrumb.svelte +107 -99
  156. package/dist/primitives/Breadcrumb/Breadcrumb.svelte.d.ts +13 -9
  157. package/dist/primitives/Breadcrumb/Breadcrumb.svelte.d.ts.map +1 -1
  158. package/dist/primitives/Button/Button.spec.js +225 -225
  159. package/dist/primitives/Button/Button.stories.svelte +76 -76
  160. package/dist/primitives/Button/Button.svelte +278 -278
  161. package/dist/primitives/Button/ButtonGroup.spec.js +44 -44
  162. package/dist/primitives/Button/ButtonGroup.svelte +50 -50
  163. package/dist/primitives/Button/ButtonSaveDemo.spec.js +146 -146
  164. package/dist/primitives/Button/ButtonSaveDemo.svelte +25 -25
  165. package/dist/primitives/Button/ButtonVariantShowcase.svelte +129 -129
  166. package/dist/primitives/Card.spec.js +49 -49
  167. package/dist/primitives/Card.stories.svelte +22 -22
  168. package/dist/primitives/Card.svelte +28 -28
  169. package/dist/primitives/CardAction/CardAction.svelte +68 -68
  170. package/dist/primitives/Checkbox/Checkbox.stories.svelte +84 -84
  171. package/dist/primitives/Checkbox/Checkbox.svelte +88 -88
  172. package/dist/primitives/DarkModeToggle.spec.js +390 -390
  173. package/dist/primitives/DarkModeToggle.stories.svelte +57 -57
  174. package/dist/primitives/DarkModeToggle.svelte +147 -136
  175. package/dist/primitives/DarkModeToggle.svelte.d.ts +9 -3
  176. package/dist/primitives/DarkModeToggle.svelte.d.ts.map +1 -1
  177. package/dist/primitives/Drawer/Drawer.stories.svelte +100 -100
  178. package/dist/primitives/Drawer/Drawer.svelte +224 -224
  179. package/dist/primitives/Drawer/DrawerTestWrapper.svelte +86 -86
  180. package/dist/primitives/Dropdown/Dropdown.stories.svelte +137 -137
  181. package/dist/primitives/Dropdown/Dropdown.svelte +179 -170
  182. package/dist/primitives/Dropdown/Dropdown.svelte.d.ts +7 -4
  183. package/dist/primitives/Dropdown/Dropdown.svelte.d.ts.map +1 -1
  184. package/dist/primitives/Dropdown/DropdownDivider.spec.js +30 -30
  185. package/dist/primitives/Dropdown/DropdownDivider.svelte +9 -9
  186. package/dist/primitives/Dropdown/DropdownItem.svelte +80 -80
  187. package/dist/primitives/Dropdown/DropdownItemTestWrapper.svelte +43 -43
  188. package/dist/primitives/Helper/Helper.spec.js +57 -57
  189. package/dist/primitives/Helper/Helper.svelte +33 -33
  190. package/dist/primitives/Icons/ArrowLeft.svelte +21 -21
  191. package/dist/primitives/Icons/ArrowRight.svelte +21 -21
  192. package/dist/primitives/Icons/Availability.svelte +27 -27
  193. package/dist/primitives/Icons/Back.svelte +27 -27
  194. package/dist/primitives/Icons/CheckCircle.svelte +19 -19
  195. package/dist/primitives/Icons/CheckCircleOutline.svelte +28 -28
  196. package/dist/primitives/Icons/ChevronLeft.svelte +17 -17
  197. package/dist/primitives/Icons/ChevronRight.svelte +17 -17
  198. package/dist/primitives/Icons/Copy.svelte +28 -28
  199. package/dist/primitives/Icons/Cross.svelte +18 -18
  200. package/dist/primitives/Icons/DownArrow.svelte +21 -21
  201. package/dist/primitives/Icons/ErrorCircle.svelte +19 -19
  202. package/dist/primitives/Icons/FacebookIcon.svelte +15 -15
  203. package/dist/primitives/Icons/Home.svelte +28 -28
  204. package/dist/primitives/Icons/Icon.spec.js +175 -175
  205. package/dist/primitives/Icons/Icon.stories.svelte +100 -100
  206. package/dist/primitives/Icons/Icon.svelte +79 -79
  207. package/dist/primitives/Icons/IconGallery.stories.svelte +235 -235
  208. package/dist/primitives/Icons/ImageOutline.svelte +21 -21
  209. package/dist/primitives/Icons/Info.svelte +20 -20
  210. package/dist/primitives/Icons/InstagramIcon.svelte +21 -21
  211. package/dist/primitives/Icons/LogoInstagram.svelte +15 -15
  212. package/dist/primitives/Icons/Message.svelte +28 -28
  213. package/dist/primitives/Icons/MoonIcon.svelte +18 -18
  214. package/dist/primitives/Icons/More.svelte +34 -34
  215. package/dist/primitives/Icons/MoreHori.spec.js +67 -67
  216. package/dist/primitives/Icons/MoreHori.svelte +35 -35
  217. package/dist/primitives/Icons/Notification.svelte +27 -27
  218. package/dist/primitives/Icons/Payment.svelte +27 -27
  219. package/dist/primitives/Icons/Profile.svelte +34 -34
  220. package/dist/primitives/Icons/Reload.svelte +42 -42
  221. package/dist/primitives/Icons/Shows.svelte +34 -34
  222. package/dist/primitives/Icons/Signout.svelte +34 -34
  223. package/dist/primitives/Icons/SunIcon.svelte +21 -21
  224. package/dist/primitives/Icons/TiktokIcon.svelte +15 -15
  225. package/dist/primitives/Icons/TrashBinOutline.svelte +21 -21
  226. package/dist/primitives/Icons/TwitterIcon.svelte +15 -15
  227. package/dist/primitives/Icons/WarningIcon.spec.js +30 -30
  228. package/dist/primitives/Icons/WarningIcon.svelte +24 -24
  229. package/dist/primitives/Input/Input.spec.js +1237 -1237
  230. package/dist/primitives/Input/Input.stories.svelte +139 -139
  231. package/dist/primitives/Input/Input.svelte +444 -431
  232. package/dist/primitives/Input/Input.svelte.d.ts.map +1 -1
  233. package/dist/primitives/Input/Select.spec.js +632 -632
  234. package/dist/primitives/Input/Select.stories.svelte +112 -112
  235. package/dist/primitives/Input/Select.svelte +252 -252
  236. package/dist/primitives/Input/Textarea.stories.svelte +137 -137
  237. package/dist/primitives/Input/Textarea.svelte +105 -105
  238. package/dist/primitives/Label/Label.svelte +37 -37
  239. package/dist/primitives/LandingButton/LandingButton.spec.js +61 -61
  240. package/dist/primitives/LandingButton/LandingButton.svelte +92 -92
  241. package/dist/primitives/MenuItem/MenuItem.spec.js +130 -130
  242. package/dist/primitives/MenuItem/MenuItem.svelte +85 -85
  243. package/dist/primitives/Modal/Modal.spec.js +314 -314
  244. package/dist/primitives/Modal/Modal.stories.svelte +86 -86
  245. package/dist/primitives/Modal/Modal.svelte +181 -181
  246. package/dist/primitives/NavItem/NavItem.spec.js +97 -97
  247. package/dist/primitives/NavItem/NavItem.svelte +75 -75
  248. package/dist/primitives/NumberInput/NumberInput.svelte +113 -105
  249. package/dist/primitives/NumberInput/NumberInput.svelte.d.ts.map +1 -1
  250. package/dist/primitives/Pagination/Pagination.stories.svelte +76 -76
  251. package/dist/primitives/Pagination/Pagination.svelte +275 -261
  252. package/dist/primitives/Pagination/Pagination.svelte.d.ts +14 -6
  253. package/dist/primitives/Pagination/Pagination.svelte.d.ts.map +1 -1
  254. package/dist/primitives/Radio/Radio.stories.svelte +80 -80
  255. package/dist/primitives/Radio/Radio.svelte +67 -67
  256. package/dist/primitives/SearchResultItem/SearchResultItem.spec.js +78 -78
  257. package/dist/primitives/SearchResultItem/SearchResultItem.svelte +109 -109
  258. package/dist/primitives/SidebarToggle/SidebarToggle.spec.js +61 -61
  259. package/dist/primitives/SidebarToggle/SidebarToggle.svelte +55 -55
  260. package/dist/primitives/Skeleton/CardPlaceholder.svelte +96 -87
  261. package/dist/primitives/Skeleton/CardPlaceholder.svelte.d.ts +8 -5
  262. package/dist/primitives/Skeleton/CardPlaceholder.svelte.d.ts.map +1 -1
  263. package/dist/primitives/Skeleton/ImagePlaceholder.svelte +68 -59
  264. package/dist/primitives/Skeleton/ImagePlaceholder.svelte.d.ts +8 -5
  265. package/dist/primitives/Skeleton/ImagePlaceholder.svelte.d.ts.map +1 -1
  266. package/dist/primitives/Skeleton/ListPlaceholder.svelte +85 -76
  267. package/dist/primitives/Skeleton/ListPlaceholder.svelte.d.ts +8 -5
  268. package/dist/primitives/Skeleton/ListPlaceholder.svelte.d.ts.map +1 -1
  269. package/dist/primitives/Skeleton/Skeleton.stories.svelte +151 -151
  270. package/dist/primitives/Skeleton/Skeleton.svelte +55 -46
  271. package/dist/primitives/Skeleton/Skeleton.svelte.d.ts +7 -4
  272. package/dist/primitives/Skeleton/Skeleton.svelte.d.ts.map +1 -1
  273. package/dist/primitives/Spinner/Spinner.spec.js +84 -84
  274. package/dist/primitives/Spinner/Spinner.stories.svelte +29 -29
  275. package/dist/primitives/Spinner/Spinner.svelte +52 -44
  276. package/dist/primitives/Spinner/Spinner.svelte.d.ts +6 -4
  277. package/dist/primitives/Spinner/Spinner.svelte.d.ts.map +1 -1
  278. package/dist/primitives/Tabs/TabItem.svelte +52 -52
  279. package/dist/primitives/Tabs/Tabs.stories.svelte +112 -112
  280. package/dist/primitives/Tabs/Tabs.svelte +137 -137
  281. package/dist/primitives/Toggle.spec.js +221 -221
  282. package/dist/primitives/Toggle.stories.svelte +92 -92
  283. package/dist/primitives/Toggle.svelte +141 -141
  284. package/dist/primitives/ToggleTestWrapper.svelte +30 -30
  285. package/dist/primitives/Tooltip/Tooltip.spec.js +126 -126
  286. package/dist/primitives/Tooltip/Tooltip.svelte +83 -83
  287. package/dist/primitives/Typography/Typography.svelte +53 -53
  288. package/dist/primitives/ValidationError.spec.js +103 -103
  289. package/dist/primitives/ValidationError.stories.svelte +112 -112
  290. package/dist/primitives/ValidationError.svelte +29 -29
  291. package/dist/primitives/index.js +113 -113
  292. package/dist/recipes/CropImage/CropImage.spec.js +208 -208
  293. package/dist/recipes/CropImage/CropImage.stories.svelte +104 -104
  294. package/dist/recipes/CropImage/CropImage.svelte +241 -241
  295. package/dist/recipes/ImageUploader/ImageUploader.stories.svelte +125 -125
  296. package/dist/recipes/ImageUploader/ImageUploader.svelte +994 -992
  297. package/dist/recipes/ImageUploader/ImageUploader.svelte.d.ts +1 -0
  298. package/dist/recipes/ImageUploader/ImageUploader.svelte.d.ts.map +1 -1
  299. package/dist/recipes/SuperLogin/SuperLogin.svelte +25 -23
  300. package/dist/recipes/SuperLogin/SuperLogin.svelte.d.ts.map +1 -1
  301. package/dist/recipes/Toaster/Toaster.stories.svelte +62 -62
  302. package/dist/recipes/feedback/EmptyState/EmptyState.svelte +75 -66
  303. package/dist/recipes/feedback/EmptyState/EmptyState.svelte.d.ts +7 -4
  304. package/dist/recipes/feedback/EmptyState/EmptyState.svelte.d.ts.map +1 -1
  305. package/dist/recipes/feedback/ErrorDisplay.spec.js +69 -69
  306. package/dist/recipes/feedback/ErrorDisplay.stories.svelte +113 -113
  307. package/dist/recipes/feedback/ErrorDisplay.svelte +67 -67
  308. package/dist/recipes/feedback/StatusIndicator/StatusIndicator.spec.js +133 -133
  309. package/dist/recipes/feedback/StatusIndicator/StatusIndicator.svelte +176 -176
  310. package/dist/recipes/feedback/index.js +4 -4
  311. package/dist/recipes/fields/CheckboxField.svelte +85 -85
  312. package/dist/recipes/fields/FormField.svelte +58 -58
  313. package/dist/recipes/fields/RadioGroup.svelte +95 -95
  314. package/dist/recipes/fields/SelectField.svelte +82 -82
  315. package/dist/recipes/fields/TextareaField.svelte +101 -101
  316. package/dist/recipes/fields/ToggleField.svelte +60 -60
  317. package/dist/recipes/fields/index.js +7 -7
  318. package/dist/recipes/index.js +24 -24
  319. package/dist/recipes/inputs/MultiSelect.spec.js +263 -263
  320. package/dist/recipes/inputs/MultiSelect.stories.svelte +133 -133
  321. package/dist/recipes/inputs/MultiSelect.svelte +291 -283
  322. package/dist/recipes/inputs/MultiSelect.svelte.d.ts.map +1 -1
  323. package/dist/recipes/inputs/OTPInput.spec.js +251 -251
  324. package/dist/recipes/inputs/OTPInput.stories.svelte +162 -162
  325. package/dist/recipes/inputs/OTPInput.svelte +128 -117
  326. package/dist/recipes/inputs/OTPInput.svelte.d.ts +14 -12
  327. package/dist/recipes/inputs/OTPInput.svelte.d.ts.map +1 -1
  328. package/dist/recipes/inputs/PasswordInput.svelte +130 -121
  329. package/dist/recipes/inputs/PasswordInput.svelte.d.ts +7 -4
  330. package/dist/recipes/inputs/PasswordInput.svelte.d.ts.map +1 -1
  331. package/dist/recipes/inputs/PasswordStrengthIndicator/PasswordStrengthIndicator.svelte +142 -131
  332. package/dist/recipes/inputs/PasswordStrengthIndicator/PasswordStrengthIndicator.svelte.d.ts +8 -3
  333. package/dist/recipes/inputs/PasswordStrengthIndicator/PasswordStrengthIndicator.svelte.d.ts.map +1 -1
  334. package/dist/recipes/inputs/PhoneInput.svelte +254 -0
  335. package/dist/recipes/inputs/PhoneInput.svelte.d.ts +40 -0
  336. package/dist/recipes/inputs/PhoneInput.svelte.d.ts.map +1 -0
  337. package/dist/recipes/inputs/PlaceAutocomplete/PlaceAutocomplete.stories.svelte +170 -170
  338. package/dist/recipes/inputs/PlaceAutocomplete/PlaceAutocomplete.svelte +349 -336
  339. package/dist/recipes/inputs/PlaceAutocomplete/PlaceAutocomplete.svelte.d.ts +21 -16
  340. package/dist/recipes/inputs/PlaceAutocomplete/PlaceAutocomplete.svelte.d.ts.map +1 -1
  341. package/dist/recipes/inputs/Search.svelte +110 -102
  342. package/dist/recipes/inputs/Search.svelte.d.ts +7 -5
  343. package/dist/recipes/inputs/Search.svelte.d.ts.map +1 -1
  344. package/dist/recipes/inputs/index.d.ts +1 -0
  345. package/dist/recipes/inputs/index.js +8 -7
  346. package/dist/recipes/inputs/phoneInput/CountrySelector.svelte +240 -0
  347. package/dist/recipes/inputs/phoneInput/CountrySelector.svelte.d.ts +15 -0
  348. package/dist/recipes/inputs/phoneInput/CountrySelector.svelte.d.ts.map +1 -0
  349. package/dist/recipes/inputs/phoneInput/countryData.d.ts +18 -0
  350. package/dist/recipes/inputs/phoneInput/countryData.d.ts.map +1 -0
  351. package/dist/recipes/inputs/phoneInput/countryData.js +211 -0
  352. package/dist/recipes/modals/AlertModal.svelte +139 -130
  353. package/dist/recipes/modals/AlertModal.svelte.d.ts +4 -2
  354. package/dist/recipes/modals/AlertModal.svelte.d.ts.map +1 -1
  355. package/dist/recipes/modals/ConfirmationModal.spec.js +396 -396
  356. package/dist/recipes/modals/ConfirmationModal.stories.svelte +119 -119
  357. package/dist/recipes/modals/ConfirmationModal.svelte +169 -162
  358. package/dist/recipes/modals/ConfirmationModal.svelte.d.ts +2 -0
  359. package/dist/recipes/modals/ConfirmationModal.svelte.d.ts.map +1 -1
  360. package/dist/recipes/modals/InputModal.svelte +194 -182
  361. package/dist/recipes/modals/InputModal.svelte.d.ts +6 -4
  362. package/dist/recipes/modals/InputModal.svelte.d.ts.map +1 -1
  363. package/dist/recipes/modals/ModalStateManager.spec.js +100 -100
  364. package/dist/recipes/modals/ModalStateManager.svelte +77 -77
  365. package/dist/recipes/modals/ModalTestWrapper.svelte +65 -65
  366. package/dist/recipes/modals/StatusModal.svelte +216 -206
  367. package/dist/recipes/modals/StatusModal.svelte.d.ts +4 -2
  368. package/dist/recipes/modals/StatusModal.svelte.d.ts.map +1 -1
  369. package/dist/recipes/modals/index.js +7 -7
  370. package/dist/schemas/common.js +1 -1
  371. package/dist/schemas/event.d.ts +4 -4
  372. package/dist/schemas/event.js +1 -1
  373. package/dist/schemas/order.d.ts +2 -2
  374. package/dist/schemas/order.js +1 -0
  375. package/dist/schemas/performer.js +1 -1
  376. package/dist/schemas/promo.d.ts +4 -4
  377. package/dist/schemas/promo.js +2 -2
  378. package/dist/schemas/ticket.js +1 -1
  379. package/dist/schemas/user.js +2 -1
  380. package/dist/services/event.service.d.ts +11 -0
  381. package/dist/services/event.service.d.ts.map +1 -0
  382. package/dist/services/event.service.js +64 -0
  383. package/dist/services/event.service.spec.d.ts +2 -0
  384. package/dist/services/event.service.spec.d.ts.map +1 -0
  385. package/dist/services/event.service.spec.js +168 -0
  386. package/dist/services/{ShowService.d.ts → show.service.d.ts} +47 -47
  387. package/dist/services/show.service.d.ts.map +1 -0
  388. package/dist/services/show.service.js +115 -0
  389. package/dist/services/show.service.spec.d.ts +2 -0
  390. package/dist/services/show.service.spec.d.ts.map +1 -0
  391. package/dist/services/show.service.spec.js +242 -0
  392. package/dist/stores/auth.d.ts +8 -8
  393. package/dist/stores/auth.svelte.spec.js +1 -1
  394. package/dist/stores/index.js +9 -9
  395. package/dist/stores/toaster.d.ts +3 -3
  396. package/dist/stores/toaster.js +13 -13
  397. package/dist/stores/toaster.spec.js +59 -59
  398. package/dist/stories/ButtonAuditReview.stories.svelte +14 -14
  399. package/dist/stories/ButtonAuditReview.svelte +427 -427
  400. package/dist/stories/PatternsGallery.stories.svelte +19 -19
  401. package/dist/stories/PatternsGallery.svelte +399 -399
  402. package/dist/stories/PrimitivesGallery.stories.svelte +19 -19
  403. package/dist/stories/PrimitivesGallery.svelte +756 -756
  404. package/dist/stories/RecipesGallery.stories.svelte +19 -19
  405. package/dist/stories/RecipesGallery.svelte +454 -454
  406. package/dist/stories/button-audit-manifest.json +11186 -11186
  407. package/dist/tailwind/preset.cjs +82 -82
  408. package/dist/telemetry.js +402 -402
  409. package/dist/telemetry.server.js +212 -212
  410. package/dist/telemetry.server.spec.js +437 -437
  411. package/dist/telemetry.spec.js +1173 -1173
  412. package/dist/tokens/tokens.css +87 -87
  413. package/dist/tokens/typography-base.css +163 -163
  414. package/dist/tokens/utilities.css +353 -353
  415. package/dist/utils/__tests__/auth.test.js +431 -431
  416. package/dist/utils/apiConfig.d.ts +29 -29
  417. package/dist/utils/apiConfig.js +117 -117
  418. package/dist/utils/apiConfig.spec.js +219 -219
  419. package/dist/utils/assets.d.ts +3 -0
  420. package/dist/utils/assets.d.ts.map +1 -0
  421. package/dist/utils/assets.js +3 -0
  422. package/dist/utils/auth.d.ts +46 -46
  423. package/dist/utils/auth.js +195 -195
  424. package/dist/utils/classNames.d.ts +10 -0
  425. package/dist/utils/classNames.d.ts.map +1 -0
  426. package/dist/utils/classNames.js +15 -0
  427. package/dist/utils/cookieHelpers.d.ts +40 -0
  428. package/dist/utils/cookieHelpers.d.ts.map +1 -0
  429. package/dist/utils/cookieHelpers.js +102 -0
  430. package/dist/utils/dateHelpers.d.ts +71 -0
  431. package/dist/utils/dateHelpers.d.ts.map +1 -0
  432. package/dist/utils/dateHelpers.js +253 -0
  433. package/dist/utils/eventFormatters.d.ts +9 -0
  434. package/dist/utils/eventFormatters.d.ts.map +1 -0
  435. package/dist/utils/eventFormatters.js +96 -0
  436. package/dist/utils/fetchHelpers.d.ts +17 -0
  437. package/dist/utils/fetchHelpers.d.ts.map +1 -0
  438. package/dist/utils/fetchHelpers.js +44 -0
  439. package/dist/utils/formatters.d.ts +62 -0
  440. package/dist/utils/formatters.d.ts.map +1 -1
  441. package/dist/utils/formatters.js +128 -0
  442. package/dist/utils/formatters.spec.js +128 -1
  443. package/dist/utils/greetings.js +187 -187
  444. package/dist/utils/greetings.spec.js +337 -337
  445. package/dist/utils/haptic.spec.js +1 -1
  446. package/dist/utils/imageValidation.js +121 -121
  447. package/dist/utils/imageValidation.spec.js +223 -223
  448. package/dist/utils/permissions.d.ts +9 -0
  449. package/dist/utils/permissions.d.ts.map +1 -0
  450. package/dist/utils/permissions.js +93 -0
  451. package/dist/utils/phoneUtils.d.ts +35 -0
  452. package/dist/utils/phoneUtils.d.ts.map +1 -0
  453. package/dist/utils/phoneUtils.js +104 -0
  454. package/dist/utils/portal.d.ts +11 -11
  455. package/dist/utils/portal.js +25 -25
  456. package/dist/utils/portal.spec.js +143 -143
  457. package/dist/utils/stringHelpers.d.ts +17 -0
  458. package/dist/utils/stringHelpers.d.ts.map +1 -0
  459. package/dist/utils/stringHelpers.js +38 -0
  460. package/dist/utils/transitions.js +4 -4
  461. package/dist/utils/utils/utils.d.ts +2 -73
  462. package/dist/utils/utils/utils.d.ts.map +1 -1
  463. package/dist/utils/utils/utils.js +3 -3
  464. package/dist/utils/utils/utils.spec.js +698 -698
  465. package/dist/utils/utils.d.ts +41 -98
  466. package/dist/utils/utils.d.ts.map +1 -1
  467. package/dist/utils/utils.js +59 -693
  468. package/dist/utils/utils.spec.js +643 -643
  469. package/package.json +301 -292
  470. package/dist/services/EventService.d.ts +0 -5
  471. package/dist/services/EventService.d.ts.map +0 -1
  472. package/dist/services/EventService.js +0 -79
  473. package/dist/services/EventService.spec.d.ts +0 -2
  474. package/dist/services/EventService.spec.d.ts.map +0 -1
  475. package/dist/services/EventService.spec.js +0 -217
  476. package/dist/services/ShowService.d.ts.map +0 -1
  477. package/dist/services/ShowService.js +0 -144
  478. package/dist/services/ShowService.spec.d.ts +0 -2
  479. package/dist/services/ShowService.spec.d.ts.map +0 -1
  480. package/dist/services/ShowService.spec.js +0 -345
@@ -1,30 +1,30 @@
1
- import { render } from '@testing-library/svelte';
2
- import { expect, describe, test } from 'vitest';
3
- import ChatContainer from './ChatContainer.svelte';
4
-
5
- describe('ChatContainer', () => {
6
- test('renders without crashing', () => {
7
- const { container } = render(ChatContainer);
8
- expect(container.firstElementChild).toBeInTheDocument();
9
- });
10
-
11
- test('has flex column layout', () => {
12
- const { container } = render(ChatContainer);
13
- expect(container.querySelector('.flex-col, .flex')).toBeInTheDocument();
14
- });
15
-
16
- test('has scrollable content area', () => {
17
- const { container } = render(ChatContainer);
18
- expect(container.querySelector('.overflow-y-auto, [class*="overflow"]')).toBeInTheDocument();
19
- });
20
-
21
- test('applies custom className', () => {
22
- const { container } = render(ChatContainer, { props: { className: 'my-container' } });
23
- expect(container.querySelector('.my-container')).toBeInTheDocument();
24
- });
25
-
26
- test('has white background', () => {
27
- const { container } = render(ChatContainer);
28
- expect(container.querySelector('[class*="bg-white"]')).toBeInTheDocument();
29
- });
30
- });
1
+ import { render } from '@testing-library/svelte';
2
+ import { expect, describe, test } from 'vitest';
3
+ import ChatContainer from './ChatContainer.svelte';
4
+
5
+ describe('ChatContainer', () => {
6
+ test('renders without crashing', () => {
7
+ const { container } = render(ChatContainer);
8
+ expect(container.firstElementChild).toBeInTheDocument();
9
+ });
10
+
11
+ test('has flex column layout', () => {
12
+ const { container } = render(ChatContainer);
13
+ expect(container.querySelector('.flex-col, .flex')).toBeInTheDocument();
14
+ });
15
+
16
+ test('has scrollable content area', () => {
17
+ const { container } = render(ChatContainer);
18
+ expect(container.querySelector('.overflow-y-auto, [class*="overflow"]')).toBeInTheDocument();
19
+ });
20
+
21
+ test('applies custom className', () => {
22
+ const { container } = render(ChatContainer, { props: { className: 'my-container' } });
23
+ expect(container.querySelector('.my-container')).toBeInTheDocument();
24
+ });
25
+
26
+ test('has white background', () => {
27
+ const { container } = render(ChatContainer);
28
+ expect(container.querySelector('[class*="bg-white"]')).toBeInTheDocument();
29
+ });
30
+ });
@@ -1,46 +1,46 @@
1
- <script lang="ts">
2
- /**
3
- * ChatContainer - Layout wrapper for chat interfaces
4
- *
5
- * Provides a flex column layout with optional header, scrollable message area,
6
- * and fixed footer for message input.
7
- */
8
- import type { Snippet } from 'svelte';
9
- import { classNames } from '../../utils/utils.js';
10
-
11
- interface Props {
12
- /** Additional CSS classes for the container */
13
- className?: string;
14
- /** Header content (title, subtitle, etc.) */
15
- header?: Snippet;
16
- /** Footer content (message input, actions) */
17
- footer?: Snippet;
18
- /** Main scrollable content */
19
- children?: Snippet;
20
- }
21
-
22
- let {
23
- className = '',
24
- header,
25
- footer,
26
- children,
27
- }: Props = $props();
28
- </script>
29
-
30
- <div class={classNames('flex flex-col h-full bg-white dark:bg-gray-900', className)}>
31
- {#if header}
32
- <div class="px-4 py-3 border-b border-gray-200 dark:border-gray-700 shrink-0">
33
- {@render header()}
34
- </div>
35
- {/if}
36
-
37
- <div class="flex-1 overflow-y-auto px-4 py-4 space-y-3">
38
- {@render children?.()}
39
- </div>
40
-
41
- {#if footer}
42
- <div class="px-4 py-3 border-t border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 shrink-0">
43
- {@render footer()}
44
- </div>
45
- {/if}
46
- </div>
1
+ <script lang="ts">
2
+ /**
3
+ * ChatContainer - Layout wrapper for chat interfaces
4
+ *
5
+ * Provides a flex column layout with optional header, scrollable message area,
6
+ * and fixed footer for message input.
7
+ */
8
+ import type { Snippet } from 'svelte';
9
+ import { classNames } from '../../utils/utils.js';
10
+
11
+ interface Props {
12
+ /** Additional CSS classes for the container */
13
+ className?: string;
14
+ /** Header content (title, subtitle, etc.) */
15
+ header?: Snippet;
16
+ /** Footer content (message input, actions) */
17
+ footer?: Snippet;
18
+ /** Main scrollable content */
19
+ children?: Snippet;
20
+ }
21
+
22
+ let {
23
+ className = '',
24
+ header,
25
+ footer,
26
+ children,
27
+ }: Props = $props();
28
+ </script>
29
+
30
+ <div class={classNames('flex flex-col h-full bg-white dark:bg-gray-900', className)}>
31
+ {#if header}
32
+ <div class="px-4 py-3 border-b border-gray-200 dark:border-gray-700 shrink-0">
33
+ {@render header()}
34
+ </div>
35
+ {/if}
36
+
37
+ <div class="flex-1 overflow-y-auto px-4 py-4 space-y-3">
38
+ {@render children?.()}
39
+ </div>
40
+
41
+ {#if footer}
42
+ <div class="px-4 py-3 border-t border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 shrink-0">
43
+ {@render footer()}
44
+ </div>
45
+ {/if}
46
+ </div>
@@ -1,30 +1,30 @@
1
- import { render, screen } from '@testing-library/svelte';
2
- import { expect, describe, test } from 'vitest';
3
- import ChatDateDivider from './ChatDateDivider.svelte';
4
-
5
- describe('ChatDateDivider', () => {
6
- test('renders the label', () => {
7
- render(ChatDateDivider, { props: { label: 'Today' } });
8
- expect(screen.getByText('Today')).toBeInTheDocument();
9
- });
10
-
11
- test('renders long date label', () => {
12
- render(ChatDateDivider, { props: { label: 'Monday, Jan 15, 2024' } });
13
- expect(screen.getByText('Monday, Jan 15, 2024')).toBeInTheDocument();
14
- });
15
-
16
- test('has centered text', () => {
17
- const { container } = render(ChatDateDivider, { props: { label: 'Today' } });
18
- expect(container.querySelector('.text-center')).toBeInTheDocument();
19
- });
20
-
21
- test('has pill styling on label', () => {
22
- const { container } = render(ChatDateDivider, { props: { label: 'Today' } });
23
- expect(container.querySelector('.rounded-full, [class*="rounded"]')).toBeInTheDocument();
24
- });
25
-
26
- test('applies custom className', () => {
27
- const { container } = render(ChatDateDivider, { props: { label: 'Today', className: 'my-divider' } });
28
- expect(container.querySelector('.my-divider')).toBeInTheDocument();
29
- });
30
- });
1
+ import { render, screen } from '@testing-library/svelte';
2
+ import { expect, describe, test } from 'vitest';
3
+ import ChatDateDivider from './ChatDateDivider.svelte';
4
+
5
+ describe('ChatDateDivider', () => {
6
+ test('renders the label', () => {
7
+ render(ChatDateDivider, { props: { label: 'Today' } });
8
+ expect(screen.getByText('Today')).toBeInTheDocument();
9
+ });
10
+
11
+ test('renders long date label', () => {
12
+ render(ChatDateDivider, { props: { label: 'Monday, Jan 15, 2024' } });
13
+ expect(screen.getByText('Monday, Jan 15, 2024')).toBeInTheDocument();
14
+ });
15
+
16
+ test('has centered text', () => {
17
+ const { container } = render(ChatDateDivider, { props: { label: 'Today' } });
18
+ expect(container.querySelector('.text-center')).toBeInTheDocument();
19
+ });
20
+
21
+ test('has pill styling on label', () => {
22
+ const { container } = render(ChatDateDivider, { props: { label: 'Today' } });
23
+ expect(container.querySelector('.rounded-full, [class*="rounded"]')).toBeInTheDocument();
24
+ });
25
+
26
+ test('applies custom className', () => {
27
+ const { container } = render(ChatDateDivider, { props: { label: 'Today', className: 'my-divider' } });
28
+ expect(container.querySelector('.my-divider')).toBeInTheDocument();
29
+ });
30
+ });
@@ -1,27 +1,27 @@
1
- <script lang="ts">
2
- /**
3
- * ChatDateDivider - Date separator for chat messages
4
- *
5
- * Displays a centered date label (Today, Yesterday, or formatted date)
6
- * to separate messages by day.
7
- */
8
- import { classNames } from '../../utils/utils.js';
9
-
10
- interface Props {
11
- /** Date label to display (e.g., "Today", "Yesterday", "Monday, Jan 15, 2024") */
12
- label: string;
13
- /** Additional CSS classes */
14
- className?: string;
15
- }
16
-
17
- let {
18
- label,
19
- className = '',
20
- }: Props = $props();
21
- </script>
22
-
23
- <div class={classNames('text-center py-2', className)}>
24
- <span class="text-xs font-semibold text-gray-500 dark:text-gray-400 bg-gray-100 dark:bg-gray-800 px-3 py-1 rounded-full">
25
- {label}
26
- </span>
27
- </div>
1
+ <script lang="ts">
2
+ /**
3
+ * ChatDateDivider - Date separator for chat messages
4
+ *
5
+ * Displays a centered date label (Today, Yesterday, or formatted date)
6
+ * to separate messages by day.
7
+ */
8
+ import { classNames } from '../../utils/utils.js';
9
+
10
+ interface Props {
11
+ /** Date label to display (e.g., "Today", "Yesterday", "Monday, Jan 15, 2024") */
12
+ label: string;
13
+ /** Additional CSS classes */
14
+ className?: string;
15
+ }
16
+
17
+ let {
18
+ label,
19
+ className = '',
20
+ }: Props = $props();
21
+ </script>
22
+
23
+ <div class={classNames('text-center py-2', className)}>
24
+ <span class="text-xs font-semibold text-gray-500 dark:text-gray-400 bg-gray-100 dark:bg-gray-800 px-3 py-1 rounded-full">
25
+ {label}
26
+ </span>
27
+ </div>
@@ -1,46 +1,46 @@
1
- import { render, screen } from '@testing-library/svelte';
2
- import { expect, describe, test } from 'vitest';
3
- import ChatInvitationBubble from './ChatInvitationBubble.svelte';
4
-
5
- describe('ChatInvitationBubble', () => {
6
- test('renders performer name', () => {
7
- render(ChatInvitationBubble, { props: { performerName: 'Alice' } });
8
- expect(screen.getByText(/Invited Alice/i)).toBeInTheDocument();
9
- });
10
-
11
- test('has blue background', () => {
12
- const { container } = render(ChatInvitationBubble, { props: { performerName: 'Bob' } });
13
- expect(container.querySelector('[class*="blue"]')).toBeInTheDocument();
14
- });
15
-
16
- test('renders invitation icon', () => {
17
- const { container } = render(ChatInvitationBubble, { props: { performerName: 'Test' } });
18
- expect(container.querySelector('svg')).toBeInTheDocument();
19
- });
20
-
21
- test('outbound true applies rounded-br-sm', () => {
22
- const { container } = render(ChatInvitationBubble, {
23
- props: { performerName: 'Test', outbound: true }
24
- });
25
- expect(container.querySelector('.rounded-br-sm')).toBeInTheDocument();
26
- });
27
-
28
- test('outbound false applies rounded-bl-sm', () => {
29
- const { container } = render(ChatInvitationBubble, {
30
- props: { performerName: 'Test', outbound: false }
31
- });
32
- expect(container.querySelector('.rounded-bl-sm')).toBeInTheDocument();
33
- });
34
-
35
- test('default outbound is true', () => {
36
- const { container } = render(ChatInvitationBubble, { props: { performerName: 'Test' } });
37
- expect(container.querySelector('.rounded-br-sm')).toBeInTheDocument();
38
- });
39
-
40
- test('applies custom className', () => {
41
- const { container } = render(ChatInvitationBubble, {
42
- props: { performerName: 'Test', className: 'my-invite' }
43
- });
44
- expect(container.querySelector('.my-invite')).toBeInTheDocument();
45
- });
46
- });
1
+ import { render, screen } from '@testing-library/svelte';
2
+ import { expect, describe, test } from 'vitest';
3
+ import ChatInvitationBubble from './ChatInvitationBubble.svelte';
4
+
5
+ describe('ChatInvitationBubble', () => {
6
+ test('renders performer name', () => {
7
+ render(ChatInvitationBubble, { props: { performerName: 'Alice' } });
8
+ expect(screen.getByText(/Invited Alice/i)).toBeInTheDocument();
9
+ });
10
+
11
+ test('has blue background', () => {
12
+ const { container } = render(ChatInvitationBubble, { props: { performerName: 'Bob' } });
13
+ expect(container.querySelector('[class*="blue"]')).toBeInTheDocument();
14
+ });
15
+
16
+ test('renders invitation icon', () => {
17
+ const { container } = render(ChatInvitationBubble, { props: { performerName: 'Test' } });
18
+ expect(container.querySelector('svg')).toBeInTheDocument();
19
+ });
20
+
21
+ test('outbound true applies rounded-br-sm', () => {
22
+ const { container } = render(ChatInvitationBubble, {
23
+ props: { performerName: 'Test', outbound: true }
24
+ });
25
+ expect(container.querySelector('.rounded-br-sm')).toBeInTheDocument();
26
+ });
27
+
28
+ test('outbound false applies rounded-bl-sm', () => {
29
+ const { container } = render(ChatInvitationBubble, {
30
+ props: { performerName: 'Test', outbound: false }
31
+ });
32
+ expect(container.querySelector('.rounded-bl-sm')).toBeInTheDocument();
33
+ });
34
+
35
+ test('default outbound is true', () => {
36
+ const { container } = render(ChatInvitationBubble, { props: { performerName: 'Test' } });
37
+ expect(container.querySelector('.rounded-br-sm')).toBeInTheDocument();
38
+ });
39
+
40
+ test('applies custom className', () => {
41
+ const { container } = render(ChatInvitationBubble, {
42
+ props: { performerName: 'Test', className: 'my-invite' }
43
+ });
44
+ expect(container.querySelector('.my-invite')).toBeInTheDocument();
45
+ });
46
+ });
@@ -1,37 +1,46 @@
1
- <script lang="ts">
2
- /**
3
- * ChatInvitationBubble - Invitation notification bubble
4
- *
5
- * Shows "Invited {performerName}" with send icon in a blue bubble.
6
- */
7
- import { classNames } from '../../utils/utils.js';
8
- import SendAltFilled from 'carbon-icons-svelte/lib/SendAltFilled.svelte';
9
-
10
- interface Props {
11
- /** Name of the performer who was invited */
12
- performerName: string;
13
- /** Whether this is outbound (right side) */
14
- outbound?: boolean;
15
- /** Additional CSS classes */
16
- className?: string;
17
- }
18
-
19
- let {
20
- performerName,
21
- outbound = true,
22
- className = '',
23
- }: Props = $props();
24
-
25
- let bubbleClasses = $derived(
26
- classNames(
27
- 'px-4 py-2.5 rounded-2xl text-sm bg-blue-600 text-white flex items-center gap-1.5',
28
- outbound ? 'rounded-br-sm' : 'rounded-bl-sm',
29
- className
30
- )
31
- );
32
- </script>
33
-
34
- <div class={bubbleClasses}>
35
- <SendAltFilled class="w-4 h-4" />
36
- Invited {performerName}
37
- </div>
1
+ <script lang="ts">
2
+ /**
3
+ * ChatInvitationBubble - Invitation notification bubble
4
+ *
5
+ * Shows "Invited {performerName}" with send icon in a blue bubble.
6
+ */
7
+ import { classNames } from '../../utils/utils.js';
8
+ import SendAltFilled from 'carbon-icons-svelte/lib/SendAltFilled.svelte';
9
+
10
+ const defaultLabels = {
11
+ invited: (name: string) => `Invited ${name}`,
12
+ };
13
+
14
+ interface Props {
15
+ /** Name of the performer who was invited */
16
+ performerName: string;
17
+ /** Whether this is outbound (right side) */
18
+ outbound?: boolean;
19
+ /** Additional CSS classes */
20
+ className?: string;
21
+ /** Override user-visible strings */
22
+ labels?: Partial<typeof defaultLabels>;
23
+ }
24
+
25
+ let {
26
+ performerName,
27
+ outbound = true,
28
+ className = '',
29
+ labels: userLabels = {},
30
+ }: Props = $props();
31
+
32
+ let labels = $derived({ ...defaultLabels, ...userLabels });
33
+
34
+ let bubbleClasses = $derived(
35
+ classNames(
36
+ 'px-4 py-2.5 rounded-2xl text-sm bg-blue-600 text-white flex items-center gap-1.5',
37
+ outbound ? 'rounded-br-sm' : 'rounded-bl-sm',
38
+ className
39
+ )
40
+ );
41
+ </script>
42
+
43
+ <div class={bubbleClasses}>
44
+ <SendAltFilled class="w-4 h-4" />
45
+ {typeof labels.invited === 'function' ? labels.invited(performerName) : labels.invited}
46
+ </div>
@@ -1,12 +1,15 @@
1
- interface Props {
1
+ declare const ChatInvitationBubble: import("svelte").Component<{
2
2
  /** Name of the performer who was invited */
3
3
  performerName: string;
4
4
  /** Whether this is outbound (right side) */
5
5
  outbound?: boolean;
6
6
  /** Additional CSS classes */
7
7
  className?: string;
8
- }
9
- declare const ChatInvitationBubble: import("svelte").Component<Props, {}, "">;
8
+ /** Override user-visible strings */
9
+ labels?: Partial<{
10
+ invited: (name: string) => string;
11
+ }>;
12
+ }, {}, "">;
10
13
  type ChatInvitationBubble = ReturnType<typeof ChatInvitationBubble>;
11
14
  export default ChatInvitationBubble;
12
15
  //# sourceMappingURL=ChatInvitationBubble.svelte.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ChatInvitationBubble.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/patterns/chat/ChatInvitationBubble.svelte.ts"],"names":[],"mappings":"AAYE,UAAU,KAAK;IACb,4CAA4C;IAC5C,aAAa,EAAE,MAAM,CAAC;IACtB,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA6BH,QAAA,MAAM,oBAAoB,2CAAwC,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}
1
+ {"version":3,"file":"ChatInvitationBubble.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/patterns/chat/ChatInvitationBubble.svelte.ts"],"names":[],"mappings":"AAwDA,QAAA,MAAM,oBAAoB;IAnCtB,4CAA4C;mBAC7B,MAAM;IACrB,4CAA4C;eACjC,OAAO;IAClB,6BAA6B;gBACjB,MAAM;IAClB,oCAAoC;aAC3B,OAAO;wBAXA,MAAM;MAWgB;UA4BwB,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}
@@ -1,32 +1,32 @@
1
- import { render, screen } from '@testing-library/svelte';
2
- import { expect, describe, test } from 'vitest';
3
- import ChatInvitationNotice from './ChatInvitationNotice.svelte';
4
-
5
- describe('ChatInvitationNotice', () => {
6
- test('renders performer name', () => {
7
- render(ChatInvitationNotice, { props: { performerName: 'Alice' } });
8
- expect(screen.getByText(/Invited Alice/i)).toBeInTheDocument();
9
- });
10
-
11
- test('has blue text color', () => {
12
- const { container } = render(ChatInvitationNotice, { props: { performerName: 'Bob' } });
13
- expect(container.querySelector('[class*="blue"]')).toBeInTheDocument();
14
- });
15
-
16
- test('renders icon', () => {
17
- const { container } = render(ChatInvitationNotice, { props: { performerName: 'Test' } });
18
- expect(container.querySelector('svg')).toBeInTheDocument();
19
- });
20
-
21
- test('has inline flex layout', () => {
22
- const { container } = render(ChatInvitationNotice, { props: { performerName: 'Test' } });
23
- expect(container.querySelector('.inline-flex, .flex')).toBeInTheDocument();
24
- });
25
-
26
- test('applies custom className', () => {
27
- const { container } = render(ChatInvitationNotice, {
28
- props: { performerName: 'Test', className: 'my-notice' }
29
- });
30
- expect(container.querySelector('.my-notice')).toBeInTheDocument();
31
- });
32
- });
1
+ import { render, screen } from '@testing-library/svelte';
2
+ import { expect, describe, test } from 'vitest';
3
+ import ChatInvitationNotice from './ChatInvitationNotice.svelte';
4
+
5
+ describe('ChatInvitationNotice', () => {
6
+ test('renders performer name', () => {
7
+ render(ChatInvitationNotice, { props: { performerName: 'Alice' } });
8
+ expect(screen.getByText(/Invited Alice/i)).toBeInTheDocument();
9
+ });
10
+
11
+ test('has blue text color', () => {
12
+ const { container } = render(ChatInvitationNotice, { props: { performerName: 'Bob' } });
13
+ expect(container.querySelector('[class*="blue"]')).toBeInTheDocument();
14
+ });
15
+
16
+ test('renders icon', () => {
17
+ const { container } = render(ChatInvitationNotice, { props: { performerName: 'Test' } });
18
+ expect(container.querySelector('svg')).toBeInTheDocument();
19
+ });
20
+
21
+ test('has inline flex layout', () => {
22
+ const { container } = render(ChatInvitationNotice, { props: { performerName: 'Test' } });
23
+ expect(container.querySelector('.inline-flex, .flex')).toBeInTheDocument();
24
+ });
25
+
26
+ test('applies custom className', () => {
27
+ const { container } = render(ChatInvitationNotice, {
28
+ props: { performerName: 'Test', className: 'my-notice' }
29
+ });
30
+ expect(container.querySelector('.my-notice')).toBeInTheDocument();
31
+ });
32
+ });
@@ -1,27 +1,36 @@
1
- <script lang="ts">
2
- /**
3
- * ChatInvitationNotice - Inline invitation notice
4
- *
5
- * Shows "Invited {performerName}" with icon for activity notices.
6
- * Smaller/subtler than ChatInvitationBubble.
7
- */
8
- import { classNames } from '../../utils/utils.js';
9
- import SendAltFilled from 'carbon-icons-svelte/lib/SendAltFilled.svelte';
10
-
11
- interface Props {
12
- /** Name of the performer who was invited */
13
- performerName: string;
14
- /** Additional CSS classes */
15
- className?: string;
16
- }
17
-
18
- let {
19
- performerName,
20
- className = '',
21
- }: Props = $props();
22
- </script>
23
-
24
- <span class={classNames('text-xs font-medium text-blue-600 flex items-center gap-1', className)}>
25
- <SendAltFilled class="w-3 h-3" />
26
- Invited {performerName}
27
- </span>
1
+ <script lang="ts">
2
+ /**
3
+ * ChatInvitationNotice - Inline invitation notice
4
+ *
5
+ * Shows "Invited {performerName}" with icon for activity notices.
6
+ * Smaller/subtler than ChatInvitationBubble.
7
+ */
8
+ import { classNames } from '../../utils/utils.js';
9
+ import SendAltFilled from 'carbon-icons-svelte/lib/SendAltFilled.svelte';
10
+
11
+ const defaultLabels = {
12
+ invited: (name: string) => `Invited ${name}`,
13
+ };
14
+
15
+ interface Props {
16
+ /** Name of the performer who was invited */
17
+ performerName: string;
18
+ /** Additional CSS classes */
19
+ className?: string;
20
+ /** Override user-visible strings */
21
+ labels?: Partial<typeof defaultLabels>;
22
+ }
23
+
24
+ let {
25
+ performerName,
26
+ className = '',
27
+ labels: userLabels = {},
28
+ }: Props = $props();
29
+
30
+ let labels = $derived({ ...defaultLabels, ...userLabels });
31
+ </script>
32
+
33
+ <span class={classNames('text-xs font-medium text-blue-600 flex items-center gap-1', className)}>
34
+ <SendAltFilled class="w-3 h-3" />
35
+ {typeof labels.invited === 'function' ? labels.invited(performerName) : labels.invited}
36
+ </span>
@@ -1,10 +1,13 @@
1
- interface Props {
1
+ declare const ChatInvitationNotice: import("svelte").Component<{
2
2
  /** Name of the performer who was invited */
3
3
  performerName: string;
4
4
  /** Additional CSS classes */
5
5
  className?: string;
6
- }
7
- declare const ChatInvitationNotice: import("svelte").Component<Props, {}, "">;
6
+ /** Override user-visible strings */
7
+ labels?: Partial<{
8
+ invited: (name: string) => string;
9
+ }>;
10
+ }, {}, "">;
8
11
  type ChatInvitationNotice = ReturnType<typeof ChatInvitationNotice>;
9
12
  export default ChatInvitationNotice;
10
13
  //# sourceMappingURL=ChatInvitationNotice.svelte.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ChatInvitationNotice.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/patterns/chat/ChatInvitationNotice.svelte.ts"],"names":[],"mappings":"AAaE,UAAU,KAAK;IACb,4CAA4C;IAC5C,aAAa,EAAE,MAAM,CAAC;IACtB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAoBH,QAAA,MAAM,oBAAoB,2CAAwC,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}
1
+ {"version":3,"file":"ChatInvitationNotice.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/patterns/chat/ChatInvitationNotice.svelte.ts"],"names":[],"mappings":"AA8CA,QAAA,MAAM,oBAAoB;IAxBtB,4CAA4C;mBAC7B,MAAM;IACrB,6BAA6B;gBACjB,MAAM;IAClB,oCAAoC;aAC3B,OAAO;wBATA,MAAM;MASgB;UAmBwB,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}