@getmicdrop/svelte-components 5.8.0 → 5.8.2

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 (243) hide show
  1. package/dist/calendar/AboutShow/AboutShow.svelte +172 -172
  2. package/dist/calendar/Calendar/MiniMonthCalendar.svelte +782 -782
  3. package/dist/calendar/FAQs/FAQs.svelte +75 -75
  4. package/dist/calendar/MonthSwitcher/MonthSwitcher.svelte +126 -126
  5. package/dist/calendar/OrderSummary/OrderSummary.svelte +367 -367
  6. package/dist/calendar/PublicCard/PublicCard.svelte +134 -134
  7. package/dist/calendar/ShowCard/ShowCard.svelte +157 -157
  8. package/dist/calendar/ShowTimeCard/ShowTimeCard.svelte +61 -61
  9. package/dist/components/Heading.svelte +60 -58
  10. package/dist/components/Heading.svelte.d.ts +1 -0
  11. package/dist/components/Heading.svelte.d.ts.map +1 -1
  12. package/dist/components/Layout/AppShell.svelte +104 -104
  13. package/dist/components/Layout/ContentSection.svelte +80 -80
  14. package/dist/components/Layout/Grid.svelte +4 -4
  15. package/dist/components/Layout/Heading.svelte +81 -81
  16. package/dist/components/Layout/PageContainer.svelte +69 -69
  17. package/dist/components/Layout/Responsive.svelte +75 -75
  18. package/dist/components/Layout/Section.svelte +80 -80
  19. package/dist/components/Layout/ShowOnDesktop.svelte +37 -37
  20. package/dist/components/Layout/ShowOnMobile.svelte +37 -37
  21. package/dist/components/Layout/Sidebar.svelte +108 -108
  22. package/dist/components/Layout/Stack.spec.js +1 -1
  23. package/dist/components/Layout/Stack.svelte +6 -6
  24. package/dist/components/Layout/Text.svelte +87 -87
  25. package/dist/components/Layout/TwoColumn.svelte +108 -108
  26. package/dist/components/Text.svelte +53 -53
  27. package/dist/constants/validation.js +91 -91
  28. package/dist/constants/validation.spec.js +64 -64
  29. package/dist/datetime/__tests__/format.test.js +1 -1
  30. package/dist/datetime/__tests__/parse.test.js +1 -1
  31. package/dist/datetime/__tests__/timezone.test.js +1 -1
  32. package/dist/datetime/parse.js +1 -1
  33. package/dist/forms/createFormStore.svelte.js +1 -0
  34. package/dist/index.js +50 -50
  35. package/dist/patterns/data/DataGrid.svelte +45 -45
  36. package/dist/patterns/data/DataList.svelte +24 -24
  37. package/dist/patterns/data/DataTable.svelte +36 -36
  38. package/dist/patterns/forms/FormActions.spec.js +95 -95
  39. package/dist/patterns/forms/FormActions.stories.svelte +97 -97
  40. package/dist/patterns/forms/FormActions.svelte +46 -46
  41. package/dist/patterns/forms/FormGrid.svelte +33 -33
  42. package/dist/patterns/forms/FormSection.svelte +32 -32
  43. package/dist/patterns/forms/FormValidationSummary.stories.svelte +83 -83
  44. package/dist/patterns/forms/FormValidationSummary.svelte +74 -74
  45. package/dist/patterns/layout/Sidebar.svelte +39 -39
  46. package/dist/patterns/layout/index.js +29 -29
  47. package/dist/patterns/navigation/BottomNav.stories.svelte +117 -117
  48. package/dist/patterns/navigation/BottomNav.svelte +74 -74
  49. package/dist/patterns/navigation/Header.stories.svelte +77 -77
  50. package/dist/patterns/navigation/Header.svelte +193 -193
  51. package/dist/patterns/page/PageHeader.svelte +18 -18
  52. package/dist/patterns/page/PageLayout.svelte +40 -40
  53. package/dist/patterns/page/PageLoader.spec.js +57 -57
  54. package/dist/patterns/page/PageLoader.stories.svelte +137 -137
  55. package/dist/patterns/page/PageLoader.svelte +24 -24
  56. package/dist/patterns/page/SectionHeader.svelte +29 -29
  57. package/dist/presets/badges.js +112 -112
  58. package/dist/presets/buttons.js +76 -76
  59. package/dist/presets/index.js +9 -9
  60. package/dist/primitives/Accordion/Accordion.stories.svelte +75 -75
  61. package/dist/primitives/Accordion/Accordion.svelte +42 -42
  62. package/dist/primitives/Accordion/AccordionItem.svelte +95 -95
  63. package/dist/primitives/Alert/Alert.spec.js +173 -173
  64. package/dist/primitives/Alert/Alert.stories.svelte +88 -88
  65. package/dist/primitives/Alert/Alert.svelte +27 -27
  66. package/dist/primitives/Avatar/Avatar.stories.svelte +94 -94
  67. package/dist/primitives/Avatar/Avatar.svelte +66 -66
  68. package/dist/primitives/Badges/Badge.spec.js +144 -144
  69. package/dist/primitives/Badges/Badge.stories.svelte +86 -86
  70. package/dist/primitives/Badges/Badge.svelte +79 -79
  71. package/dist/primitives/BottomSheet/BottomSheet.spec.js +136 -136
  72. package/dist/primitives/BottomSheet/BottomSheet.stories.svelte +83 -83
  73. package/dist/primitives/BottomSheet/BottomSheet.svelte +100 -100
  74. package/dist/primitives/Breadcrumb/Breadcrumb.spec.js +122 -122
  75. package/dist/primitives/Breadcrumb/Breadcrumb.stories.svelte +23 -23
  76. package/dist/primitives/Breadcrumb/Breadcrumb.svelte +89 -89
  77. package/dist/primitives/Button/Button.spec.js +223 -223
  78. package/dist/primitives/Button/Button.stories.svelte +76 -76
  79. package/dist/primitives/Button/Button.svelte +270 -270
  80. package/dist/primitives/Button/ButtonSaveDemo.spec.js +146 -146
  81. package/dist/primitives/Button/ButtonSaveDemo.svelte +25 -25
  82. package/dist/primitives/Button/ButtonVariantShowcase.svelte +129 -129
  83. package/dist/primitives/Card.spec.js +49 -49
  84. package/dist/primitives/Card.stories.svelte +22 -22
  85. package/dist/primitives/Card.svelte +28 -28
  86. package/dist/primitives/Checkbox/Checkbox.stories.svelte +84 -84
  87. package/dist/primitives/Checkbox/Checkbox.svelte +88 -88
  88. package/dist/primitives/DarkModeToggle.spec.js +390 -390
  89. package/dist/primitives/DarkModeToggle.stories.svelte +57 -57
  90. package/dist/primitives/DarkModeToggle.svelte +136 -136
  91. package/dist/primitives/Drawer/Drawer.stories.svelte +80 -80
  92. package/dist/primitives/Drawer/Drawer.svelte +120 -120
  93. package/dist/primitives/Dropdown/Dropdown.stories.svelte +137 -137
  94. package/dist/primitives/Dropdown/Dropdown.svelte +14 -14
  95. package/dist/primitives/Dropdown/DropdownDivider.svelte +9 -9
  96. package/dist/primitives/Dropdown/DropdownItem.svelte +80 -80
  97. package/dist/primitives/Helper/Helper.svelte +33 -33
  98. package/dist/primitives/Icons/ArrowLeft.svelte +8 -8
  99. package/dist/primitives/Icons/ArrowRight.svelte +8 -8
  100. package/dist/primitives/Icons/Availability.svelte +14 -14
  101. package/dist/primitives/Icons/Back.svelte +14 -14
  102. package/dist/primitives/Icons/CheckCircle.svelte +6 -6
  103. package/dist/primitives/Icons/CheckCircleOutline.svelte +15 -15
  104. package/dist/primitives/Icons/ChevronLeft.svelte +4 -4
  105. package/dist/primitives/Icons/ChevronRight.svelte +4 -4
  106. package/dist/primitives/Icons/Copy.svelte +15 -15
  107. package/dist/primitives/Icons/Cross.svelte +5 -5
  108. package/dist/primitives/Icons/DownArrow.svelte +8 -8
  109. package/dist/primitives/Icons/ErrorCircle.svelte +6 -6
  110. package/dist/primitives/Icons/FacebookIcon.svelte +2 -2
  111. package/dist/primitives/Icons/Home.svelte +15 -15
  112. package/dist/primitives/Icons/Icon.spec.js +169 -169
  113. package/dist/primitives/Icons/Icon.stories.svelte +100 -100
  114. package/dist/primitives/Icons/Icon.svelte +52 -52
  115. package/dist/primitives/Icons/IconGallery.stories.svelte +235 -235
  116. package/dist/primitives/Icons/Info.svelte +7 -7
  117. package/dist/primitives/Icons/InstagramIcon.svelte +4 -4
  118. package/dist/primitives/Icons/LogoInstagram.svelte +2 -2
  119. package/dist/primitives/Icons/Message.svelte +15 -15
  120. package/dist/primitives/Icons/MoonIcon.svelte +5 -5
  121. package/dist/primitives/Icons/More.svelte +21 -21
  122. package/dist/primitives/Icons/MoreHori.spec.js +61 -61
  123. package/dist/primitives/Icons/MoreHori.svelte +22 -22
  124. package/dist/primitives/Icons/Notification.svelte +14 -14
  125. package/dist/primitives/Icons/Payment.svelte +14 -14
  126. package/dist/primitives/Icons/Profile.svelte +21 -21
  127. package/dist/primitives/Icons/Reload.svelte +29 -29
  128. package/dist/primitives/Icons/Shows.svelte +21 -21
  129. package/dist/primitives/Icons/Signout.svelte +21 -21
  130. package/dist/primitives/Icons/SunIcon.svelte +8 -8
  131. package/dist/primitives/Icons/TiktokIcon.svelte +2 -2
  132. package/dist/primitives/Icons/TwitterIcon.svelte +2 -2
  133. package/dist/primitives/Icons/WarningIcon.spec.js +18 -18
  134. package/dist/primitives/Icons/WarningIcon.svelte +5 -5
  135. package/dist/primitives/Input/Input.spec.js +573 -573
  136. package/dist/primitives/Input/Input.stories.svelte +139 -139
  137. package/dist/primitives/Input/Select.spec.js +212 -212
  138. package/dist/primitives/Input/Select.stories.svelte +112 -112
  139. package/dist/primitives/Input/Select.svelte +128 -128
  140. package/dist/primitives/Input/Textarea.stories.svelte +137 -137
  141. package/dist/primitives/Input/Textarea.svelte +35 -35
  142. package/dist/primitives/Label/Label.svelte +37 -37
  143. package/dist/primitives/Modal/Modal.spec.js +99 -99
  144. package/dist/primitives/Modal/Modal.stories.svelte +86 -86
  145. package/dist/primitives/Pagination/Pagination.stories.svelte +76 -76
  146. package/dist/primitives/Pagination/Pagination.svelte +261 -261
  147. package/dist/primitives/Radio/Radio.stories.svelte +80 -80
  148. package/dist/primitives/Radio/Radio.svelte +67 -67
  149. package/dist/primitives/Skeleton/CardPlaceholder.svelte +87 -87
  150. package/dist/primitives/Skeleton/ImagePlaceholder.svelte +59 -59
  151. package/dist/primitives/Skeleton/ListPlaceholder.svelte +76 -76
  152. package/dist/primitives/Skeleton/Skeleton.stories.svelte +151 -151
  153. package/dist/primitives/Skeleton/Skeleton.svelte +26 -26
  154. package/dist/primitives/Spinner/Spinner.spec.js +71 -71
  155. package/dist/primitives/Spinner/Spinner.stories.svelte +29 -29
  156. package/dist/primitives/Spinner/Spinner.svelte +20 -20
  157. package/dist/primitives/Tabs/TabItem.svelte +49 -49
  158. package/dist/primitives/Tabs/Tabs.stories.svelte +112 -112
  159. package/dist/primitives/Tabs/Tabs.svelte +123 -123
  160. package/dist/primitives/Toggle.spec.js +143 -143
  161. package/dist/primitives/Toggle.stories.svelte +92 -92
  162. package/dist/primitives/Tooltip/Tooltip.svelte +83 -83
  163. package/dist/primitives/Typography/Typography.svelte +53 -53
  164. package/dist/primitives/ValidationError.spec.js +103 -103
  165. package/dist/primitives/ValidationError.stories.svelte +69 -69
  166. package/dist/primitives/ValidationError.svelte +29 -29
  167. package/dist/primitives/index.js +91 -91
  168. package/dist/recipes/CropImage/CropImage.spec.js +208 -208
  169. package/dist/recipes/CropImage/CropImage.stories.svelte +104 -104
  170. package/dist/recipes/CropImage/CropImage.svelte +238 -238
  171. package/dist/recipes/ImageUploader/ImageUploader.stories.svelte +125 -125
  172. package/dist/recipes/ImageUploader/ImageUploader.svelte +804 -804
  173. package/dist/recipes/Toaster/Toaster.stories.svelte +62 -62
  174. package/dist/recipes/feedback/EmptyState/EmptyState.svelte +1 -1
  175. package/dist/recipes/feedback/ErrorDisplay.spec.js +69 -69
  176. package/dist/recipes/feedback/ErrorDisplay.stories.svelte +101 -101
  177. package/dist/recipes/feedback/ErrorDisplay.svelte +1 -1
  178. package/dist/recipes/feedback/StatusIndicator/StatusIndicator.spec.js +133 -133
  179. package/dist/recipes/feedback/StatusIndicator/StatusIndicator.svelte +157 -157
  180. package/dist/recipes/fields/CheckboxField.svelte +85 -85
  181. package/dist/recipes/fields/FormField.svelte +58 -58
  182. package/dist/recipes/fields/RadioGroup.svelte +95 -95
  183. package/dist/recipes/fields/SelectField.svelte +80 -80
  184. package/dist/recipes/fields/TextareaField.svelte +97 -97
  185. package/dist/recipes/fields/ToggleField.svelte +60 -60
  186. package/dist/recipes/fields/index.js +7 -7
  187. package/dist/recipes/inputs/MultiSelect.spec.js +258 -258
  188. package/dist/recipes/inputs/MultiSelect.stories.svelte +133 -133
  189. package/dist/recipes/inputs/OTPInput.spec.js +251 -251
  190. package/dist/recipes/inputs/OTPInput.stories.svelte +162 -162
  191. package/dist/recipes/inputs/OTPInput.svelte +29 -29
  192. package/dist/recipes/inputs/PasswordInput.svelte +22 -22
  193. package/dist/recipes/inputs/PasswordStrengthIndicator/PasswordStrengthIndicator.svelte +117 -117
  194. package/dist/recipes/inputs/PlaceAutocomplete/PlaceAutocomplete.stories.svelte +123 -123
  195. package/dist/recipes/inputs/Search.svelte +37 -37
  196. package/dist/recipes/inputs/SelectDropdown.svelte +57 -57
  197. package/dist/recipes/modals/AlertModal.svelte +130 -130
  198. package/dist/recipes/modals/ConfirmationModal.spec.js +206 -206
  199. package/dist/recipes/modals/ConfirmationModal.stories.svelte +119 -119
  200. package/dist/recipes/modals/ConfirmationModal.svelte +152 -152
  201. package/dist/recipes/modals/InputModal.svelte +182 -182
  202. package/dist/recipes/modals/ModalStateManager.spec.js +100 -100
  203. package/dist/recipes/modals/ModalStateManager.svelte +77 -77
  204. package/dist/recipes/modals/ModalTestWrapper.svelte +65 -65
  205. package/dist/recipes/modals/StatusModal.svelte +206 -206
  206. package/dist/services/EventService.js +75 -75
  207. package/dist/services/EventService.spec.js +217 -217
  208. package/dist/services/ShowService.spec.js +345 -345
  209. package/dist/stores/index.d.ts +4 -4
  210. package/dist/stores/index.js +6 -7
  211. package/dist/stores/toaster.js +13 -13
  212. package/dist/stories/ButtonAuditReview.stories.svelte +14 -14
  213. package/dist/stories/ButtonAuditReview.svelte +427 -427
  214. package/dist/stories/PatternsGallery.stories.svelte +19 -19
  215. package/dist/stories/PatternsGallery.svelte +206 -206
  216. package/dist/stories/PrimitivesGallery.stories.svelte +19 -19
  217. package/dist/stories/PrimitivesGallery.svelte +725 -725
  218. package/dist/stories/RecipesGallery.stories.svelte +19 -19
  219. package/dist/stories/RecipesGallery.svelte +271 -271
  220. package/dist/stories/button-audit-manifest.json +11186 -11186
  221. package/dist/tailwind/preset.cjs +82 -82
  222. package/dist/telemetry.js +405 -405
  223. package/dist/telemetry.spec.js +1169 -1169
  224. package/dist/tokens/tokens.css +87 -87
  225. package/dist/tokens/typography-base.css +163 -163
  226. package/dist/tokens/utilities.css +353 -0
  227. package/dist/utils/apiConfig.spec.js +219 -219
  228. package/dist/utils/transitions.js +62 -62
  229. package/dist/utils/utils.js +354 -354
  230. package/package.json +296 -295
  231. package/dist/stores/auth.js +0 -44
  232. package/dist/stores/createFormStore.d.ts +0 -77
  233. package/dist/stores/createFormStore.d.ts.map +0 -1
  234. package/dist/stores/createFormStore.js +0 -410
  235. package/dist/stores/formDataStore.d.ts +0 -17
  236. package/dist/stores/formDataStore.d.ts.map +0 -1
  237. package/dist/stores/formDataStore.js +0 -33
  238. package/dist/stores/formSave.d.ts +0 -24
  239. package/dist/stores/formSave.d.ts.map +0 -1
  240. package/dist/stores/formSave.js +0 -140
  241. package/dist/stores/navigation.d.ts +0 -5
  242. package/dist/stores/navigation.d.ts.map +0 -1
  243. package/dist/stores/navigation.js +0 -20
@@ -1,108 +1,108 @@
1
- <script lang="ts">
2
- import type { Snippet } from 'svelte';
3
-
4
- type Gap = 'none' | 'sm' | 'md' | 'lg' | 'xl';
5
- type Ratio = 'equal' | '1:2' | '2:1' | '1:3' | '3:1';
6
- type StackAt = 'sm' | 'md' | 'lg' | 'never';
7
-
8
- interface Props {
9
- /** Gap between columns */
10
- gap?: Gap;
11
- /** Column ratio */
12
- ratio?: Ratio;
13
- /** Breakpoint at which columns stack vertically */
14
- stackAt?: StackAt;
15
- /** Reverse order when stacked */
16
- reverseOnStack?: boolean;
17
- /** Vertical alignment */
18
- align?: 'start' | 'center' | 'end' | 'stretch';
19
- /** Additional CSS classes */
20
- class?: string;
21
- /** Left column content */
22
- left?: Snippet;
23
- /** Right column content */
24
- right?: Snippet;
25
- /** Children (alternative to left/right slots) */
26
- children?: Snippet;
27
- }
28
-
29
- let {
30
- gap = 'md',
31
- ratio = 'equal',
32
- stackAt = 'md',
33
- reverseOnStack = false,
34
- align = 'stretch',
35
- class: className = '',
36
- left,
37
- right,
38
- children,
39
- }: Props = $props();
40
-
41
- const gapClasses: Record<Gap, string> = {
42
- none: 'gap-0',
43
- sm: 'gap-2',
44
- md: 'gap-4',
45
- lg: 'gap-6',
46
- xl: 'gap-8',
47
- };
48
-
49
- // Stack classes: normal and reversed versions
50
- const stackAtClasses: Record<StackAt, string> = {
51
- sm: 'flex-col sm:flex-row',
52
- md: 'flex-col md:flex-row',
53
- lg: 'flex-col lg:flex-row',
54
- never: 'flex-row',
55
- };
56
-
57
- const stackAtReversedClasses: Record<StackAt, string> = {
58
- sm: 'flex-col-reverse sm:flex-row',
59
- md: 'flex-col-reverse md:flex-row',
60
- lg: 'flex-col-reverse lg:flex-row',
61
- never: 'flex-row',
62
- };
63
-
64
- const alignClasses: Record<string, string> = {
65
- start: 'items-start',
66
- center: 'items-center',
67
- end: 'items-end',
68
- stretch: 'items-stretch',
69
- };
70
-
71
- // Ratio classes for each column
72
- const ratioLeftClasses: Record<Ratio, string> = {
73
- equal: 'flex-1',
74
- '1:2': 'w-full md:w-1/3',
75
- '2:1': 'w-full md:w-2/3',
76
- '1:3': 'w-full md:w-1/4',
77
- '3:1': 'w-full md:w-3/4',
78
- };
79
-
80
- const ratioRightClasses: Record<Ratio, string> = {
81
- equal: 'flex-1',
82
- '1:2': 'w-full md:w-2/3',
83
- '2:1': 'w-full md:w-1/3',
84
- '1:3': 'w-full md:w-3/4',
85
- '3:1': 'w-full md:w-1/4',
86
- };
87
-
88
- let containerClasses = $derived([
89
- 'flex',
90
- reverseOnStack ? stackAtReversedClasses[stackAt] : stackAtClasses[stackAt],
91
- gapClasses[gap],
92
- alignClasses[align],
93
- className,
94
- ].filter(Boolean).join(' '));
95
- </script>
96
-
97
- <div class={containerClasses}>
98
- {#if left && right}
99
- <div class={ratioLeftClasses[ratio]}>
100
- {@render left()}
101
- </div>
102
- <div class={ratioRightClasses[ratio]}>
103
- {@render right()}
104
- </div>
105
- {:else if children}
106
- {@render children()}
107
- {/if}
108
- </div>
1
+ <script lang="ts">
2
+ import type { Snippet } from 'svelte';
3
+
4
+ type Gap = 'none' | 'sm' | 'md' | 'lg' | 'xl';
5
+ type Ratio = 'equal' | '1:2' | '2:1' | '1:3' | '3:1';
6
+ type StackAt = 'sm' | 'md' | 'lg' | 'never';
7
+
8
+ interface Props {
9
+ /** Gap between columns */
10
+ gap?: Gap;
11
+ /** Column ratio */
12
+ ratio?: Ratio;
13
+ /** Breakpoint at which columns stack vertically */
14
+ stackAt?: StackAt;
15
+ /** Reverse order when stacked */
16
+ reverseOnStack?: boolean;
17
+ /** Vertical alignment */
18
+ align?: 'start' | 'center' | 'end' | 'stretch';
19
+ /** Additional CSS classes */
20
+ class?: string;
21
+ /** Left column content */
22
+ left?: Snippet;
23
+ /** Right column content */
24
+ right?: Snippet;
25
+ /** Children (alternative to left/right slots) */
26
+ children?: Snippet;
27
+ }
28
+
29
+ let {
30
+ gap = 'md',
31
+ ratio = 'equal',
32
+ stackAt = 'md',
33
+ reverseOnStack = false,
34
+ align = 'stretch',
35
+ class: className = '',
36
+ left,
37
+ right,
38
+ children,
39
+ }: Props = $props();
40
+
41
+ const gapClasses: Record<Gap, string> = {
42
+ none: 'gap-0',
43
+ sm: 'gap-2',
44
+ md: 'gap-4',
45
+ lg: 'gap-6',
46
+ xl: 'gap-8',
47
+ };
48
+
49
+ // Stack classes: normal and reversed versions
50
+ const stackAtClasses: Record<StackAt, string> = {
51
+ sm: 'flex-col sm:flex-row',
52
+ md: 'flex-col md:flex-row',
53
+ lg: 'flex-col lg:flex-row',
54
+ never: 'flex-row',
55
+ };
56
+
57
+ const stackAtReversedClasses: Record<StackAt, string> = {
58
+ sm: 'flex-col-reverse sm:flex-row',
59
+ md: 'flex-col-reverse md:flex-row',
60
+ lg: 'flex-col-reverse lg:flex-row',
61
+ never: 'flex-row',
62
+ };
63
+
64
+ const alignClasses: Record<string, string> = {
65
+ start: 'items-start',
66
+ center: 'items-center',
67
+ end: 'items-end',
68
+ stretch: 'items-stretch',
69
+ };
70
+
71
+ // Ratio classes for each column
72
+ const ratioLeftClasses: Record<Ratio, string> = {
73
+ equal: 'flex-1',
74
+ '1:2': 'w-full md:w-1/3',
75
+ '2:1': 'w-full md:w-2/3',
76
+ '1:3': 'w-full md:w-1/4',
77
+ '3:1': 'w-full md:w-3/4',
78
+ };
79
+
80
+ const ratioRightClasses: Record<Ratio, string> = {
81
+ equal: 'flex-1',
82
+ '1:2': 'w-full md:w-2/3',
83
+ '2:1': 'w-full md:w-1/3',
84
+ '1:3': 'w-full md:w-3/4',
85
+ '3:1': 'w-full md:w-1/4',
86
+ };
87
+
88
+ let containerClasses = $derived([
89
+ 'flex',
90
+ reverseOnStack ? stackAtReversedClasses[stackAt] : stackAtClasses[stackAt],
91
+ gapClasses[gap],
92
+ alignClasses[align],
93
+ className,
94
+ ].filter(Boolean).join(' '));
95
+ </script>
96
+
97
+ <div class={containerClasses}>
98
+ {#if left && right}
99
+ <div class={ratioLeftClasses[ratio]}>
100
+ {@render left()}
101
+ </div>
102
+ <div class={ratioRightClasses[ratio]}>
103
+ {@render right()}
104
+ </div>
105
+ {:else if children}
106
+ {@render children()}
107
+ {/if}
108
+ </div>
@@ -1,53 +1,53 @@
1
- <script lang="ts">
2
- import type { Snippet } from 'svelte';
3
-
4
- interface Props {
5
- size?: 'xs' | 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl';
6
- leading?: 'none' | 'tight' | 'snug' | 'normal' | 'relaxed' | 'loose';
7
- color?: 'default' | 'muted' | 'primary' | 'secondary' | 'success' | 'warning' | 'error';
8
- class?: string;
9
- children: Snippet;
10
- }
11
-
12
- let {
13
- size = 'md',
14
- leading,
15
- color = 'default',
16
- class: className = '',
17
- children,
18
- }: Props = $props();
19
-
20
- const sizeClasses: Record<string, string> = {
21
- xs: 'text-xs',
22
- sm: 'text-sm',
23
- base: 'text-base',
24
- md: 'text-base',
25
- lg: 'text-lg',
26
- xl: 'text-xl',
27
- '2xl': 'text-2xl',
28
- };
29
-
30
- const colorClasses: Record<string, string> = {
31
- default: 'text-gray-900 dark:text-gray-100',
32
- muted: 'text-gray-500 dark:text-gray-400',
33
- primary: 'text-primary-600 dark:text-primary-400',
34
- secondary: 'text-gray-600 dark:text-gray-300',
35
- success: 'text-green-600 dark:text-green-400',
36
- warning: 'text-yellow-600 dark:text-yellow-400',
37
- error: 'text-red-600 dark:text-red-400',
38
- };
39
-
40
- const leadingClasses: Record<string, string> = {
41
- none: 'leading-none',
42
- tight: 'leading-tight',
43
- snug: 'leading-snug',
44
- normal: 'leading-normal',
45
- relaxed: 'leading-relaxed',
46
- loose: 'leading-loose',
47
- };
48
-
49
- const leadingClass = leading ? leadingClasses[leading] : '';
50
- const classes = `${sizeClasses[size] || 'text-base'} ${leadingClass} ${colorClasses[color] || ''} ${className}`.trim();
51
- </script>
52
-
53
- <span class={classes}>{@render children()}</span>
1
+ <script lang="ts">
2
+ import type { Snippet } from 'svelte';
3
+
4
+ interface Props {
5
+ size?: 'xs' | 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl';
6
+ leading?: 'none' | 'tight' | 'snug' | 'normal' | 'relaxed' | 'loose';
7
+ color?: 'default' | 'muted' | 'primary' | 'secondary' | 'success' | 'warning' | 'error';
8
+ class?: string;
9
+ children: Snippet;
10
+ }
11
+
12
+ let {
13
+ size = 'md',
14
+ leading,
15
+ color = 'default',
16
+ class: className = '',
17
+ children,
18
+ }: Props = $props();
19
+
20
+ const sizeClasses: Record<string, string> = {
21
+ xs: 'text-xs',
22
+ sm: 'text-sm',
23
+ base: 'text-base',
24
+ md: 'text-base',
25
+ lg: 'text-lg',
26
+ xl: 'text-xl',
27
+ '2xl': 'text-2xl',
28
+ };
29
+
30
+ const colorClasses: Record<string, string> = {
31
+ default: 'text-gray-900 dark:text-gray-100',
32
+ muted: 'text-gray-500 dark:text-gray-400',
33
+ primary: 'text-primary-600 dark:text-primary-400',
34
+ secondary: 'text-gray-600 dark:text-gray-300',
35
+ success: 'text-green-600 dark:text-green-400',
36
+ warning: 'text-yellow-600 dark:text-yellow-400',
37
+ error: 'text-red-600 dark:text-red-400',
38
+ };
39
+
40
+ const leadingClasses: Record<string, string> = {
41
+ none: 'leading-none',
42
+ tight: 'leading-tight',
43
+ snug: 'leading-snug',
44
+ normal: 'leading-normal',
45
+ relaxed: 'leading-relaxed',
46
+ loose: 'leading-loose',
47
+ };
48
+
49
+ const leadingClass = leading ? leadingClasses[leading] : '';
50
+ const classes = `${sizeClasses[size] || 'text-base'} ${leadingClass} ${colorClasses[color] || ''} ${className}`.trim();
51
+ </script>
52
+
53
+ <span class={classes}>{@render children()}</span>
@@ -1,91 +1,91 @@
1
- /**
2
- * Validation Constants
3
- *
4
- * Shared validation rules and defaults for event, ticket, and promo code validation.
5
- * Used by micdrop-frontend, venue-calendar-npm, and other apps.
6
- *
7
- * @example
8
- * import { MIN_EVENT_DURATION_MINS, DEFAULT_EVENT_DURATION_MINS } from '@getmicdrop/svelte-components';
9
- */
10
-
11
- // ============================================================================
12
- // Event Time Constants
13
- // ============================================================================
14
-
15
- /** Minimum event duration in minutes (validation constraint) */
16
- export const MIN_EVENT_DURATION_MINS = 15;
17
-
18
- /** Maximum event duration in minutes (24 hours) */
19
- export const MAX_EVENT_DURATION_MINS = 1440;
20
-
21
- /** Default event duration in minutes (used when auto-filling end time) */
22
- export const DEFAULT_EVENT_DURATION_MINS = 90;
23
-
24
- /** Default time doors open before event start in minutes (used when auto-filling) */
25
- export const DEFAULT_DOORS_BEFORE_START_MINS = 30;
26
-
27
- // ============================================================================
28
- // Ticket Constants
29
- // ============================================================================
30
-
31
- /** Maximum tickets per order limit */
32
- export const MAX_TICKETS_PER_ORDER = 100;
33
-
34
- /** Minimum tickets per order limit */
35
- export const MIN_TICKETS_PER_ORDER = 0;
36
-
37
- // ============================================================================
38
- // Promo Code Constants
39
- // ============================================================================
40
-
41
- /** Maximum percentage discount */
42
- export const MAX_PERCENTAGE_DISCOUNT = 100;
43
-
44
- // ============================================================================
45
- // Error Codes
46
- // ============================================================================
47
-
48
- export const ErrorCodes = {
49
- // Event errors
50
- EVENT_DURATION_TOO_SHORT: 'EVENT_DURATION_TOO_SHORT',
51
- EVENT_DURATION_TOO_LONG: 'EVENT_DURATION_TOO_LONG',
52
- EVENT_END_BEFORE_START: 'EVENT_END_BEFORE_START',
53
- EVENT_DOORS_SAME_AS_START: 'EVENT_DOORS_SAME_AS_START',
54
- EVENT_DOORS_TOO_CLOSE: 'EVENT_DOORS_TOO_CLOSE',
55
- EVENT_INVALID_TIME_FORMAT: 'EVENT_INVALID_TIME_FORMAT',
56
-
57
- // Price/quantity errors
58
- PRICE_REQUIRED: 'PRICE_REQUIRED',
59
- PRICE_MUST_BE_POSITIVE: 'PRICE_MUST_BE_POSITIVE',
60
- PRICE_INVALID_FORMAT: 'PRICE_INVALID_FORMAT',
61
- QUANTITY_REQUIRED: 'QUANTITY_REQUIRED',
62
- QUANTITY_MUST_BE_POSITIVE: 'QUANTITY_MUST_BE_POSITIVE',
63
- QUANTITY_INVALID_FORMAT: 'QUANTITY_INVALID_FORMAT',
64
-
65
- // Ticket limit errors
66
- MIN_TICKETS_REQUIRED: 'MIN_TICKETS_REQUIRED',
67
- MIN_TICKETS_EXCEEDS_MAX_ALLOWED: 'MIN_TICKETS_EXCEEDS_MAX_ALLOWED',
68
- MAX_TICKETS_EXCEEDS_MAX_ALLOWED: 'MAX_TICKETS_EXCEEDS_MAX_ALLOWED',
69
- MIN_EXCEEDS_MAX: 'MIN_EXCEEDS_MAX',
70
-
71
- // Sales window errors
72
- SALES_BEGIN_AFTER_EVENT_END: 'SALES_BEGIN_AFTER_EVENT_END',
73
- SALES_END_AFTER_EVENT_END: 'SALES_END_AFTER_EVENT_END',
74
- SALES_END_BEFORE_BEGIN: 'SALES_END_BEFORE_BEGIN',
75
-
76
- // Capacity errors
77
- CAPACITY_EXCEEDED: 'CAPACITY_EXCEEDED',
78
-
79
- // Promo code errors
80
- PROMO_NAME_REQUIRED: 'PROMO_NAME_REQUIRED',
81
- PROMO_NAME_COLLISION: 'PROMO_NAME_COLLISION',
82
- PROMO_END_BEFORE_START: 'PROMO_END_BEFORE_START',
83
- PROMO_DISCOUNT_REQUIRED: 'PROMO_DISCOUNT_REQUIRED',
84
- PROMO_BOTH_DISCOUNT_TYPES: 'PROMO_BOTH_DISCOUNT_TYPES',
85
- PROMO_PERCENT_EXCEEDS_100: 'PROMO_PERCENT_EXCEEDS_100',
86
- PROMO_LIMIT_REQUIRED: 'PROMO_LIMIT_REQUIRED',
87
-
88
- // Warning codes
89
- PROMO_EXTENDS_PAST_EVENT: 'PROMO_EXTENDS_PAST_EVENT',
90
- SALES_CLOSE_TO_EVENT: 'SALES_CLOSE_TO_EVENT',
91
- };
1
+ /**
2
+ * Validation Constants
3
+ *
4
+ * Shared validation rules and defaults for event, ticket, and promo code validation.
5
+ * Used by micdrop-frontend, venue-calendar-npm, and other apps.
6
+ *
7
+ * @example
8
+ * import { MIN_EVENT_DURATION_MINS, DEFAULT_EVENT_DURATION_MINS } from '@getmicdrop/svelte-components';
9
+ */
10
+
11
+ // ============================================================================
12
+ // Event Time Constants
13
+ // ============================================================================
14
+
15
+ /** Minimum event duration in minutes (validation constraint) */
16
+ export const MIN_EVENT_DURATION_MINS = 15;
17
+
18
+ /** Maximum event duration in minutes (24 hours) */
19
+ export const MAX_EVENT_DURATION_MINS = 1440;
20
+
21
+ /** Default event duration in minutes (used when auto-filling end time) */
22
+ export const DEFAULT_EVENT_DURATION_MINS = 90;
23
+
24
+ /** Default time doors open before event start in minutes (used when auto-filling) */
25
+ export const DEFAULT_DOORS_BEFORE_START_MINS = 30;
26
+
27
+ // ============================================================================
28
+ // Ticket Constants
29
+ // ============================================================================
30
+
31
+ /** Maximum tickets per order limit */
32
+ export const MAX_TICKETS_PER_ORDER = 100;
33
+
34
+ /** Minimum tickets per order limit */
35
+ export const MIN_TICKETS_PER_ORDER = 0;
36
+
37
+ // ============================================================================
38
+ // Promo Code Constants
39
+ // ============================================================================
40
+
41
+ /** Maximum percentage discount */
42
+ export const MAX_PERCENTAGE_DISCOUNT = 100;
43
+
44
+ // ============================================================================
45
+ // Error Codes
46
+ // ============================================================================
47
+
48
+ export const ErrorCodes = {
49
+ // Event errors
50
+ EVENT_DURATION_TOO_SHORT: 'EVENT_DURATION_TOO_SHORT',
51
+ EVENT_DURATION_TOO_LONG: 'EVENT_DURATION_TOO_LONG',
52
+ EVENT_END_BEFORE_START: 'EVENT_END_BEFORE_START',
53
+ EVENT_DOORS_SAME_AS_START: 'EVENT_DOORS_SAME_AS_START',
54
+ EVENT_DOORS_TOO_CLOSE: 'EVENT_DOORS_TOO_CLOSE',
55
+ EVENT_INVALID_TIME_FORMAT: 'EVENT_INVALID_TIME_FORMAT',
56
+
57
+ // Price/quantity errors
58
+ PRICE_REQUIRED: 'PRICE_REQUIRED',
59
+ PRICE_MUST_BE_POSITIVE: 'PRICE_MUST_BE_POSITIVE',
60
+ PRICE_INVALID_FORMAT: 'PRICE_INVALID_FORMAT',
61
+ QUANTITY_REQUIRED: 'QUANTITY_REQUIRED',
62
+ QUANTITY_MUST_BE_POSITIVE: 'QUANTITY_MUST_BE_POSITIVE',
63
+ QUANTITY_INVALID_FORMAT: 'QUANTITY_INVALID_FORMAT',
64
+
65
+ // Ticket limit errors
66
+ MIN_TICKETS_REQUIRED: 'MIN_TICKETS_REQUIRED',
67
+ MIN_TICKETS_EXCEEDS_MAX_ALLOWED: 'MIN_TICKETS_EXCEEDS_MAX_ALLOWED',
68
+ MAX_TICKETS_EXCEEDS_MAX_ALLOWED: 'MAX_TICKETS_EXCEEDS_MAX_ALLOWED',
69
+ MIN_EXCEEDS_MAX: 'MIN_EXCEEDS_MAX',
70
+
71
+ // Sales window errors
72
+ SALES_BEGIN_AFTER_EVENT_END: 'SALES_BEGIN_AFTER_EVENT_END',
73
+ SALES_END_AFTER_EVENT_END: 'SALES_END_AFTER_EVENT_END',
74
+ SALES_END_BEFORE_BEGIN: 'SALES_END_BEFORE_BEGIN',
75
+
76
+ // Capacity errors
77
+ CAPACITY_EXCEEDED: 'CAPACITY_EXCEEDED',
78
+
79
+ // Promo code errors
80
+ PROMO_NAME_REQUIRED: 'PROMO_NAME_REQUIRED',
81
+ PROMO_NAME_COLLISION: 'PROMO_NAME_COLLISION',
82
+ PROMO_END_BEFORE_START: 'PROMO_END_BEFORE_START',
83
+ PROMO_DISCOUNT_REQUIRED: 'PROMO_DISCOUNT_REQUIRED',
84
+ PROMO_BOTH_DISCOUNT_TYPES: 'PROMO_BOTH_DISCOUNT_TYPES',
85
+ PROMO_PERCENT_EXCEEDS_100: 'PROMO_PERCENT_EXCEEDS_100',
86
+ PROMO_LIMIT_REQUIRED: 'PROMO_LIMIT_REQUIRED',
87
+
88
+ // Warning codes
89
+ PROMO_EXTENDS_PAST_EVENT: 'PROMO_EXTENDS_PAST_EVENT',
90
+ SALES_CLOSE_TO_EVENT: 'SALES_CLOSE_TO_EVENT',
91
+ };
@@ -1,64 +1,64 @@
1
- import { describe, it, expect } from 'vitest';
2
- import {
3
- MIN_EVENT_DURATION_MINS,
4
- MAX_EVENT_DURATION_MINS,
5
- DEFAULT_EVENT_DURATION_MINS,
6
- DEFAULT_DOORS_BEFORE_START_MINS,
7
- MAX_TICKETS_PER_ORDER,
8
- MIN_TICKETS_PER_ORDER,
9
- MAX_PERCENTAGE_DISCOUNT,
10
- ErrorCodes,
11
- } from './validation.js';
12
-
13
- describe('validation constants', () => {
14
- describe('event time constants', () => {
15
- it('exports MIN_EVENT_DURATION_MINS as 15', () => {
16
- expect(MIN_EVENT_DURATION_MINS).toBe(15);
17
- });
18
-
19
- it('exports MAX_EVENT_DURATION_MINS as 1440 (24 hours)', () => {
20
- expect(MAX_EVENT_DURATION_MINS).toBe(1440);
21
- });
22
-
23
- it('exports DEFAULT_EVENT_DURATION_MINS as 90', () => {
24
- expect(DEFAULT_EVENT_DURATION_MINS).toBe(90);
25
- });
26
-
27
- it('exports DEFAULT_DOORS_BEFORE_START_MINS as 30', () => {
28
- expect(DEFAULT_DOORS_BEFORE_START_MINS).toBe(30);
29
- });
30
- });
31
-
32
- describe('ticket constants', () => {
33
- it('exports MAX_TICKETS_PER_ORDER as 100', () => {
34
- expect(MAX_TICKETS_PER_ORDER).toBe(100);
35
- });
36
-
37
- it('exports MIN_TICKETS_PER_ORDER as 0', () => {
38
- expect(MIN_TICKETS_PER_ORDER).toBe(0);
39
- });
40
- });
41
-
42
- describe('promo code constants', () => {
43
- it('exports MAX_PERCENTAGE_DISCOUNT as 100', () => {
44
- expect(MAX_PERCENTAGE_DISCOUNT).toBe(100);
45
- });
46
- });
47
-
48
- describe('error codes', () => {
49
- it('exports ErrorCodes object with event errors', () => {
50
- expect(ErrorCodes.EVENT_DURATION_TOO_SHORT).toBe('EVENT_DURATION_TOO_SHORT');
51
- expect(ErrorCodes.EVENT_END_BEFORE_START).toBe('EVENT_END_BEFORE_START');
52
- });
53
-
54
- it('exports ErrorCodes object with ticket errors', () => {
55
- expect(ErrorCodes.PRICE_REQUIRED).toBe('PRICE_REQUIRED');
56
- expect(ErrorCodes.QUANTITY_REQUIRED).toBe('QUANTITY_REQUIRED');
57
- });
58
-
59
- it('exports ErrorCodes object with promo errors', () => {
60
- expect(ErrorCodes.PROMO_NAME_REQUIRED).toBe('PROMO_NAME_REQUIRED');
61
- expect(ErrorCodes.PROMO_PERCENT_EXCEEDS_100).toBe('PROMO_PERCENT_EXCEEDS_100');
62
- });
63
- });
64
- });
1
+ import { describe, it, expect } from 'vitest';
2
+ import {
3
+ MIN_EVENT_DURATION_MINS,
4
+ MAX_EVENT_DURATION_MINS,
5
+ DEFAULT_EVENT_DURATION_MINS,
6
+ DEFAULT_DOORS_BEFORE_START_MINS,
7
+ MAX_TICKETS_PER_ORDER,
8
+ MIN_TICKETS_PER_ORDER,
9
+ MAX_PERCENTAGE_DISCOUNT,
10
+ ErrorCodes,
11
+ } from './validation.js';
12
+
13
+ describe('validation constants', () => {
14
+ describe('event time constants', () => {
15
+ it('exports MIN_EVENT_DURATION_MINS as 15', () => {
16
+ expect(MIN_EVENT_DURATION_MINS).toBe(15);
17
+ });
18
+
19
+ it('exports MAX_EVENT_DURATION_MINS as 1440 (24 hours)', () => {
20
+ expect(MAX_EVENT_DURATION_MINS).toBe(1440);
21
+ });
22
+
23
+ it('exports DEFAULT_EVENT_DURATION_MINS as 90', () => {
24
+ expect(DEFAULT_EVENT_DURATION_MINS).toBe(90);
25
+ });
26
+
27
+ it('exports DEFAULT_DOORS_BEFORE_START_MINS as 30', () => {
28
+ expect(DEFAULT_DOORS_BEFORE_START_MINS).toBe(30);
29
+ });
30
+ });
31
+
32
+ describe('ticket constants', () => {
33
+ it('exports MAX_TICKETS_PER_ORDER as 100', () => {
34
+ expect(MAX_TICKETS_PER_ORDER).toBe(100);
35
+ });
36
+
37
+ it('exports MIN_TICKETS_PER_ORDER as 0', () => {
38
+ expect(MIN_TICKETS_PER_ORDER).toBe(0);
39
+ });
40
+ });
41
+
42
+ describe('promo code constants', () => {
43
+ it('exports MAX_PERCENTAGE_DISCOUNT as 100', () => {
44
+ expect(MAX_PERCENTAGE_DISCOUNT).toBe(100);
45
+ });
46
+ });
47
+
48
+ describe('error codes', () => {
49
+ it('exports ErrorCodes object with event errors', () => {
50
+ expect(ErrorCodes.EVENT_DURATION_TOO_SHORT).toBe('EVENT_DURATION_TOO_SHORT');
51
+ expect(ErrorCodes.EVENT_END_BEFORE_START).toBe('EVENT_END_BEFORE_START');
52
+ });
53
+
54
+ it('exports ErrorCodes object with ticket errors', () => {
55
+ expect(ErrorCodes.PRICE_REQUIRED).toBe('PRICE_REQUIRED');
56
+ expect(ErrorCodes.QUANTITY_REQUIRED).toBe('QUANTITY_REQUIRED');
57
+ });
58
+
59
+ it('exports ErrorCodes object with promo errors', () => {
60
+ expect(ErrorCodes.PROMO_NAME_REQUIRED).toBe('PROMO_NAME_REQUIRED');
61
+ expect(ErrorCodes.PROMO_PERCENT_EXCEEDS_100).toBe('PROMO_PERCENT_EXCEEDS_100');
62
+ });
63
+ });
64
+ });
@@ -1,6 +1,6 @@
1
1
  import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
2
2
  import { formatCleanTimeRange, formatDateRange, formatDayOfWeek, formatEventDate, formatEventDateTime, formatEventTime, formatHour, formatMonth, formatNotificationTime, formatRelativeTime, formatTimeRange, getDateInTimezone, getDateParts, getHourInTimezone, isToday, } from '../format';
3
- import { DateTimeError } from '../types';
3
+ import { DateTimeError, DateTimeErrorCode } from '../types';
4
4
  describe('format utilities', () => {
5
5
  describe('formatEventTime', () => {
6
6
  it('formats time in specified timezone', () => {
@@ -1,6 +1,6 @@
1
1
  import { describe, expect, it } from 'vitest';
2
2
  import { combineDateAndTime, formatDateTimeForAPI, isNextDayTime, minutesToTimeString, parseDateTimeFromAPI, parseEndOfDay, parseLocalToUTC, parseStartOfDay, parseTimeToMinutes, parseUTCToLocal, stripNextDayPrefix, } from '../parse';
3
- import { DateTimeError } from '../types';
3
+ import { DateTimeError, DateTimeErrorCode } from '../types';
4
4
  describe('parse utilities', () => {
5
5
  describe('parseLocalToUTC', () => {
6
6
  it('converts local datetime to UTC', () => {
@@ -1,4 +1,4 @@
1
- import { describe, expect, it } from 'vitest';
1
+ import { beforeEach, describe, expect, it, vi } from 'vitest';
2
2
  import { getTimezoneDisplayName, getTimezoneOffset, getUserTimezone, getVenueTimezone, isDST, isValidTimezone, normalizeTimezone, getIANATimezone, isValidIANATimezone, getAllTimezones, formatTimezoneForDisplay, getTimezoneOptions, getCommonUSTimezoneOptions, } from '../timezone';
3
3
  import { DateTimeError, DateTimeErrorCode } from '../types';
4
4
  describe('timezone utilities', () => {