@mmailaender/convex-creem 0.1.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 (383) hide show
  1. package/LICENSE +201 -0
  2. package/README.md +1176 -0
  3. package/dist/client/helpers.d.ts +17 -0
  4. package/dist/client/helpers.d.ts.map +1 -0
  5. package/dist/client/helpers.js +43 -0
  6. package/dist/client/helpers.js.map +1 -0
  7. package/dist/client/index.d.ts +1041 -0
  8. package/dist/client/index.d.ts.map +1 -0
  9. package/dist/client/index.js +1068 -0
  10. package/dist/client/index.js.map +1 -0
  11. package/dist/client/parsers.d.ts +45 -0
  12. package/dist/client/parsers.d.ts.map +1 -0
  13. package/dist/client/parsers.js +138 -0
  14. package/dist/client/parsers.js.map +1 -0
  15. package/dist/client/polyfill.d.ts +2 -0
  16. package/dist/client/polyfill.d.ts.map +1 -0
  17. package/dist/client/polyfill.js +3 -0
  18. package/dist/client/polyfill.js.map +1 -0
  19. package/dist/component/_generated/api.d.ts +36 -0
  20. package/dist/component/_generated/api.d.ts.map +1 -0
  21. package/dist/component/_generated/api.js +31 -0
  22. package/dist/component/_generated/api.js.map +1 -0
  23. package/dist/component/_generated/component.d.ts +542 -0
  24. package/dist/component/_generated/component.d.ts.map +1 -0
  25. package/dist/component/_generated/component.js +11 -0
  26. package/dist/component/_generated/component.js.map +1 -0
  27. package/dist/component/_generated/dataModel.d.ts +46 -0
  28. package/dist/component/_generated/dataModel.d.ts.map +1 -0
  29. package/dist/component/_generated/dataModel.js +11 -0
  30. package/dist/component/_generated/dataModel.js.map +1 -0
  31. package/dist/component/_generated/server.d.ts +121 -0
  32. package/dist/component/_generated/server.d.ts.map +1 -0
  33. package/dist/component/_generated/server.js +78 -0
  34. package/dist/component/_generated/server.js.map +1 -0
  35. package/dist/component/convex.config.d.ts +3 -0
  36. package/dist/component/convex.config.d.ts.map +1 -0
  37. package/dist/component/convex.config.js +3 -0
  38. package/dist/component/convex.config.js.map +1 -0
  39. package/dist/component/lib.d.ts +1005 -0
  40. package/dist/component/lib.d.ts.map +1 -0
  41. package/dist/component/lib.js +647 -0
  42. package/dist/component/lib.js.map +1 -0
  43. package/dist/component/schema.d.ts +191 -0
  44. package/dist/component/schema.d.ts.map +1 -0
  45. package/dist/component/schema.js +104 -0
  46. package/dist/component/schema.js.map +1 -0
  47. package/dist/component/util.d.ts +61 -0
  48. package/dist/component/util.d.ts.map +1 -0
  49. package/dist/component/util.js +142 -0
  50. package/dist/component/util.js.map +1 -0
  51. package/dist/core/catalog.d.ts +18 -0
  52. package/dist/core/catalog.d.ts.map +1 -0
  53. package/dist/core/catalog.js +82 -0
  54. package/dist/core/catalog.js.map +1 -0
  55. package/dist/core/index.d.ts +9 -0
  56. package/dist/core/index.d.ts.map +1 -0
  57. package/dist/core/index.js +9 -0
  58. package/dist/core/index.js.map +1 -0
  59. package/dist/core/markdown.d.ts +12 -0
  60. package/dist/core/markdown.d.ts.map +1 -0
  61. package/dist/core/markdown.js +26 -0
  62. package/dist/core/markdown.js.map +1 -0
  63. package/dist/core/payments.d.ts +11 -0
  64. package/dist/core/payments.d.ts.map +1 -0
  65. package/dist/core/payments.js +27 -0
  66. package/dist/core/payments.js.map +1 -0
  67. package/dist/core/pendingCheckout.d.ts +15 -0
  68. package/dist/core/pendingCheckout.d.ts.map +1 -0
  69. package/dist/core/pendingCheckout.js +40 -0
  70. package/dist/core/pendingCheckout.js.map +1 -0
  71. package/dist/core/resolver.d.ts +11 -0
  72. package/dist/core/resolver.d.ts.map +1 -0
  73. package/dist/core/resolver.js +106 -0
  74. package/dist/core/resolver.js.map +1 -0
  75. package/dist/core/selectors.d.ts +12 -0
  76. package/dist/core/selectors.d.ts.map +1 -0
  77. package/dist/core/selectors.js +18 -0
  78. package/dist/core/selectors.js.map +1 -0
  79. package/dist/core/subscriptionUpdate.d.ts +20 -0
  80. package/dist/core/subscriptionUpdate.d.ts.map +1 -0
  81. package/dist/core/subscriptionUpdate.js +64 -0
  82. package/dist/core/subscriptionUpdate.js.map +1 -0
  83. package/dist/core/types.d.ts +170 -0
  84. package/dist/core/types.d.ts.map +1 -0
  85. package/dist/core/types.js +15 -0
  86. package/dist/core/types.js.map +1 -0
  87. package/dist/design-system/colors/color-utils.d.ts +10 -0
  88. package/dist/design-system/colors/color-utils.d.ts.map +1 -0
  89. package/dist/design-system/colors/color-utils.js +91 -0
  90. package/dist/design-system/colors/color-utils.js.map +1 -0
  91. package/dist/design-system/colors/config.d.ts +33 -0
  92. package/dist/design-system/colors/config.d.ts.map +1 -0
  93. package/dist/design-system/colors/config.js +224 -0
  94. package/dist/design-system/colors/config.js.map +1 -0
  95. package/dist/design-system/colors/index.d.ts +3 -0
  96. package/dist/design-system/colors/index.d.ts.map +1 -0
  97. package/dist/design-system/colors/index.js +3 -0
  98. package/dist/design-system/colors/index.js.map +1 -0
  99. package/dist/design-system/rounded/config.d.ts +31 -0
  100. package/dist/design-system/rounded/config.d.ts.map +1 -0
  101. package/dist/design-system/rounded/config.js +76 -0
  102. package/dist/design-system/rounded/config.js.map +1 -0
  103. package/dist/design-system/rounded/index.d.ts +2 -0
  104. package/dist/design-system/rounded/index.d.ts.map +1 -0
  105. package/dist/design-system/rounded/index.js +2 -0
  106. package/dist/design-system/rounded/index.js.map +1 -0
  107. package/dist/design-system/typography/config.d.ts +55 -0
  108. package/dist/design-system/typography/config.d.ts.map +1 -0
  109. package/dist/design-system/typography/config.js +308 -0
  110. package/dist/design-system/typography/config.js.map +1 -0
  111. package/dist/design-system/typography/index.d.ts +3 -0
  112. package/dist/design-system/typography/index.d.ts.map +1 -0
  113. package/dist/design-system/typography/index.js +3 -0
  114. package/dist/design-system/typography/index.js.map +1 -0
  115. package/dist/design-system/typography/tokens.d.ts +23 -0
  116. package/dist/design-system/typography/tokens.d.ts.map +1 -0
  117. package/dist/design-system/typography/tokens.js +99 -0
  118. package/dist/design-system/typography/tokens.js.map +1 -0
  119. package/dist/react/hooks/useCheckoutSuccessParams.d.ts +2 -0
  120. package/dist/react/hooks/useCheckoutSuccessParams.d.ts.map +1 -0
  121. package/dist/react/hooks/useCheckoutSuccessParams.js +5 -0
  122. package/dist/react/hooks/useCheckoutSuccessParams.js.map +1 -0
  123. package/dist/react/index.d.ts +25 -0
  124. package/dist/react/index.d.ts.map +1 -0
  125. package/dist/react/index.js +22 -0
  126. package/dist/react/index.js.map +1 -0
  127. package/dist/react/primitives/BillingGate.d.ts +8 -0
  128. package/dist/react/primitives/BillingGate.d.ts.map +1 -0
  129. package/dist/react/primitives/BillingGate.js +13 -0
  130. package/dist/react/primitives/BillingGate.js.map +1 -0
  131. package/dist/react/primitives/BillingToggle.d.ts +8 -0
  132. package/dist/react/primitives/BillingToggle.d.ts.map +1 -0
  133. package/dist/react/primitives/BillingToggle.js +12 -0
  134. package/dist/react/primitives/BillingToggle.js.map +1 -0
  135. package/dist/react/primitives/CheckoutButton.d.ts +11 -0
  136. package/dist/react/primitives/CheckoutButton.d.ts.map +1 -0
  137. package/dist/react/primitives/CheckoutButton.js +21 -0
  138. package/dist/react/primitives/CheckoutButton.js.map +1 -0
  139. package/dist/react/primitives/CheckoutSuccessSummary.d.ts +7 -0
  140. package/dist/react/primitives/CheckoutSuccessSummary.d.ts.map +1 -0
  141. package/dist/react/primitives/CheckoutSuccessSummary.js +11 -0
  142. package/dist/react/primitives/CheckoutSuccessSummary.js.map +1 -0
  143. package/dist/react/primitives/CustomerPortalButton.d.ts +8 -0
  144. package/dist/react/primitives/CustomerPortalButton.d.ts.map +1 -0
  145. package/dist/react/primitives/CustomerPortalButton.js +21 -0
  146. package/dist/react/primitives/CustomerPortalButton.js.map +1 -0
  147. package/dist/react/primitives/NumberInput.d.ts +11 -0
  148. package/dist/react/primitives/NumberInput.d.ts.map +1 -0
  149. package/dist/react/primitives/NumberInput.js +18 -0
  150. package/dist/react/primitives/NumberInput.js.map +1 -0
  151. package/dist/react/primitives/OneTimeCheckoutButton.d.ts +11 -0
  152. package/dist/react/primitives/OneTimeCheckoutButton.d.ts.map +1 -0
  153. package/dist/react/primitives/OneTimeCheckoutButton.js +4 -0
  154. package/dist/react/primitives/OneTimeCheckoutButton.js.map +1 -0
  155. package/dist/react/primitives/OneTimePaymentStatusBadge.d.ts +6 -0
  156. package/dist/react/primitives/OneTimePaymentStatusBadge.d.ts.map +1 -0
  157. package/dist/react/primitives/OneTimePaymentStatusBadge.js +11 -0
  158. package/dist/react/primitives/OneTimePaymentStatusBadge.js.map +1 -0
  159. package/dist/react/primitives/PaymentWarningBanner.d.ts +7 -0
  160. package/dist/react/primitives/PaymentWarningBanner.d.ts.map +1 -0
  161. package/dist/react/primitives/PaymentWarningBanner.js +18 -0
  162. package/dist/react/primitives/PaymentWarningBanner.js.map +1 -0
  163. package/dist/react/primitives/PricingCard.d.ts +37 -0
  164. package/dist/react/primitives/PricingCard.d.ts.map +1 -0
  165. package/dist/react/primitives/PricingCard.js +125 -0
  166. package/dist/react/primitives/PricingCard.js.map +1 -0
  167. package/dist/react/primitives/PricingSection.d.ts +39 -0
  168. package/dist/react/primitives/PricingSection.d.ts.map +1 -0
  169. package/dist/react/primitives/PricingSection.js +24 -0
  170. package/dist/react/primitives/PricingSection.js.map +1 -0
  171. package/dist/react/primitives/ScheduledChangeBanner.d.ts +8 -0
  172. package/dist/react/primitives/ScheduledChangeBanner.d.ts.map +1 -0
  173. package/dist/react/primitives/ScheduledChangeBanner.js +13 -0
  174. package/dist/react/primitives/ScheduledChangeBanner.js.map +1 -0
  175. package/dist/react/primitives/SegmentControl.d.ts +11 -0
  176. package/dist/react/primitives/SegmentControl.d.ts.map +1 -0
  177. package/dist/react/primitives/SegmentControl.js +8 -0
  178. package/dist/react/primitives/SegmentControl.js.map +1 -0
  179. package/dist/react/primitives/SegmentGroup.d.ts +14 -0
  180. package/dist/react/primitives/SegmentGroup.d.ts.map +1 -0
  181. package/dist/react/primitives/SegmentGroup.js +11 -0
  182. package/dist/react/primitives/SegmentGroup.js.map +1 -0
  183. package/dist/react/primitives/TrialLimitBanner.d.ts +7 -0
  184. package/dist/react/primitives/TrialLimitBanner.d.ts.map +1 -0
  185. package/dist/react/primitives/TrialLimitBanner.js +14 -0
  186. package/dist/react/primitives/TrialLimitBanner.js.map +1 -0
  187. package/dist/react/shared.d.ts +28 -0
  188. package/dist/react/shared.d.ts.map +1 -0
  189. package/dist/react/shared.js +109 -0
  190. package/dist/react/shared.js.map +1 -0
  191. package/dist/react/widgets/BillingPortal.d.ts +9 -0
  192. package/dist/react/widgets/BillingPortal.d.ts.map +1 -0
  193. package/dist/react/widgets/BillingPortal.js +30 -0
  194. package/dist/react/widgets/BillingPortal.js.map +1 -0
  195. package/dist/react/widgets/ProductItem.d.ts +8 -0
  196. package/dist/react/widgets/ProductItem.d.ts.map +1 -0
  197. package/dist/react/widgets/ProductItem.js +14 -0
  198. package/dist/react/widgets/ProductItem.js.map +1 -0
  199. package/dist/react/widgets/ProductRoot.d.ts +16 -0
  200. package/dist/react/widgets/ProductRoot.d.ts.map +1 -0
  201. package/dist/react/widgets/ProductRoot.js +171 -0
  202. package/dist/react/widgets/ProductRoot.js.map +1 -0
  203. package/dist/react/widgets/SubscriptionItem.d.ts +27 -0
  204. package/dist/react/widgets/SubscriptionItem.d.ts.map +1 -0
  205. package/dist/react/widgets/SubscriptionItem.js +32 -0
  206. package/dist/react/widgets/SubscriptionItem.js.map +1 -0
  207. package/dist/react/widgets/SubscriptionRoot.d.ts +16 -0
  208. package/dist/react/widgets/SubscriptionRoot.d.ts.map +1 -0
  209. package/dist/react/widgets/SubscriptionRoot.js +405 -0
  210. package/dist/react/widgets/SubscriptionRoot.js.map +1 -0
  211. package/dist/react/widgets/index.d.ts +19 -0
  212. package/dist/react/widgets/index.d.ts.map +1 -0
  213. package/dist/react/widgets/index.js +16 -0
  214. package/dist/react/widgets/index.js.map +1 -0
  215. package/dist/react/widgets/productGroupContext.d.ts +6 -0
  216. package/dist/react/widgets/productGroupContext.d.ts.map +1 -0
  217. package/dist/react/widgets/productGroupContext.js +3 -0
  218. package/dist/react/widgets/productGroupContext.js.map +1 -0
  219. package/dist/react/widgets/subscriptionContext.d.ts +6 -0
  220. package/dist/react/widgets/subscriptionContext.d.ts.map +1 -0
  221. package/dist/react/widgets/subscriptionContext.js +3 -0
  222. package/dist/react/widgets/subscriptionContext.js.map +1 -0
  223. package/dist/react/widgets/types.d.ts +171 -0
  224. package/dist/react/widgets/types.d.ts.map +1 -0
  225. package/dist/react/widgets/types.js +2 -0
  226. package/dist/react/widgets/types.js.map +1 -0
  227. package/dist/svelte/index.d.ts +22 -0
  228. package/dist/svelte/index.d.ts.map +1 -0
  229. package/dist/svelte/index.js +20 -0
  230. package/dist/svelte/index.js.map +1 -0
  231. package/dist/svelte/primitives/BillingGate.svelte +28 -0
  232. package/dist/svelte/primitives/BillingToggle.svelte +27 -0
  233. package/dist/svelte/primitives/CheckoutButton.svelte +60 -0
  234. package/dist/svelte/primitives/CheckoutSuccessSummary.svelte +34 -0
  235. package/dist/svelte/primitives/CustomerPortalButton.svelte +60 -0
  236. package/dist/svelte/primitives/NumberInput.svelte +71 -0
  237. package/dist/svelte/primitives/OneTimeCheckoutButton.svelte +37 -0
  238. package/dist/svelte/primitives/OneTimePaymentStatusBadge.svelte +20 -0
  239. package/dist/svelte/primitives/PaymentWarningBanner.svelte +30 -0
  240. package/dist/svelte/primitives/PricingCard.svelte +356 -0
  241. package/dist/svelte/primitives/PricingSection.svelte +121 -0
  242. package/dist/svelte/primitives/ScheduledChangeBanner.svelte +46 -0
  243. package/dist/svelte/primitives/SegmentControl.svelte +38 -0
  244. package/dist/svelte/primitives/SegmentGroup.svelte +52 -0
  245. package/dist/svelte/primitives/TrialLimitBanner.svelte +32 -0
  246. package/dist/svelte/primitives/shared.d.ts +13 -0
  247. package/dist/svelte/primitives/shared.d.ts.map +1 -0
  248. package/dist/svelte/primitives/shared.js +87 -0
  249. package/dist/svelte/primitives/shared.js.map +1 -0
  250. package/dist/svelte/widgets/BillingPortal.svelte +55 -0
  251. package/dist/svelte/widgets/Product.svelte +35 -0
  252. package/dist/svelte/widgets/ProductRoot.svelte +428 -0
  253. package/dist/svelte/widgets/Subscription.svelte +52 -0
  254. package/dist/svelte/widgets/SubscriptionRoot.svelte +690 -0
  255. package/dist/svelte/widgets/index.d.ts +19 -0
  256. package/dist/svelte/widgets/index.d.ts.map +1 -0
  257. package/dist/svelte/widgets/index.js +16 -0
  258. package/dist/svelte/widgets/index.js.map +1 -0
  259. package/dist/svelte/widgets/productGroupContext.d.ts +6 -0
  260. package/dist/svelte/widgets/productGroupContext.d.ts.map +1 -0
  261. package/dist/svelte/widgets/productGroupContext.js +2 -0
  262. package/dist/svelte/widgets/productGroupContext.js.map +1 -0
  263. package/dist/svelte/widgets/subscriptionContext.d.ts +6 -0
  264. package/dist/svelte/widgets/subscriptionContext.d.ts.map +1 -0
  265. package/dist/svelte/widgets/subscriptionContext.js +2 -0
  266. package/dist/svelte/widgets/subscriptionContext.js.map +1 -0
  267. package/dist/svelte/widgets/types.d.ts +171 -0
  268. package/dist/svelte/widgets/types.d.ts.map +1 -0
  269. package/dist/svelte/widgets/types.js +2 -0
  270. package/dist/svelte/widgets/types.js.map +1 -0
  271. package/package.json +182 -0
  272. package/src/client/helpers.test.ts +139 -0
  273. package/src/client/helpers.ts +51 -0
  274. package/src/client/index.test.ts +1554 -0
  275. package/src/client/index.ts +1504 -0
  276. package/src/client/parsers.test.ts +1017 -0
  277. package/src/client/parsers.ts +182 -0
  278. package/src/client/polyfill.ts +2 -0
  279. package/src/component/_generated/api.ts +52 -0
  280. package/src/component/_generated/component.ts +619 -0
  281. package/src/component/_generated/dataModel.ts +60 -0
  282. package/src/component/_generated/server.ts +156 -0
  283. package/src/component/convex.config.ts +3 -0
  284. package/src/component/lib.test.ts +1359 -0
  285. package/src/component/lib.ts +726 -0
  286. package/src/component/schema.ts +112 -0
  287. package/src/component/util.test.ts +281 -0
  288. package/src/component/util.ts +228 -0
  289. package/src/core/catalog.test.ts +212 -0
  290. package/src/core/catalog.ts +119 -0
  291. package/src/core/index.ts +8 -0
  292. package/src/core/markdown.test.ts +43 -0
  293. package/src/core/markdown.ts +26 -0
  294. package/src/core/payments.test.ts +69 -0
  295. package/src/core/payments.ts +33 -0
  296. package/src/core/pendingCheckout.test.ts +44 -0
  297. package/src/core/pendingCheckout.ts +40 -0
  298. package/src/core/resolver.test.ts +283 -0
  299. package/src/core/resolver.ts +160 -0
  300. package/src/core/selectors.test.ts +119 -0
  301. package/src/core/selectors.ts +35 -0
  302. package/src/core/subscriptionUpdate.test.ts +164 -0
  303. package/src/core/subscriptionUpdate.ts +102 -0
  304. package/src/core/types.ts +220 -0
  305. package/src/design-system/README.md +40 -0
  306. package/src/design-system/base.css +27 -0
  307. package/src/design-system/colors/color-utils.ts +110 -0
  308. package/src/design-system/colors/config.ts +282 -0
  309. package/src/design-system/colors/index.ts +2 -0
  310. package/src/design-system/colors/utilities.css +2328 -0
  311. package/src/design-system/components/badges.css +65 -0
  312. package/src/design-system/components/buttons.css +256 -0
  313. package/src/design-system/components/dialog.css +218 -0
  314. package/src/design-system/components/icon-buttons.css +115 -0
  315. package/src/design-system/components/inputs.css +94 -0
  316. package/src/design-system/components/links.css +53 -0
  317. package/src/design-system/components/prose.css +67 -0
  318. package/src/design-system/components/segment-control.css +303 -0
  319. package/src/design-system/index.css +21 -0
  320. package/src/design-system/rounded/config.ts +91 -0
  321. package/src/design-system/rounded/index.ts +1 -0
  322. package/src/design-system/rounded/utilities.css +37 -0
  323. package/src/design-system/typography/config.ts +340 -0
  324. package/src/design-system/typography/index.ts +2 -0
  325. package/src/design-system/typography/tokens.ts +148 -0
  326. package/src/design-system/typography/utilities.css +728 -0
  327. package/src/library.css +20 -0
  328. package/src/react/hooks/useCheckoutSuccessParams.ts +7 -0
  329. package/src/react/index.tsx +47 -0
  330. package/src/react/primitives/BillingGate.tsx +26 -0
  331. package/src/react/primitives/BillingToggle.tsx +29 -0
  332. package/src/react/primitives/CheckoutButton.tsx +47 -0
  333. package/src/react/primitives/CheckoutSuccessSummary.tsx +36 -0
  334. package/src/react/primitives/CustomerPortalButton.tsx +50 -0
  335. package/src/react/primitives/NumberInput.tsx +83 -0
  336. package/src/react/primitives/OneTimeCheckoutButton.tsx +27 -0
  337. package/src/react/primitives/OneTimePaymentStatusBadge.tsx +18 -0
  338. package/src/react/primitives/PaymentWarningBanner.tsx +33 -0
  339. package/src/react/primitives/PricingCard.tsx +421 -0
  340. package/src/react/primitives/PricingSection.tsx +129 -0
  341. package/src/react/primitives/ScheduledChangeBanner.tsx +52 -0
  342. package/src/react/primitives/SegmentControl.tsx +32 -0
  343. package/src/react/primitives/SegmentGroup.tsx +53 -0
  344. package/src/react/primitives/TrialLimitBanner.tsx +32 -0
  345. package/src/react/shared.ts +138 -0
  346. package/src/react/widgets/BillingPortal.tsx +56 -0
  347. package/src/react/widgets/ProductItem.tsx +26 -0
  348. package/src/react/widgets/ProductRoot.tsx +441 -0
  349. package/src/react/widgets/SubscriptionItem.tsx +71 -0
  350. package/src/react/widgets/SubscriptionRoot.tsx +759 -0
  351. package/src/react/widgets/index.ts +36 -0
  352. package/src/react/widgets/productGroupContext.ts +10 -0
  353. package/src/react/widgets/subscriptionContext.ts +10 -0
  354. package/src/react/widgets/types.ts +179 -0
  355. package/src/svelte/index.ts +43 -0
  356. package/src/svelte/primitives/BillingGate.svelte +28 -0
  357. package/src/svelte/primitives/BillingToggle.svelte +27 -0
  358. package/src/svelte/primitives/CheckoutButton.svelte +60 -0
  359. package/src/svelte/primitives/CheckoutSuccessSummary.svelte +34 -0
  360. package/src/svelte/primitives/CustomerPortalButton.svelte +60 -0
  361. package/src/svelte/primitives/NumberInput.svelte +71 -0
  362. package/src/svelte/primitives/OneTimeCheckoutButton.svelte +37 -0
  363. package/src/svelte/primitives/OneTimePaymentStatusBadge.svelte +20 -0
  364. package/src/svelte/primitives/PaymentWarningBanner.svelte +30 -0
  365. package/src/svelte/primitives/PricingCard.svelte +356 -0
  366. package/src/svelte/primitives/PricingSection.svelte +121 -0
  367. package/src/svelte/primitives/ScheduledChangeBanner.svelte +46 -0
  368. package/src/svelte/primitives/SegmentControl.svelte +38 -0
  369. package/src/svelte/primitives/SegmentGroup.svelte +52 -0
  370. package/src/svelte/primitives/TrialLimitBanner.svelte +32 -0
  371. package/src/svelte/primitives/shared.ts +113 -0
  372. package/src/svelte/svelte.d.ts +6 -0
  373. package/src/svelte/widgets/BillingPortal.svelte +55 -0
  374. package/src/svelte/widgets/Product.svelte +35 -0
  375. package/src/svelte/widgets/ProductRoot.svelte +428 -0
  376. package/src/svelte/widgets/Subscription.svelte +52 -0
  377. package/src/svelte/widgets/SubscriptionRoot.svelte +690 -0
  378. package/src/svelte/widgets/index.ts +36 -0
  379. package/src/svelte/widgets/productGroupContext.ts +7 -0
  380. package/src/svelte/widgets/subscriptionContext.ts +7 -0
  381. package/src/svelte/widgets/types.ts +179 -0
  382. package/src/tailwind.css +6 -0
  383. package/src/test.ts +18 -0
package/src/design-system/typography/utilities.css ADDED
@@ -0,0 +1,728 @@
1
+ /* Components: Typography */
2
+
3
+ @layer base {
4
+ :root {
5
+ --et-typeface-brand: Inter, sans-serif;
6
+ --et-typeface-plain: Inter, sans-serif;
7
+ --et-font-weight-brand: 600;
8
+ --et-font-weight-plain: 400;
9
+ --et-type-display-l-color: inherit;
10
+ --et-type-display-l-color-dark: inherit;
11
+ --et-type-display-l-font-weight: var(--et-font-weight-brand);
12
+ --et-type-display-l-size-desktop: 5.9375rem;
13
+ --et-type-display-l-line-height-desktop: 6.0625rem;
14
+ --et-type-display-l-tracking-desktop: -0.21875rem;
15
+ --et-type-display-l-size-tablet: 4.82437rem;
16
+ --et-type-display-l-line-height-tablet: 4.92563rem;
17
+ --et-type-display-l-tracking-tablet: -0.175rem;
18
+ --et-type-display-l-size-mobile: 3.71125rem;
19
+ --et-type-display-l-line-height-mobile: 3.78938rem;
20
+ --et-type-display-l-tracking-mobile: -0.1125rem;
21
+ --et-type-display-m-color: inherit;
22
+ --et-type-display-m-color-dark: inherit;
23
+ --et-type-display-m-font-weight: var(--et-font-weight-brand);
24
+ --et-type-display-m-size-desktop: 4.75rem;
25
+ --et-type-display-m-line-height-desktop: 5.225rem;
26
+ --et-type-display-m-tracking-desktop: -0.175rem;
27
+ --et-type-display-m-size-tablet: 3.85938rem;
28
+ --et-type-display-m-line-height-tablet: 4.24563rem;
29
+ --et-type-display-m-tracking-tablet: -0.1375rem;
30
+ --et-type-display-m-size-mobile: 2.96875rem;
31
+ --et-type-display-m-line-height-mobile: 3.26563rem;
32
+ --et-type-display-m-tracking-mobile: -0.0875rem;
33
+ --et-type-display-s-color: inherit;
34
+ --et-type-display-s-color-dark: inherit;
35
+ --et-type-display-s-font-weight: var(--et-font-weight-brand);
36
+ --et-type-display-s-size-desktop: 3.8125rem;
37
+ --et-type-display-s-line-height-desktop: 4.19375rem;
38
+ --et-type-display-s-tracking-desktop: -0.1875rem;
39
+ --et-type-display-s-size-tablet: 3.0975rem;
40
+ --et-type-display-s-line-height-tablet: 3.4075rem;
41
+ --et-type-display-s-tracking-tablet: -0.1125rem;
42
+ --et-type-display-s-size-mobile: 2.38313rem;
43
+ --et-type-display-s-line-height-mobile: 2.62125rem;
44
+ --et-type-display-s-tracking-mobile: -0.0875rem;
45
+ --et-type-heading-l-color: inherit;
46
+ --et-type-heading-l-color-dark: inherit;
47
+ --et-type-heading-l-font-weight: var(--et-font-weight-brand);
48
+ --et-type-heading-l-size-desktop: 3.0625rem;
49
+ --et-type-heading-l-line-height-desktop: 3.36875rem;
50
+ --et-type-heading-l-tracking-desktop: -0.1125rem;
51
+ --et-type-heading-l-size-tablet: 2.48813rem;
52
+ --et-type-heading-l-line-height-tablet: 2.73687rem;
53
+ --et-type-heading-l-tracking-tablet: -0.0875rem;
54
+ --et-type-heading-l-size-mobile: 1.91437rem;
55
+ --et-type-heading-l-line-height-mobile: 2.10562rem;
56
+ --et-type-heading-l-tracking-mobile: -0.0625rem;
57
+ --et-type-heading-m-color: inherit;
58
+ --et-type-heading-m-color-dark: inherit;
59
+ --et-type-heading-m-font-weight: var(--et-font-weight-brand);
60
+ --et-type-heading-m-size-desktop: 2.4375rem;
61
+ --et-type-heading-m-line-height-desktop: 2.68125rem;
62
+ --et-type-heading-m-tracking-desktop: -0.0875rem;
63
+ --et-type-heading-m-size-tablet: 1.98063rem;
64
+ --et-type-heading-m-line-height-tablet: 2.17875rem;
65
+ --et-type-heading-m-tracking-tablet: -0.0625rem;
66
+ --et-type-heading-m-size-mobile: 1.52375rem;
67
+ --et-type-heading-m-line-height-mobile: 1.67562rem;
68
+ --et-type-heading-m-tracking-mobile: -0.0375rem;
69
+ --et-type-heading-s-color: inherit;
70
+ --et-type-heading-s-color-dark: inherit;
71
+ --et-type-heading-s-font-weight: var(--et-font-weight-brand);
72
+ --et-type-heading-s-size-desktop: 1.9375rem;
73
+ --et-type-heading-s-line-height-desktop: 2.13125rem;
74
+ --et-type-heading-s-tracking-desktop: -0.0625rem;
75
+ --et-type-heading-s-size-tablet: 1.57438rem;
76
+ --et-type-heading-s-line-height-tablet: 1.73188rem;
77
+ --et-type-heading-s-tracking-tablet: -0.0375rem;
78
+ --et-type-heading-s-size-mobile: 1.21125rem;
79
+ --et-type-heading-s-line-height-mobile: 1.33187rem;
80
+ --et-type-heading-s-tracking-mobile: 0rem;
81
+ --et-type-heading-xs-color: inherit;
82
+ --et-type-heading-xs-color-dark: inherit;
83
+ --et-type-heading-xs-font-weight: var(--et-font-weight-brand);
84
+ --et-type-heading-xs-size-desktop: 1.5625rem;
85
+ --et-type-heading-xs-line-height-desktop: 1.71875rem;
86
+ --et-type-heading-xs-tracking-desktop: -0.0375rem;
87
+ --et-type-heading-xs-size-tablet: 1.26937rem;
88
+ --et-type-heading-xs-line-height-tablet: 1.39625rem;
89
+ --et-type-heading-xs-tracking-tablet: -0.01875rem;
90
+ --et-type-heading-xs-size-mobile: 0.97688rem;
91
+ --et-type-heading-xs-line-height-mobile: 1.07438rem;
92
+ --et-type-heading-xs-tracking-mobile: 0rem;
93
+ --et-type-title-l-color: inherit;
94
+ --et-type-title-l-color-dark: inherit;
95
+ --et-type-title-l-font-weight: var(--et-font-weight-brand);
96
+ --et-type-title-l-size-desktop: 1.5625rem;
97
+ --et-type-title-l-line-height-desktop: 1.875rem;
98
+ --et-type-title-l-tracking-desktop: -0.0375rem;
99
+ --et-type-title-l-size-tablet: 1.5625rem;
100
+ --et-type-title-l-line-height-tablet: 1.875rem;
101
+ --et-type-title-l-tracking-tablet: -0.0375rem;
102
+ --et-type-title-l-size-mobile: 1.5625rem;
103
+ --et-type-title-l-line-height-mobile: 1.875rem;
104
+ --et-type-title-l-tracking-mobile: -0.0375rem;
105
+ --et-type-title-m-color: inherit;
106
+ --et-type-title-m-color-dark: inherit;
107
+ --et-type-title-m-font-weight: var(--et-font-weight-brand);
108
+ --et-type-title-m-size-desktop: 1.25rem;
109
+ --et-type-title-m-line-height-desktop: 1.5rem;
110
+ --et-type-title-m-tracking-desktop: -0.01875rem;
111
+ --et-type-title-m-size-tablet: 1.25rem;
112
+ --et-type-title-m-line-height-tablet: 1.5rem;
113
+ --et-type-title-m-tracking-tablet: -0.01875rem;
114
+ --et-type-title-m-size-mobile: 1.25rem;
115
+ --et-type-title-m-line-height-mobile: 1.5rem;
116
+ --et-type-title-m-tracking-mobile: -0.01875rem;
117
+ --et-type-title-s-color: inherit;
118
+ --et-type-title-s-color-dark: inherit;
119
+ --et-type-title-s-font-weight: var(--et-font-weight-brand);
120
+ --et-type-title-s-size-desktop: 1rem;
121
+ --et-type-title-s-line-height-desktop: 1.25rem;
122
+ --et-type-title-s-tracking-desktop: 0rem;
123
+ --et-type-title-s-size-tablet: 1rem;
124
+ --et-type-title-s-line-height-tablet: 1.25rem;
125
+ --et-type-title-s-tracking-tablet: 0rem;
126
+ --et-type-title-s-size-mobile: 1rem;
127
+ --et-type-title-s-line-height-mobile: 1.25rem;
128
+ --et-type-title-s-tracking-mobile: 0rem;
129
+ --et-type-subtitle-l-color: inherit;
130
+ --et-type-subtitle-l-color-dark: inherit;
131
+ --et-type-subtitle-l-font-weight: var(--et-font-weight-plain);
132
+ --et-type-subtitle-l-size-desktop: 1.5625rem;
133
+ --et-type-subtitle-l-line-height-desktop: 2.34375rem;
134
+ --et-type-subtitle-l-tracking-desktop: -0.0375rem;
135
+ --et-type-subtitle-l-size-tablet: 1.5625rem;
136
+ --et-type-subtitle-l-line-height-tablet: 2.34375rem;
137
+ --et-type-subtitle-l-tracking-tablet: -0.0375rem;
138
+ --et-type-subtitle-l-size-mobile: 1.5625rem;
139
+ --et-type-subtitle-l-line-height-mobile: 2.34375rem;
140
+ --et-type-subtitle-l-tracking-mobile: -0.0375rem;
141
+ --et-type-subtitle-m-color: inherit;
142
+ --et-type-subtitle-m-color-dark: inherit;
143
+ --et-type-subtitle-m-font-weight: var(--et-font-weight-plain);
144
+ --et-type-subtitle-m-size-desktop: 1.25rem;
145
+ --et-type-subtitle-m-line-height-desktop: 1.875rem;
146
+ --et-type-subtitle-m-tracking-desktop: -0.01875rem;
147
+ --et-type-subtitle-m-size-tablet: 1.25rem;
148
+ --et-type-subtitle-m-line-height-tablet: 1.875rem;
149
+ --et-type-subtitle-m-tracking-tablet: -0.01875rem;
150
+ --et-type-subtitle-m-size-mobile: 1.25rem;
151
+ --et-type-subtitle-m-line-height-mobile: 1.875rem;
152
+ --et-type-subtitle-m-tracking-mobile: -0.01875rem;
153
+ --et-type-body-l-color: inherit;
154
+ --et-type-body-l-color-dark: inherit;
155
+ --et-type-body-l-font-weight: var(--et-font-weight-plain);
156
+ --et-type-body-l-size-desktop: 1rem;
157
+ --et-type-body-l-line-height-desktop: 1.5rem;
158
+ --et-type-body-l-tracking-desktop: 0rem;
159
+ --et-type-body-l-size-tablet: 1rem;
160
+ --et-type-body-l-line-height-tablet: 1.5rem;
161
+ --et-type-body-l-tracking-tablet: 0rem;
162
+ --et-type-body-l-size-mobile: 1rem;
163
+ --et-type-body-l-line-height-mobile: 1.5rem;
164
+ --et-type-body-l-tracking-mobile: 0rem;
165
+ --et-type-body-m-color: inherit;
166
+ --et-type-body-m-color-dark: inherit;
167
+ --et-type-body-m-font-weight: var(--et-font-weight-plain);
168
+ --et-type-body-m-size-desktop: 0.875rem;
169
+ --et-type-body-m-line-height-desktop: 1.21875rem;
170
+ --et-type-body-m-tracking-desktop: 0rem;
171
+ --et-type-body-m-size-tablet: 0.875rem;
172
+ --et-type-body-m-line-height-tablet: 1.21875rem;
173
+ --et-type-body-m-tracking-tablet: 0rem;
174
+ --et-type-body-m-size-mobile: 0.875rem;
175
+ --et-type-body-m-line-height-mobile: 1.21875rem;
176
+ --et-type-body-m-tracking-mobile: 0rem;
177
+ --et-type-body-s-color: inherit;
178
+ --et-type-body-s-color-dark: inherit;
179
+ --et-type-body-s-font-weight: var(--et-font-weight-plain);
180
+ --et-type-body-s-size-desktop: 0.6875rem;
181
+ --et-type-body-s-line-height-desktop: 1rem;
182
+ --et-type-body-s-tracking-desktop: 0rem;
183
+ --et-type-body-s-size-tablet: 0.6875rem;
184
+ --et-type-body-s-line-height-tablet: 1rem;
185
+ --et-type-body-s-tracking-tablet: 0rem;
186
+ --et-type-body-s-size-mobile: 0.6875rem;
187
+ --et-type-body-s-line-height-mobile: 1rem;
188
+ --et-type-body-s-tracking-mobile: 0rem;
189
+ --et-type-label-l-color: inherit;
190
+ --et-type-label-l-color-dark: inherit;
191
+ --et-type-label-l-font-weight: var(--et-font-weight-plain);
192
+ --et-type-label-l-size-desktop: 1rem;
193
+ --et-type-label-l-line-height-desktop: 1.5rem;
194
+ --et-type-label-l-tracking-desktop: 0rem;
195
+ --et-type-label-l-size-tablet: 1rem;
196
+ --et-type-label-l-line-height-tablet: 1.5rem;
197
+ --et-type-label-l-tracking-tablet: 0rem;
198
+ --et-type-label-l-size-mobile: 1rem;
199
+ --et-type-label-l-line-height-mobile: 1.5rem;
200
+ --et-type-label-l-tracking-mobile: 0rem;
201
+ --et-type-label-m-color: inherit;
202
+ --et-type-label-m-color-dark: inherit;
203
+ --et-type-label-m-font-weight: var(--et-font-weight-plain);
204
+ --et-type-label-m-size-desktop: 0.875rem;
205
+ --et-type-label-m-line-height-desktop: 1.21875rem;
206
+ --et-type-label-m-tracking-desktop: 0rem;
207
+ --et-type-label-m-size-tablet: 0.875rem;
208
+ --et-type-label-m-line-height-tablet: 1.21875rem;
209
+ --et-type-label-m-tracking-tablet: 0rem;
210
+ --et-type-label-m-size-mobile: 0.875rem;
211
+ --et-type-label-m-line-height-mobile: 1.21875rem;
212
+ --et-type-label-m-tracking-mobile: 0rem;
213
+ --et-type-label-s-color: inherit;
214
+ --et-type-label-s-color-dark: inherit;
215
+ --et-type-label-s-font-weight: var(--et-font-weight-plain);
216
+ --et-type-label-s-size-desktop: 0.6875rem;
217
+ --et-type-label-s-line-height-desktop: 1rem;
218
+ --et-type-label-s-tracking-desktop: 0rem;
219
+ --et-type-label-s-size-tablet: 0.6875rem;
220
+ --et-type-label-s-line-height-tablet: 1rem;
221
+ --et-type-label-s-tracking-tablet: 0rem;
222
+ --et-type-label-s-size-mobile: 0.6875rem;
223
+ --et-type-label-s-line-height-mobile: 1rem;
224
+ --et-type-label-s-tracking-mobile: 0rem;
225
+ --et-type-button-l-color: inherit;
226
+ --et-type-button-l-color-dark: inherit;
227
+ --et-type-button-l-font-weight: var(--et-font-weight-plain);
228
+ --et-type-button-l-size-desktop: 1rem;
229
+ --et-type-button-l-line-height-desktop: 1.5rem;
230
+ --et-type-button-l-tracking-desktop: 0rem;
231
+ --et-type-button-l-size-tablet: 1rem;
232
+ --et-type-button-l-line-height-tablet: 1.5rem;
233
+ --et-type-button-l-tracking-tablet: 0rem;
234
+ --et-type-button-l-size-mobile: 1rem;
235
+ --et-type-button-l-line-height-mobile: 1.5rem;
236
+ --et-type-button-l-tracking-mobile: 0rem;
237
+ --et-type-button-m-color: inherit;
238
+ --et-type-button-m-color-dark: inherit;
239
+ --et-type-button-m-font-weight: var(--et-font-weight-plain);
240
+ --et-type-button-m-size-desktop: 0.875rem;
241
+ --et-type-button-m-line-height-desktop: 1.25rem;
242
+ --et-type-button-m-tracking-desktop: 0rem;
243
+ --et-type-button-m-size-tablet: 0.875rem;
244
+ --et-type-button-m-line-height-tablet: 1.25rem;
245
+ --et-type-button-m-tracking-tablet: 0rem;
246
+ --et-type-button-m-size-mobile: 0.875rem;
247
+ --et-type-button-m-line-height-mobile: 1.25rem;
248
+ --et-type-button-m-tracking-mobile: 0rem;
249
+ --et-type-button-s-color: inherit;
250
+ --et-type-button-s-color-dark: inherit;
251
+ --et-type-button-s-font-weight: var(--et-font-weight-plain);
252
+ --et-type-button-s-size-desktop: 0.6875rem;
253
+ --et-type-button-s-line-height-desktop: 1rem;
254
+ --et-type-button-s-tracking-desktop: 0rem;
255
+ --et-type-button-s-size-tablet: 0.6875rem;
256
+ --et-type-button-s-line-height-tablet: 1rem;
257
+ --et-type-button-s-tracking-tablet: 0rem;
258
+ --et-type-button-s-size-mobile: 0.6875rem;
259
+ --et-type-button-s-line-height-mobile: 1rem;
260
+ --et-type-button-s-tracking-mobile: 0rem;
261
+ --et-type-link-l-color: inherit;
262
+ --et-type-link-l-color-dark: inherit;
263
+ --et-type-link-l-font-weight: var(--et-font-weight-plain);
264
+ --et-type-link-l-size-desktop: 1rem;
265
+ --et-type-link-l-line-height-desktop: 1.5rem;
266
+ --et-type-link-l-tracking-desktop: 0rem;
267
+ --et-type-link-l-size-tablet: 1rem;
268
+ --et-type-link-l-line-height-tablet: 1.5rem;
269
+ --et-type-link-l-tracking-tablet: 0rem;
270
+ --et-type-link-l-size-mobile: 1rem;
271
+ --et-type-link-l-line-height-mobile: 1.5rem;
272
+ --et-type-link-l-tracking-mobile: 0rem;
273
+ --et-type-link-m-color: inherit;
274
+ --et-type-link-m-color-dark: inherit;
275
+ --et-type-link-m-font-weight: var(--et-font-weight-plain);
276
+ --et-type-link-m-size-desktop: 0.875rem;
277
+ --et-type-link-m-line-height-desktop: 1.21875rem;
278
+ --et-type-link-m-tracking-desktop: 0rem;
279
+ --et-type-link-m-size-tablet: 0.875rem;
280
+ --et-type-link-m-line-height-tablet: 1.21875rem;
281
+ --et-type-link-m-tracking-tablet: 0rem;
282
+ --et-type-link-m-size-mobile: 0.875rem;
283
+ --et-type-link-m-line-height-mobile: 1.21875rem;
284
+ --et-type-link-m-tracking-mobile: 0rem;
285
+ --et-type-link-s-color: inherit;
286
+ --et-type-link-s-color-dark: inherit;
287
+ --et-type-link-s-font-weight: var(--et-font-weight-plain);
288
+ --et-type-link-s-size-desktop: 0.6875rem;
289
+ --et-type-link-s-line-height-desktop: 1rem;
290
+ --et-type-link-s-tracking-desktop: 0rem;
291
+ --et-type-link-s-size-tablet: 0.6875rem;
292
+ --et-type-link-s-line-height-tablet: 1rem;
293
+ --et-type-link-s-tracking-tablet: 0rem;
294
+ --et-type-link-s-size-mobile: 0.6875rem;
295
+ --et-type-link-s-line-height-mobile: 1rem;
296
+ --et-type-link-s-tracking-mobile: 0rem;
297
+ }
298
+ }
299
+
300
+ @utility display-l {
301
+ color: var(--et-type-display-l-color);
302
+ font-family: var(--et-typeface-brand);
303
+ font-weight: var(--et-type-display-l-font-weight);
304
+ font-style: normal;
305
+ font-size: var(--et-type-display-l-size-desktop);
306
+ line-height: var(--et-type-display-l-line-height-desktop);
307
+ letter-spacing: var(--et-type-display-l-tracking-desktop);
308
+
309
+ @variant max-sm {
310
+ font-size: var(--et-type-display-l-size-mobile);
311
+ line-height: var(--et-type-display-l-line-height-mobile);
312
+ letter-spacing: var(--et-type-display-l-tracking-mobile);
313
+ }
314
+ @variant sm {
315
+ font-size: var(--et-type-display-l-size-tablet);
316
+ line-height: var(--et-type-display-l-line-height-tablet);
317
+ letter-spacing: var(--et-type-display-l-tracking-tablet);
318
+ }
319
+ @variant lg {
320
+ font-size: var(--et-type-display-l-size-desktop);
321
+ line-height: var(--et-type-display-l-line-height-desktop);
322
+ letter-spacing: var(--et-type-display-l-tracking-desktop);
323
+ }
324
+ @variant dark {
325
+ color: var(--et-type-display-l-color-dark);
326
+ }
327
+ }
328
+
329
+ @utility display-m {
330
+ color: var(--et-type-display-m-color);
331
+ font-family: var(--et-typeface-brand);
332
+ font-weight: var(--et-type-display-m-font-weight);
333
+ font-style: normal;
334
+ font-size: var(--et-type-display-m-size-desktop);
335
+ line-height: var(--et-type-display-m-line-height-desktop);
336
+ letter-spacing: var(--et-type-display-m-tracking-desktop);
337
+
338
+ @variant max-sm {
339
+ font-size: var(--et-type-display-m-size-mobile);
340
+ line-height: var(--et-type-display-m-line-height-mobile);
341
+ letter-spacing: var(--et-type-display-m-tracking-mobile);
342
+ }
343
+ @variant sm {
344
+ font-size: var(--et-type-display-m-size-tablet);
345
+ line-height: var(--et-type-display-m-line-height-tablet);
346
+ letter-spacing: var(--et-type-display-m-tracking-tablet);
347
+ }
348
+ @variant lg {
349
+ font-size: var(--et-type-display-m-size-desktop);
350
+ line-height: var(--et-type-display-m-line-height-desktop);
351
+ letter-spacing: var(--et-type-display-m-tracking-desktop);
352
+ }
353
+ @variant dark {
354
+ color: var(--et-type-display-m-color-dark);
355
+ }
356
+ }
357
+
358
+ @utility display-s {
359
+ color: var(--et-type-display-s-color);
360
+ font-family: var(--et-typeface-brand);
361
+ font-weight: var(--et-type-display-s-font-weight);
362
+ font-style: normal;
363
+ font-size: var(--et-type-display-s-size-desktop);
364
+ line-height: var(--et-type-display-s-line-height-desktop);
365
+ letter-spacing: var(--et-type-display-s-tracking-desktop);
366
+
367
+ @variant max-sm {
368
+ font-size: var(--et-type-display-s-size-mobile);
369
+ line-height: var(--et-type-display-s-line-height-mobile);
370
+ letter-spacing: var(--et-type-display-s-tracking-mobile);
371
+ }
372
+ @variant sm {
373
+ font-size: var(--et-type-display-s-size-tablet);
374
+ line-height: var(--et-type-display-s-line-height-tablet);
375
+ letter-spacing: var(--et-type-display-s-tracking-tablet);
376
+ }
377
+ @variant lg {
378
+ font-size: var(--et-type-display-s-size-desktop);
379
+ line-height: var(--et-type-display-s-line-height-desktop);
380
+ letter-spacing: var(--et-type-display-s-tracking-desktop);
381
+ }
382
+ @variant dark {
383
+ color: var(--et-type-display-s-color-dark);
384
+ }
385
+ }
386
+
387
+ @utility heading-l {
388
+ color: var(--et-type-heading-l-color);
389
+ font-family: var(--et-typeface-brand);
390
+ font-weight: var(--et-type-heading-l-font-weight);
391
+ font-style: normal;
392
+ font-size: var(--et-type-heading-l-size-desktop);
393
+ line-height: var(--et-type-heading-l-line-height-desktop);
394
+ letter-spacing: var(--et-type-heading-l-tracking-desktop);
395
+
396
+ @variant max-sm {
397
+ font-size: var(--et-type-heading-l-size-mobile);
398
+ line-height: var(--et-type-heading-l-line-height-mobile);
399
+ letter-spacing: var(--et-type-heading-l-tracking-mobile);
400
+ }
401
+ @variant sm {
402
+ font-size: var(--et-type-heading-l-size-tablet);
403
+ line-height: var(--et-type-heading-l-line-height-tablet);
404
+ letter-spacing: var(--et-type-heading-l-tracking-tablet);
405
+ }
406
+ @variant lg {
407
+ font-size: var(--et-type-heading-l-size-desktop);
408
+ line-height: var(--et-type-heading-l-line-height-desktop);
409
+ letter-spacing: var(--et-type-heading-l-tracking-desktop);
410
+ }
411
+ @variant dark {
412
+ color: var(--et-type-heading-l-color-dark);
413
+ }
414
+ }
415
+
416
+ @utility heading-m {
417
+ color: var(--et-type-heading-m-color);
418
+ font-family: var(--et-typeface-brand);
419
+ font-weight: var(--et-type-heading-m-font-weight);
420
+ font-style: normal;
421
+ font-size: var(--et-type-heading-m-size-desktop);
422
+ line-height: var(--et-type-heading-m-line-height-desktop);
423
+ letter-spacing: var(--et-type-heading-m-tracking-desktop);
424
+
425
+ @variant max-sm {
426
+ font-size: var(--et-type-heading-m-size-mobile);
427
+ line-height: var(--et-type-heading-m-line-height-mobile);
428
+ letter-spacing: var(--et-type-heading-m-tracking-mobile);
429
+ }
430
+ @variant sm {
431
+ font-size: var(--et-type-heading-m-size-tablet);
432
+ line-height: var(--et-type-heading-m-line-height-tablet);
433
+ letter-spacing: var(--et-type-heading-m-tracking-tablet);
434
+ }
435
+ @variant lg {
436
+ font-size: var(--et-type-heading-m-size-desktop);
437
+ line-height: var(--et-type-heading-m-line-height-desktop);
438
+ letter-spacing: var(--et-type-heading-m-tracking-desktop);
439
+ }
440
+ @variant dark {
441
+ color: var(--et-type-heading-m-color-dark);
442
+ }
443
+ }
444
+
445
+ @utility heading-s {
446
+ color: var(--et-type-heading-s-color);
447
+ font-family: var(--et-typeface-brand);
448
+ font-weight: var(--et-type-heading-s-font-weight);
449
+ font-style: normal;
450
+ font-size: var(--et-type-heading-s-size-desktop);
451
+ line-height: var(--et-type-heading-s-line-height-desktop);
452
+ letter-spacing: var(--et-type-heading-s-tracking-desktop);
453
+
454
+ @variant max-sm {
455
+ font-size: var(--et-type-heading-s-size-mobile);
456
+ line-height: var(--et-type-heading-s-line-height-mobile);
457
+ letter-spacing: var(--et-type-heading-s-tracking-mobile);
458
+ }
459
+ @variant sm {
460
+ font-size: var(--et-type-heading-s-size-tablet);
461
+ line-height: var(--et-type-heading-s-line-height-tablet);
462
+ letter-spacing: var(--et-type-heading-s-tracking-tablet);
463
+ }
464
+ @variant lg {
465
+ font-size: var(--et-type-heading-s-size-desktop);
466
+ line-height: var(--et-type-heading-s-line-height-desktop);
467
+ letter-spacing: var(--et-type-heading-s-tracking-desktop);
468
+ }
469
+ @variant dark {
470
+ color: var(--et-type-heading-s-color-dark);
471
+ }
472
+ }
473
+
474
+ @utility heading-xs {
475
+ color: var(--et-type-heading-xs-color);
476
+ font-family: var(--et-typeface-brand);
477
+ font-weight: var(--et-type-heading-xs-font-weight);
478
+ font-style: normal;
479
+ font-size: var(--et-type-heading-xs-size-desktop);
480
+ line-height: var(--et-type-heading-xs-line-height-desktop);
481
+ letter-spacing: var(--et-type-heading-xs-tracking-desktop);
482
+
483
+ @variant max-sm {
484
+ font-size: var(--et-type-heading-xs-size-mobile);
485
+ line-height: var(--et-type-heading-xs-line-height-mobile);
486
+ letter-spacing: var(--et-type-heading-xs-tracking-mobile);
487
+ }
488
+ @variant sm {
489
+ font-size: var(--et-type-heading-xs-size-tablet);
490
+ line-height: var(--et-type-heading-xs-line-height-tablet);
491
+ letter-spacing: var(--et-type-heading-xs-tracking-tablet);
492
+ }
493
+ @variant lg {
494
+ font-size: var(--et-type-heading-xs-size-desktop);
495
+ line-height: var(--et-type-heading-xs-line-height-desktop);
496
+ letter-spacing: var(--et-type-heading-xs-tracking-desktop);
497
+ }
498
+ @variant dark {
499
+ color: var(--et-type-heading-xs-color-dark);
500
+ }
501
+ }
502
+
503
+ @utility title-l {
504
+ color: var(--et-type-title-l-color);
505
+ font-family: var(--et-typeface-brand);
506
+ font-weight: var(--et-type-title-l-font-weight);
507
+ font-style: normal;
508
+ font-size: var(--et-type-title-l-size-desktop);
509
+ line-height: var(--et-type-title-l-line-height-desktop);
510
+ letter-spacing: var(--et-type-title-l-tracking-desktop);
511
+ @variant dark {
512
+ color: var(--et-type-title-l-color-dark);
513
+ }
514
+ }
515
+
516
+ @utility title-m {
517
+ color: var(--et-type-title-m-color);
518
+ font-family: var(--et-typeface-brand);
519
+ font-weight: var(--et-type-title-m-font-weight);
520
+ font-style: normal;
521
+ font-size: var(--et-type-title-m-size-desktop);
522
+ line-height: var(--et-type-title-m-line-height-desktop);
523
+ letter-spacing: var(--et-type-title-m-tracking-desktop);
524
+ @variant dark {
525
+ color: var(--et-type-title-m-color-dark);
526
+ }
527
+ }
528
+
529
+ @utility title-s {
530
+ color: var(--et-type-title-s-color);
531
+ font-family: var(--et-typeface-brand);
532
+ font-weight: var(--et-type-title-s-font-weight);
533
+ font-style: normal;
534
+ font-size: var(--et-type-title-s-size-desktop);
535
+ line-height: var(--et-type-title-s-line-height-desktop);
536
+ letter-spacing: var(--et-type-title-s-tracking-desktop);
537
+ @variant dark {
538
+ color: var(--et-type-title-s-color-dark);
539
+ }
540
+ }
541
+
542
+ @utility subtitle-l {
543
+ color: var(--et-type-subtitle-l-color);
544
+ font-family: var(--et-typeface-plain);
545
+ font-weight: var(--et-type-subtitle-l-font-weight);
546
+ font-style: normal;
547
+ font-size: var(--et-type-subtitle-l-size-desktop);
548
+ line-height: var(--et-type-subtitle-l-line-height-desktop);
549
+ letter-spacing: var(--et-type-subtitle-l-tracking-desktop);
550
+ @variant dark {
551
+ color: var(--et-type-subtitle-l-color-dark);
552
+ }
553
+ }
554
+
555
+ @utility subtitle-m {
556
+ color: var(--et-type-subtitle-m-color);
557
+ font-family: var(--et-typeface-plain);
558
+ font-weight: var(--et-type-subtitle-m-font-weight);
559
+ font-style: normal;
560
+ font-size: var(--et-type-subtitle-m-size-desktop);
561
+ line-height: var(--et-type-subtitle-m-line-height-desktop);
562
+ letter-spacing: var(--et-type-subtitle-m-tracking-desktop);
563
+ @variant dark {
564
+ color: var(--et-type-subtitle-m-color-dark);
565
+ }
566
+ }
567
+
568
+ @utility body-l {
569
+ color: var(--et-type-body-l-color);
570
+ font-family: var(--et-typeface-plain);
571
+ font-weight: var(--et-type-body-l-font-weight);
572
+ font-style: normal;
573
+ font-size: var(--et-type-body-l-size-desktop);
574
+ line-height: var(--et-type-body-l-line-height-desktop);
575
+ letter-spacing: var(--et-type-body-l-tracking-desktop);
576
+ @variant dark {
577
+ color: var(--et-type-body-l-color-dark);
578
+ }
579
+ }
580
+
581
+ @utility body-m {
582
+ color: var(--et-type-body-m-color);
583
+ font-family: var(--et-typeface-plain);
584
+ font-weight: var(--et-type-body-m-font-weight);
585
+ font-style: normal;
586
+ font-size: var(--et-type-body-m-size-desktop);
587
+ line-height: var(--et-type-body-m-line-height-desktop);
588
+ letter-spacing: var(--et-type-body-m-tracking-desktop);
589
+ @variant dark {
590
+ color: var(--et-type-body-m-color-dark);
591
+ }
592
+ }
593
+
594
+ @utility body-s {
595
+ color: var(--et-type-body-s-color);
596
+ font-family: var(--et-typeface-plain);
597
+ font-weight: var(--et-type-body-s-font-weight);
598
+ font-style: normal;
599
+ font-size: var(--et-type-body-s-size-desktop);
600
+ line-height: var(--et-type-body-s-line-height-desktop);
601
+ letter-spacing: var(--et-type-body-s-tracking-desktop);
602
+ @variant dark {
603
+ color: var(--et-type-body-s-color-dark);
604
+ }
605
+ }
606
+
607
+ @utility label-l {
608
+ color: var(--et-type-label-l-color);
609
+ font-family: var(--et-typeface-plain);
610
+ font-weight: var(--et-type-label-l-font-weight);
611
+ font-style: normal;
612
+ font-size: var(--et-type-label-l-size-desktop);
613
+ line-height: var(--et-type-label-l-line-height-desktop);
614
+ letter-spacing: var(--et-type-label-l-tracking-desktop);
615
+ @variant dark {
616
+ color: var(--et-type-label-l-color-dark);
617
+ }
618
+ }
619
+
620
+ @utility label-m {
621
+ color: var(--et-type-label-m-color);
622
+ font-family: var(--et-typeface-plain);
623
+ font-weight: var(--et-type-label-m-font-weight);
624
+ font-style: normal;
625
+ font-size: var(--et-type-label-m-size-desktop);
626
+ line-height: var(--et-type-label-m-line-height-desktop);
627
+ letter-spacing: var(--et-type-label-m-tracking-desktop);
628
+ @variant dark {
629
+ color: var(--et-type-label-m-color-dark);
630
+ }
631
+ }
632
+
633
+ @utility label-s {
634
+ color: var(--et-type-label-s-color);
635
+ font-family: var(--et-typeface-plain);
636
+ font-weight: var(--et-type-label-s-font-weight);
637
+ font-style: normal;
638
+ font-size: var(--et-type-label-s-size-desktop);
639
+ line-height: var(--et-type-label-s-line-height-desktop);
640
+ letter-spacing: var(--et-type-label-s-tracking-desktop);
641
+ @variant dark {
642
+ color: var(--et-type-label-s-color-dark);
643
+ }
644
+ }
645
+
646
+ @utility button-l {
647
+ color: var(--et-type-button-l-color);
648
+ font-family: var(--et-typeface-plain);
649
+ font-weight: var(--et-type-button-l-font-weight);
650
+ font-style: normal;
651
+ font-size: var(--et-type-button-l-size-desktop);
652
+ line-height: var(--et-type-button-l-line-height-desktop);
653
+ letter-spacing: var(--et-type-button-l-tracking-desktop);
654
+ text-transform: none;
655
+ @variant dark {
656
+ color: var(--et-type-button-l-color-dark);
657
+ }
658
+ }
659
+
660
+ @utility button-m {
661
+ color: var(--et-type-button-m-color);
662
+ font-family: var(--et-typeface-plain);
663
+ font-weight: var(--et-type-button-m-font-weight);
664
+ font-style: normal;
665
+ font-size: var(--et-type-button-m-size-desktop);
666
+ line-height: var(--et-type-button-m-line-height-desktop);
667
+ letter-spacing: var(--et-type-button-m-tracking-desktop);
668
+ text-transform: none;
669
+ @variant dark {
670
+ color: var(--et-type-button-m-color-dark);
671
+ }
672
+ }
673
+
674
+ @utility button-s {
675
+ color: var(--et-type-button-s-color);
676
+ font-family: var(--et-typeface-plain);
677
+ font-weight: var(--et-type-button-s-font-weight);
678
+ font-style: normal;
679
+ font-size: var(--et-type-button-s-size-desktop);
680
+ line-height: var(--et-type-button-s-line-height-desktop);
681
+ letter-spacing: var(--et-type-button-s-tracking-desktop);
682
+ text-transform: none;
683
+ @variant dark {
684
+ color: var(--et-type-button-s-color-dark);
685
+ }
686
+ }
687
+
688
+ @utility link-l {
689
+ color: var(--et-type-link-l-color);
690
+ font-family: var(--et-typeface-plain);
691
+ font-weight: var(--et-type-link-l-font-weight);
692
+ font-style: normal;
693
+ font-size: var(--et-type-link-l-size-desktop);
694
+ line-height: var(--et-type-link-l-line-height-desktop);
695
+ letter-spacing: var(--et-type-link-l-tracking-desktop);
696
+ text-decoration: underline;
697
+ @variant dark {
698
+ color: var(--et-type-link-l-color-dark);
699
+ }
700
+ }
701
+
702
+ @utility link-m {
703
+ color: var(--et-type-link-m-color);
704
+ font-family: var(--et-typeface-plain);
705
+ font-weight: var(--et-type-link-m-font-weight);
706
+ font-style: normal;
707
+ font-size: var(--et-type-link-m-size-desktop);
708
+ line-height: var(--et-type-link-m-line-height-desktop);
709
+ letter-spacing: var(--et-type-link-m-tracking-desktop);
710
+ text-decoration: underline;
711
+ @variant dark {
712
+ color: var(--et-type-link-m-color-dark);
713
+ }
714
+ }
715
+
716
+ @utility link-s {
717
+ color: var(--et-type-link-s-color);
718
+ font-family: var(--et-typeface-plain);
719
+ font-weight: var(--et-type-link-s-font-weight);
720
+ font-style: normal;
721
+ font-size: var(--et-type-link-s-size-desktop);
722
+ line-height: var(--et-type-link-s-line-height-desktop);
723
+ letter-spacing: var(--et-type-link-s-tracking-desktop);
724
+ text-decoration: underline;
725
+ @variant dark {
726
+ color: var(--et-type-link-s-color-dark);
727
+ }
728
+ }