@riverbankcms/sdk 0.108.0 → 0.111.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 (278) hide show
  1. package/README.md +21 -1
  2. package/dist/{PreviewEditorSidebar-BBT-kZAM.mjs → PreviewEditorSidebar-CTR6LUhN.mjs} +181 -135
  3. package/dist/{PreviewEditorUI-D69xNKT2.mjs → PreviewEditorUI-DZg15Zip.mjs} +3 -4
  4. package/dist/{PreviewQueryProvider-RRu7wyQ5.mjs → PreviewQueryProvider-kkmjklLG.mjs} +1 -1
  5. package/dist/{SdkPreviewModeRuntime-CuDjXH6o.mjs → SdkPreviewModeRuntime-DeOTAFvR.mjs} +436 -367
  6. package/dist/{SiteChromeCustomizeContext-BQUY2dEk.mjs → SiteChromeCustomizeContext-DOSDLCiJ.mjs} +3442 -3029
  7. package/dist/_dts/ai/src/contracts/proposals.d.ts +12633 -10490
  8. package/dist/_dts/api/src/bookingAdjustments.d.ts +5 -0
  9. package/dist/_dts/api/src/bookingOperations.d.ts +4 -0
  10. package/dist/_dts/api/src/bookingRecords.d.ts +2 -17
  11. package/dist/_dts/api/src/bookingRefundOutcomes.d.ts +6 -6
  12. package/dist/_dts/api/src/commercePortalEndpoints.d.ts +5 -5
  13. package/dist/_dts/api/src/common/envelope.d.ts +7 -0
  14. package/dist/_dts/api/src/contentRuntime.d.ts +4 -1
  15. package/dist/_dts/api/src/courses.d.ts +31 -15
  16. package/dist/_dts/api/src/customerMembershipOutcomes.d.ts +5 -5
  17. package/dist/_dts/api/src/endpoints.d.ts +49 -4
  18. package/dist/_dts/api/src/index.d.ts +3 -3
  19. package/dist/_dts/api/src/participantMessaging.d.ts +18 -12
  20. package/dist/_dts/api/src/publicExperienceEndpoints.d.ts +1 -0
  21. package/dist/_dts/api/src/sdkContracts.d.ts +259 -1
  22. package/dist/_dts/api/src/siteInfrastructure.d.ts +13 -0
  23. package/dist/_dts/api/src/siteManagementEndpoints.d.ts +6 -6
  24. package/dist/_dts/api/src/siteOperations.d.ts +11 -19
  25. package/dist/_dts/api/src/sitePlatformEndpoints.d.ts +29 -1
  26. package/dist/_dts/api/src/siteRuntimeEndpoints.d.ts +37 -31
  27. package/dist/_dts/api/src/webhooks.d.ts +98 -1
  28. package/dist/_dts/billing/src/site-arrangements.d.ts +3 -0
  29. package/dist/_dts/block-form/src/widgets/BackgroundGradientWidget/BackgroundGradientField.d.ts +9 -0
  30. package/dist/_dts/block-form/src/widgets/BackgroundGradientWidget/BackgroundGradientWidget.d.ts +3 -4
  31. package/dist/_dts/blocks/src/client/course-registration.d.ts +4 -1
  32. package/dist/_dts/blocks/src/client.d.ts +4 -1
  33. package/dist/_dts/blocks/src/contracts/proof-block-islands.d.ts +8 -8
  34. package/dist/_dts/blocks/src/index.d.ts +4 -2
  35. package/dist/_dts/blocks/src/system/blocks/audio-player.d.ts +3 -0
  36. package/dist/_dts/blocks/src/system/blocks/body-text.d.ts +3 -0
  37. package/dist/_dts/blocks/src/system/blocks/contact-newsletter.d.ts +3 -0
  38. package/dist/_dts/blocks/src/system/blocks/course-registration.d.ts +3 -23
  39. package/dist/_dts/blocks/src/system/blocks/courses/shared/types.d.ts +2 -1
  40. package/dist/_dts/blocks/src/system/blocks/cta-full.d.ts +5 -4
  41. package/dist/_dts/blocks/src/system/blocks/event-registration.d.ts +3 -23
  42. package/dist/_dts/blocks/src/system/blocks/events/event-listing.d.ts +2 -1
  43. package/dist/_dts/blocks/src/system/blocks/events/event-spotlight.d.ts +2 -1
  44. package/dist/_dts/blocks/src/system/blocks/events/recurring-schedule.d.ts +3 -2
  45. package/dist/_dts/blocks/src/system/blocks/events/shared/types.d.ts +2 -1
  46. package/dist/_dts/blocks/src/system/blocks/file-download.d.ts +5 -1
  47. package/dist/_dts/blocks/src/system/blocks/form.d.ts +3 -0
  48. package/dist/_dts/blocks/src/system/blocks/image-gallery.d.ts +3 -0
  49. package/dist/_dts/blocks/src/system/blocks/media-text.d.ts +3 -0
  50. package/dist/_dts/blocks/src/system/blocks/newsletter-signup.d.ts +5 -1
  51. package/dist/_dts/blocks/src/system/blocks/shop.d.ts +2 -1
  52. package/dist/_dts/blocks/src/system/blocks/single-button.d.ts +2 -1
  53. package/dist/_dts/blocks/src/system/blocks/site-header.d.ts +3 -0
  54. package/dist/_dts/blocks/src/system/blocks/team-members.d.ts +3 -0
  55. package/dist/_dts/blocks/src/system/blocks/testimonials.d.ts +3 -0
  56. package/dist/_dts/blocks/src/system/blocks/video-grid.d.ts +3 -0
  57. package/dist/_dts/blocks/src/system/constants/background.d.ts +1 -1
  58. package/dist/_dts/blocks/src/system/constants/buttonRoles.d.ts +35 -0
  59. package/dist/_dts/blocks/src/system/customize/backgrounds.d.ts +16 -6
  60. package/dist/_dts/blocks/src/system/defineBlock.d.ts +9 -1
  61. package/dist/_dts/blocks/src/system/fields/button.d.ts +10 -21
  62. package/dist/_dts/blocks/src/system/fields/ctas.d.ts +10 -1
  63. package/dist/_dts/blocks/src/system/fragments/library/heroCtaRow.d.ts +9 -5
  64. package/dist/_dts/blocks/src/system/manifest/schema.d.ts +31 -0
  65. package/dist/_dts/blocks/src/system/runtime/components/registry.client.d.ts +24 -24
  66. package/dist/_dts/blocks/src/system/runtime/components/runtime-backed-blocks.d.ts +12 -12
  67. package/dist/_dts/blocks/src/system/runtime/hooks/useHeadlessWholeSeriesRegistrationFlow.d.ts +29 -0
  68. package/dist/_dts/blocks/src/system/runtime/nodes/buttonAffordance.d.ts +1 -1
  69. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/ErrorStep.d.ts +2 -1
  70. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/PaymentFailedStep.d.ts +2 -1
  71. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/VerifyingTimeoutStep.d.ts +2 -1
  72. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/types.d.ts +21 -0
  73. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/useCourseRegistrationWizard.d.ts +4 -4
  74. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/whole-series-registration.headless.contract.d.ts +326 -0
  75. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/whole-series-registration.headless.planning.d.ts +27 -0
  76. package/dist/_dts/blocks/src/system/runtime/nodes/course-registration.interactive.d.ts +5 -4
  77. package/dist/_dts/blocks/src/system/runtime/nodes/event-registration/event-registration.headless.contract.d.ts +3 -2
  78. package/dist/_dts/blocks/src/system/runtime/nodes/event-registration/types.d.ts +2 -1
  79. package/dist/_dts/blocks/src/system/runtime/nodes/event-registration.interactive.d.ts +5 -4
  80. package/dist/_dts/blocks/src/system/runtime/nodes/file-download.d.ts +2 -3
  81. package/dist/_dts/blocks/src/system/runtime/nodes/newsletter-form.types.d.ts +2 -1
  82. package/dist/_dts/blocks/src/system/runtime/nodes/shared/contract-schemas.d.ts +7 -4
  83. package/dist/_dts/blocks/src/system/runtime/nodes/shop.interactive.d.ts +7 -6
  84. package/dist/_dts/blocks/src/system/runtime/nodes/shop.types.d.ts +2 -1
  85. package/dist/_dts/blocks/src/system/runtime/shared/types.d.ts +2 -1
  86. package/dist/_dts/content-editor/src/FooterComposerPanel.d.ts +4 -2
  87. package/dist/_dts/content-editor/src/index.d.ts +12 -12
  88. package/dist/_dts/content-editor/src/ui/editorUiStore.d.ts +17 -2
  89. package/dist/_dts/content-model/src/content-types/entryValidation.d.ts +31 -0
  90. package/dist/_dts/content-model/src/content-types/scaffold.d.ts +58 -0
  91. package/dist/_dts/content-model/src/content-types/sentinels.d.ts +36 -0
  92. package/dist/_dts/content-model/src/index.d.ts +3 -0
  93. package/dist/_dts/core/src/booking-date-time.d.ts +8 -0
  94. package/dist/_dts/db/src/generated/supabase/database.types.d.ts +3278 -3196
  95. package/dist/_dts/editor-blocks/src/widgets/button/context.d.ts +3 -2
  96. package/dist/_dts/media-core/src/fileMimeDetection.d.ts +16 -0
  97. package/dist/_dts/media-core/src/fileStorage.d.ts +8 -0
  98. package/dist/_dts/media-core/src/storagePathDomain.d.ts +2 -0
  99. package/dist/_dts/media-core/src/uploadVerificationContract.d.ts +3 -0
  100. package/dist/_dts/preview-next/src/client/blocks/BlockToolbar.d.ts +2 -0
  101. package/dist/_dts/preview-next/src/client/index.d.ts +3 -2
  102. package/dist/_dts/preview-next/src/client/preview/ButtonStylePicker.d.ts +16 -0
  103. package/dist/_dts/preview-next/src/client/preview/PageBlockEditorPanel.d.ts +2 -3
  104. package/dist/_dts/preview-next/src/client/preview/PreviewDesignOpenRequestContext.d.ts +7 -0
  105. package/dist/_dts/preview-next/src/client/preview/PreviewEditorSidebar.d.ts +5 -11
  106. package/dist/_dts/preview-next/src/client/preview/PreviewShell.d.ts +5 -6
  107. package/dist/_dts/preview-next/src/client/preview/PreviewShellLayout.d.ts +6 -7
  108. package/dist/_dts/preview-next/src/client/preview/SiteChromeCustomizeContext.d.ts +7 -9
  109. package/dist/_dts/preview-next/src/client/preview/StyleConfigurator.d.ts +4 -11
  110. package/dist/_dts/preview-next/src/client/preview/StyleConfigurator.state.d.ts +8 -7
  111. package/dist/_dts/preview-next/src/client/preview/sidebarTabPreference.d.ts +0 -8
  112. package/dist/_dts/preview-next/src/client/preview/siteChromeLookRows.d.ts +1 -11
  113. package/dist/_dts/preview-next/src/client/preview/siteChromeQuickControlHistoryState.d.ts +1 -5
  114. package/dist/_dts/preview-next/src/client/preview/siteChromeSavePlan.d.ts +2 -3
  115. package/dist/_dts/preview-next/src/client/preview/siteStylePreviewPlanner.d.ts +3 -4
  116. package/dist/_dts/preview-next/src/client/preview/styleConfiguratorApplyPayload.d.ts +1 -1
  117. package/dist/_dts/preview-next/src/client/preview/styleConfiguratorSnapshot.d.ts +3 -5
  118. package/dist/_dts/sdk/src/bookings/index.d.ts +5 -4
  119. package/dist/_dts/sdk/src/bookings/types.d.ts +3 -3
  120. package/dist/_dts/sdk/src/cli/commands/audit.d.ts +1 -1
  121. package/dist/_dts/sdk/src/cli/commands/compare.d.ts +1 -1
  122. package/dist/_dts/sdk/src/cli/commands/deploy.d.ts +1 -1
  123. package/dist/_dts/sdk/src/cli/commands/drafts.d.ts +18 -0
  124. package/dist/_dts/sdk/src/cli/commands/entry.d.ts +15 -0
  125. package/dist/_dts/sdk/src/cli/commands/init-docs.d.ts +2 -2
  126. package/dist/_dts/sdk/src/cli/commands/publish-all.d.ts +1 -1
  127. package/dist/_dts/sdk/src/cli/commands/pull.d.ts +1 -0
  128. package/dist/_dts/sdk/src/cli/commands/push/execute/diff.d.ts +1 -1
  129. package/dist/_dts/sdk/src/cli/commands/push/options.d.ts +3 -0
  130. package/dist/_dts/sdk/src/cli/commands/push-execute.d.ts +12 -1
  131. package/dist/_dts/sdk/src/cli/commands/setup.d.ts +1 -0
  132. package/dist/_dts/sdk/src/cli/commands/style.d.ts +3 -2
  133. package/dist/_dts/sdk/src/cli/commands/verify.d.ts +1 -0
  134. package/dist/_dts/sdk/src/cli/helpers.d.ts +22 -1
  135. package/dist/_dts/sdk/src/cli/index.d.ts +4 -0
  136. package/dist/_dts/sdk/src/cli/output.d.ts +88 -0
  137. package/dist/_dts/sdk/src/cli/program.d.ts +29 -0
  138. package/dist/_dts/sdk/src/cli/push-config.d.ts +1 -1
  139. package/dist/_dts/sdk/src/client/management/catalog.d.ts +10 -0
  140. package/dist/_dts/sdk/src/client/management/http.d.ts +7 -1
  141. package/dist/_dts/sdk/src/client/management/index.d.ts +1 -1
  142. package/dist/_dts/sdk/src/client/management/types.d.ts +45 -20
  143. package/dist/_dts/sdk/src/contracts/system-block-content.d.ts +12 -15
  144. package/dist/_dts/sdk/src/date-time/index.d.ts +68 -0
  145. package/dist/_dts/sdk/src/public-api/contracts.d.ts +3 -1
  146. package/dist/_dts/sdk/src/version.d.ts +1 -1
  147. package/dist/_dts/sdk/src/webhooks/index.d.ts +1 -1
  148. package/dist/_dts/sdk/src/webhooks/verify.d.ts +3 -3
  149. package/dist/_dts/site-commands/src/commands.d.ts +1010 -817
  150. package/dist/_dts/theme-core/src/accordions/types.d.ts +1 -1
  151. package/dist/_dts/theme-core/src/buttons/core.d.ts +15 -46
  152. package/dist/_dts/theme-core/src/buttons/effectClassification.d.ts +147 -0
  153. package/dist/_dts/theme-core/src/buttons/effects/types.d.ts +2 -3
  154. package/dist/_dts/theme-core/src/buttons/generateDefaultButtonSystem.d.ts +1 -1
  155. package/dist/_dts/theme-core/src/buttons/index.d.ts +2 -1
  156. package/dist/_dts/theme-core/src/buttons/presets.d.ts +4 -25
  157. package/dist/_dts/theme-core/src/buttons/resolveButtonColourStates.d.ts +100 -0
  158. package/dist/_dts/theme-core/src/buttons/resolvedButtonCss.d.ts +16 -0
  159. package/dist/_dts/theme-core/src/buttons/styles/domain.d.ts +80 -0
  160. package/dist/_dts/theme-core/src/buttons/styles/index.d.ts +3 -0
  161. package/dist/_dts/theme-core/src/buttons/styles/recipes/defineStaticButtonStyleRecipe.d.ts +49 -0
  162. package/dist/_dts/theme-core/src/buttons/styles/recipes/quietArrow.d.ts +67 -0
  163. package/dist/_dts/theme-core/src/buttons/styles/recipes/staticRecipes.d.ts +649 -0
  164. package/dist/_dts/theme-core/src/buttons/styles/registry.d.ts +753 -0
  165. package/dist/_dts/theme-core/src/buttons/styles/selection.d.ts +69 -0
  166. package/dist/_dts/theme-core/src/buttons/types.d.ts +101 -83
  167. package/dist/_dts/theme-core/src/cards/types.d.ts +16 -16
  168. package/dist/_dts/theme-core/src/generated/containerResponsiveThemeCss.d.ts +1 -1
  169. package/dist/_dts/theme-core/src/gradients/presets.d.ts +200 -8
  170. package/dist/_dts/theme-core/src/gradients/utils.d.ts +6 -2
  171. package/dist/_dts/theme-core/src/mock-themes/all.d.ts +87 -126
  172. package/dist/_dts/theme-core/src/mock-themes/modern-minimal.d.ts +1 -1
  173. package/dist/_dts/theme-core/src/navigation/types.d.ts +2 -2
  174. package/dist/_dts/theme-core/src/palette/curated/index.d.ts +2 -2
  175. package/dist/_dts/theme-core/src/palette/curated/types.d.ts +5 -8
  176. package/dist/_dts/theme-core/src/palette/index.d.ts +0 -1
  177. package/dist/_dts/theme-core/src/schema.d.ts +112 -138
  178. package/dist/_dts/theme-core/src/site-styles/backgroundAppearance.d.ts +2 -2
  179. package/dist/_dts/theme-core/src/site-styles/curatedSiteStyles.d.ts +26 -24
  180. package/dist/_dts/theme-core/src/site-styles/designState.d.ts +10 -10
  181. package/dist/_dts/theme-core/src/site-styles/footerLooks.d.ts +19 -153
  182. package/dist/_dts/theme-core/src/site-styles/headerCtaVariants.d.ts +3 -1
  183. package/dist/_dts/theme-core/src/site-styles/pageDesignEditorModel.d.ts +3 -2
  184. package/dist/_dts/theme-core/src/site-styles/pageDesignIntent.d.ts +13 -6
  185. package/dist/_dts/theme-core/src/site-styles/previewCompiler.d.ts +8 -9
  186. package/dist/_dts/theme-core/src/site-styles/runtimeCompiler.d.ts +33 -12
  187. package/dist/_dts/theme-core/src/site-styles/styleTags.d.ts +2 -2
  188. package/dist/_dts/ui/src/palette/hex.d.ts +3 -3
  189. package/dist/cli/index.mjs +68396 -67339
  190. package/dist/cli/init-docs/content/cli-reference.md +50 -7
  191. package/dist/cli/init-docs/content/content-management.md +7 -4
  192. package/dist/cli/init-docs/content/workflow-isr-revalidation.md +1 -1
  193. package/dist/cli/init-docs/content/workflow-publish.md +5 -1
  194. package/dist/client/{DiscountCodeDisclosure-D6TOf6Hi.mjs → DiscountCodeDisclosure-C4xvTBux.mjs} +1 -1
  195. package/dist/client/{EventCombined.client-Dao3zxRk.mjs → EventCombined.client-Cr7G131j.mjs} +2 -3
  196. package/dist/client/{EventListing.client-B2NNt4y1.mjs → EventListing.client-CAjbseNy.mjs} +2 -2
  197. package/dist/client/{LeafletStaticMap-BhwFo16w.mjs → LeafletStaticMap-BMlWfwz3.mjs} +1 -1
  198. package/dist/client/{MagicLinkForm-BWnB7cMR.mjs → MagicLinkForm-ChdFz96y.mjs} +1 -2
  199. package/dist/client/{StepIndicator-TzRiQ0BY.mjs → StepIndicator-7D3GaBeM.mjs} +2 -2
  200. package/dist/client/{accordion-BPy-AJ4_.mjs → accordion-D8JTs2Si.mjs} +1 -1
  201. package/dist/client/{bookingForm-BL4PGZds.mjs → bookingForm-H3DCRBHs.mjs} +6 -7
  202. package/dist/client/bookings.mjs +4649 -2767
  203. package/dist/client/{carousel-C2b7Cn9-.mjs → carousel-DMr_QWlz.mjs} +1 -1
  204. package/dist/client/{cart-BQcbXIVD.mjs → cart-DWMbfBdR.mjs} +3 -3
  205. package/dist/client/{checkout-DEmpGRJu.mjs → checkout-zmfdkXLx.mjs} +3 -3
  206. package/dist/client/client.mjs +3195 -2488
  207. package/dist/client/{colorStyles-jZS6KfkP.mjs → colorStyles-gcTh5yZT.mjs} +2 -41
  208. package/dist/client/{colorTokenParts-CMugwvX_.mjs → colorTokenParts-FSS3al6l.mjs} +31 -1
  209. package/dist/client/{courseRegistration-BqRZPmsq.mjs → courseRegistration-Z_mn18jy.mjs} +100 -37
  210. package/dist/client/{eventCalendar-B8N_tSl5.mjs → eventCalendar-CYp0YJGF.mjs} +4 -5
  211. package/dist/client/{eventCombined-Gjn6gtq7.mjs → eventCombined-rKyYZUa9.mjs} +2 -2
  212. package/dist/client/{eventDetails-M-VCxA-r.mjs → eventDetails-X0ZaUuMj.mjs} +3 -3
  213. package/dist/client/{eventListing-DR19hqYi.mjs → eventListing-W1SuL7EP.mjs} +2 -2
  214. package/dist/client/{eventRegistration-BR02a0k3.mjs → eventRegistration-ClWricui.mjs} +6 -7
  215. package/dist/client/{form-LY2xIbwg.mjs → form--eKPwAAD.mjs} +1 -2
  216. package/dist/client/{headerSection-CYwwXJfh.mjs → headerSection-BSeGr-FS.mjs} +2 -3
  217. package/dist/client/hooks.mjs +2169 -2093
  218. package/dist/client/{locationMap-DWnBXrFq.mjs → locationMap-BpOrtNYn.mjs} +8 -5
  219. package/dist/client/{media-DHtSxS5V.mjs → media-DoF0dcVx.mjs} +4 -3
  220. package/dist/client/{newsletterForm-D9s-fQ2P.mjs → newsletterForm-Bt7it7Dy.mjs} +1 -2
  221. package/dist/client/{pricing-DDq80oYc.mjs → pricing-BTjSDDr4.mjs} +1 -1
  222. package/dist/client/{productDetail-B0SbWd45.mjs → productDetail-ICnVTcCg.mjs} +3 -3
  223. package/dist/client/{productList-PwYlZn0y.mjs → productList-ZHr6D604.mjs} +3 -3
  224. package/dist/client/{propsDecoder-BRWBiH7i.mjs → propsDecoder-wWN0tBDF.mjs} +2484 -223
  225. package/dist/client/rendering/client.mjs +2532 -2144
  226. package/dist/client/rendering/islands.mjs +20 -20
  227. package/dist/client/rendering.mjs +3322 -2462
  228. package/dist/client/{shop-CMwZPYME.mjs → shop-C1u_BUn0.mjs} +5 -6
  229. package/dist/client/{shop-commerce-BuxsFate.mjs → shop-commerce-CleZdRha.mjs} +5 -6
  230. package/dist/client/{shop-commerce-store-boYlEJ91.mjs → shop-commerce-store-ycnoB2Ce.mjs} +1 -1
  231. package/dist/client/{shopShared-D2naaOes.mjs → shopShared-CPhByt2a.mjs} +3 -3
  232. package/dist/client/{useDiscountCodeUi-D9RHpVoj.mjs → useDiscountCodeUi-cStSQI6C.mjs} +1 -1
  233. package/dist/client/{useEventFilters-igGiK1re.mjs → useEventFilters-DKPN7hSY.mjs} +46 -70
  234. package/dist/client/{usePolling-CI7MbsFB.mjs → usePolling-BKAd6pkZ.mjs} +2 -2
  235. package/dist/preview-next/before-render.mjs +72 -6
  236. package/dist/preview-next/client/runtime.mjs +4 -4
  237. package/dist/preview-next/middleware.mjs +72 -6
  238. package/dist/{previewAuthStore-a_cBD28m.mjs → previewAuthStore-BkT1D06A.mjs} +72 -6
  239. package/dist/{sdk-runtime-MBzD-GmP.mjs → sdk-runtime-hu3wr3ng.mjs} +2 -2
  240. package/dist/{separator-5ahRBC85.mjs → separator-Bln8izQ9.mjs} +1 -1
  241. package/dist/server/components.mjs +3123 -2391
  242. package/dist/server/config-validation.mjs +2169 -2093
  243. package/dist/server/config.mjs +2169 -2093
  244. package/dist/server/data.mjs +2169 -2093
  245. package/dist/server/date-time.mjs +386 -0
  246. package/dist/server/index.mjs +73 -7
  247. package/dist/server/next/revalidate.mjs +53 -1
  248. package/dist/server/next.mjs +3195 -2397
  249. package/dist/server/page-converter.mjs +2192 -1945
  250. package/dist/server/prebuild.mjs +1 -1
  251. package/dist/server/rendering/server.mjs +2844 -2325
  252. package/dist/server/rendering.mjs +3123 -2391
  253. package/dist/server/routing.mjs +2269 -2149
  254. package/dist/server/server.mjs +2244 -2102
  255. package/dist/server/theme-bridge.mjs +2720 -1887
  256. package/dist/server/theme.mjs +1669 -1322
  257. package/dist/server/webhooks.mjs +54 -2
  258. package/dist/styles/index.css +5 -0
  259. package/package.json +7 -1
  260. package/dist/_dts/theme-core/src/buttons/personalities/brushed-wash.d.ts +0 -16
  261. package/dist/_dts/theme-core/src/buttons/personalities/confident-chip.d.ts +0 -16
  262. package/dist/_dts/theme-core/src/buttons/personalities/earth-pill.d.ts +0 -16
  263. package/dist/_dts/theme-core/src/buttons/personalities/editorial-link.d.ts +0 -16
  264. package/dist/_dts/theme-core/src/buttons/personalities/flat-ink.d.ts +0 -20
  265. package/dist/_dts/theme-core/src/buttons/personalities/index.d.ts +0 -172
  266. package/dist/_dts/theme-core/src/buttons/personalities/ink-stamp.d.ts +0 -16
  267. package/dist/_dts/theme-core/src/buttons/personalities/joy-stamp.d.ts +0 -22
  268. package/dist/_dts/theme-core/src/buttons/personalities/ornate-ritual.d.ts +0 -16
  269. package/dist/_dts/theme-core/src/buttons/personalities/pebble.d.ts +0 -16
  270. package/dist/_dts/theme-core/src/buttons/personalities/quiet-arrow.d.ts +0 -17
  271. package/dist/_dts/theme-core/src/buttons/personalities/showtime-pill.d.ts +0 -17
  272. package/dist/_dts/theme-core/src/buttons/personalities/soft-pill.d.ts +0 -16
  273. package/dist/_dts/theme-core/src/buttons/personalities/two-tone-pill.d.ts +0 -17
  274. package/dist/_dts/theme-core/src/buttons/personalities/types.d.ts +0 -273
  275. package/dist/_dts/theme-core/src/buttons/presets/types.d.ts +0 -88
  276. package/dist/_dts/theme-core/src/buttons/utils/contrast.d.ts +0 -38
  277. package/dist/_dts/theme-core/src/palette/themePaletteCompatibility.d.ts +0 -57
  278. package/dist/client/buttons-EBjyslaX.mjs +0 -1852
@@ -1,1852 +0,0 @@
1
- import { $ as themeColorTokenSchema } from "./propsDecoder-BRWBiH7i.mjs";
2
- import { z as z$1 } from "zod";
3
- //#region ../theme-core/src/buttons/types.ts
4
- /**
5
- * Standard semantic variant roles a theme exposes.
6
- *
7
- * Block content references variants by role; the active theme determines
8
- * what each role looks like.
9
- */
10
- const VARIANT_ROLES = [
11
- "primary",
12
- "secondary",
13
- "outline",
14
- "ghost",
15
- "link",
16
- "tertiary",
17
- "accent"
18
- ];
19
- const cornerStyleSchema = z$1.enum([
20
- "square",
21
- "rounded",
22
- "pill"
23
- ]);
24
- const shadowSizeSchema = z$1.enum([
25
- "none",
26
- "low",
27
- "medium",
28
- "high"
29
- ]);
30
- const textTransformSchema = z$1.enum([
31
- "none",
32
- "uppercase",
33
- "lowercase",
34
- "capitalize"
35
- ]);
36
- const fontWeightSchema = z$1.union([
37
- z$1.literal(500),
38
- z$1.literal(600),
39
- z$1.literal(700)
40
- ]);
41
- const buttonTypographySchema = z$1.enum(["body", "heading"]);
42
- const letterSpacingSchema = z$1.enum([
43
- "tight",
44
- "normal",
45
- "loose"
46
- ]);
47
- const hoverTransformSchema = z$1.enum([
48
- "none",
49
- "lift",
50
- "scale",
51
- "press"
52
- ]);
53
- const hoverColorSchema = z$1.enum([
54
- "none",
55
- "brighten",
56
- "darken",
57
- "saturate",
58
- "token"
59
- ]);
60
- const buttonPaddingPresetSchema = z$1.enum([
61
- "compact",
62
- "default",
63
- "spacious"
64
- ]);
65
- const gradientStyleSchema = z$1.enum([
66
- "linear",
67
- "radial",
68
- "conic"
69
- ]);
70
- const gradientSharpnessSchema = z$1.enum([
71
- "smooth",
72
- "medium",
73
- "hard"
74
- ]);
75
- const prioritySchema = z$1.union([
76
- z$1.literal(1),
77
- z$1.literal(2),
78
- z$1.literal(3)
79
- ]);
80
- z$1.enum(VARIANT_ROLES);
81
- const buttonSizeNameSchema = z$1.enum([
82
- "sm",
83
- "md",
84
- "lg",
85
- "xl"
86
- ]);
87
- /**
88
- * CSS padding string in `"<vertical> <horizontal>"` shorthand form.
89
- *
90
- * Exactly two space-separated CSS length tokens. Each token is either the
91
- * literal `0` or a number followed by `rem`/`em`/`px`/`%`. This lets the
92
- * generator trust the shape rather than defensively defaulting downstream.
93
- */
94
- const PADDING_TOKEN_PATTERN = /^(?:0|\d+(?:\.\d+)?(?:rem|em|px|%))$/;
95
- const paddingShorthandSchema = z$1.string().refine((value) => {
96
- const parts = value.split(/\s+/).filter(Boolean);
97
- return parts.length === 2 && parts.every((token) => PADDING_TOKEN_PATTERN.test(token));
98
- }, { message: "Padding must be two space-separated CSS length tokens (e.g. \"0.5rem 1rem\"). Use `0` for zero." });
99
- const buttonSizeConfigSchema = z$1.object({
100
- padding: paddingShorthandSchema,
101
- fontSize: z$1.string().optional()
102
- });
103
- /**
104
- * `xl` is optional on the wire so themes persisted before the `xl` size was
105
- * added (e.g. SWTS) continue to parse. When `xl` is missing the schema
106
- * backfills it from `lg`, keeping `ButtonSizes` a complete `sm/md/lg/xl` map
107
- * downstream — generators never need to deal with an undefined `xl`.
108
- */
109
- const buttonSizesSchema = z$1.object({
110
- sm: buttonSizeConfigSchema,
111
- md: buttonSizeConfigSchema,
112
- lg: buttonSizeConfigSchema,
113
- xl: buttonSizeConfigSchema.optional()
114
- }).transform(({ sm, md, lg, xl }) => ({
115
- sm,
116
- md,
117
- lg,
118
- xl: xl ?? lg
119
- }));
120
- const buttonGlobalSettingsSchema = z$1.object({
121
- cornerStyle: cornerStyleSchema,
122
- cornerRadius: z$1.number().min(0).max(24).optional(),
123
- /**
124
- * Family-level shadow inherited by variants that don't set their own.
125
- * Optional and flat-by-default: when omitted, buttons carry no drop shadow
126
- * (`elevation: 'none'`). A personality opts the whole family into a shadow by
127
- * setting this; individual variants still override. There is no system-level
128
- * shadow-by-default — shadows only appear when explicitly declared.
129
- */
130
- shadow: shadowSizeSchema.optional(),
131
- textTransform: textTransformSchema,
132
- fontWeight: fontWeightSchema,
133
- /**
134
- * @deprecated Set per-variant via `variant.border.widthClass` instead.
135
- * Schema field is preserved so existing presets parse; the value is unread
136
- * by the current generator and will be removed once the legacy
137
- * `primitives/content/components/Button.tsx` slot exports are deleted.
138
- */
139
- borderWidth: z$1.union([
140
- z$1.literal(1),
141
- z$1.literal(2),
142
- z$1.literal(3)
143
- ]),
144
- typography: buttonTypographySchema.optional(),
145
- fontSize: z$1.string().optional(),
146
- letterSpacing: letterSpacingSchema.optional(),
147
- italic: z$1.boolean().optional(),
148
- paddingPreset: buttonPaddingPresetSchema.optional(),
149
- hoverTransform: hoverTransformSchema,
150
- hoverColor: hoverColorSchema,
151
- hoverColorToken: themeColorTokenSchema.optional(),
152
- gradientStyle: gradientStyleSchema.optional(),
153
- gradientAngle: z$1.number().min(0).max(360).optional(),
154
- gradientSharpness: gradientSharpnessSchema.optional()
155
- });
156
- const gradientDirectionSchema = z$1.enum([
157
- "to-r",
158
- "to-l",
159
- "to-t",
160
- "to-b",
161
- "to-tr",
162
- "to-tl",
163
- "to-br",
164
- "to-bl"
165
- ]);
166
- const buttonBackgroundSchema = z$1.discriminatedUnion("type", [
167
- z$1.object({
168
- type: z$1.literal("solid"),
169
- colorToken: themeColorTokenSchema
170
- }),
171
- z$1.object({
172
- type: z$1.literal("gradient"),
173
- stops: z$1.array(themeColorTokenSchema).min(2),
174
- direction: gradientDirectionSchema
175
- }),
176
- z$1.object({ type: z$1.literal("transparent") })
177
- ]);
178
- const effectApplicationSchema = z$1.object({
179
- effectId: z$1.string(),
180
- options: z$1.record(z$1.string(), z$1.any()).optional()
181
- });
182
- const buttonBorderSchema = z$1.object({
183
- widthClass: z$1.string(),
184
- colorToken: themeColorTokenSchema
185
- });
186
- const buttonVariantAffordanceSchema = z$1.object({
187
- iconId: z$1.string().min(1),
188
- colorToken: themeColorTokenSchema.optional()
189
- });
190
- const variantShadowSchema = z$1.object({
191
- elevation: z$1.enum([
192
- "none",
193
- "low",
194
- "medium",
195
- "high"
196
- ]),
197
- softness: z$1.enum([
198
- "crisp",
199
- "soft",
200
- "hard"
201
- ]).nullable(),
202
- position: z$1.enum(["bottom", "bottom-right"]).default("bottom"),
203
- colorToken: themeColorTokenSchema.optional()
204
- });
205
- const variantEffectsSchema = z$1.object({
206
- base: z$1.array(effectApplicationSchema).optional(),
207
- hover: z$1.array(effectApplicationSchema).optional(),
208
- active: z$1.array(effectApplicationSchema).optional(),
209
- focus: z$1.array(effectApplicationSchema).optional()
210
- });
211
- /**
212
- * Per-variant size overrides schema — every entry is optional.
213
- *
214
- * For each size key present, the values override the theme's `sizes` config
215
- * for that size on this variant. Missing sizes fall through to theme.sizes,
216
- * then system defaults.
217
- */
218
- const variantSizeOverridesSchema = z$1.object({
219
- sm: buttonSizeConfigSchema.optional(),
220
- md: buttonSizeConfigSchema.optional(),
221
- lg: buttonSizeConfigSchema.optional(),
222
- xl: buttonSizeConfigSchema.optional()
223
- });
224
- /**
225
- * Unified variant schema. Every variant participates in the size system; the
226
- * optional `sizes` field lets a variant scale differently than the theme
227
- * default (e.g. link-style variants declaring zero horizontal padding at
228
- * every size).
229
- */
230
- const buttonVariantSchema = z$1.object({
231
- id: z$1.string(),
232
- name: z$1.string().min(1).max(20),
233
- enabled: z$1.boolean(),
234
- priority: prioritySchema,
235
- background: buttonBackgroundSchema,
236
- textColorToken: themeColorTokenSchema,
237
- /** Tailwind radius token (e.g. `'rounded-md'`). Omit to inherit from `global.cornerStyle`. */
238
- borderRadius: z$1.string().optional(),
239
- shadow: variantShadowSchema.optional(),
240
- border: buttonBorderSchema.optional(),
241
- hoverBackgroundToken: z$1.string().optional(),
242
- effects: variantEffectsSchema.optional(),
243
- sizes: variantSizeOverridesSchema.optional(),
244
- affordance: buttonVariantAffordanceSchema.optional()
245
- });
246
- const buttonSystemSchema = z$1.object({
247
- global: buttonGlobalSettingsSchema,
248
- variants: z$1.array(buttonVariantSchema).min(1).max(6),
249
- sizes: buttonSizesSchema.optional()
250
- });
251
- //#endregion
252
- //#region ../theme-core/src/buttons/classNames.ts
253
- function themeButtonVariantClassNames(variant) {
254
- if (variant === "default") return [variant];
255
- return [variant, `button-${variant}`];
256
- }
257
- function themeButtonSizeClassName(size) {
258
- return `btn-${size}`;
259
- }
260
- function themeButtonClassName(spec) {
261
- return [
262
- ...themeButtonVariantClassNames(spec.variant),
263
- themeButtonSizeClassName(spec.size),
264
- spec.extraClassName
265
- ].filter(Boolean).join(" ");
266
- }
267
- buttonSizeNameSchema.options;
268
- //#endregion
269
- //#region ../theme-core/src/site-styles/styleTags.ts
270
- /**
271
- * Descriptive style-axis metadata for button personalities and palette
272
- * variants. Site Style picker shape is curated explicitly; these tags remain
273
- * for catalog audit, docs, and future discovery tooling.
274
- */
275
- const STYLE_AXIS_VALUES = {
276
- tone: [
277
- "minimal",
278
- "classic",
279
- "bold"
280
- ],
281
- energy: ["calm", "vibrant"],
282
- motion: [
283
- "subtle",
284
- "standard",
285
- "expressive"
286
- ],
287
- era: [
288
- "editorial",
289
- "modern",
290
- "organic",
291
- "technical",
292
- "retro"
293
- ]
294
- };
295
- const styleTagsSchema = z$1.object({
296
- tone: z$1.enum(STYLE_AXIS_VALUES.tone).optional(),
297
- energy: z$1.enum(STYLE_AXIS_VALUES.energy).optional(),
298
- motion: z$1.enum(STYLE_AXIS_VALUES.motion).optional(),
299
- era: z$1.enum(STYLE_AXIS_VALUES.era).optional()
300
- });
301
- //#endregion
302
- //#region ../theme-core/src/buttons/personalities/types.ts
303
- function asButtonPersonalityId(value) {
304
- if (value.length === 0) throw new Error("ButtonPersonalityId must be a non-empty string");
305
- return value;
306
- }
307
- const buttonPersonalityIdSchema = z$1.string().min(1).transform((value) => asButtonPersonalityId(value));
308
- z$1.object({
309
- id: buttonPersonalityIdSchema,
310
- name: z$1.string().min(1),
311
- description: z$1.string().min(1),
312
- tags: styleTagsSchema,
313
- buttonSystem: buttonSystemSchema
314
- });
315
- /**
316
- * Helper for personality file modules to keep the call site short and
317
- * type-safe. `as const satisfies ...` would also work but produces wider
318
- * types at use sites.
319
- */
320
- function defineButtonPersonality(input) {
321
- return {
322
- id: asButtonPersonalityId(input.id),
323
- name: input.name,
324
- description: input.description,
325
- tags: input.tags,
326
- buttonSystem: input.buttonSystem
327
- };
328
- }
329
- //#endregion
330
- //#region ../theme-core/src/buttons/personalities/brushed-wash.ts
331
- /**
332
- * Brushed Wash — gradient backgrounds that read as watercolour washes.
333
- * Generous padding, soft shadows; pairs with vibrant organic brands.
334
- */
335
- const brushedWash = defineButtonPersonality({
336
- id: "brushed-wash",
337
- name: "Brushed Wash",
338
- description: "Watercolour-gradient buttons with soft shadows and generous padding.",
339
- tags: {
340
- tone: "classic",
341
- energy: "vibrant",
342
- motion: "standard",
343
- era: "organic"
344
- },
345
- buttonSystem: {
346
- global: {
347
- cornerStyle: "rounded",
348
- shadow: "low",
349
- textTransform: "none",
350
- fontWeight: 500,
351
- borderWidth: 1,
352
- hoverTransform: "none",
353
- hoverColor: "none"
354
- },
355
- sizes: {
356
- sm: {
357
- padding: "0.75rem 2rem",
358
- fontSize: "text-sm"
359
- },
360
- md: { padding: "1rem 2.5rem" },
361
- lg: {
362
- padding: "1.25rem 3rem",
363
- fontSize: "text-lg"
364
- },
365
- xl: {
366
- padding: "1.625rem 3.75rem",
367
- fontSize: "text-xl"
368
- }
369
- },
370
- variants: [
371
- {
372
- id: "primary",
373
- name: "Primary",
374
- enabled: true,
375
- priority: 1,
376
- background: {
377
- type: "gradient",
378
- stops: ["primary", "accent"],
379
- direction: "to-r"
380
- },
381
- textColorToken: "primaryForeground",
382
- borderRadius: "rounded-lg",
383
- shadow: {
384
- elevation: "low",
385
- softness: "soft",
386
- position: "bottom"
387
- },
388
- effects: { hover: [{
389
- effectId: "opacity-reduce",
390
- options: { reduction: -15 }
391
- }] }
392
- },
393
- {
394
- id: "secondary",
395
- name: "Secondary",
396
- enabled: true,
397
- priority: 2,
398
- background: {
399
- type: "gradient",
400
- stops: ["secondary", "accent"],
401
- direction: "to-br"
402
- },
403
- textColorToken: "primaryForeground",
404
- borderRadius: "rounded-lg",
405
- shadow: {
406
- elevation: "low",
407
- softness: "soft",
408
- position: "bottom"
409
- },
410
- effects: { hover: [{
411
- effectId: "opacity-reduce",
412
- options: { reduction: -15 }
413
- }] }
414
- },
415
- {
416
- id: "outline",
417
- name: "Outline",
418
- enabled: true,
419
- priority: 3,
420
- background: { type: "transparent" },
421
- textColorToken: "primary",
422
- borderRadius: "rounded-lg",
423
- border: {
424
- widthClass: "border",
425
- colorToken: "primary"
426
- },
427
- effects: { hover: [{
428
- effectId: "background-on-hover",
429
- options: { colorToken: "surface" }
430
- }] }
431
- },
432
- {
433
- id: "ghost",
434
- name: "Ghost",
435
- enabled: true,
436
- priority: 3,
437
- background: { type: "transparent" },
438
- textColorToken: "text",
439
- borderRadius: "rounded-lg",
440
- effects: { hover: [{
441
- effectId: "background-on-hover",
442
- options: { colorToken: "surface" }
443
- }] }
444
- }
445
- ]
446
- }
447
- });
448
- //#endregion
449
- //#region ../theme-core/src/buttons/personalities/confident-chip.ts
450
- /**
451
- * Confident Chip — moderate-radius solid buttons that read as competent and
452
- * direct. Default for Clear Professional; works for any modern brand voice.
453
- */
454
- const confidentChip = defineButtonPersonality({
455
- id: "confident-chip",
456
- name: "Confident Chip",
457
- description: "Mid-radius solid buttons with a crisp hover.",
458
- tags: {
459
- tone: "classic",
460
- energy: "calm",
461
- motion: "standard",
462
- era: "modern"
463
- },
464
- buttonSystem: {
465
- global: {
466
- cornerStyle: "rounded",
467
- shadow: "medium",
468
- textTransform: "none",
469
- fontWeight: 600,
470
- borderWidth: 1,
471
- hoverTransform: "none",
472
- hoverColor: "none"
473
- },
474
- variants: [
475
- {
476
- id: "primary",
477
- name: "Primary",
478
- enabled: true,
479
- priority: 1,
480
- background: {
481
- type: "solid",
482
- colorToken: "primary"
483
- },
484
- textColorToken: "primaryForeground",
485
- borderRadius: "rounded-md",
486
- shadow: {
487
- elevation: "medium",
488
- softness: "soft",
489
- position: "bottom"
490
- },
491
- effects: {
492
- hover: [{
493
- effectId: "darken-background",
494
- options: { amount: 60 }
495
- }],
496
- active: [{
497
- effectId: "scale-down",
498
- options: { scale: "0.97" }
499
- }]
500
- }
501
- },
502
- {
503
- id: "secondary",
504
- name: "Secondary",
505
- enabled: true,
506
- priority: 2,
507
- background: {
508
- type: "solid",
509
- colorToken: "surface"
510
- },
511
- textColorToken: "text",
512
- borderRadius: "rounded-md",
513
- border: {
514
- widthClass: "border",
515
- colorToken: "border"
516
- },
517
- effects: { hover: [{
518
- effectId: "background-on-hover",
519
- options: { colorToken: "background" }
520
- }] }
521
- },
522
- {
523
- id: "outline",
524
- name: "Outline",
525
- enabled: true,
526
- priority: 3,
527
- background: { type: "transparent" },
528
- textColorToken: "primary",
529
- borderRadius: "rounded-md",
530
- border: {
531
- widthClass: "border",
532
- colorToken: "primary"
533
- },
534
- effects: { hover: [{
535
- effectId: "background-on-hover",
536
- options: { colorToken: "surface" }
537
- }] }
538
- },
539
- {
540
- id: "ghost",
541
- name: "Ghost",
542
- enabled: true,
543
- priority: 3,
544
- background: { type: "transparent" },
545
- textColorToken: "primary",
546
- borderRadius: "rounded-md",
547
- effects: { hover: [{
548
- effectId: "background-on-hover",
549
- options: { colorToken: "surface" }
550
- }] }
551
- }
552
- ]
553
- }
554
- });
555
- //#endregion
556
- //#region ../theme-core/src/buttons/personalities/earth-pill.ts
557
- /**
558
- * Earth Pill - warm studio pills with compact, primary-coloured ghost CTAs.
559
- * Built for grounded editorial wellness styles such as Soft Earth.
560
- */
561
- const earthPill = defineButtonPersonality({
562
- id: "earth-pill",
563
- name: "Earth Pill",
564
- description: "Compact terracotta pills with quiet primary-coloured ghost CTAs.",
565
- tags: {
566
- tone: "classic",
567
- energy: "calm",
568
- motion: "subtle",
569
- era: "organic"
570
- },
571
- buttonSystem: {
572
- global: {
573
- cornerStyle: "pill",
574
- shadow: "low",
575
- textTransform: "none",
576
- fontWeight: 500,
577
- borderWidth: 1,
578
- hoverTransform: "lift",
579
- hoverColor: "none",
580
- typography: "body",
581
- paddingPreset: "default"
582
- },
583
- sizes: {
584
- sm: {
585
- padding: "0.5rem 1rem",
586
- fontSize: "text-sm"
587
- },
588
- md: { padding: "0.625rem 1.35rem" },
589
- lg: {
590
- padding: "0.75rem 1.65rem",
591
- fontSize: "text-lg"
592
- },
593
- xl: {
594
- padding: "0.875rem 2rem",
595
- fontSize: "text-xl"
596
- }
597
- },
598
- variants: [
599
- {
600
- id: "primary",
601
- name: "Primary",
602
- enabled: true,
603
- priority: 1,
604
- background: {
605
- type: "solid",
606
- colorToken: "primary"
607
- },
608
- textColorToken: "primaryForeground",
609
- borderRadius: "rounded-full",
610
- shadow: {
611
- elevation: "low",
612
- softness: "soft",
613
- position: "bottom"
614
- },
615
- effects: {
616
- hover: [{
617
- effectId: "lift",
618
- options: { translateY: "-1px" }
619
- }, {
620
- effectId: "background-on-hover",
621
- options: { colorToken: "accent" }
622
- }],
623
- active: [{
624
- effectId: "scale-down",
625
- options: { scale: "0.98" }
626
- }]
627
- }
628
- },
629
- {
630
- id: "secondary",
631
- name: "Secondary",
632
- enabled: true,
633
- priority: 2,
634
- background: { type: "transparent" },
635
- textColorToken: "primary",
636
- borderRadius: "rounded-full",
637
- border: {
638
- widthClass: "border",
639
- colorToken: "primary"
640
- },
641
- effects: { hover: [{
642
- effectId: "background-on-hover",
643
- options: { colorToken: "muted" }
644
- }] }
645
- },
646
- {
647
- id: "outline",
648
- name: "Outline",
649
- enabled: true,
650
- priority: 3,
651
- background: { type: "transparent" },
652
- textColorToken: "text",
653
- borderRadius: "rounded-full",
654
- border: {
655
- widthClass: "border",
656
- colorToken: "border"
657
- },
658
- effects: { hover: [{
659
- effectId: "background-on-hover",
660
- options: { colorToken: "surfaceAlt" }
661
- }] }
662
- },
663
- {
664
- id: "ghost",
665
- name: "Ghost",
666
- enabled: true,
667
- priority: 3,
668
- background: { type: "transparent" },
669
- textColorToken: "primary",
670
- borderRadius: "rounded-full",
671
- shadow: {
672
- elevation: "none",
673
- softness: null,
674
- position: "bottom"
675
- },
676
- sizes: {
677
- sm: {
678
- padding: "0.25rem 0",
679
- fontSize: "text-sm"
680
- },
681
- md: { padding: "0.375rem 0" },
682
- lg: {
683
- padding: "0.5rem 0",
684
- fontSize: "text-lg"
685
- },
686
- xl: {
687
- padding: "0.625rem 0",
688
- fontSize: "text-xl"
689
- }
690
- },
691
- effects: { hover: [{
692
- effectId: "opacity-reduce",
693
- options: { reduction: 25 }
694
- }] }
695
- }
696
- ]
697
- }
698
- });
699
- //#endregion
700
- //#region ../theme-core/src/buttons/personalities/editorial-link.ts
701
- /**
702
- * Editorial Link — all variants are link-style with a growing underline.
703
- * Default for Warm Editorial and Quiet Luxury; reads as refined and quiet.
704
- */
705
- const editorialLink = defineButtonPersonality({
706
- id: "editorial-link",
707
- name: "Editorial Link",
708
- description: "Link-style with a growing underline. Refined, typographic.",
709
- tags: {
710
- tone: "minimal",
711
- energy: "calm",
712
- motion: "subtle",
713
- era: "editorial"
714
- },
715
- buttonSystem: {
716
- global: {
717
- cornerStyle: "square",
718
- textTransform: "none",
719
- fontWeight: 500,
720
- borderWidth: 1,
721
- hoverTransform: "none",
722
- hoverColor: "none"
723
- },
724
- variants: [
725
- {
726
- id: "primary",
727
- name: "Primary",
728
- enabled: true,
729
- priority: 1,
730
- background: { type: "transparent" },
731
- textColorToken: "text",
732
- borderRadius: "rounded-none",
733
- sizes: {
734
- sm: { padding: "0.25rem 0" },
735
- md: { padding: "0.5rem 0" },
736
- lg: { padding: "0.625rem 0" },
737
- xl: { padding: "0.75rem 0" }
738
- },
739
- effects: { base: [{
740
- effectId: "border-bottom-grow",
741
- options: {
742
- height: 2,
743
- colorToken: "text",
744
- origin: "left"
745
- }
746
- }] }
747
- },
748
- {
749
- id: "secondary",
750
- name: "Secondary",
751
- enabled: true,
752
- priority: 2,
753
- background: { type: "transparent" },
754
- textColorToken: "mutedText",
755
- borderRadius: "rounded-none",
756
- sizes: {
757
- sm: { padding: "0.25rem 0" },
758
- md: { padding: "0.5rem 0" },
759
- lg: { padding: "0.625rem 0" },
760
- xl: { padding: "0.75rem 0" }
761
- },
762
- effects: { base: [{
763
- effectId: "border-bottom-grow",
764
- options: {
765
- height: 1,
766
- colorToken: "mutedText",
767
- origin: "left"
768
- }
769
- }] }
770
- },
771
- {
772
- id: "outline",
773
- name: "Outline",
774
- enabled: true,
775
- priority: 3,
776
- background: { type: "transparent" },
777
- textColorToken: "accent",
778
- borderRadius: "rounded-none",
779
- sizes: {
780
- sm: { padding: "0.25rem 0" },
781
- md: { padding: "0.5rem 0" },
782
- lg: { padding: "0.625rem 0" },
783
- xl: { padding: "0.75rem 0" }
784
- },
785
- effects: { base: [{
786
- effectId: "border-bottom-grow",
787
- options: {
788
- height: 1,
789
- colorToken: "accent",
790
- origin: "left"
791
- }
792
- }] }
793
- },
794
- {
795
- id: "ghost",
796
- name: "Ghost",
797
- enabled: true,
798
- priority: 3,
799
- background: { type: "transparent" },
800
- textColorToken: "mutedText",
801
- borderRadius: "rounded-none",
802
- sizes: {
803
- sm: { padding: "0.25rem 0" },
804
- md: { padding: "0.5rem 0" },
805
- lg: { padding: "0.625rem 0" },
806
- xl: { padding: "0.75rem 0" }
807
- },
808
- effects: { hover: [{
809
- effectId: "opacity-reduce",
810
- options: { reduction: -20 }
811
- }] }
812
- }
813
- ]
814
- }
815
- });
816
- //#endregion
817
- //#region ../theme-core/src/buttons/personalities/flat-ink.ts
818
- /**
819
- * Flat Ink — a solid ink primary, a hairline ghost secondary, and a single
820
- * amber accent climax, all completely flat (no drop shadow) with a modest
821
- * radius. Reads as grounded, editorial and clinician-precise: the Fulcrum
822
- * physiotherapy voice. The primary shifts to the secondary (moss) on hover and
823
- * every variant lifts 2px; the amber accent is meant to be used sparingly as
824
- * the page's one conversion climax.
825
- */
826
- const flatInk = defineButtonPersonality({
827
- id: "flat-ink",
828
- name: "Flat Ink",
829
- description: "Flat solid-ink primary, hairline ghost secondary, and a single amber accent climax — modest radius, no shadow.",
830
- tags: {
831
- tone: "classic",
832
- energy: "calm",
833
- motion: "subtle",
834
- era: "editorial"
835
- },
836
- buttonSystem: {
837
- global: {
838
- cornerStyle: "rounded",
839
- textTransform: "none",
840
- fontWeight: 600,
841
- borderWidth: 1,
842
- typography: "body",
843
- letterSpacing: "tight",
844
- paddingPreset: "default",
845
- hoverTransform: "lift",
846
- hoverColor: "none"
847
- },
848
- sizes: {
849
- sm: {
850
- padding: "0.625rem 1.125rem",
851
- fontSize: "text-sm"
852
- },
853
- md: { padding: "0.8125rem 1.375rem" },
854
- lg: {
855
- padding: "0.9375rem 1.625rem",
856
- fontSize: "text-lg"
857
- },
858
- xl: {
859
- padding: "1.0625rem 2rem",
860
- fontSize: "text-xl"
861
- }
862
- },
863
- variants: [
864
- {
865
- id: "primary",
866
- name: "Primary",
867
- enabled: true,
868
- priority: 1,
869
- background: {
870
- type: "solid",
871
- colorToken: "primary"
872
- },
873
- textColorToken: "primaryForeground",
874
- borderRadius: "rounded-lg",
875
- affordance: {
876
- iconId: "ArrowRight",
877
- colorToken: "accent"
878
- },
879
- effects: { hover: [{
880
- effectId: "lift",
881
- options: { translateY: "-2px" }
882
- }, {
883
- effectId: "background-on-hover",
884
- options: { colorToken: "secondary" }
885
- }] }
886
- },
887
- {
888
- id: "secondary",
889
- name: "Secondary",
890
- enabled: true,
891
- priority: 2,
892
- background: { type: "transparent" },
893
- textColorToken: "primary",
894
- borderRadius: "rounded-lg",
895
- border: {
896
- widthClass: "border",
897
- colorToken: "border"
898
- },
899
- effects: { hover: [{
900
- effectId: "lift",
901
- options: { translateY: "-2px" }
902
- }, {
903
- effectId: "background-on-hover",
904
- options: { colorToken: "surfaceAlt" }
905
- }] }
906
- },
907
- {
908
- id: "accent",
909
- name: "Accent",
910
- enabled: true,
911
- priority: 3,
912
- background: {
913
- type: "solid",
914
- colorToken: "accent"
915
- },
916
- textColorToken: "accentForeground",
917
- borderRadius: "rounded-lg",
918
- affordance: {
919
- iconId: "ArrowRight",
920
- colorToken: "accentForeground"
921
- },
922
- effects: { hover: [{
923
- effectId: "lift",
924
- options: { translateY: "-2px" }
925
- }] }
926
- }
927
- ]
928
- }
929
- });
930
- //#endregion
931
- //#region ../theme-core/src/buttons/personalities/ink-stamp.ts
932
- /**
933
- * Ink Stamp — solid earthy fills with a bordered, hand-stamped block-print
934
- * feel. Reads as bold and handmade; suits expressive craft brands.
935
- */
936
- const inkStamp = defineButtonPersonality({
937
- id: "ink-stamp",
938
- name: "Ink Stamp",
939
- description: "Hand-stamped block-print buttons with a slight lift on hover.",
940
- tags: {
941
- tone: "bold",
942
- energy: "vibrant",
943
- motion: "standard",
944
- era: "organic"
945
- },
946
- buttonSystem: {
947
- global: {
948
- cornerStyle: "rounded",
949
- textTransform: "uppercase",
950
- fontWeight: 600,
951
- borderWidth: 1,
952
- hoverTransform: "none",
953
- hoverColor: "none",
954
- letterSpacing: "loose"
955
- },
956
- sizes: {
957
- sm: {
958
- padding: "0.5rem 1.25rem",
959
- fontSize: "text-xs"
960
- },
961
- md: {
962
- padding: "0.75rem 1.75rem",
963
- fontSize: "text-sm"
964
- },
965
- lg: {
966
- padding: "0.875rem 2.25rem",
967
- fontSize: "text-base"
968
- },
969
- xl: {
970
- padding: "1.125rem 2.75rem",
971
- fontSize: "text-lg"
972
- }
973
- },
974
- variants: [
975
- {
976
- id: "primary",
977
- name: "Primary",
978
- enabled: true,
979
- priority: 1,
980
- background: {
981
- type: "solid",
982
- colorToken: "primary"
983
- },
984
- textColorToken: "primaryForeground",
985
- borderRadius: "rounded-md",
986
- effects: {
987
- hover: [{
988
- effectId: "drop-shadow",
989
- options: { intensity: "medium" }
990
- }, {
991
- effectId: "scale-up",
992
- options: { scale: "1.02" }
993
- }],
994
- active: [{
995
- effectId: "scale-down",
996
- options: { scale: "0.98" }
997
- }]
998
- }
999
- },
1000
- {
1001
- id: "secondary",
1002
- name: "Secondary",
1003
- enabled: true,
1004
- priority: 2,
1005
- background: { type: "transparent" },
1006
- textColorToken: "primary",
1007
- borderRadius: "rounded-md",
1008
- border: {
1009
- widthClass: "border-2",
1010
- colorToken: "primary"
1011
- },
1012
- effects: { hover: [{
1013
- effectId: "background-on-hover",
1014
- options: { colorToken: "surface" }
1015
- }] }
1016
- },
1017
- {
1018
- id: "outline",
1019
- name: "Outline",
1020
- enabled: true,
1021
- priority: 3,
1022
- background: { type: "transparent" },
1023
- textColorToken: "text",
1024
- borderRadius: "rounded-md",
1025
- border: {
1026
- widthClass: "border-2",
1027
- colorToken: "border"
1028
- },
1029
- effects: { hover: [{
1030
- effectId: "background-on-hover",
1031
- options: { colorToken: "surface" }
1032
- }] }
1033
- },
1034
- {
1035
- id: "ghost",
1036
- name: "Ghost",
1037
- enabled: true,
1038
- priority: 3,
1039
- background: { type: "transparent" },
1040
- textColorToken: "accent",
1041
- borderRadius: "rounded-none",
1042
- sizes: {
1043
- sm: {
1044
- padding: "0.375rem 0",
1045
- fontSize: "text-xs"
1046
- },
1047
- md: {
1048
- padding: "0.5rem 0",
1049
- fontSize: "text-sm"
1050
- },
1051
- lg: {
1052
- padding: "0.625rem 0",
1053
- fontSize: "text-base"
1054
- },
1055
- xl: {
1056
- padding: "0.75rem 0",
1057
- fontSize: "text-lg"
1058
- }
1059
- },
1060
- effects: { base: [{
1061
- effectId: "border-bottom-grow",
1062
- options: {
1063
- height: 1,
1064
- colorToken: "accent",
1065
- origin: "left"
1066
- }
1067
- }] }
1068
- }
1069
- ]
1070
- }
1071
- });
1072
- //#endregion
1073
- //#region ../theme-core/src/buttons/personalities/joy-stamp.ts
1074
- /**
1075
- * Joy Stamp — neo-brutalist pills with a hard, brand-coloured offset shadow
1076
- * that collapses as the button presses into it on hover. Authored for the
1077
- * Original Joy site style: a cream "stamp" shadow under the solid primary, and
1078
- * a brown shadow under the cream outline. Reads as bold, warm, and handmade.
1079
- *
1080
- * The coloured offset shadow relies on the per-variant `shadow.colorToken`
1081
- * extension; the press is the shared `press-down` effect, which matches its
1082
- * translate to each variant's own shadow offset.
1083
- */
1084
- const joyStamp = defineButtonPersonality({
1085
- id: "joy-stamp",
1086
- name: "Joy Stamp",
1087
- description: "Pill buttons with a hard, brand-coloured offset shadow that presses in on hover.",
1088
- tags: {
1089
- tone: "bold",
1090
- energy: "vibrant",
1091
- motion: "expressive",
1092
- era: "organic"
1093
- },
1094
- buttonSystem: {
1095
- global: {
1096
- cornerStyle: "pill",
1097
- shadow: "high",
1098
- textTransform: "none",
1099
- typography: "heading",
1100
- fontWeight: 700,
1101
- fontSize: "text-lg",
1102
- borderWidth: 2,
1103
- hoverTransform: "none",
1104
- hoverColor: "none"
1105
- },
1106
- sizes: {
1107
- sm: {
1108
- padding: "0.625rem 1.25rem",
1109
- fontSize: "text-base"
1110
- },
1111
- md: {
1112
- padding: "0.875rem 1.75rem",
1113
- fontSize: "text-lg"
1114
- },
1115
- lg: {
1116
- padding: "1.125rem 2.25rem",
1117
- fontSize: "text-xl"
1118
- },
1119
- xl: {
1120
- padding: "1.25rem 2.75rem",
1121
- fontSize: "text-2xl"
1122
- }
1123
- },
1124
- variants: [{
1125
- id: "primary",
1126
- name: "Primary",
1127
- enabled: true,
1128
- priority: 1,
1129
- background: {
1130
- type: "solid",
1131
- colorToken: "primary"
1132
- },
1133
- textColorToken: "primaryForeground",
1134
- borderRadius: "rounded-full",
1135
- shadow: {
1136
- elevation: "high",
1137
- softness: "hard",
1138
- position: "bottom-right",
1139
- colorToken: "text"
1140
- },
1141
- effects: { hover: [{ effectId: "press-down" }] }
1142
- }, {
1143
- id: "secondary",
1144
- name: "Secondary",
1145
- enabled: true,
1146
- priority: 2,
1147
- background: { type: "transparent" },
1148
- textColorToken: "text",
1149
- borderRadius: "rounded-full",
1150
- border: {
1151
- widthClass: "border-2",
1152
- colorToken: "text"
1153
- },
1154
- shadow: {
1155
- elevation: "high",
1156
- softness: "hard",
1157
- position: "bottom-right",
1158
- colorToken: "secondary"
1159
- },
1160
- effects: { hover: [{ effectId: "press-down" }] }
1161
- }]
1162
- }
1163
- });
1164
- //#endregion
1165
- //#region ../theme-core/src/buttons/personalities/ornate-ritual.ts
1166
- /**
1167
- * Ornate Ritual — framed, ceremonial buttons with jewel-toned fills and
1168
- * deliberate spacing. Designed for music, ceremony, and soulful event sites.
1169
- */
1170
- const ornateRitual = defineButtonPersonality({
1171
- id: "ornate-ritual",
1172
- name: "Ornate Ritual",
1173
- description: "Ceremonial framed buttons with jewel-toned fills and quiet color-change hover states.",
1174
- tags: {
1175
- tone: "classic",
1176
- energy: "vibrant",
1177
- motion: "subtle",
1178
- era: "organic"
1179
- },
1180
- buttonSystem: {
1181
- global: {
1182
- cornerStyle: "rounded",
1183
- textTransform: "uppercase",
1184
- fontWeight: 600,
1185
- borderWidth: 1,
1186
- hoverTransform: "none",
1187
- hoverColor: "none",
1188
- letterSpacing: "loose"
1189
- },
1190
- sizes: {
1191
- sm: {
1192
- padding: "0.5625rem 1.25rem",
1193
- fontSize: "text-xs"
1194
- },
1195
- md: {
1196
- padding: "0.75rem 1.75rem",
1197
- fontSize: "text-xs"
1198
- },
1199
- lg: {
1200
- padding: "0.875rem 2.25rem",
1201
- fontSize: "text-sm"
1202
- },
1203
- xl: {
1204
- padding: "1rem 2.75rem",
1205
- fontSize: "text-base"
1206
- }
1207
- },
1208
- variants: [
1209
- {
1210
- id: "primary",
1211
- name: "Primary",
1212
- enabled: true,
1213
- priority: 1,
1214
- background: {
1215
- type: "solid",
1216
- colorToken: "primary"
1217
- },
1218
- textColorToken: "primaryForeground",
1219
- borderRadius: "rounded-md",
1220
- border: {
1221
- widthClass: "border",
1222
- colorToken: "primary"
1223
- },
1224
- effects: {
1225
- hover: [{
1226
- effectId: "background-on-hover",
1227
- options: { colorToken: "primary-100" }
1228
- }],
1229
- active: [{
1230
- effectId: "scale-down",
1231
- options: { scale: "0.98" }
1232
- }]
1233
- }
1234
- },
1235
- {
1236
- id: "secondary",
1237
- name: "Secondary",
1238
- enabled: true,
1239
- priority: 2,
1240
- background: {
1241
- type: "solid",
1242
- colorToken: "secondary"
1243
- },
1244
- textColorToken: "primaryForeground",
1245
- borderRadius: "rounded-md",
1246
- border: {
1247
- widthClass: "border",
1248
- colorToken: "primary"
1249
- },
1250
- effects: { hover: [{
1251
- effectId: "background-on-hover",
1252
- options: { colorToken: "surface" }
1253
- }] }
1254
- },
1255
- {
1256
- id: "outline",
1257
- name: "Outline",
1258
- enabled: true,
1259
- priority: 3,
1260
- background: { type: "transparent" },
1261
- textColorToken: "primary",
1262
- borderRadius: "rounded-md",
1263
- border: {
1264
- widthClass: "border",
1265
- colorToken: "primary"
1266
- },
1267
- effects: { hover: [{
1268
- effectId: "background-on-hover",
1269
- options: { colorToken: "muted" }
1270
- }] }
1271
- },
1272
- {
1273
- id: "ghost",
1274
- name: "Ghost",
1275
- enabled: true,
1276
- priority: 3,
1277
- background: { type: "transparent" },
1278
- textColorToken: "accent",
1279
- borderRadius: "rounded-none",
1280
- sizes: {
1281
- sm: {
1282
- padding: "0.375rem 0",
1283
- fontSize: "text-xs"
1284
- },
1285
- md: {
1286
- padding: "0.5rem 0",
1287
- fontSize: "text-sm"
1288
- },
1289
- lg: {
1290
- padding: "0.625rem 0",
1291
- fontSize: "text-base"
1292
- },
1293
- xl: {
1294
- padding: "0.75rem 0",
1295
- fontSize: "text-lg"
1296
- }
1297
- },
1298
- effects: { base: [{
1299
- effectId: "border-bottom-grow",
1300
- options: {
1301
- height: 1,
1302
- colorToken: "accent",
1303
- origin: "left"
1304
- }
1305
- }] }
1306
- }
1307
- ]
1308
- }
1309
- });
1310
- //#endregion
1311
- //#region ../theme-core/src/buttons/personalities/pebble.ts
1312
- /**
1313
- * Pebble — large pill primaries with generous padding. Reads as spa-luxurious
1314
- * and natural; pairs well with wellness/yoga/dance brands.
1315
- */
1316
- const pebble = defineButtonPersonality({
1317
- id: "pebble",
1318
- name: "Pebble",
1319
- description: "Generous pill buttons with a quiet colour-softening hover.",
1320
- tags: {
1321
- tone: "classic",
1322
- energy: "calm",
1323
- motion: "standard",
1324
- era: "organic"
1325
- },
1326
- buttonSystem: {
1327
- global: {
1328
- cornerStyle: "pill",
1329
- textTransform: "none",
1330
- fontWeight: 500,
1331
- borderWidth: 2,
1332
- hoverTransform: "none",
1333
- hoverColor: "none"
1334
- },
1335
- sizes: {
1336
- sm: {
1337
- padding: "0.625rem 1.75rem",
1338
- fontSize: "text-sm"
1339
- },
1340
- md: { padding: "0.875rem 2.25rem" },
1341
- lg: {
1342
- padding: "1.125rem 2.75rem",
1343
- fontSize: "text-lg"
1344
- },
1345
- xl: {
1346
- padding: "1.5rem 3.5rem",
1347
- fontSize: "text-xl"
1348
- }
1349
- },
1350
- variants: [
1351
- {
1352
- id: "primary",
1353
- name: "Primary",
1354
- enabled: true,
1355
- priority: 1,
1356
- background: {
1357
- type: "solid",
1358
- colorToken: "primary"
1359
- },
1360
- textColorToken: "primaryForeground",
1361
- borderRadius: "rounded-full",
1362
- effects: { hover: [{
1363
- effectId: "background-on-hover-alpha",
1364
- options: {
1365
- colorToken: "primary",
1366
- opacity: 88
1367
- }
1368
- }] }
1369
- },
1370
- {
1371
- id: "secondary",
1372
- name: "Secondary",
1373
- enabled: true,
1374
- priority: 2,
1375
- background: { type: "transparent" },
1376
- textColorToken: "primary",
1377
- borderRadius: "rounded-full",
1378
- border: {
1379
- widthClass: "border-2",
1380
- colorToken: "accent"
1381
- },
1382
- effects: { hover: [{
1383
- effectId: "background-on-hover",
1384
- options: { colorToken: "accent" }
1385
- }] }
1386
- },
1387
- {
1388
- id: "outline",
1389
- name: "Outline",
1390
- enabled: true,
1391
- priority: 3,
1392
- background: { type: "transparent" },
1393
- textColorToken: "text",
1394
- borderRadius: "rounded-full",
1395
- border: {
1396
- widthClass: "border",
1397
- colorToken: "border"
1398
- },
1399
- effects: { hover: [{
1400
- effectId: "background-on-hover",
1401
- options: { colorToken: "surface" }
1402
- }] }
1403
- },
1404
- {
1405
- id: "ghost",
1406
- name: "Ghost",
1407
- enabled: true,
1408
- priority: 3,
1409
- background: { type: "transparent" },
1410
- textColorToken: "primary",
1411
- borderRadius: "rounded-full",
1412
- sizes: {
1413
- sm: {
1414
- padding: "0.375rem 0.875rem",
1415
- fontSize: "text-sm"
1416
- },
1417
- md: { padding: "0.5rem 1rem" },
1418
- lg: {
1419
- padding: "0.625rem 1.25rem",
1420
- fontSize: "text-lg"
1421
- },
1422
- xl: {
1423
- padding: "0.75rem 1.5rem",
1424
- fontSize: "text-xl"
1425
- }
1426
- },
1427
- effects: { hover: [{
1428
- effectId: "opacity-reduce",
1429
- options: { reduction: 30 }
1430
- }] }
1431
- }
1432
- ]
1433
- }
1434
- });
1435
- //#endregion
1436
- //#region ../theme-core/src/buttons/personalities/quiet-arrow.ts
1437
- /**
1438
- * Quiet Arrow — wide, flat editorial buttons for grounded service businesses.
1439
- * Primary and secondary keep stable semantic colours; surrounding surfaces are
1440
- * responsible for contrast rather than reversing the button roles.
1441
- */
1442
- const quietArrow = defineButtonPersonality({
1443
- id: "quiet-arrow",
1444
- name: "Quiet Arrow",
1445
- description: "Wide, flat arrow buttons with a solid primary and a primary-colour outlined secondary.",
1446
- tags: {
1447
- tone: "classic",
1448
- energy: "calm",
1449
- motion: "subtle",
1450
- era: "editorial"
1451
- },
1452
- buttonSystem: {
1453
- global: {
1454
- cornerStyle: "rounded",
1455
- textTransform: "uppercase",
1456
- fontWeight: 500,
1457
- borderWidth: 1,
1458
- typography: "body",
1459
- fontSize: "text-sm",
1460
- letterSpacing: "loose",
1461
- hoverTransform: "none",
1462
- hoverColor: "none"
1463
- },
1464
- sizes: {
1465
- sm: {
1466
- padding: "0.625rem 1.25rem",
1467
- fontSize: "text-xs"
1468
- },
1469
- md: {
1470
- padding: "0.8125rem 1.75rem",
1471
- fontSize: "text-sm"
1472
- },
1473
- lg: {
1474
- padding: "0.9375rem 2.125rem",
1475
- fontSize: "text-sm"
1476
- },
1477
- xl: {
1478
- padding: "1.0625rem 2.5rem",
1479
- fontSize: "text-base"
1480
- }
1481
- },
1482
- variants: [
1483
- {
1484
- id: "primary",
1485
- name: "Primary",
1486
- enabled: true,
1487
- priority: 1,
1488
- background: {
1489
- type: "solid",
1490
- colorToken: "primary"
1491
- },
1492
- textColorToken: "primaryForeground",
1493
- borderRadius: "rounded-xl",
1494
- affordance: { iconId: "ArrowRight" },
1495
- effects: { hover: [{
1496
- effectId: "background-on-hover-alpha",
1497
- options: {
1498
- colorToken: "primary",
1499
- opacity: 90
1500
- }
1501
- }] }
1502
- },
1503
- {
1504
- id: "secondary",
1505
- name: "Secondary",
1506
- enabled: true,
1507
- priority: 2,
1508
- background: { type: "transparent" },
1509
- textColorToken: "primary",
1510
- borderRadius: "rounded-xl",
1511
- border: {
1512
- widthClass: "border",
1513
- colorToken: "primary"
1514
- },
1515
- affordance: { iconId: "ArrowRight" },
1516
- effects: { hover: [{
1517
- effectId: "background-on-hover",
1518
- options: { colorToken: "surfaceAlt" }
1519
- }] }
1520
- },
1521
- {
1522
- id: "outline",
1523
- name: "Outline",
1524
- enabled: true,
1525
- priority: 3,
1526
- background: { type: "transparent" },
1527
- textColorToken: "primary",
1528
- borderRadius: "rounded-xl",
1529
- border: {
1530
- widthClass: "border",
1531
- colorToken: "primary"
1532
- }
1533
- },
1534
- {
1535
- id: "ghost",
1536
- name: "Ghost",
1537
- enabled: true,
1538
- priority: 3,
1539
- background: { type: "transparent" },
1540
- textColorToken: "primary",
1541
- borderRadius: "rounded-xl"
1542
- }
1543
- ]
1544
- }
1545
- });
1546
- //#endregion
1547
- //#region ../theme-core/src/buttons/personalities/showtime-pill.ts
1548
- /**
1549
- * Showtime Pill — bold, spacious, fully rounded buttons with playful pop
1550
- * motion. Suits energetic schools, performers, festivals, and community brands
1551
- * that need calls to action to feel loud without becoming visually chaotic.
1552
- */
1553
- const showtimePill = defineButtonPersonality({
1554
- id: "showtime-pill",
1555
- name: "Showtime Pill",
1556
- description: "Bold pill buttons with uppercase labels, generous padding, and a playful pop.",
1557
- tags: {
1558
- tone: "bold",
1559
- energy: "vibrant",
1560
- motion: "expressive",
1561
- era: "modern"
1562
- },
1563
- buttonSystem: {
1564
- global: {
1565
- cornerStyle: "pill",
1566
- shadow: "low",
1567
- textTransform: "uppercase",
1568
- fontWeight: 700,
1569
- borderWidth: 2,
1570
- hoverTransform: "lift",
1571
- hoverColor: "darken",
1572
- typography: "body",
1573
- paddingPreset: "spacious",
1574
- italic: false
1575
- },
1576
- sizes: {
1577
- sm: {
1578
- padding: "0.625rem 1.25rem",
1579
- fontSize: "0.875rem"
1580
- },
1581
- md: {
1582
- padding: "0.875rem 1.75rem",
1583
- fontSize: "1rem"
1584
- },
1585
- lg: {
1586
- padding: "1.125rem 2.25rem",
1587
- fontSize: "1.125rem"
1588
- },
1589
- xl: {
1590
- padding: "1.125rem 2.25rem",
1591
- fontSize: "1.125rem"
1592
- }
1593
- },
1594
- variants: [
1595
- {
1596
- id: "primary",
1597
- name: "Primary",
1598
- enabled: true,
1599
- priority: 1,
1600
- background: {
1601
- type: "solid",
1602
- colorToken: "primary"
1603
- },
1604
- textColorToken: "background",
1605
- borderRadius: "rounded-full",
1606
- effects: { hover: [{ effectId: "pop" }] }
1607
- },
1608
- {
1609
- id: "secondary",
1610
- name: "Secondary",
1611
- enabled: true,
1612
- priority: 2,
1613
- background: { type: "transparent" },
1614
- textColorToken: "primary",
1615
- borderRadius: "rounded-full",
1616
- border: {
1617
- widthClass: "border-2",
1618
- colorToken: "primary"
1619
- },
1620
- effects: { hover: [{ effectId: "pop" }] }
1621
- },
1622
- {
1623
- id: "hero",
1624
- name: "Hero",
1625
- enabled: true,
1626
- priority: 1,
1627
- background: {
1628
- type: "solid",
1629
- colorToken: "secondary"
1630
- },
1631
- textColorToken: "primary",
1632
- borderRadius: "rounded-full",
1633
- effects: { hover: [{ effectId: "pop" }] }
1634
- },
1635
- {
1636
- id: "header",
1637
- name: "Header",
1638
- enabled: true,
1639
- priority: 2,
1640
- background: {
1641
- type: "solid",
1642
- colorToken: "background"
1643
- },
1644
- textColorToken: "primary",
1645
- borderRadius: "rounded-full",
1646
- border: {
1647
- widthClass: "border-2",
1648
- colorToken: "primary"
1649
- },
1650
- effects: { hover: [{
1651
- effectId: "background-on-hover",
1652
- options: { colorToken: "surface" }
1653
- }] }
1654
- },
1655
- {
1656
- id: "outline",
1657
- name: "Outline",
1658
- enabled: true,
1659
- priority: 3,
1660
- background: { type: "transparent" },
1661
- textColorToken: "primary",
1662
- borderRadius: "rounded-full",
1663
- border: {
1664
- widthClass: "border-2",
1665
- colorToken: "primary"
1666
- },
1667
- effects: { hover: [{
1668
- effectId: "background-on-hover",
1669
- options: { colorToken: "background" }
1670
- }] }
1671
- },
1672
- {
1673
- id: "ghost",
1674
- name: "Ghost",
1675
- enabled: true,
1676
- priority: 3,
1677
- background: { type: "transparent" },
1678
- textColorToken: "primary",
1679
- borderRadius: "rounded-full",
1680
- effects: { hover: [{
1681
- effectId: "background-on-hover",
1682
- options: { colorToken: "surface" }
1683
- }] }
1684
- }
1685
- ]
1686
- }
1687
- });
1688
- //#endregion
1689
- //#region ../theme-core/src/buttons/personalities/soft-pill.ts
1690
- /**
1691
- * Soft Pill — rounded-full pill buttons with a hover lift. The default for
1692
- * Calm Studio and Modern Wellness; reads as quietly modern and welcoming.
1693
- */
1694
- const softPill = defineButtonPersonality({
1695
- id: "soft-pill",
1696
- name: "Soft Pill",
1697
- description: "Rounded pills with a gentle lift on hover. Quietly modern.",
1698
- tags: {
1699
- tone: "classic",
1700
- energy: "calm",
1701
- motion: "subtle",
1702
- era: "organic"
1703
- },
1704
- buttonSystem: {
1705
- global: {
1706
- cornerStyle: "pill",
1707
- shadow: "low",
1708
- textTransform: "none",
1709
- fontWeight: 500,
1710
- borderWidth: 2,
1711
- hoverTransform: "lift",
1712
- hoverColor: "none"
1713
- },
1714
- variants: [
1715
- {
1716
- id: "primary",
1717
- name: "Primary",
1718
- enabled: true,
1719
- priority: 1,
1720
- background: {
1721
- type: "solid",
1722
- colorToken: "primary"
1723
- },
1724
- textColorToken: "primaryForeground",
1725
- borderRadius: "rounded-full",
1726
- shadow: {
1727
- elevation: "low",
1728
- softness: "soft",
1729
- position: "bottom"
1730
- },
1731
- effects: {
1732
- hover: [{
1733
- effectId: "lift",
1734
- options: { translateY: "-1px" }
1735
- }],
1736
- active: [{
1737
- effectId: "scale-down",
1738
- options: { scale: "0.98" }
1739
- }]
1740
- }
1741
- },
1742
- {
1743
- id: "secondary",
1744
- name: "Secondary",
1745
- enabled: true,
1746
- priority: 2,
1747
- background: { type: "transparent" },
1748
- textColorToken: "primary",
1749
- borderRadius: "rounded-full",
1750
- border: {
1751
- widthClass: "border-2",
1752
- colorToken: "primary"
1753
- },
1754
- effects: { hover: [{
1755
- effectId: "background-on-hover",
1756
- options: { colorToken: "surface" }
1757
- }] }
1758
- },
1759
- {
1760
- id: "outline",
1761
- name: "Outline",
1762
- enabled: true,
1763
- priority: 3,
1764
- background: { type: "transparent" },
1765
- textColorToken: "text",
1766
- borderRadius: "rounded-full",
1767
- border: {
1768
- widthClass: "border",
1769
- colorToken: "border"
1770
- },
1771
- effects: { hover: [{
1772
- effectId: "background-on-hover",
1773
- options: { colorToken: "surface" }
1774
- }] }
1775
- },
1776
- {
1777
- id: "ghost",
1778
- name: "Ghost",
1779
- enabled: true,
1780
- priority: 3,
1781
- background: { type: "transparent" },
1782
- textColorToken: "text",
1783
- borderRadius: "rounded-full",
1784
- effects: { hover: [{
1785
- effectId: "background-on-hover",
1786
- options: { colorToken: "surface" }
1787
- }] }
1788
- }
1789
- ]
1790
- }
1791
- });
1792
- //#endregion
1793
- //#region ../theme-core/src/buttons/personalities/two-tone-pill.ts
1794
- const solidSecondary = {
1795
- id: "secondary",
1796
- name: "Secondary",
1797
- enabled: true,
1798
- priority: 2,
1799
- background: {
1800
- type: "solid",
1801
- colorToken: "secondary"
1802
- },
1803
- textColorToken: "onSecondary",
1804
- borderRadius: "rounded-full",
1805
- shadow: {
1806
- elevation: "none",
1807
- softness: null,
1808
- position: "bottom"
1809
- },
1810
- effects: {
1811
- hover: [{
1812
- effectId: "background-on-hover-alpha",
1813
- options: {
1814
- colorToken: "secondary",
1815
- opacity: 88
1816
- }
1817
- }],
1818
- active: [{
1819
- effectId: "scale-down",
1820
- options: { scale: "0.98" }
1821
- }]
1822
- }
1823
- };
1824
- //#endregion
1825
- //#region ../theme-core/src/buttons/personalities/index.ts
1826
- const buttonPersonalities = [
1827
- softPill,
1828
- defineButtonPersonality({
1829
- id: "two-tone-pill",
1830
- name: "Two-tone Pill",
1831
- description: "Rounded pills with distinct solid primary and secondary brand colours.",
1832
- tags: softPill.tags,
1833
- buttonSystem: {
1834
- ...softPill.buttonSystem,
1835
- variants: softPill.buttonSystem.variants.map((variant) => variant.id === "secondary" ? solidSecondary : variant)
1836
- }
1837
- }),
1838
- earthPill,
1839
- confidentChip,
1840
- editorialLink,
1841
- pebble,
1842
- inkStamp,
1843
- flatInk,
1844
- brushedWash,
1845
- showtimePill,
1846
- joyStamp,
1847
- ornateRitual,
1848
- quietArrow
1849
- ];
1850
- new Map(buttonPersonalities.map((p) => [p.id, p]));
1851
- //#endregion
1852
- export { themeButtonClassName as t };