@riverbankcms/sdk 0.109.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.
- package/dist/{PreviewEditorSidebar-DWqwfy3_.mjs → PreviewEditorSidebar-CTR6LUhN.mjs} +178 -117
- package/dist/{PreviewEditorUI-B7OL4sfR.mjs → PreviewEditorUI-DZg15Zip.mjs} +3 -4
- package/dist/{PreviewQueryProvider-D0y2l8JN.mjs → PreviewQueryProvider-kkmjklLG.mjs} +1 -1
- package/dist/{SdkPreviewModeRuntime-D8Gt9Gbe.mjs → SdkPreviewModeRuntime-DeOTAFvR.mjs} +229 -219
- package/dist/{SiteChromeCustomizeContext-DUpalEdL.mjs → SiteChromeCustomizeContext-DOSDLCiJ.mjs} +1695 -2169
- package/dist/_dts/ai/src/contracts/proposals.d.ts +1716 -76
- package/dist/_dts/api/src/commercePortalEndpoints.d.ts +5 -5
- package/dist/_dts/api/src/contentRuntime.d.ts +4 -1
- package/dist/_dts/api/src/courses.d.ts +30 -15
- package/dist/_dts/api/src/endpoints.d.ts +14 -4
- package/dist/_dts/api/src/index.d.ts +2 -2
- package/dist/_dts/api/src/sdkContracts.d.ts +23 -11
- package/dist/_dts/api/src/siteManagementEndpoints.d.ts +5 -1
- package/dist/_dts/api/src/siteOperations.d.ts +11 -19
- package/dist/_dts/api/src/siteRuntimeEndpoints.d.ts +6 -6
- package/dist/_dts/api/src/webhooks.d.ts +98 -1
- package/dist/_dts/billing/src/site-arrangements.d.ts +3 -0
- package/dist/_dts/blocks/src/client/course-registration.d.ts +4 -1
- package/dist/_dts/blocks/src/client.d.ts +4 -1
- package/dist/_dts/blocks/src/contracts/proof-block-islands.d.ts +4 -4
- package/dist/_dts/blocks/src/index.d.ts +3 -1
- package/dist/_dts/blocks/src/system/blocks/course-registration.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/courses/shared/types.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/cta-full.d.ts +2 -4
- package/dist/_dts/blocks/src/system/blocks/event-registration.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/events/event-listing.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/events/event-spotlight.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/events/recurring-schedule.d.ts +3 -2
- package/dist/_dts/blocks/src/system/blocks/events/shared/types.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/file-download.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/newsletter-signup.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/shop.d.ts +2 -1
- package/dist/_dts/blocks/src/system/blocks/single-button.d.ts +2 -1
- package/dist/_dts/blocks/src/system/constants/buttonRoles.d.ts +35 -0
- package/dist/_dts/blocks/src/system/fields/button.d.ts +10 -21
- package/dist/_dts/blocks/src/system/fields/ctas.d.ts +2 -1
- package/dist/_dts/blocks/src/system/fragments/library/heroCtaRow.d.ts +9 -5
- package/dist/_dts/blocks/src/system/runtime/components/registry.client.d.ts +18 -18
- package/dist/_dts/blocks/src/system/runtime/components/runtime-backed-blocks.d.ts +9 -9
- package/dist/_dts/blocks/src/system/runtime/hooks/useHeadlessWholeSeriesRegistrationFlow.d.ts +29 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/buttonAffordance.d.ts +1 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/ErrorStep.d.ts +2 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/PaymentFailedStep.d.ts +2 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/VerifyingTimeoutStep.d.ts +2 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/types.d.ts +21 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/useCourseRegistrationWizard.d.ts +4 -4
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/whole-series-registration.headless.contract.d.ts +326 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration/whole-series-registration.headless.planning.d.ts +27 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/course-registration.interactive.d.ts +5 -4
- package/dist/_dts/blocks/src/system/runtime/nodes/event-registration/event-registration.headless.contract.d.ts +3 -2
- package/dist/_dts/blocks/src/system/runtime/nodes/event-registration/types.d.ts +2 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/event-registration.interactive.d.ts +5 -4
- package/dist/_dts/blocks/src/system/runtime/nodes/file-download.d.ts +2 -3
- package/dist/_dts/blocks/src/system/runtime/nodes/newsletter-form.types.d.ts +2 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/shared/contract-schemas.d.ts +6 -3
- package/dist/_dts/blocks/src/system/runtime/nodes/shop.interactive.d.ts +7 -6
- package/dist/_dts/blocks/src/system/runtime/nodes/shop.types.d.ts +2 -1
- package/dist/_dts/blocks/src/system/runtime/shared/types.d.ts +2 -1
- package/dist/_dts/content-editor/src/FooterComposerPanel.d.ts +4 -2
- package/dist/_dts/content-editor/src/index.d.ts +12 -12
- package/dist/_dts/content-editor/src/ui/editorUiStore.d.ts +17 -2
- package/dist/_dts/db/src/generated/supabase/database.types.d.ts +221 -53
- package/dist/_dts/editor-blocks/src/widgets/button/context.d.ts +3 -2
- package/dist/_dts/preview-next/src/client/index.d.ts +3 -2
- package/dist/_dts/preview-next/src/client/preview/ButtonStylePicker.d.ts +16 -0
- package/dist/_dts/preview-next/src/client/preview/PageBlockEditorPanel.d.ts +2 -3
- package/dist/_dts/preview-next/src/client/preview/PreviewDesignOpenRequestContext.d.ts +7 -0
- package/dist/_dts/preview-next/src/client/preview/PreviewEditorSidebar.d.ts +5 -11
- package/dist/_dts/preview-next/src/client/preview/PreviewShell.d.ts +5 -6
- package/dist/_dts/preview-next/src/client/preview/PreviewShellLayout.d.ts +6 -7
- package/dist/_dts/preview-next/src/client/preview/SiteChromeCustomizeContext.d.ts +7 -9
- package/dist/_dts/preview-next/src/client/preview/StyleConfigurator.d.ts +4 -11
- package/dist/_dts/preview-next/src/client/preview/StyleConfigurator.state.d.ts +7 -7
- package/dist/_dts/preview-next/src/client/preview/sidebarTabPreference.d.ts +0 -8
- package/dist/_dts/preview-next/src/client/preview/siteChromeLookRows.d.ts +1 -11
- package/dist/_dts/preview-next/src/client/preview/siteChromeQuickControlHistoryState.d.ts +1 -5
- package/dist/_dts/preview-next/src/client/preview/siteChromeSavePlan.d.ts +2 -3
- package/dist/_dts/preview-next/src/client/preview/siteStylePreviewPlanner.d.ts +3 -4
- package/dist/_dts/preview-next/src/client/preview/styleConfiguratorSnapshot.d.ts +3 -5
- package/dist/_dts/sdk/src/bookings/index.d.ts +5 -4
- package/dist/_dts/sdk/src/bookings/types.d.ts +3 -3
- package/dist/_dts/sdk/src/cli/commands/style.d.ts +3 -2
- package/dist/_dts/sdk/src/client/management/types.d.ts +2 -1
- package/dist/_dts/sdk/src/contracts/system-block-content.d.ts +12 -15
- package/dist/_dts/sdk/src/public-api/contracts.d.ts +1 -1
- package/dist/_dts/sdk/src/version.d.ts +1 -1
- package/dist/_dts/sdk/src/webhooks/index.d.ts +1 -1
- package/dist/_dts/sdk/src/webhooks/verify.d.ts +3 -3
- package/dist/_dts/site-commands/src/commands.d.ts +129 -6
- package/dist/_dts/theme-core/src/buttons/index.d.ts +1 -1
- package/dist/_dts/theme-core/src/buttons/styles/domain.d.ts +80 -0
- package/dist/_dts/theme-core/src/buttons/styles/index.d.ts +3 -0
- package/dist/_dts/theme-core/src/buttons/styles/recipes/defineStaticButtonStyleRecipe.d.ts +49 -0
- package/dist/_dts/theme-core/src/buttons/styles/recipes/quietArrow.d.ts +67 -0
- package/dist/_dts/theme-core/src/buttons/styles/recipes/staticRecipes.d.ts +649 -0
- package/dist/_dts/theme-core/src/buttons/styles/registry.d.ts +753 -0
- package/dist/_dts/theme-core/src/buttons/styles/selection.d.ts +69 -0
- package/dist/_dts/theme-core/src/site-styles/curatedSiteStyles.d.ts +26 -24
- package/dist/_dts/theme-core/src/site-styles/footerLooks.d.ts +19 -153
- package/dist/_dts/theme-core/src/site-styles/headerCtaVariants.d.ts +3 -1
- package/dist/_dts/theme-core/src/site-styles/previewCompiler.d.ts +8 -9
- package/dist/_dts/theme-core/src/site-styles/runtimeCompiler.d.ts +4 -4
- package/dist/_dts/ui/src/palette/hex.d.ts +3 -3
- package/dist/cli/index.mjs +1760 -1914
- package/dist/cli/init-docs/content/workflow-isr-revalidation.md +1 -1
- package/dist/client/{DiscountCodeDisclosure-DU1ygxU2.mjs → DiscountCodeDisclosure-C4xvTBux.mjs} +1 -1
- package/dist/client/{EventCombined.client-DB5zagCo.mjs → EventCombined.client-Cr7G131j.mjs} +2 -3
- package/dist/client/{EventListing.client-CTX9JHBL.mjs → EventListing.client-CAjbseNy.mjs} +2 -2
- package/dist/client/{LeafletStaticMap-BYImhgiB.mjs → LeafletStaticMap-BMlWfwz3.mjs} +1 -1
- package/dist/client/{MagicLinkForm-CRkw_M3l.mjs → MagicLinkForm-ChdFz96y.mjs} +1 -2
- package/dist/client/{StepIndicator-BnmVBJJh.mjs → StepIndicator-7D3GaBeM.mjs} +2 -2
- package/dist/client/{accordion-CeGreumd.mjs → accordion-D8JTs2Si.mjs} +1 -1
- package/dist/client/{bookingForm-CSzFNrpN.mjs → bookingForm-H3DCRBHs.mjs} +6 -7
- package/dist/client/bookings.mjs +3069 -1447
- package/dist/client/{carousel-B2jDtogf.mjs → carousel-DMr_QWlz.mjs} +1 -1
- package/dist/client/{cart-D-jZ-vaY.mjs → cart-DWMbfBdR.mjs} +3 -3
- package/dist/client/{checkout-Dza-LA7N.mjs → checkout-zmfdkXLx.mjs} +3 -3
- package/dist/client/client.mjs +1732 -1913
- package/dist/client/{colorStyles-CrgzoXsm.mjs → colorStyles-gcTh5yZT.mjs} +2 -12
- package/dist/client/{colorTokenParts-CMugwvX_.mjs → colorTokenParts-FSS3al6l.mjs} +31 -1
- package/dist/client/{courseRegistration-TYkNychb.mjs → courseRegistration-Z_mn18jy.mjs} +100 -37
- package/dist/client/{eventCalendar-BI_90SsT.mjs → eventCalendar-CYp0YJGF.mjs} +4 -5
- package/dist/client/{eventCombined-mNrpryE9.mjs → eventCombined-rKyYZUa9.mjs} +2 -2
- package/dist/client/{eventDetails-D4GVlCIY.mjs → eventDetails-X0ZaUuMj.mjs} +3 -3
- package/dist/client/{eventListing-YhKN018y.mjs → eventListing-W1SuL7EP.mjs} +2 -2
- package/dist/client/{eventRegistration-CdHGtilr.mjs → eventRegistration-ClWricui.mjs} +6 -7
- package/dist/client/{form-AcAL45rA.mjs → form--eKPwAAD.mjs} +1 -2
- package/dist/client/{headerSection-uEC52ueD.mjs → headerSection-BSeGr-FS.mjs} +2 -3
- package/dist/client/hooks.mjs +1554 -1871
- package/dist/client/{locationMap-_wJDSUYe.mjs → locationMap-BpOrtNYn.mjs} +8 -5
- package/dist/client/{media-BK0O3b-U.mjs → media-DoF0dcVx.mjs} +2 -2
- package/dist/client/{newsletterForm-DrArsb2B.mjs → newsletterForm-Bt7it7Dy.mjs} +1 -2
- package/dist/client/{pricing-BSYVghwo.mjs → pricing-BTjSDDr4.mjs} +1 -1
- package/dist/client/{productDetail-Dyk90sMs.mjs → productDetail-ICnVTcCg.mjs} +3 -3
- package/dist/client/{productList-BCKThwAI.mjs → productList-ZHr6D604.mjs} +3 -3
- package/dist/client/{propsDecoder-CkXxkdSR.mjs → propsDecoder-wWN0tBDF.mjs} +2351 -129
- package/dist/client/rendering/client.mjs +1664 -1824
- package/dist/client/rendering/islands.mjs +20 -20
- package/dist/client/rendering.mjs +1697 -1909
- package/dist/client/{shop-DeltVH10.mjs → shop-C1u_BUn0.mjs} +5 -6
- package/dist/client/{shop-commerce-BD9Jsm2Z.mjs → shop-commerce-CleZdRha.mjs} +5 -6
- package/dist/client/{shop-commerce-store-CmXD6FDS.mjs → shop-commerce-store-ycnoB2Ce.mjs} +1 -1
- package/dist/client/{shopShared-B8v-lH_F.mjs → shopShared-CPhByt2a.mjs} +3 -3
- package/dist/client/{useDiscountCodeUi-DbWJN8ld.mjs → useDiscountCodeUi-cStSQI6C.mjs} +1 -1
- package/dist/client/{useEventFilters-EJIMUnqT.mjs → useEventFilters-DKPN7hSY.mjs} +26 -27
- package/dist/client/{usePolling-Cmh14fc7.mjs → usePolling-BKAd6pkZ.mjs} +2 -2
- package/dist/preview-next/before-render.mjs +37 -6
- package/dist/preview-next/client/runtime.mjs +4 -4
- package/dist/preview-next/middleware.mjs +37 -6
- package/dist/{previewAuthStore-CTO7CRPk.mjs → previewAuthStore-BkT1D06A.mjs} +37 -6
- package/dist/{sdk-runtime-Dou0GAav.mjs → sdk-runtime-hu3wr3ng.mjs} +2 -2
- package/dist/{separator-CI5wZNXT.mjs → separator-Bln8izQ9.mjs} +1 -1
- package/dist/server/components.mjs +1472 -1788
- package/dist/server/config-validation.mjs +1559 -1876
- package/dist/server/config.mjs +1559 -1876
- package/dist/server/data.mjs +1554 -1871
- package/dist/server/index.mjs +38 -7
- package/dist/server/next/revalidate.mjs +53 -1
- package/dist/server/next.mjs +1584 -1869
- package/dist/server/page-converter.mjs +1543 -1860
- package/dist/server/prebuild.mjs +1 -1
- package/dist/server/rendering/server.mjs +1472 -1788
- package/dist/server/rendering.mjs +1472 -1788
- package/dist/server/routing.mjs +1600 -1891
- package/dist/server/server.mjs +1574 -1860
- package/dist/server/theme-bridge.mjs +1436 -1619
- package/dist/server/theme.mjs +1345 -1241
- package/dist/server/webhooks.mjs +54 -2
- package/package.json +1 -1
- package/dist/_dts/theme-core/src/buttons/personalities/brushed-wash.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/confident-chip.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/earth-pill.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/editorial-link.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/flat-ink.d.ts +0 -20
- package/dist/_dts/theme-core/src/buttons/personalities/index.d.ts +0 -172
- package/dist/_dts/theme-core/src/buttons/personalities/ink-stamp.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/joy-stamp.d.ts +0 -22
- package/dist/_dts/theme-core/src/buttons/personalities/ornate-ritual.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/pebble.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/quiet-arrow.d.ts +0 -17
- package/dist/_dts/theme-core/src/buttons/personalities/showtime-pill.d.ts +0 -17
- package/dist/_dts/theme-core/src/buttons/personalities/soft-pill.d.ts +0 -16
- package/dist/_dts/theme-core/src/buttons/personalities/two-tone-pill.d.ts +0 -17
- package/dist/_dts/theme-core/src/buttons/personalities/types.d.ts +0 -285
- package/dist/client/buttons-DoFV7KDL.mjs +0 -2115
- package/dist/client/foregroundContract-xICPq59x.mjs +0 -31
package/dist/server/next.mjs
CHANGED
|
@@ -2280,6 +2280,24 @@ const API_ENDPOINTS$1 = {
|
|
|
2280
2280
|
auth: "user",
|
|
2281
2281
|
responseKind: "json"
|
|
2282
2282
|
},
|
|
2283
|
+
publishEventOfferingPageSurface: {
|
|
2284
|
+
path: "/sites/{siteId}/page-surfaces/{pageSurfaceId}/publication",
|
|
2285
|
+
method: "POST",
|
|
2286
|
+
errors: [
|
|
2287
|
+
"auth:forbidden",
|
|
2288
|
+
"validation:invalid_input",
|
|
2289
|
+
"resource:not_found",
|
|
2290
|
+
"resource:conflict",
|
|
2291
|
+
"server:internal_error"
|
|
2292
|
+
],
|
|
2293
|
+
tags: [
|
|
2294
|
+
TAG_TEMPLATES.siteCollection,
|
|
2295
|
+
TAG_TEMPLATES.siteRoutableContent,
|
|
2296
|
+
TAG_TEMPLATES.pageSurfaceById
|
|
2297
|
+
],
|
|
2298
|
+
auth: "user",
|
|
2299
|
+
responseKind: "json"
|
|
2300
|
+
},
|
|
2283
2301
|
runSdkWorkflow: {
|
|
2284
2302
|
path: "/sites/{siteId}/content/{type}/{entryId}/workflows/{workflowId}/run",
|
|
2285
2303
|
method: "POST",
|
|
@@ -6142,8 +6160,8 @@ const API_ENDPOINTS$1 = {
|
|
|
6142
6160
|
auth: "user",
|
|
6143
6161
|
responseKind: "blob"
|
|
6144
6162
|
},
|
|
6145
|
-
|
|
6146
|
-
path: "/admin/sites/{siteId}/
|
|
6163
|
+
adminSiteBillingArrangement: {
|
|
6164
|
+
path: "/admin/sites/{siteId}/billing/arrangement",
|
|
6147
6165
|
method: "GET",
|
|
6148
6166
|
tags: [
|
|
6149
6167
|
"admin",
|
|
@@ -6151,10 +6169,16 @@ const API_ENDPOINTS$1 = {
|
|
|
6151
6169
|
"billing"
|
|
6152
6170
|
],
|
|
6153
6171
|
auth: "admin",
|
|
6154
|
-
responseKind: "json"
|
|
6172
|
+
responseKind: "json",
|
|
6173
|
+
errors: [
|
|
6174
|
+
"validation:invalid_input",
|
|
6175
|
+
"auth:forbidden",
|
|
6176
|
+
"resource:not_found",
|
|
6177
|
+
"server:internal_error"
|
|
6178
|
+
]
|
|
6155
6179
|
},
|
|
6156
|
-
|
|
6157
|
-
path: "/admin/sites/{siteId}/
|
|
6180
|
+
adminUpdateSiteBillingArrangement: {
|
|
6181
|
+
path: "/admin/sites/{siteId}/billing/arrangement",
|
|
6158
6182
|
method: "POST",
|
|
6159
6183
|
tags: [
|
|
6160
6184
|
"admin",
|
|
@@ -6162,7 +6186,14 @@ const API_ENDPOINTS$1 = {
|
|
|
6162
6186
|
"billing"
|
|
6163
6187
|
],
|
|
6164
6188
|
auth: "admin",
|
|
6165
|
-
responseKind: "json"
|
|
6189
|
+
responseKind: "json",
|
|
6190
|
+
errors: [
|
|
6191
|
+
"validation:invalid_input",
|
|
6192
|
+
"auth:forbidden",
|
|
6193
|
+
"resource:not_found",
|
|
6194
|
+
"resource:conflict",
|
|
6195
|
+
"server:internal_error"
|
|
6196
|
+
]
|
|
6166
6197
|
},
|
|
6167
6198
|
adminScheduleBillingComponentEnd: {
|
|
6168
6199
|
path: "/admin/sites/{siteId}/billing/components/{componentId}/end",
|
|
@@ -16464,7 +16495,7 @@ const gradientDirectionSchema$1 = z$1.enum([
|
|
|
16464
16495
|
"to-br",
|
|
16465
16496
|
"to-bl"
|
|
16466
16497
|
]);
|
|
16467
|
-
const
|
|
16498
|
+
const buttonColourTreatmentSchema = z$1.discriminatedUnion("type", [
|
|
16468
16499
|
z$1.object({
|
|
16469
16500
|
type: z$1.literal("solid"),
|
|
16470
16501
|
colorToken: opaqueButtonColourTokenSchema
|
|
@@ -16488,6 +16519,7 @@ const buttonBackgroundSchema = z$1.discriminatedUnion("type", [
|
|
|
16488
16519
|
role: z$1.literal("link")
|
|
16489
16520
|
})
|
|
16490
16521
|
]);
|
|
16522
|
+
const buttonBackgroundSchema = buttonColourTreatmentSchema;
|
|
16491
16523
|
const effectApplicationSchema$1 = z$1.object({
|
|
16492
16524
|
effectId: z$1.string(),
|
|
16493
16525
|
options: z$1.record(z$1.string(), z$1.json()).optional()
|
|
@@ -16699,50 +16731,887 @@ function isUnknownArray$2(value) {
|
|
|
16699
16731
|
return Array.isArray(value);
|
|
16700
16732
|
}
|
|
16701
16733
|
//#endregion
|
|
16702
|
-
//#region ../theme-core/src/buttons/
|
|
16703
|
-
|
|
16704
|
-
|
|
16705
|
-
|
|
16734
|
+
//#region ../theme-core/src/buttons/styles/domain.ts
|
|
16735
|
+
const PUBLIC_BUTTON_ROLES = [
|
|
16736
|
+
"primary",
|
|
16737
|
+
"secondary",
|
|
16738
|
+
"outline",
|
|
16739
|
+
"ghost",
|
|
16740
|
+
"accent"
|
|
16741
|
+
];
|
|
16742
|
+
function defineButtonStyleRecipe(recipe) {
|
|
16743
|
+
return recipe;
|
|
16706
16744
|
}
|
|
16707
|
-
|
|
16708
|
-
|
|
16709
|
-
|
|
16710
|
-
|
|
16711
|
-
|
|
16712
|
-
|
|
16713
|
-
|
|
16714
|
-
});
|
|
16715
|
-
/**
|
|
16716
|
-
* Helper for personality file modules to keep the call site short and
|
|
16717
|
-
* type-safe. `as const satisfies ...` would also work but produces wider
|
|
16718
|
-
* types at use sites.
|
|
16719
|
-
*/
|
|
16720
|
-
function defineButtonPersonality(input) {
|
|
16745
|
+
function materializeButtonRoles(definitions) {
|
|
16746
|
+
const primary = materializeCompleteRole("primary", definitions.primary.appearance);
|
|
16747
|
+
const secondary = materializeCompleteRole("secondary", definitions.secondary.appearance);
|
|
16748
|
+
const completeRoles = {
|
|
16749
|
+
primary,
|
|
16750
|
+
secondary
|
|
16751
|
+
};
|
|
16721
16752
|
return {
|
|
16722
|
-
|
|
16723
|
-
|
|
16724
|
-
|
|
16753
|
+
primary,
|
|
16754
|
+
secondary,
|
|
16755
|
+
outline: materializeSupportingRole("outline", definitions.outline, completeRoles),
|
|
16756
|
+
ghost: materializeSupportingRole("ghost", definitions.ghost, completeRoles),
|
|
16757
|
+
accent: materializeSupportingRole("accent", definitions.accent, completeRoles)
|
|
16758
|
+
};
|
|
16759
|
+
}
|
|
16760
|
+
function resolveButtonStyleRecipe(recipe, parameters) {
|
|
16761
|
+
const parsedParameters = recipe.parameterSchema.safeParse(parameters);
|
|
16762
|
+
if (!parsedParameters.success) return {
|
|
16763
|
+
kind: "error",
|
|
16764
|
+
error: {
|
|
16765
|
+
kind: "invalid-parameters",
|
|
16766
|
+
styleId: recipe.id,
|
|
16767
|
+
issues: parsedParameters.error.issues.map((issue) => issue.message)
|
|
16768
|
+
}
|
|
16769
|
+
};
|
|
16770
|
+
const definition = recipe.defineSystem(parsedParameters.data);
|
|
16771
|
+
const roles = materializeButtonRoles(definition.roles);
|
|
16772
|
+
const buttonSystem = {
|
|
16773
|
+
global: definition.global,
|
|
16774
|
+
variants: PUBLIC_BUTTON_ROLES.map((role) => roles[role]),
|
|
16775
|
+
...definition.sizes ? { sizes: definition.sizes } : {}
|
|
16776
|
+
};
|
|
16777
|
+
const parsedButtonSystem = buttonSystemSchema.safeParse(buttonSystem);
|
|
16778
|
+
if (!parsedButtonSystem.success) return {
|
|
16779
|
+
kind: "error",
|
|
16780
|
+
error: {
|
|
16781
|
+
kind: "invalid-button-system",
|
|
16782
|
+
styleId: recipe.id,
|
|
16783
|
+
issues: parsedButtonSystem.error.issues.map((issue) => issue.message)
|
|
16784
|
+
}
|
|
16785
|
+
};
|
|
16786
|
+
return {
|
|
16787
|
+
kind: "resolved",
|
|
16788
|
+
buttonSystem: parsedButtonSystem.data
|
|
16789
|
+
};
|
|
16790
|
+
}
|
|
16791
|
+
function materializeSupportingRole(role, definition, completeRoles) {
|
|
16792
|
+
if (definition.kind === "complete") return materializeCompleteRole(role, definition.appearance);
|
|
16793
|
+
return {
|
|
16794
|
+
...completeRoles[definition.from],
|
|
16795
|
+
...definition.overrides,
|
|
16796
|
+
id: role,
|
|
16797
|
+
name: roleName(role),
|
|
16798
|
+
enabled: true,
|
|
16799
|
+
priority: 3
|
|
16800
|
+
};
|
|
16801
|
+
}
|
|
16802
|
+
function materializeCompleteRole(role, appearance) {
|
|
16803
|
+
return {
|
|
16804
|
+
...appearance,
|
|
16805
|
+
id: role,
|
|
16806
|
+
name: roleName(role),
|
|
16807
|
+
enabled: true,
|
|
16808
|
+
priority: rolePriority(role)
|
|
16809
|
+
};
|
|
16810
|
+
}
|
|
16811
|
+
function roleName(role) {
|
|
16812
|
+
return role.charAt(0).toUpperCase() + role.slice(1);
|
|
16813
|
+
}
|
|
16814
|
+
function rolePriority(role) {
|
|
16815
|
+
if (role === "primary") return 1;
|
|
16816
|
+
if (role === "secondary") return 2;
|
|
16817
|
+
return 3;
|
|
16818
|
+
}
|
|
16819
|
+
//#endregion
|
|
16820
|
+
//#region ../theme-core/src/buttons/styles/selection.ts
|
|
16821
|
+
const BUTTON_STYLE_IDS = [
|
|
16822
|
+
"soft-pill",
|
|
16823
|
+
"earth-pill",
|
|
16824
|
+
"confident-chip",
|
|
16825
|
+
"editorial-link",
|
|
16826
|
+
"pebble",
|
|
16827
|
+
"ink-stamp",
|
|
16828
|
+
"flat-ink",
|
|
16829
|
+
"brushed-wash",
|
|
16830
|
+
"showtime-pill",
|
|
16831
|
+
"joy-stamp",
|
|
16832
|
+
"ornate-ritual",
|
|
16833
|
+
"quiet-arrow"
|
|
16834
|
+
];
|
|
16835
|
+
const quietArrowParametersSchema = z$1.object({ secondaryTreatment: z$1.enum(["outlined", "solid-accent"]) }).strict();
|
|
16836
|
+
const emptyParametersSchema$1 = z$1.object({}).strict();
|
|
16837
|
+
function selectionBranch(styleId, parameters) {
|
|
16838
|
+
return z$1.object({
|
|
16839
|
+
styleId: z$1.literal(styleId),
|
|
16840
|
+
parameters
|
|
16841
|
+
}).strict();
|
|
16842
|
+
}
|
|
16843
|
+
const buttonStyleSelectionSchema = z$1.discriminatedUnion("styleId", [
|
|
16844
|
+
selectionBranch("soft-pill", emptyParametersSchema$1),
|
|
16845
|
+
selectionBranch("earth-pill", emptyParametersSchema$1),
|
|
16846
|
+
selectionBranch("confident-chip", emptyParametersSchema$1),
|
|
16847
|
+
selectionBranch("editorial-link", emptyParametersSchema$1),
|
|
16848
|
+
selectionBranch("pebble", emptyParametersSchema$1),
|
|
16849
|
+
selectionBranch("ink-stamp", emptyParametersSchema$1),
|
|
16850
|
+
selectionBranch("flat-ink", emptyParametersSchema$1),
|
|
16851
|
+
selectionBranch("brushed-wash", emptyParametersSchema$1),
|
|
16852
|
+
selectionBranch("showtime-pill", emptyParametersSchema$1),
|
|
16853
|
+
selectionBranch("joy-stamp", emptyParametersSchema$1),
|
|
16854
|
+
selectionBranch("ornate-ritual", emptyParametersSchema$1),
|
|
16855
|
+
selectionBranch("quiet-arrow", quietArrowParametersSchema)
|
|
16856
|
+
]);
|
|
16857
|
+
//#endregion
|
|
16858
|
+
//#region ../theme-core/src/buttons/styles/recipes/quietArrow.ts
|
|
16859
|
+
const quietArrowRecipe = defineButtonStyleRecipe({
|
|
16860
|
+
id: "quiet-arrow",
|
|
16861
|
+
accessibilityLabel: "Wide uppercase buttons with trailing arrows",
|
|
16862
|
+
tags: {
|
|
16863
|
+
tone: "classic",
|
|
16864
|
+
energy: "calm",
|
|
16865
|
+
motion: "subtle",
|
|
16866
|
+
era: "editorial"
|
|
16867
|
+
},
|
|
16868
|
+
parameterSchema: quietArrowParametersSchema,
|
|
16869
|
+
defaultParameters: { secondaryTreatment: "outlined" },
|
|
16870
|
+
controls: [{
|
|
16871
|
+
kind: "choice",
|
|
16872
|
+
parameter: "secondaryTreatment",
|
|
16873
|
+
label: "Secondary button treatment",
|
|
16874
|
+
options: [{
|
|
16875
|
+
value: "outlined",
|
|
16876
|
+
label: "Outlined"
|
|
16877
|
+
}, {
|
|
16878
|
+
value: "solid-accent",
|
|
16879
|
+
label: "Solid accent"
|
|
16880
|
+
}]
|
|
16881
|
+
}],
|
|
16882
|
+
defineSystem: (parameters) => ({
|
|
16883
|
+
global: {
|
|
16884
|
+
cornerStyle: "rounded",
|
|
16885
|
+
textTransform: "uppercase",
|
|
16886
|
+
fontWeight: 500,
|
|
16887
|
+
borderWidth: 1,
|
|
16888
|
+
typography: "body",
|
|
16889
|
+
fontSize: "text-sm",
|
|
16890
|
+
letterSpacing: "loose",
|
|
16891
|
+
hoverTransform: "none",
|
|
16892
|
+
hoverColor: "none"
|
|
16893
|
+
},
|
|
16894
|
+
sizes: {
|
|
16895
|
+
sm: {
|
|
16896
|
+
padding: "0.625rem 1.25rem",
|
|
16897
|
+
fontSize: "text-xs"
|
|
16898
|
+
},
|
|
16899
|
+
md: {
|
|
16900
|
+
padding: "0.8125rem 1.75rem",
|
|
16901
|
+
fontSize: "text-sm"
|
|
16902
|
+
},
|
|
16903
|
+
lg: {
|
|
16904
|
+
padding: "0.9375rem 2.125rem",
|
|
16905
|
+
fontSize: "text-sm"
|
|
16906
|
+
},
|
|
16907
|
+
xl: {
|
|
16908
|
+
padding: "1.0625rem 2.5rem",
|
|
16909
|
+
fontSize: "text-base"
|
|
16910
|
+
}
|
|
16911
|
+
},
|
|
16912
|
+
roles: {
|
|
16913
|
+
primary: {
|
|
16914
|
+
kind: "complete",
|
|
16915
|
+
appearance: {
|
|
16916
|
+
background: {
|
|
16917
|
+
type: "solid",
|
|
16918
|
+
colorToken: unsafeAsOpaqueButtonColourToken("primary")
|
|
16919
|
+
},
|
|
16920
|
+
borderRadius: "rounded-xl",
|
|
16921
|
+
affordance: { iconId: "ArrowRight" },
|
|
16922
|
+
effects: { hover: [{
|
|
16923
|
+
effectId: "darken-background",
|
|
16924
|
+
options: { amount: 100 }
|
|
16925
|
+
}] }
|
|
16926
|
+
}
|
|
16927
|
+
},
|
|
16928
|
+
secondary: {
|
|
16929
|
+
kind: "complete",
|
|
16930
|
+
appearance: parameters.secondaryTreatment === "solid-accent" ? {
|
|
16931
|
+
background: {
|
|
16932
|
+
type: "solid",
|
|
16933
|
+
colorToken: unsafeAsOpaqueButtonColourToken("accent")
|
|
16934
|
+
},
|
|
16935
|
+
borderRadius: "rounded-xl",
|
|
16936
|
+
affordance: { iconId: "ArrowRight" },
|
|
16937
|
+
effects: { hover: [{
|
|
16938
|
+
effectId: "darken-background",
|
|
16939
|
+
options: { amount: 100 }
|
|
16940
|
+
}] }
|
|
16941
|
+
} : {
|
|
16942
|
+
background: {
|
|
16943
|
+
type: "surface",
|
|
16944
|
+
role: "link"
|
|
16945
|
+
},
|
|
16946
|
+
borderRadius: "rounded-xl",
|
|
16947
|
+
border: { widthClass: "border" },
|
|
16948
|
+
affordance: { iconId: "ArrowRight" },
|
|
16949
|
+
effects: { hover: [{
|
|
16950
|
+
effectId: "background-on-hover",
|
|
16951
|
+
options: { colorToken: "surfaceAlt" }
|
|
16952
|
+
}] }
|
|
16953
|
+
}
|
|
16954
|
+
},
|
|
16955
|
+
outline: {
|
|
16956
|
+
kind: "complete",
|
|
16957
|
+
appearance: {
|
|
16958
|
+
background: {
|
|
16959
|
+
type: "surface",
|
|
16960
|
+
role: "link"
|
|
16961
|
+
},
|
|
16962
|
+
borderRadius: "rounded-xl",
|
|
16963
|
+
border: { widthClass: "border" }
|
|
16964
|
+
}
|
|
16965
|
+
},
|
|
16966
|
+
ghost: {
|
|
16967
|
+
kind: "complete",
|
|
16968
|
+
appearance: {
|
|
16969
|
+
background: {
|
|
16970
|
+
type: "surface",
|
|
16971
|
+
role: "link"
|
|
16972
|
+
},
|
|
16973
|
+
borderRadius: "rounded-xl"
|
|
16974
|
+
}
|
|
16975
|
+
},
|
|
16976
|
+
accent: {
|
|
16977
|
+
kind: "derive",
|
|
16978
|
+
from: "primary",
|
|
16979
|
+
overrides: { background: {
|
|
16980
|
+
type: "solid",
|
|
16981
|
+
colorToken: unsafeAsOpaqueButtonColourToken("accent")
|
|
16982
|
+
} }
|
|
16983
|
+
}
|
|
16984
|
+
}
|
|
16985
|
+
})
|
|
16986
|
+
});
|
|
16987
|
+
//#endregion
|
|
16988
|
+
//#region ../theme-core/src/buttons/styles/recipes/defineStaticButtonStyleRecipe.ts
|
|
16989
|
+
const emptyParametersSchema = z$1.object({}).strict();
|
|
16990
|
+
function defineStaticButtonStyleRecipe(input) {
|
|
16991
|
+
const system = normalizeSystem(input.system);
|
|
16992
|
+
return defineButtonStyleRecipe({
|
|
16993
|
+
id: input.id,
|
|
16994
|
+
accessibilityLabel: input.accessibilityLabel,
|
|
16725
16995
|
tags: input.tags,
|
|
16726
|
-
|
|
16996
|
+
parameterSchema: emptyParametersSchema,
|
|
16997
|
+
defaultParameters: {},
|
|
16998
|
+
controls: [],
|
|
16999
|
+
defineSystem: () => system
|
|
17000
|
+
});
|
|
17001
|
+
}
|
|
17002
|
+
function normalizeSystem(input) {
|
|
17003
|
+
return {
|
|
17004
|
+
global: buttonGlobalSettingsSchema.parse(input.global),
|
|
17005
|
+
...input.sizes ? { sizes: input.sizes } : {},
|
|
17006
|
+
roles: {
|
|
17007
|
+
primary: normalizeCompleteRole(input.roles.primary),
|
|
17008
|
+
secondary: normalizeCompleteRole(input.roles.secondary),
|
|
17009
|
+
outline: normalizeSupportingRole(input.roles.outline),
|
|
17010
|
+
ghost: normalizeSupportingRole(input.roles.ghost),
|
|
17011
|
+
accent: normalizeSupportingRole(input.roles.accent)
|
|
17012
|
+
}
|
|
17013
|
+
};
|
|
17014
|
+
}
|
|
17015
|
+
function normalizeCompleteRole(role) {
|
|
17016
|
+
return {
|
|
17017
|
+
kind: "complete",
|
|
17018
|
+
appearance: normalizeAppearance(role.appearance)
|
|
17019
|
+
};
|
|
17020
|
+
}
|
|
17021
|
+
function normalizeSupportingRole(role) {
|
|
17022
|
+
if (role.kind === "complete") return normalizeCompleteRole(role);
|
|
17023
|
+
return {
|
|
17024
|
+
kind: "derive",
|
|
17025
|
+
from: role.from,
|
|
17026
|
+
...role.overrides ? { overrides: normalizeAppearanceOverrides(role.overrides) } : {}
|
|
17027
|
+
};
|
|
17028
|
+
}
|
|
17029
|
+
function normalizeAppearance(appearance) {
|
|
17030
|
+
const { background, hoverBackgroundToken, ...rest } = appearance;
|
|
17031
|
+
return {
|
|
17032
|
+
...rest,
|
|
17033
|
+
background: buttonColourTreatmentSchema.parse(background),
|
|
17034
|
+
...hoverBackgroundToken ? { hoverBackgroundToken: opaqueButtonColourTokenSchema.parse(hoverBackgroundToken) } : {}
|
|
17035
|
+
};
|
|
17036
|
+
}
|
|
17037
|
+
function normalizeAppearanceOverrides(overrides) {
|
|
17038
|
+
const { background, hoverBackgroundToken, ...rest } = overrides;
|
|
17039
|
+
return {
|
|
17040
|
+
...rest,
|
|
17041
|
+
...background ? { background: buttonColourTreatmentSchema.parse(background) } : {},
|
|
17042
|
+
...hoverBackgroundToken ? { hoverBackgroundToken: opaqueButtonColourTokenSchema.parse(hoverBackgroundToken) } : {}
|
|
16727
17043
|
};
|
|
16728
17044
|
}
|
|
16729
17045
|
//#endregion
|
|
16730
|
-
//#region ../theme-core/src/buttons/
|
|
16731
|
-
|
|
16732
|
-
|
|
16733
|
-
|
|
16734
|
-
|
|
16735
|
-
|
|
17046
|
+
//#region ../theme-core/src/buttons/styles/recipes/staticRecipes.ts
|
|
17047
|
+
const softPillRecipe = defineStaticButtonStyleRecipe({
|
|
17048
|
+
id: "soft-pill",
|
|
17049
|
+
accessibilityLabel: "Rounded pill buttons with a gentle hover lift",
|
|
17050
|
+
tags: {
|
|
17051
|
+
tone: "classic",
|
|
17052
|
+
energy: "calm",
|
|
17053
|
+
motion: "subtle",
|
|
17054
|
+
era: "organic"
|
|
17055
|
+
},
|
|
17056
|
+
system: {
|
|
17057
|
+
global: {
|
|
17058
|
+
cornerStyle: "pill",
|
|
17059
|
+
shadow: "low",
|
|
17060
|
+
textTransform: "none",
|
|
17061
|
+
fontWeight: 500,
|
|
17062
|
+
borderWidth: 2,
|
|
17063
|
+
hoverTransform: "lift",
|
|
17064
|
+
hoverColor: "none"
|
|
17065
|
+
},
|
|
17066
|
+
roles: {
|
|
17067
|
+
primary: {
|
|
17068
|
+
kind: "complete",
|
|
17069
|
+
appearance: {
|
|
17070
|
+
background: {
|
|
17071
|
+
type: "solid",
|
|
17072
|
+
colorToken: "primary"
|
|
17073
|
+
},
|
|
17074
|
+
borderRadius: "rounded-full",
|
|
17075
|
+
shadow: {
|
|
17076
|
+
elevation: "low",
|
|
17077
|
+
softness: "soft",
|
|
17078
|
+
position: "bottom"
|
|
17079
|
+
},
|
|
17080
|
+
effects: {
|
|
17081
|
+
hover: [{
|
|
17082
|
+
effectId: "lift",
|
|
17083
|
+
options: { translateY: "-1px" }
|
|
17084
|
+
}],
|
|
17085
|
+
active: [{
|
|
17086
|
+
effectId: "scale-down",
|
|
17087
|
+
options: { scale: "0.98" }
|
|
17088
|
+
}]
|
|
17089
|
+
}
|
|
17090
|
+
}
|
|
17091
|
+
},
|
|
17092
|
+
secondary: {
|
|
17093
|
+
kind: "complete",
|
|
17094
|
+
appearance: {
|
|
17095
|
+
background: {
|
|
17096
|
+
type: "surface",
|
|
17097
|
+
role: "link"
|
|
17098
|
+
},
|
|
17099
|
+
borderRadius: "rounded-full",
|
|
17100
|
+
border: { widthClass: "border-2" },
|
|
17101
|
+
effects: { hover: [{
|
|
17102
|
+
effectId: "background-on-hover",
|
|
17103
|
+
options: { colorToken: "surface" }
|
|
17104
|
+
}] }
|
|
17105
|
+
}
|
|
17106
|
+
},
|
|
17107
|
+
outline: {
|
|
17108
|
+
kind: "complete",
|
|
17109
|
+
appearance: {
|
|
17110
|
+
background: {
|
|
17111
|
+
type: "surface",
|
|
17112
|
+
role: "link"
|
|
17113
|
+
},
|
|
17114
|
+
borderRadius: "rounded-full",
|
|
17115
|
+
border: { widthClass: "border" },
|
|
17116
|
+
effects: { hover: [{
|
|
17117
|
+
effectId: "background-on-hover",
|
|
17118
|
+
options: { colorToken: "surface" }
|
|
17119
|
+
}] }
|
|
17120
|
+
}
|
|
17121
|
+
},
|
|
17122
|
+
ghost: {
|
|
17123
|
+
kind: "complete",
|
|
17124
|
+
appearance: {
|
|
17125
|
+
background: {
|
|
17126
|
+
type: "surface",
|
|
17127
|
+
role: "link"
|
|
17128
|
+
},
|
|
17129
|
+
borderRadius: "rounded-full",
|
|
17130
|
+
effects: { hover: [{
|
|
17131
|
+
effectId: "background-on-hover",
|
|
17132
|
+
options: { colorToken: "surface" }
|
|
17133
|
+
}] }
|
|
17134
|
+
}
|
|
17135
|
+
},
|
|
17136
|
+
accent: {
|
|
17137
|
+
kind: "derive",
|
|
17138
|
+
from: "primary",
|
|
17139
|
+
overrides: { background: {
|
|
17140
|
+
type: "solid",
|
|
17141
|
+
colorToken: "accent"
|
|
17142
|
+
} }
|
|
17143
|
+
}
|
|
17144
|
+
}
|
|
17145
|
+
}
|
|
17146
|
+
});
|
|
17147
|
+
const earthPillRecipe = defineStaticButtonStyleRecipe({
|
|
17148
|
+
id: "earth-pill",
|
|
17149
|
+
accessibilityLabel: "Compact rounded buttons with a quiet hover lift",
|
|
17150
|
+
tags: {
|
|
17151
|
+
tone: "classic",
|
|
17152
|
+
energy: "calm",
|
|
17153
|
+
motion: "subtle",
|
|
17154
|
+
era: "organic"
|
|
17155
|
+
},
|
|
17156
|
+
system: {
|
|
17157
|
+
global: {
|
|
17158
|
+
cornerStyle: "pill",
|
|
17159
|
+
shadow: "low",
|
|
17160
|
+
textTransform: "none",
|
|
17161
|
+
fontWeight: 500,
|
|
17162
|
+
borderWidth: 1,
|
|
17163
|
+
hoverTransform: "lift",
|
|
17164
|
+
hoverColor: "none",
|
|
17165
|
+
typography: "body",
|
|
17166
|
+
paddingPreset: "default"
|
|
17167
|
+
},
|
|
17168
|
+
sizes: {
|
|
17169
|
+
sm: {
|
|
17170
|
+
padding: "0.5rem 1rem",
|
|
17171
|
+
fontSize: "text-sm"
|
|
17172
|
+
},
|
|
17173
|
+
md: { padding: "0.625rem 1.35rem" },
|
|
17174
|
+
lg: {
|
|
17175
|
+
padding: "0.75rem 1.65rem",
|
|
17176
|
+
fontSize: "text-lg"
|
|
17177
|
+
},
|
|
17178
|
+
xl: {
|
|
17179
|
+
padding: "0.875rem 2rem",
|
|
17180
|
+
fontSize: "text-xl"
|
|
17181
|
+
}
|
|
17182
|
+
},
|
|
17183
|
+
roles: {
|
|
17184
|
+
primary: {
|
|
17185
|
+
kind: "complete",
|
|
17186
|
+
appearance: {
|
|
17187
|
+
background: {
|
|
17188
|
+
type: "solid",
|
|
17189
|
+
colorToken: "primary"
|
|
17190
|
+
},
|
|
17191
|
+
borderRadius: "rounded-full",
|
|
17192
|
+
shadow: {
|
|
17193
|
+
elevation: "low",
|
|
17194
|
+
softness: "soft",
|
|
17195
|
+
position: "bottom"
|
|
17196
|
+
},
|
|
17197
|
+
effects: {
|
|
17198
|
+
hover: [{
|
|
17199
|
+
effectId: "lift",
|
|
17200
|
+
options: { translateY: "-1px" }
|
|
17201
|
+
}, {
|
|
17202
|
+
effectId: "background-on-hover",
|
|
17203
|
+
options: { colorToken: "accent" }
|
|
17204
|
+
}],
|
|
17205
|
+
active: [{
|
|
17206
|
+
effectId: "scale-down",
|
|
17207
|
+
options: { scale: "0.98" }
|
|
17208
|
+
}]
|
|
17209
|
+
}
|
|
17210
|
+
}
|
|
17211
|
+
},
|
|
17212
|
+
secondary: {
|
|
17213
|
+
kind: "complete",
|
|
17214
|
+
appearance: {
|
|
17215
|
+
background: {
|
|
17216
|
+
type: "surface",
|
|
17217
|
+
role: "link"
|
|
17218
|
+
},
|
|
17219
|
+
borderRadius: "rounded-full",
|
|
17220
|
+
border: { widthClass: "border" },
|
|
17221
|
+
effects: { hover: [{
|
|
17222
|
+
effectId: "background-on-hover",
|
|
17223
|
+
options: { colorToken: "muted" }
|
|
17224
|
+
}] }
|
|
17225
|
+
}
|
|
17226
|
+
},
|
|
17227
|
+
outline: {
|
|
17228
|
+
kind: "complete",
|
|
17229
|
+
appearance: {
|
|
17230
|
+
background: {
|
|
17231
|
+
type: "surface",
|
|
17232
|
+
role: "link"
|
|
17233
|
+
},
|
|
17234
|
+
borderRadius: "rounded-full",
|
|
17235
|
+
border: { widthClass: "border" },
|
|
17236
|
+
effects: { hover: [{
|
|
17237
|
+
effectId: "background-on-hover",
|
|
17238
|
+
options: { colorToken: "surfaceAlt" }
|
|
17239
|
+
}] }
|
|
17240
|
+
}
|
|
17241
|
+
},
|
|
17242
|
+
ghost: {
|
|
17243
|
+
kind: "complete",
|
|
17244
|
+
appearance: {
|
|
17245
|
+
background: {
|
|
17246
|
+
type: "surface",
|
|
17247
|
+
role: "link"
|
|
17248
|
+
},
|
|
17249
|
+
borderRadius: "rounded-full",
|
|
17250
|
+
shadow: {
|
|
17251
|
+
elevation: "none",
|
|
17252
|
+
softness: null,
|
|
17253
|
+
position: "bottom"
|
|
17254
|
+
},
|
|
17255
|
+
sizes: {
|
|
17256
|
+
sm: {
|
|
17257
|
+
padding: "0.25rem 0",
|
|
17258
|
+
fontSize: "text-sm"
|
|
17259
|
+
},
|
|
17260
|
+
md: { padding: "0.375rem 0" },
|
|
17261
|
+
lg: {
|
|
17262
|
+
padding: "0.5rem 0",
|
|
17263
|
+
fontSize: "text-lg"
|
|
17264
|
+
},
|
|
17265
|
+
xl: {
|
|
17266
|
+
padding: "0.625rem 0",
|
|
17267
|
+
fontSize: "text-xl"
|
|
17268
|
+
}
|
|
17269
|
+
}
|
|
17270
|
+
}
|
|
17271
|
+
},
|
|
17272
|
+
accent: {
|
|
17273
|
+
kind: "derive",
|
|
17274
|
+
from: "primary",
|
|
17275
|
+
overrides: { background: {
|
|
17276
|
+
type: "solid",
|
|
17277
|
+
colorToken: "accent"
|
|
17278
|
+
} }
|
|
17279
|
+
}
|
|
17280
|
+
}
|
|
17281
|
+
}
|
|
17282
|
+
});
|
|
17283
|
+
const confidentChipRecipe = defineStaticButtonStyleRecipe({
|
|
17284
|
+
id: "confident-chip",
|
|
17285
|
+
accessibilityLabel: "Moderately rounded solid buttons with a crisp hover",
|
|
17286
|
+
tags: {
|
|
17287
|
+
tone: "classic",
|
|
17288
|
+
energy: "calm",
|
|
17289
|
+
motion: "standard",
|
|
17290
|
+
era: "modern"
|
|
17291
|
+
},
|
|
17292
|
+
system: {
|
|
17293
|
+
global: {
|
|
17294
|
+
cornerStyle: "rounded",
|
|
17295
|
+
shadow: "medium",
|
|
17296
|
+
textTransform: "none",
|
|
17297
|
+
fontWeight: 600,
|
|
17298
|
+
borderWidth: 1,
|
|
17299
|
+
hoverTransform: "none",
|
|
17300
|
+
hoverColor: "none"
|
|
17301
|
+
},
|
|
17302
|
+
roles: {
|
|
17303
|
+
primary: {
|
|
17304
|
+
kind: "complete",
|
|
17305
|
+
appearance: {
|
|
17306
|
+
background: {
|
|
17307
|
+
type: "solid",
|
|
17308
|
+
colorToken: "primary"
|
|
17309
|
+
},
|
|
17310
|
+
borderRadius: "rounded-md",
|
|
17311
|
+
shadow: {
|
|
17312
|
+
elevation: "medium",
|
|
17313
|
+
softness: "soft",
|
|
17314
|
+
position: "bottom"
|
|
17315
|
+
},
|
|
17316
|
+
effects: {
|
|
17317
|
+
hover: [{
|
|
17318
|
+
effectId: "darken-background",
|
|
17319
|
+
options: { amount: 100 }
|
|
17320
|
+
}],
|
|
17321
|
+
active: [{
|
|
17322
|
+
effectId: "scale-down",
|
|
17323
|
+
options: { scale: "0.97" }
|
|
17324
|
+
}]
|
|
17325
|
+
}
|
|
17326
|
+
}
|
|
17327
|
+
},
|
|
17328
|
+
secondary: {
|
|
17329
|
+
kind: "complete",
|
|
17330
|
+
appearance: {
|
|
17331
|
+
background: {
|
|
17332
|
+
type: "solid",
|
|
17333
|
+
colorToken: "surface"
|
|
17334
|
+
},
|
|
17335
|
+
borderRadius: "rounded-md",
|
|
17336
|
+
border: { widthClass: "border" },
|
|
17337
|
+
effects: { hover: [{
|
|
17338
|
+
effectId: "background-on-hover",
|
|
17339
|
+
options: { colorToken: "background" }
|
|
17340
|
+
}] }
|
|
17341
|
+
}
|
|
17342
|
+
},
|
|
17343
|
+
outline: {
|
|
17344
|
+
kind: "complete",
|
|
17345
|
+
appearance: {
|
|
17346
|
+
background: {
|
|
17347
|
+
type: "surface",
|
|
17348
|
+
role: "link"
|
|
17349
|
+
},
|
|
17350
|
+
borderRadius: "rounded-md",
|
|
17351
|
+
border: { widthClass: "border" },
|
|
17352
|
+
effects: { hover: [{
|
|
17353
|
+
effectId: "background-on-hover",
|
|
17354
|
+
options: { colorToken: "surface" }
|
|
17355
|
+
}] }
|
|
17356
|
+
}
|
|
17357
|
+
},
|
|
17358
|
+
ghost: {
|
|
17359
|
+
kind: "complete",
|
|
17360
|
+
appearance: {
|
|
17361
|
+
background: {
|
|
17362
|
+
type: "surface",
|
|
17363
|
+
role: "link"
|
|
17364
|
+
},
|
|
17365
|
+
borderRadius: "rounded-md",
|
|
17366
|
+
effects: { hover: [{
|
|
17367
|
+
effectId: "background-on-hover",
|
|
17368
|
+
options: { colorToken: "surface" }
|
|
17369
|
+
}] }
|
|
17370
|
+
}
|
|
17371
|
+
},
|
|
17372
|
+
accent: {
|
|
17373
|
+
kind: "derive",
|
|
17374
|
+
from: "primary",
|
|
17375
|
+
overrides: { background: {
|
|
17376
|
+
type: "solid",
|
|
17377
|
+
colorToken: "accent"
|
|
17378
|
+
} }
|
|
17379
|
+
}
|
|
17380
|
+
}
|
|
17381
|
+
}
|
|
17382
|
+
});
|
|
17383
|
+
const editorialSizes = {
|
|
17384
|
+
sm: { padding: "0.25rem 0" },
|
|
17385
|
+
md: { padding: "0.5rem 0" },
|
|
17386
|
+
lg: { padding: "0.625rem 0" },
|
|
17387
|
+
xl: { padding: "0.75rem 0" }
|
|
17388
|
+
};
|
|
17389
|
+
const editorialLinkRecipe = defineStaticButtonStyleRecipe({
|
|
17390
|
+
id: "editorial-link",
|
|
17391
|
+
accessibilityLabel: "Flat typographic buttons with an underline treatment",
|
|
17392
|
+
tags: {
|
|
17393
|
+
tone: "minimal",
|
|
17394
|
+
energy: "calm",
|
|
17395
|
+
motion: "subtle",
|
|
17396
|
+
era: "editorial"
|
|
17397
|
+
},
|
|
17398
|
+
system: {
|
|
17399
|
+
global: {
|
|
17400
|
+
cornerStyle: "square",
|
|
17401
|
+
textTransform: "none",
|
|
17402
|
+
fontWeight: 500,
|
|
17403
|
+
borderWidth: 1,
|
|
17404
|
+
hoverTransform: "none",
|
|
17405
|
+
hoverColor: "none"
|
|
17406
|
+
},
|
|
17407
|
+
roles: {
|
|
17408
|
+
primary: {
|
|
17409
|
+
kind: "complete",
|
|
17410
|
+
appearance: {
|
|
17411
|
+
background: {
|
|
17412
|
+
type: "surface",
|
|
17413
|
+
role: "link"
|
|
17414
|
+
},
|
|
17415
|
+
borderRadius: "rounded-none",
|
|
17416
|
+
sizes: editorialSizes,
|
|
17417
|
+
effects: { base: [{
|
|
17418
|
+
effectId: "border-bottom-grow",
|
|
17419
|
+
options: {
|
|
17420
|
+
height: 2,
|
|
17421
|
+
colorToken: "text",
|
|
17422
|
+
origin: "left"
|
|
17423
|
+
}
|
|
17424
|
+
}] }
|
|
17425
|
+
}
|
|
17426
|
+
},
|
|
17427
|
+
secondary: {
|
|
17428
|
+
kind: "complete",
|
|
17429
|
+
appearance: {
|
|
17430
|
+
background: {
|
|
17431
|
+
type: "surface",
|
|
17432
|
+
role: "link"
|
|
17433
|
+
},
|
|
17434
|
+
borderRadius: "rounded-none",
|
|
17435
|
+
sizes: editorialSizes,
|
|
17436
|
+
effects: { base: [{
|
|
17437
|
+
effectId: "border-bottom-grow",
|
|
17438
|
+
options: {
|
|
17439
|
+
height: 1,
|
|
17440
|
+
colorToken: "mutedText",
|
|
17441
|
+
origin: "left"
|
|
17442
|
+
}
|
|
17443
|
+
}] }
|
|
17444
|
+
}
|
|
17445
|
+
},
|
|
17446
|
+
outline: {
|
|
17447
|
+
kind: "complete",
|
|
17448
|
+
appearance: {
|
|
17449
|
+
background: {
|
|
17450
|
+
type: "surface",
|
|
17451
|
+
role: "link"
|
|
17452
|
+
},
|
|
17453
|
+
borderRadius: "rounded-none",
|
|
17454
|
+
sizes: editorialSizes,
|
|
17455
|
+
effects: { base: [{
|
|
17456
|
+
effectId: "border-bottom-grow",
|
|
17457
|
+
options: {
|
|
17458
|
+
height: 1,
|
|
17459
|
+
colorToken: "accent",
|
|
17460
|
+
origin: "left"
|
|
17461
|
+
}
|
|
17462
|
+
}] }
|
|
17463
|
+
}
|
|
17464
|
+
},
|
|
17465
|
+
ghost: {
|
|
17466
|
+
kind: "complete",
|
|
17467
|
+
appearance: {
|
|
17468
|
+
background: {
|
|
17469
|
+
type: "surface",
|
|
17470
|
+
role: "link"
|
|
17471
|
+
},
|
|
17472
|
+
borderRadius: "rounded-none",
|
|
17473
|
+
sizes: editorialSizes
|
|
17474
|
+
}
|
|
17475
|
+
},
|
|
17476
|
+
accent: {
|
|
17477
|
+
kind: "derive",
|
|
17478
|
+
from: "primary",
|
|
17479
|
+
overrides: { effects: { base: [{
|
|
17480
|
+
effectId: "border-bottom-grow",
|
|
17481
|
+
options: {
|
|
17482
|
+
height: 2,
|
|
17483
|
+
colorToken: "accent",
|
|
17484
|
+
origin: "left"
|
|
17485
|
+
}
|
|
17486
|
+
}] } }
|
|
17487
|
+
}
|
|
17488
|
+
}
|
|
17489
|
+
}
|
|
17490
|
+
});
|
|
17491
|
+
const pebbleRecipe = defineStaticButtonStyleRecipe({
|
|
17492
|
+
id: "pebble",
|
|
17493
|
+
accessibilityLabel: "Generously padded pill buttons",
|
|
17494
|
+
tags: {
|
|
17495
|
+
tone: "classic",
|
|
17496
|
+
energy: "calm",
|
|
17497
|
+
motion: "standard",
|
|
17498
|
+
era: "organic"
|
|
17499
|
+
},
|
|
17500
|
+
system: {
|
|
17501
|
+
global: {
|
|
17502
|
+
cornerStyle: "pill",
|
|
17503
|
+
textTransform: "none",
|
|
17504
|
+
fontWeight: 500,
|
|
17505
|
+
borderWidth: 2,
|
|
17506
|
+
hoverTransform: "none",
|
|
17507
|
+
hoverColor: "none"
|
|
17508
|
+
},
|
|
17509
|
+
sizes: {
|
|
17510
|
+
sm: {
|
|
17511
|
+
padding: "0.625rem 1.75rem",
|
|
17512
|
+
fontSize: "text-sm"
|
|
17513
|
+
},
|
|
17514
|
+
md: { padding: "0.875rem 2.25rem" },
|
|
17515
|
+
lg: {
|
|
17516
|
+
padding: "1.125rem 2.75rem",
|
|
17517
|
+
fontSize: "text-lg"
|
|
17518
|
+
},
|
|
17519
|
+
xl: {
|
|
17520
|
+
padding: "1.5rem 3.5rem",
|
|
17521
|
+
fontSize: "text-xl"
|
|
17522
|
+
}
|
|
17523
|
+
},
|
|
17524
|
+
roles: {
|
|
17525
|
+
primary: {
|
|
17526
|
+
kind: "complete",
|
|
17527
|
+
appearance: {
|
|
17528
|
+
background: {
|
|
17529
|
+
type: "solid",
|
|
17530
|
+
colorToken: "primary"
|
|
17531
|
+
},
|
|
17532
|
+
borderRadius: "rounded-full",
|
|
17533
|
+
effects: { hover: [{
|
|
17534
|
+
effectId: "darken-background",
|
|
17535
|
+
options: { amount: 100 }
|
|
17536
|
+
}] }
|
|
17537
|
+
}
|
|
17538
|
+
},
|
|
17539
|
+
secondary: {
|
|
17540
|
+
kind: "complete",
|
|
17541
|
+
appearance: {
|
|
17542
|
+
background: {
|
|
17543
|
+
type: "surface",
|
|
17544
|
+
role: "link"
|
|
17545
|
+
},
|
|
17546
|
+
borderRadius: "rounded-full",
|
|
17547
|
+
border: { widthClass: "border-2" },
|
|
17548
|
+
effects: { hover: [{
|
|
17549
|
+
effectId: "background-on-hover",
|
|
17550
|
+
options: { colorToken: "accent" }
|
|
17551
|
+
}] }
|
|
17552
|
+
}
|
|
17553
|
+
},
|
|
17554
|
+
outline: {
|
|
17555
|
+
kind: "complete",
|
|
17556
|
+
appearance: {
|
|
17557
|
+
background: {
|
|
17558
|
+
type: "surface",
|
|
17559
|
+
role: "link"
|
|
17560
|
+
},
|
|
17561
|
+
borderRadius: "rounded-full",
|
|
17562
|
+
border: { widthClass: "border" },
|
|
17563
|
+
effects: { hover: [{
|
|
17564
|
+
effectId: "background-on-hover",
|
|
17565
|
+
options: { colorToken: "surface" }
|
|
17566
|
+
}] }
|
|
17567
|
+
}
|
|
17568
|
+
},
|
|
17569
|
+
ghost: {
|
|
17570
|
+
kind: "complete",
|
|
17571
|
+
appearance: {
|
|
17572
|
+
background: {
|
|
17573
|
+
type: "surface",
|
|
17574
|
+
role: "link"
|
|
17575
|
+
},
|
|
17576
|
+
borderRadius: "rounded-full",
|
|
17577
|
+
sizes: {
|
|
17578
|
+
sm: {
|
|
17579
|
+
padding: "0.375rem 0.875rem",
|
|
17580
|
+
fontSize: "text-sm"
|
|
17581
|
+
},
|
|
17582
|
+
md: { padding: "0.5rem 1rem" },
|
|
17583
|
+
lg: {
|
|
17584
|
+
padding: "0.625rem 1.25rem",
|
|
17585
|
+
fontSize: "text-lg"
|
|
17586
|
+
},
|
|
17587
|
+
xl: {
|
|
17588
|
+
padding: "0.75rem 1.5rem",
|
|
17589
|
+
fontSize: "text-xl"
|
|
17590
|
+
}
|
|
17591
|
+
}
|
|
17592
|
+
}
|
|
17593
|
+
},
|
|
17594
|
+
accent: {
|
|
17595
|
+
kind: "derive",
|
|
17596
|
+
from: "primary",
|
|
17597
|
+
overrides: { background: {
|
|
17598
|
+
type: "solid",
|
|
17599
|
+
colorToken: "accent"
|
|
17600
|
+
} }
|
|
17601
|
+
}
|
|
17602
|
+
}
|
|
17603
|
+
}
|
|
17604
|
+
});
|
|
17605
|
+
const brushedWashRecipe = defineStaticButtonStyleRecipe({
|
|
16736
17606
|
id: "brushed-wash",
|
|
16737
|
-
|
|
16738
|
-
description: "Watercolour-gradient buttons with soft shadows and generous padding.",
|
|
17607
|
+
accessibilityLabel: "Generously padded gradient buttons with soft shadows",
|
|
16739
17608
|
tags: {
|
|
16740
17609
|
tone: "classic",
|
|
16741
17610
|
energy: "vibrant",
|
|
16742
17611
|
motion: "standard",
|
|
16743
17612
|
era: "organic"
|
|
16744
17613
|
},
|
|
16745
|
-
|
|
17614
|
+
system: {
|
|
16746
17615
|
global: {
|
|
16747
17616
|
cornerStyle: "rounded",
|
|
16748
17617
|
shadow: "low",
|
|
@@ -16767,461 +17636,229 @@ const brushedWash = defineButtonPersonality({
|
|
|
16767
17636
|
fontSize: "text-xl"
|
|
16768
17637
|
}
|
|
16769
17638
|
},
|
|
16770
|
-
|
|
16771
|
-
{
|
|
16772
|
-
|
|
16773
|
-
|
|
16774
|
-
|
|
16775
|
-
|
|
16776
|
-
|
|
16777
|
-
|
|
16778
|
-
|
|
16779
|
-
|
|
16780
|
-
|
|
16781
|
-
|
|
16782
|
-
|
|
16783
|
-
|
|
16784
|
-
|
|
16785
|
-
|
|
16786
|
-
position: "bottom"
|
|
17639
|
+
roles: {
|
|
17640
|
+
primary: {
|
|
17641
|
+
kind: "complete",
|
|
17642
|
+
appearance: {
|
|
17643
|
+
background: {
|
|
17644
|
+
type: "gradient",
|
|
17645
|
+
stops: ["primary", "accent"],
|
|
17646
|
+
direction: "to-r",
|
|
17647
|
+
foregroundToken: "primaryForeground"
|
|
17648
|
+
},
|
|
17649
|
+
borderRadius: "rounded-lg",
|
|
17650
|
+
shadow: {
|
|
17651
|
+
elevation: "low",
|
|
17652
|
+
softness: "soft",
|
|
17653
|
+
position: "bottom"
|
|
17654
|
+
}
|
|
16787
17655
|
}
|
|
16788
17656
|
},
|
|
16789
|
-
{
|
|
16790
|
-
|
|
16791
|
-
|
|
16792
|
-
|
|
16793
|
-
|
|
16794
|
-
|
|
16795
|
-
|
|
16796
|
-
|
|
16797
|
-
|
|
16798
|
-
|
|
16799
|
-
|
|
16800
|
-
|
|
16801
|
-
|
|
16802
|
-
|
|
16803
|
-
|
|
16804
|
-
position: "bottom"
|
|
17657
|
+
secondary: {
|
|
17658
|
+
kind: "complete",
|
|
17659
|
+
appearance: {
|
|
17660
|
+
background: {
|
|
17661
|
+
type: "gradient",
|
|
17662
|
+
stops: ["secondary", "accent"],
|
|
17663
|
+
direction: "to-br",
|
|
17664
|
+
foregroundToken: "primaryForeground"
|
|
17665
|
+
},
|
|
17666
|
+
borderRadius: "rounded-lg",
|
|
17667
|
+
shadow: {
|
|
17668
|
+
elevation: "low",
|
|
17669
|
+
softness: "soft",
|
|
17670
|
+
position: "bottom"
|
|
17671
|
+
}
|
|
16805
17672
|
}
|
|
16806
17673
|
},
|
|
16807
|
-
{
|
|
16808
|
-
|
|
16809
|
-
|
|
16810
|
-
|
|
16811
|
-
|
|
16812
|
-
|
|
16813
|
-
|
|
16814
|
-
|
|
16815
|
-
|
|
16816
|
-
|
|
16817
|
-
|
|
16818
|
-
|
|
16819
|
-
|
|
16820
|
-
|
|
16821
|
-
}] }
|
|
17674
|
+
outline: {
|
|
17675
|
+
kind: "complete",
|
|
17676
|
+
appearance: {
|
|
17677
|
+
background: {
|
|
17678
|
+
type: "surface",
|
|
17679
|
+
role: "link"
|
|
17680
|
+
},
|
|
17681
|
+
borderRadius: "rounded-lg",
|
|
17682
|
+
border: { widthClass: "border" },
|
|
17683
|
+
effects: { hover: [{
|
|
17684
|
+
effectId: "background-on-hover",
|
|
17685
|
+
options: { colorToken: "surface" }
|
|
17686
|
+
}] }
|
|
17687
|
+
}
|
|
16822
17688
|
},
|
|
16823
|
-
{
|
|
16824
|
-
|
|
16825
|
-
|
|
16826
|
-
|
|
16827
|
-
|
|
16828
|
-
|
|
16829
|
-
|
|
16830
|
-
|
|
16831
|
-
|
|
16832
|
-
|
|
16833
|
-
|
|
16834
|
-
|
|
16835
|
-
options: { colorToken: "surface" }
|
|
16836
|
-
}] }
|
|
16837
|
-
}
|
|
16838
|
-
]
|
|
16839
|
-
}
|
|
16840
|
-
});
|
|
16841
|
-
//#endregion
|
|
16842
|
-
//#region ../theme-core/src/buttons/personalities/confident-chip.ts
|
|
16843
|
-
/**
|
|
16844
|
-
* Confident Chip — moderate-radius solid buttons that read as competent and
|
|
16845
|
-
* direct. Default for Clear Professional; works for any modern brand voice.
|
|
16846
|
-
*/
|
|
16847
|
-
const confidentChip = defineButtonPersonality({
|
|
16848
|
-
id: "confident-chip",
|
|
16849
|
-
name: "Confident Chip",
|
|
16850
|
-
description: "Mid-radius solid buttons with a crisp hover.",
|
|
16851
|
-
tags: {
|
|
16852
|
-
tone: "classic",
|
|
16853
|
-
energy: "calm",
|
|
16854
|
-
motion: "standard",
|
|
16855
|
-
era: "modern"
|
|
16856
|
-
},
|
|
16857
|
-
buttonSystem: {
|
|
16858
|
-
global: {
|
|
16859
|
-
cornerStyle: "rounded",
|
|
16860
|
-
shadow: "medium",
|
|
16861
|
-
textTransform: "none",
|
|
16862
|
-
fontWeight: 600,
|
|
16863
|
-
borderWidth: 1,
|
|
16864
|
-
hoverTransform: "none",
|
|
16865
|
-
hoverColor: "none"
|
|
16866
|
-
},
|
|
16867
|
-
variants: [
|
|
16868
|
-
{
|
|
16869
|
-
id: "primary",
|
|
16870
|
-
name: "Primary",
|
|
16871
|
-
enabled: true,
|
|
16872
|
-
priority: 1,
|
|
16873
|
-
background: {
|
|
16874
|
-
type: "solid",
|
|
16875
|
-
colorToken: "primary"
|
|
16876
|
-
},
|
|
16877
|
-
borderRadius: "rounded-md",
|
|
16878
|
-
shadow: {
|
|
16879
|
-
elevation: "medium",
|
|
16880
|
-
softness: "soft",
|
|
16881
|
-
position: "bottom"
|
|
16882
|
-
},
|
|
16883
|
-
effects: {
|
|
16884
|
-
hover: [{
|
|
16885
|
-
effectId: "darken-background",
|
|
16886
|
-
options: { amount: 100 }
|
|
16887
|
-
}],
|
|
16888
|
-
active: [{
|
|
16889
|
-
effectId: "scale-down",
|
|
16890
|
-
options: { scale: "0.97" }
|
|
16891
|
-
}]
|
|
17689
|
+
ghost: {
|
|
17690
|
+
kind: "complete",
|
|
17691
|
+
appearance: {
|
|
17692
|
+
background: {
|
|
17693
|
+
type: "surface",
|
|
17694
|
+
role: "link"
|
|
17695
|
+
},
|
|
17696
|
+
borderRadius: "rounded-lg",
|
|
17697
|
+
effects: { hover: [{
|
|
17698
|
+
effectId: "background-on-hover",
|
|
17699
|
+
options: { colorToken: "surface" }
|
|
17700
|
+
}] }
|
|
16892
17701
|
}
|
|
16893
17702
|
},
|
|
16894
|
-
{
|
|
16895
|
-
|
|
16896
|
-
|
|
16897
|
-
|
|
16898
|
-
priority: 2,
|
|
16899
|
-
background: {
|
|
17703
|
+
accent: {
|
|
17704
|
+
kind: "derive",
|
|
17705
|
+
from: "primary",
|
|
17706
|
+
overrides: { background: {
|
|
16900
17707
|
type: "solid",
|
|
16901
|
-
colorToken: "
|
|
16902
|
-
}
|
|
16903
|
-
borderRadius: "rounded-md",
|
|
16904
|
-
border: { widthClass: "border" },
|
|
16905
|
-
effects: { hover: [{
|
|
16906
|
-
effectId: "background-on-hover",
|
|
16907
|
-
options: { colorToken: "background" }
|
|
16908
|
-
}] }
|
|
16909
|
-
},
|
|
16910
|
-
{
|
|
16911
|
-
id: "outline",
|
|
16912
|
-
name: "Outline",
|
|
16913
|
-
enabled: true,
|
|
16914
|
-
priority: 3,
|
|
16915
|
-
background: {
|
|
16916
|
-
type: "surface",
|
|
16917
|
-
role: "link"
|
|
16918
|
-
},
|
|
16919
|
-
borderRadius: "rounded-md",
|
|
16920
|
-
border: { widthClass: "border" },
|
|
16921
|
-
effects: { hover: [{
|
|
16922
|
-
effectId: "background-on-hover",
|
|
16923
|
-
options: { colorToken: "surface" }
|
|
16924
|
-
}] }
|
|
16925
|
-
},
|
|
16926
|
-
{
|
|
16927
|
-
id: "ghost",
|
|
16928
|
-
name: "Ghost",
|
|
16929
|
-
enabled: true,
|
|
16930
|
-
priority: 3,
|
|
16931
|
-
background: {
|
|
16932
|
-
type: "surface",
|
|
16933
|
-
role: "link"
|
|
16934
|
-
},
|
|
16935
|
-
borderRadius: "rounded-md",
|
|
16936
|
-
effects: { hover: [{
|
|
16937
|
-
effectId: "background-on-hover",
|
|
16938
|
-
options: { colorToken: "surface" }
|
|
16939
|
-
}] }
|
|
17708
|
+
colorToken: "accent"
|
|
17709
|
+
} }
|
|
16940
17710
|
}
|
|
16941
|
-
|
|
17711
|
+
}
|
|
16942
17712
|
}
|
|
16943
17713
|
});
|
|
16944
|
-
|
|
16945
|
-
|
|
16946
|
-
|
|
16947
|
-
* Earth Pill - warm studio pills with compact, primary-coloured ghost CTAs.
|
|
16948
|
-
* Built for grounded editorial wellness styles such as Soft Earth.
|
|
16949
|
-
*/
|
|
16950
|
-
const earthPill = defineButtonPersonality({
|
|
16951
|
-
id: "earth-pill",
|
|
16952
|
-
name: "Earth Pill",
|
|
16953
|
-
description: "Compact terracotta pills with quiet primary-coloured ghost CTAs.",
|
|
17714
|
+
const inkStampRecipe = defineStaticButtonStyleRecipe({
|
|
17715
|
+
id: "ink-stamp",
|
|
17716
|
+
accessibilityLabel: "Uppercase block-print buttons with a playful hover",
|
|
16954
17717
|
tags: {
|
|
16955
|
-
tone: "
|
|
16956
|
-
energy: "
|
|
16957
|
-
motion: "
|
|
17718
|
+
tone: "bold",
|
|
17719
|
+
energy: "vibrant",
|
|
17720
|
+
motion: "standard",
|
|
16958
17721
|
era: "organic"
|
|
16959
17722
|
},
|
|
16960
|
-
|
|
17723
|
+
system: {
|
|
16961
17724
|
global: {
|
|
16962
|
-
cornerStyle: "
|
|
16963
|
-
|
|
16964
|
-
|
|
16965
|
-
fontWeight: 500,
|
|
17725
|
+
cornerStyle: "rounded",
|
|
17726
|
+
textTransform: "uppercase",
|
|
17727
|
+
fontWeight: 600,
|
|
16966
17728
|
borderWidth: 1,
|
|
16967
|
-
hoverTransform: "
|
|
17729
|
+
hoverTransform: "none",
|
|
16968
17730
|
hoverColor: "none",
|
|
16969
|
-
|
|
16970
|
-
paddingPreset: "default"
|
|
17731
|
+
letterSpacing: "loose"
|
|
16971
17732
|
},
|
|
16972
17733
|
sizes: {
|
|
16973
17734
|
sm: {
|
|
16974
|
-
padding: "0.5rem
|
|
17735
|
+
padding: "0.5rem 1.25rem",
|
|
17736
|
+
fontSize: "text-xs"
|
|
17737
|
+
},
|
|
17738
|
+
md: {
|
|
17739
|
+
padding: "0.75rem 1.75rem",
|
|
16975
17740
|
fontSize: "text-sm"
|
|
16976
17741
|
},
|
|
16977
|
-
md: { padding: "0.625rem 1.35rem" },
|
|
16978
17742
|
lg: {
|
|
16979
|
-
padding: "0.
|
|
16980
|
-
fontSize: "text-
|
|
17743
|
+
padding: "0.875rem 2.25rem",
|
|
17744
|
+
fontSize: "text-base"
|
|
16981
17745
|
},
|
|
16982
17746
|
xl: {
|
|
16983
|
-
padding: "
|
|
16984
|
-
fontSize: "text-
|
|
17747
|
+
padding: "1.125rem 2.75rem",
|
|
17748
|
+
fontSize: "text-lg"
|
|
16985
17749
|
}
|
|
16986
17750
|
},
|
|
16987
|
-
|
|
16988
|
-
{
|
|
16989
|
-
|
|
16990
|
-
|
|
16991
|
-
|
|
16992
|
-
|
|
16993
|
-
|
|
16994
|
-
|
|
16995
|
-
|
|
16996
|
-
|
|
16997
|
-
|
|
16998
|
-
|
|
16999
|
-
|
|
17000
|
-
|
|
17001
|
-
|
|
17002
|
-
|
|
17003
|
-
|
|
17004
|
-
|
|
17005
|
-
|
|
17006
|
-
|
|
17007
|
-
|
|
17008
|
-
|
|
17009
|
-
options: { colorToken: "accent" }
|
|
17010
|
-
}],
|
|
17011
|
-
active: [{
|
|
17012
|
-
effectId: "scale-down",
|
|
17013
|
-
options: { scale: "0.98" }
|
|
17014
|
-
}]
|
|
17751
|
+
roles: {
|
|
17752
|
+
primary: {
|
|
17753
|
+
kind: "complete",
|
|
17754
|
+
appearance: {
|
|
17755
|
+
background: {
|
|
17756
|
+
type: "solid",
|
|
17757
|
+
colorToken: "primary"
|
|
17758
|
+
},
|
|
17759
|
+
borderRadius: "rounded-md",
|
|
17760
|
+
effects: {
|
|
17761
|
+
hover: [{
|
|
17762
|
+
effectId: "drop-shadow",
|
|
17763
|
+
options: { intensity: "medium" }
|
|
17764
|
+
}, {
|
|
17765
|
+
effectId: "scale-up",
|
|
17766
|
+
options: { scale: "1.02" }
|
|
17767
|
+
}],
|
|
17768
|
+
active: [{
|
|
17769
|
+
effectId: "scale-down",
|
|
17770
|
+
options: { scale: "0.98" }
|
|
17771
|
+
}]
|
|
17772
|
+
}
|
|
17015
17773
|
}
|
|
17016
17774
|
},
|
|
17017
|
-
{
|
|
17018
|
-
|
|
17019
|
-
|
|
17020
|
-
|
|
17021
|
-
|
|
17022
|
-
|
|
17023
|
-
|
|
17024
|
-
|
|
17025
|
-
|
|
17026
|
-
|
|
17027
|
-
|
|
17028
|
-
|
|
17029
|
-
|
|
17030
|
-
|
|
17031
|
-
}] }
|
|
17775
|
+
secondary: {
|
|
17776
|
+
kind: "complete",
|
|
17777
|
+
appearance: {
|
|
17778
|
+
background: {
|
|
17779
|
+
type: "surface",
|
|
17780
|
+
role: "link"
|
|
17781
|
+
},
|
|
17782
|
+
borderRadius: "rounded-md",
|
|
17783
|
+
border: { widthClass: "border-2" },
|
|
17784
|
+
effects: { hover: [{
|
|
17785
|
+
effectId: "background-on-hover",
|
|
17786
|
+
options: { colorToken: "surface" }
|
|
17787
|
+
}] }
|
|
17788
|
+
}
|
|
17032
17789
|
},
|
|
17033
|
-
{
|
|
17034
|
-
|
|
17035
|
-
|
|
17036
|
-
|
|
17037
|
-
|
|
17038
|
-
|
|
17039
|
-
|
|
17040
|
-
|
|
17041
|
-
|
|
17042
|
-
|
|
17043
|
-
|
|
17044
|
-
|
|
17045
|
-
|
|
17046
|
-
|
|
17047
|
-
}] }
|
|
17790
|
+
outline: {
|
|
17791
|
+
kind: "complete",
|
|
17792
|
+
appearance: {
|
|
17793
|
+
background: {
|
|
17794
|
+
type: "surface",
|
|
17795
|
+
role: "link"
|
|
17796
|
+
},
|
|
17797
|
+
borderRadius: "rounded-md",
|
|
17798
|
+
border: { widthClass: "border-2" },
|
|
17799
|
+
effects: { hover: [{
|
|
17800
|
+
effectId: "background-on-hover",
|
|
17801
|
+
options: { colorToken: "surface" }
|
|
17802
|
+
}] }
|
|
17803
|
+
}
|
|
17048
17804
|
},
|
|
17049
|
-
{
|
|
17050
|
-
|
|
17051
|
-
|
|
17052
|
-
|
|
17053
|
-
|
|
17054
|
-
|
|
17055
|
-
type: "surface",
|
|
17056
|
-
role: "link"
|
|
17057
|
-
},
|
|
17058
|
-
borderRadius: "rounded-full",
|
|
17059
|
-
shadow: {
|
|
17060
|
-
elevation: "none",
|
|
17061
|
-
softness: null,
|
|
17062
|
-
position: "bottom"
|
|
17063
|
-
},
|
|
17064
|
-
sizes: {
|
|
17065
|
-
sm: {
|
|
17066
|
-
padding: "0.25rem 0",
|
|
17067
|
-
fontSize: "text-sm"
|
|
17805
|
+
ghost: {
|
|
17806
|
+
kind: "complete",
|
|
17807
|
+
appearance: {
|
|
17808
|
+
background: {
|
|
17809
|
+
type: "surface",
|
|
17810
|
+
role: "link"
|
|
17068
17811
|
},
|
|
17069
|
-
|
|
17070
|
-
|
|
17071
|
-
|
|
17072
|
-
|
|
17812
|
+
borderRadius: "rounded-none",
|
|
17813
|
+
sizes: {
|
|
17814
|
+
sm: {
|
|
17815
|
+
padding: "0.375rem 0",
|
|
17816
|
+
fontSize: "text-xs"
|
|
17817
|
+
},
|
|
17818
|
+
md: {
|
|
17819
|
+
padding: "0.5rem 0",
|
|
17820
|
+
fontSize: "text-sm"
|
|
17821
|
+
},
|
|
17822
|
+
lg: {
|
|
17823
|
+
padding: "0.625rem 0",
|
|
17824
|
+
fontSize: "text-base"
|
|
17825
|
+
},
|
|
17826
|
+
xl: {
|
|
17827
|
+
padding: "0.75rem 0",
|
|
17828
|
+
fontSize: "text-lg"
|
|
17829
|
+
}
|
|
17073
17830
|
},
|
|
17074
|
-
|
|
17075
|
-
|
|
17076
|
-
|
|
17077
|
-
|
|
17831
|
+
effects: { base: [{
|
|
17832
|
+
effectId: "border-bottom-grow",
|
|
17833
|
+
options: {
|
|
17834
|
+
height: 1,
|
|
17835
|
+
colorToken: "accent",
|
|
17836
|
+
origin: "left"
|
|
17837
|
+
}
|
|
17838
|
+
}] }
|
|
17078
17839
|
}
|
|
17079
|
-
}
|
|
17080
|
-
]
|
|
17081
|
-
}
|
|
17082
|
-
});
|
|
17083
|
-
//#endregion
|
|
17084
|
-
//#region ../theme-core/src/buttons/personalities/editorial-link.ts
|
|
17085
|
-
/**
|
|
17086
|
-
* Editorial Link — all variants are link-style with a growing underline.
|
|
17087
|
-
* Default for Warm Editorial and Quiet Luxury; reads as refined and quiet.
|
|
17088
|
-
*/
|
|
17089
|
-
const editorialLink = defineButtonPersonality({
|
|
17090
|
-
id: "editorial-link",
|
|
17091
|
-
name: "Editorial Link",
|
|
17092
|
-
description: "Link-style with a growing underline. Refined, typographic.",
|
|
17093
|
-
tags: {
|
|
17094
|
-
tone: "minimal",
|
|
17095
|
-
energy: "calm",
|
|
17096
|
-
motion: "subtle",
|
|
17097
|
-
era: "editorial"
|
|
17098
|
-
},
|
|
17099
|
-
buttonSystem: {
|
|
17100
|
-
global: {
|
|
17101
|
-
cornerStyle: "square",
|
|
17102
|
-
textTransform: "none",
|
|
17103
|
-
fontWeight: 500,
|
|
17104
|
-
borderWidth: 1,
|
|
17105
|
-
hoverTransform: "none",
|
|
17106
|
-
hoverColor: "none"
|
|
17107
|
-
},
|
|
17108
|
-
variants: [
|
|
17109
|
-
{
|
|
17110
|
-
id: "primary",
|
|
17111
|
-
name: "Primary",
|
|
17112
|
-
enabled: true,
|
|
17113
|
-
priority: 1,
|
|
17114
|
-
background: {
|
|
17115
|
-
type: "surface",
|
|
17116
|
-
role: "link"
|
|
17117
|
-
},
|
|
17118
|
-
borderRadius: "rounded-none",
|
|
17119
|
-
sizes: {
|
|
17120
|
-
sm: { padding: "0.25rem 0" },
|
|
17121
|
-
md: { padding: "0.5rem 0" },
|
|
17122
|
-
lg: { padding: "0.625rem 0" },
|
|
17123
|
-
xl: { padding: "0.75rem 0" }
|
|
17124
|
-
},
|
|
17125
|
-
effects: { base: [{
|
|
17126
|
-
effectId: "border-bottom-grow",
|
|
17127
|
-
options: {
|
|
17128
|
-
height: 2,
|
|
17129
|
-
colorToken: "text",
|
|
17130
|
-
origin: "left"
|
|
17131
|
-
}
|
|
17132
|
-
}] }
|
|
17133
|
-
},
|
|
17134
|
-
{
|
|
17135
|
-
id: "secondary",
|
|
17136
|
-
name: "Secondary",
|
|
17137
|
-
enabled: true,
|
|
17138
|
-
priority: 2,
|
|
17139
|
-
background: {
|
|
17140
|
-
type: "surface",
|
|
17141
|
-
role: "link"
|
|
17142
|
-
},
|
|
17143
|
-
borderRadius: "rounded-none",
|
|
17144
|
-
sizes: {
|
|
17145
|
-
sm: { padding: "0.25rem 0" },
|
|
17146
|
-
md: { padding: "0.5rem 0" },
|
|
17147
|
-
lg: { padding: "0.625rem 0" },
|
|
17148
|
-
xl: { padding: "0.75rem 0" }
|
|
17149
|
-
},
|
|
17150
|
-
effects: { base: [{
|
|
17151
|
-
effectId: "border-bottom-grow",
|
|
17152
|
-
options: {
|
|
17153
|
-
height: 1,
|
|
17154
|
-
colorToken: "mutedText",
|
|
17155
|
-
origin: "left"
|
|
17156
|
-
}
|
|
17157
|
-
}] }
|
|
17158
|
-
},
|
|
17159
|
-
{
|
|
17160
|
-
id: "outline",
|
|
17161
|
-
name: "Outline",
|
|
17162
|
-
enabled: true,
|
|
17163
|
-
priority: 3,
|
|
17164
|
-
background: {
|
|
17165
|
-
type: "surface",
|
|
17166
|
-
role: "link"
|
|
17167
|
-
},
|
|
17168
|
-
borderRadius: "rounded-none",
|
|
17169
|
-
sizes: {
|
|
17170
|
-
sm: { padding: "0.25rem 0" },
|
|
17171
|
-
md: { padding: "0.5rem 0" },
|
|
17172
|
-
lg: { padding: "0.625rem 0" },
|
|
17173
|
-
xl: { padding: "0.75rem 0" }
|
|
17174
|
-
},
|
|
17175
|
-
effects: { base: [{
|
|
17176
|
-
effectId: "border-bottom-grow",
|
|
17177
|
-
options: {
|
|
17178
|
-
height: 1,
|
|
17179
|
-
colorToken: "accent",
|
|
17180
|
-
origin: "left"
|
|
17181
|
-
}
|
|
17182
|
-
}] }
|
|
17183
17840
|
},
|
|
17184
|
-
{
|
|
17185
|
-
|
|
17186
|
-
|
|
17187
|
-
|
|
17188
|
-
|
|
17189
|
-
|
|
17190
|
-
|
|
17191
|
-
role: "link"
|
|
17192
|
-
},
|
|
17193
|
-
borderRadius: "rounded-none",
|
|
17194
|
-
sizes: {
|
|
17195
|
-
sm: { padding: "0.25rem 0" },
|
|
17196
|
-
md: { padding: "0.5rem 0" },
|
|
17197
|
-
lg: { padding: "0.625rem 0" },
|
|
17198
|
-
xl: { padding: "0.75rem 0" }
|
|
17199
|
-
}
|
|
17841
|
+
accent: {
|
|
17842
|
+
kind: "derive",
|
|
17843
|
+
from: "primary",
|
|
17844
|
+
overrides: { background: {
|
|
17845
|
+
type: "solid",
|
|
17846
|
+
colorToken: "accent"
|
|
17847
|
+
} }
|
|
17200
17848
|
}
|
|
17201
|
-
|
|
17849
|
+
}
|
|
17202
17850
|
}
|
|
17203
17851
|
});
|
|
17204
|
-
|
|
17205
|
-
//#region ../theme-core/src/buttons/personalities/flat-ink.ts
|
|
17206
|
-
/**
|
|
17207
|
-
* Flat Ink — a solid ink primary, a hairline ghost secondary, and a single
|
|
17208
|
-
* amber accent climax, all completely flat (no drop shadow) with a modest
|
|
17209
|
-
* radius. Reads as grounded, editorial and clinician-precise: the Fulcrum
|
|
17210
|
-
* physiotherapy voice. The primary shifts to the secondary (moss) on hover and
|
|
17211
|
-
* every variant lifts 2px; the amber accent is meant to be used sparingly as
|
|
17212
|
-
* the page's one conversion climax.
|
|
17213
|
-
*/
|
|
17214
|
-
const flatInk = defineButtonPersonality({
|
|
17852
|
+
const flatInkRecipe = defineStaticButtonStyleRecipe({
|
|
17215
17853
|
id: "flat-ink",
|
|
17216
|
-
|
|
17217
|
-
description: "Flat solid-ink primary, hairline ghost secondary, and a single amber accent climax — modest radius, no shadow.",
|
|
17854
|
+
accessibilityLabel: "Flat rounded buttons with arrow affordances",
|
|
17218
17855
|
tags: {
|
|
17219
17856
|
tone: "classic",
|
|
17220
17857
|
energy: "calm",
|
|
17221
17858
|
motion: "subtle",
|
|
17222
17859
|
era: "editorial"
|
|
17223
17860
|
},
|
|
17224
|
-
|
|
17861
|
+
system: {
|
|
17225
17862
|
global: {
|
|
17226
17863
|
cornerStyle: "rounded",
|
|
17227
17864
|
textTransform: "none",
|
|
@@ -17248,228 +17885,210 @@ const flatInk = defineButtonPersonality({
|
|
|
17248
17885
|
fontSize: "text-xl"
|
|
17249
17886
|
}
|
|
17250
17887
|
},
|
|
17251
|
-
|
|
17252
|
-
{
|
|
17253
|
-
|
|
17254
|
-
|
|
17255
|
-
|
|
17256
|
-
|
|
17257
|
-
|
|
17258
|
-
|
|
17259
|
-
|
|
17260
|
-
|
|
17261
|
-
|
|
17262
|
-
|
|
17263
|
-
|
|
17264
|
-
|
|
17265
|
-
|
|
17266
|
-
|
|
17267
|
-
|
|
17268
|
-
|
|
17269
|
-
}] }
|
|
17888
|
+
roles: {
|
|
17889
|
+
primary: {
|
|
17890
|
+
kind: "complete",
|
|
17891
|
+
appearance: {
|
|
17892
|
+
background: {
|
|
17893
|
+
type: "solid",
|
|
17894
|
+
colorToken: "primary"
|
|
17895
|
+
},
|
|
17896
|
+
borderRadius: "rounded-lg",
|
|
17897
|
+
affordance: { iconId: "ArrowRight" },
|
|
17898
|
+
effects: { hover: [{
|
|
17899
|
+
effectId: "lift",
|
|
17900
|
+
options: { translateY: "-2px" }
|
|
17901
|
+
}, {
|
|
17902
|
+
effectId: "background-on-hover",
|
|
17903
|
+
options: { colorToken: "secondary" }
|
|
17904
|
+
}] }
|
|
17905
|
+
}
|
|
17270
17906
|
},
|
|
17271
|
-
{
|
|
17272
|
-
|
|
17273
|
-
|
|
17274
|
-
|
|
17275
|
-
|
|
17276
|
-
|
|
17277
|
-
|
|
17278
|
-
|
|
17279
|
-
|
|
17280
|
-
|
|
17281
|
-
|
|
17282
|
-
|
|
17283
|
-
|
|
17284
|
-
|
|
17285
|
-
|
|
17286
|
-
|
|
17287
|
-
|
|
17288
|
-
}] }
|
|
17907
|
+
secondary: {
|
|
17908
|
+
kind: "complete",
|
|
17909
|
+
appearance: {
|
|
17910
|
+
background: {
|
|
17911
|
+
type: "surface",
|
|
17912
|
+
role: "link"
|
|
17913
|
+
},
|
|
17914
|
+
borderRadius: "rounded-lg",
|
|
17915
|
+
border: { widthClass: "border" },
|
|
17916
|
+
effects: { hover: [{
|
|
17917
|
+
effectId: "lift",
|
|
17918
|
+
options: { translateY: "-2px" }
|
|
17919
|
+
}, {
|
|
17920
|
+
effectId: "background-on-hover",
|
|
17921
|
+
options: { colorToken: "surfaceAlt" }
|
|
17922
|
+
}] }
|
|
17923
|
+
}
|
|
17289
17924
|
},
|
|
17290
|
-
{
|
|
17291
|
-
|
|
17292
|
-
|
|
17293
|
-
|
|
17294
|
-
|
|
17295
|
-
|
|
17296
|
-
|
|
17297
|
-
|
|
17298
|
-
|
|
17299
|
-
|
|
17300
|
-
|
|
17301
|
-
|
|
17302
|
-
|
|
17303
|
-
|
|
17304
|
-
|
|
17925
|
+
outline: {
|
|
17926
|
+
kind: "complete",
|
|
17927
|
+
appearance: {
|
|
17928
|
+
background: {
|
|
17929
|
+
type: "surface",
|
|
17930
|
+
role: "link"
|
|
17931
|
+
},
|
|
17932
|
+
borderRadius: "rounded-lg",
|
|
17933
|
+
border: { widthClass: "border" },
|
|
17934
|
+
effects: { hover: [{
|
|
17935
|
+
effectId: "lift",
|
|
17936
|
+
options: { translateY: "-2px" }
|
|
17937
|
+
}, {
|
|
17938
|
+
effectId: "background-on-hover",
|
|
17939
|
+
options: { colorToken: "surfaceAlt" }
|
|
17940
|
+
}] }
|
|
17941
|
+
}
|
|
17942
|
+
},
|
|
17943
|
+
ghost: {
|
|
17944
|
+
kind: "complete",
|
|
17945
|
+
appearance: {
|
|
17946
|
+
background: {
|
|
17947
|
+
type: "surface",
|
|
17948
|
+
role: "link"
|
|
17949
|
+
},
|
|
17950
|
+
borderRadius: "rounded-lg",
|
|
17951
|
+
effects: { hover: [{
|
|
17952
|
+
effectId: "lift",
|
|
17953
|
+
options: { translateY: "-2px" }
|
|
17954
|
+
}] }
|
|
17955
|
+
}
|
|
17956
|
+
},
|
|
17957
|
+
accent: {
|
|
17958
|
+
kind: "complete",
|
|
17959
|
+
appearance: {
|
|
17960
|
+
background: {
|
|
17961
|
+
type: "solid",
|
|
17962
|
+
colorToken: "accent"
|
|
17963
|
+
},
|
|
17964
|
+
borderRadius: "rounded-lg",
|
|
17965
|
+
affordance: { iconId: "ArrowRight" },
|
|
17966
|
+
effects: { hover: [{
|
|
17967
|
+
effectId: "lift",
|
|
17968
|
+
options: { translateY: "-2px" }
|
|
17969
|
+
}] }
|
|
17970
|
+
}
|
|
17305
17971
|
}
|
|
17306
|
-
|
|
17972
|
+
}
|
|
17307
17973
|
}
|
|
17308
17974
|
});
|
|
17309
|
-
|
|
17310
|
-
|
|
17311
|
-
|
|
17312
|
-
* Ink Stamp — solid earthy fills with a bordered, hand-stamped block-print
|
|
17313
|
-
* feel. Reads as bold and handmade; suits expressive craft brands.
|
|
17314
|
-
*/
|
|
17315
|
-
const inkStamp = defineButtonPersonality({
|
|
17316
|
-
id: "ink-stamp",
|
|
17317
|
-
name: "Ink Stamp",
|
|
17318
|
-
description: "Hand-stamped block-print buttons with a slight lift on hover.",
|
|
17975
|
+
const showtimePillRecipe = defineStaticButtonStyleRecipe({
|
|
17976
|
+
id: "showtime-pill",
|
|
17977
|
+
accessibilityLabel: "Bold uppercase pill buttons with playful movement",
|
|
17319
17978
|
tags: {
|
|
17320
17979
|
tone: "bold",
|
|
17321
17980
|
energy: "vibrant",
|
|
17322
|
-
motion: "
|
|
17323
|
-
era: "
|
|
17981
|
+
motion: "expressive",
|
|
17982
|
+
era: "modern"
|
|
17324
17983
|
},
|
|
17325
|
-
|
|
17984
|
+
system: {
|
|
17326
17985
|
global: {
|
|
17327
|
-
cornerStyle: "
|
|
17986
|
+
cornerStyle: "pill",
|
|
17987
|
+
shadow: "low",
|
|
17328
17988
|
textTransform: "uppercase",
|
|
17329
|
-
fontWeight:
|
|
17330
|
-
borderWidth:
|
|
17331
|
-
hoverTransform: "
|
|
17332
|
-
hoverColor: "
|
|
17333
|
-
|
|
17989
|
+
fontWeight: 700,
|
|
17990
|
+
borderWidth: 2,
|
|
17991
|
+
hoverTransform: "lift",
|
|
17992
|
+
hoverColor: "darken",
|
|
17993
|
+
typography: "body",
|
|
17994
|
+
paddingPreset: "spacious",
|
|
17995
|
+
italic: false
|
|
17334
17996
|
},
|
|
17335
17997
|
sizes: {
|
|
17336
17998
|
sm: {
|
|
17337
|
-
padding: "0.
|
|
17338
|
-
fontSize: "
|
|
17999
|
+
padding: "0.625rem 1.25rem",
|
|
18000
|
+
fontSize: "0.875rem"
|
|
17339
18001
|
},
|
|
17340
18002
|
md: {
|
|
17341
|
-
padding: "0.
|
|
17342
|
-
fontSize: "
|
|
18003
|
+
padding: "0.875rem 1.75rem",
|
|
18004
|
+
fontSize: "1rem"
|
|
17343
18005
|
},
|
|
17344
18006
|
lg: {
|
|
17345
|
-
padding: "
|
|
17346
|
-
fontSize: "
|
|
18007
|
+
padding: "1.125rem 2.25rem",
|
|
18008
|
+
fontSize: "1.125rem"
|
|
17347
18009
|
},
|
|
17348
18010
|
xl: {
|
|
17349
|
-
padding: "1.125rem 2.
|
|
17350
|
-
fontSize: "
|
|
18011
|
+
padding: "1.125rem 2.25rem",
|
|
18012
|
+
fontSize: "1.125rem"
|
|
17351
18013
|
}
|
|
17352
18014
|
},
|
|
17353
|
-
|
|
17354
|
-
{
|
|
17355
|
-
|
|
17356
|
-
|
|
17357
|
-
|
|
17358
|
-
|
|
17359
|
-
|
|
17360
|
-
|
|
17361
|
-
|
|
17362
|
-
|
|
17363
|
-
borderRadius: "rounded-md",
|
|
17364
|
-
effects: {
|
|
17365
|
-
hover: [{
|
|
17366
|
-
effectId: "drop-shadow",
|
|
17367
|
-
options: { intensity: "medium" }
|
|
17368
|
-
}, {
|
|
17369
|
-
effectId: "scale-up",
|
|
17370
|
-
options: { scale: "1.02" }
|
|
17371
|
-
}],
|
|
17372
|
-
active: [{
|
|
17373
|
-
effectId: "scale-down",
|
|
17374
|
-
options: { scale: "0.98" }
|
|
17375
|
-
}]
|
|
18015
|
+
roles: {
|
|
18016
|
+
primary: {
|
|
18017
|
+
kind: "complete",
|
|
18018
|
+
appearance: {
|
|
18019
|
+
background: {
|
|
18020
|
+
type: "solid",
|
|
18021
|
+
colorToken: "primary"
|
|
18022
|
+
},
|
|
18023
|
+
borderRadius: "rounded-full",
|
|
18024
|
+
effects: { hover: [{ effectId: "pop" }] }
|
|
17376
18025
|
}
|
|
17377
18026
|
},
|
|
17378
|
-
{
|
|
17379
|
-
|
|
17380
|
-
|
|
17381
|
-
|
|
17382
|
-
|
|
17383
|
-
|
|
17384
|
-
|
|
17385
|
-
|
|
17386
|
-
|
|
17387
|
-
|
|
17388
|
-
|
|
17389
|
-
effects: { hover: [{
|
|
17390
|
-
effectId: "background-on-hover",
|
|
17391
|
-
options: { colorToken: "surface" }
|
|
17392
|
-
}] }
|
|
17393
|
-
},
|
|
17394
|
-
{
|
|
17395
|
-
id: "outline",
|
|
17396
|
-
name: "Outline",
|
|
17397
|
-
enabled: true,
|
|
17398
|
-
priority: 3,
|
|
17399
|
-
background: {
|
|
17400
|
-
type: "surface",
|
|
17401
|
-
role: "link"
|
|
17402
|
-
},
|
|
17403
|
-
borderRadius: "rounded-md",
|
|
17404
|
-
border: { widthClass: "border-2" },
|
|
17405
|
-
effects: { hover: [{
|
|
17406
|
-
effectId: "background-on-hover",
|
|
17407
|
-
options: { colorToken: "surface" }
|
|
17408
|
-
}] }
|
|
18027
|
+
secondary: {
|
|
18028
|
+
kind: "complete",
|
|
18029
|
+
appearance: {
|
|
18030
|
+
background: {
|
|
18031
|
+
type: "surface",
|
|
18032
|
+
role: "link"
|
|
18033
|
+
},
|
|
18034
|
+
borderRadius: "rounded-full",
|
|
18035
|
+
border: { widthClass: "border-2" },
|
|
18036
|
+
effects: { hover: [{ effectId: "pop" }] }
|
|
18037
|
+
}
|
|
17409
18038
|
},
|
|
17410
|
-
{
|
|
17411
|
-
|
|
17412
|
-
|
|
17413
|
-
|
|
17414
|
-
|
|
17415
|
-
|
|
17416
|
-
type: "surface",
|
|
17417
|
-
role: "link"
|
|
17418
|
-
},
|
|
17419
|
-
borderRadius: "rounded-none",
|
|
17420
|
-
sizes: {
|
|
17421
|
-
sm: {
|
|
17422
|
-
padding: "0.375rem 0",
|
|
17423
|
-
fontSize: "text-xs"
|
|
18039
|
+
outline: {
|
|
18040
|
+
kind: "complete",
|
|
18041
|
+
appearance: {
|
|
18042
|
+
background: {
|
|
18043
|
+
type: "surface",
|
|
18044
|
+
role: "link"
|
|
17424
18045
|
},
|
|
17425
|
-
|
|
17426
|
-
|
|
17427
|
-
|
|
18046
|
+
borderRadius: "rounded-full",
|
|
18047
|
+
border: { widthClass: "border-2" },
|
|
18048
|
+
effects: { hover: [{
|
|
18049
|
+
effectId: "background-on-hover",
|
|
18050
|
+
options: { colorToken: "background" }
|
|
18051
|
+
}] }
|
|
18052
|
+
}
|
|
18053
|
+
},
|
|
18054
|
+
ghost: {
|
|
18055
|
+
kind: "complete",
|
|
18056
|
+
appearance: {
|
|
18057
|
+
background: {
|
|
18058
|
+
type: "surface",
|
|
18059
|
+
role: "link"
|
|
17428
18060
|
},
|
|
17429
|
-
|
|
17430
|
-
|
|
17431
|
-
|
|
18061
|
+
borderRadius: "rounded-full",
|
|
18062
|
+
effects: { hover: [{
|
|
18063
|
+
effectId: "background-on-hover",
|
|
18064
|
+
options: { colorToken: "surface" }
|
|
18065
|
+
}] }
|
|
18066
|
+
}
|
|
18067
|
+
},
|
|
18068
|
+
accent: {
|
|
18069
|
+
kind: "complete",
|
|
18070
|
+
appearance: {
|
|
18071
|
+
background: {
|
|
18072
|
+
type: "solid",
|
|
18073
|
+
colorToken: "secondary"
|
|
17432
18074
|
},
|
|
17433
|
-
|
|
17434
|
-
|
|
17435
|
-
|
|
17436
|
-
}
|
|
17437
|
-
},
|
|
17438
|
-
effects: { base: [{
|
|
17439
|
-
effectId: "border-bottom-grow",
|
|
17440
|
-
options: {
|
|
17441
|
-
height: 1,
|
|
17442
|
-
colorToken: "accent",
|
|
17443
|
-
origin: "left"
|
|
17444
|
-
}
|
|
17445
|
-
}] }
|
|
18075
|
+
borderRadius: "rounded-full",
|
|
18076
|
+
effects: { hover: [{ effectId: "pop" }] }
|
|
18077
|
+
}
|
|
17446
18078
|
}
|
|
17447
|
-
|
|
18079
|
+
}
|
|
17448
18080
|
}
|
|
17449
18081
|
});
|
|
17450
|
-
|
|
17451
|
-
//#region ../theme-core/src/buttons/personalities/joy-stamp.ts
|
|
17452
|
-
/**
|
|
17453
|
-
* Joy Stamp — neo-brutalist pills with a hard, brand-coloured offset shadow
|
|
17454
|
-
* that collapses as the button presses into it on hover. Authored for the
|
|
17455
|
-
* Original Joy site style: a cream "stamp" shadow under the solid primary, and
|
|
17456
|
-
* a brown shadow under the cream outline. Reads as bold, warm, and handmade.
|
|
17457
|
-
*
|
|
17458
|
-
* The coloured offset shadow relies on the per-variant `shadow.colorToken`
|
|
17459
|
-
* extension; the press is the shared `press-down` effect, which matches its
|
|
17460
|
-
* translate to each variant's own shadow offset.
|
|
17461
|
-
*/
|
|
17462
|
-
const joyStamp = defineButtonPersonality({
|
|
18082
|
+
const joyStampRecipe = defineStaticButtonStyleRecipe({
|
|
17463
18083
|
id: "joy-stamp",
|
|
17464
|
-
|
|
17465
|
-
description: "Pill buttons with a hard, brand-coloured offset shadow that presses in on hover.",
|
|
18084
|
+
accessibilityLabel: "Bold pill buttons with a hard offset shadow",
|
|
17466
18085
|
tags: {
|
|
17467
18086
|
tone: "bold",
|
|
17468
18087
|
energy: "vibrant",
|
|
17469
18088
|
motion: "expressive",
|
|
17470
18089
|
era: "organic"
|
|
17471
18090
|
},
|
|
17472
|
-
|
|
18091
|
+
system: {
|
|
17473
18092
|
global: {
|
|
17474
18093
|
cornerStyle: "pill",
|
|
17475
18094
|
shadow: "high",
|
|
@@ -17499,61 +18118,78 @@ const joyStamp = defineButtonPersonality({
|
|
|
17499
18118
|
fontSize: "text-2xl"
|
|
17500
18119
|
}
|
|
17501
18120
|
},
|
|
17502
|
-
|
|
17503
|
-
|
|
17504
|
-
|
|
17505
|
-
|
|
17506
|
-
|
|
17507
|
-
|
|
17508
|
-
|
|
17509
|
-
|
|
18121
|
+
roles: {
|
|
18122
|
+
primary: {
|
|
18123
|
+
kind: "complete",
|
|
18124
|
+
appearance: {
|
|
18125
|
+
background: {
|
|
18126
|
+
type: "solid",
|
|
18127
|
+
colorToken: "primary"
|
|
18128
|
+
},
|
|
18129
|
+
borderRadius: "rounded-full",
|
|
18130
|
+
shadow: {
|
|
18131
|
+
elevation: "high",
|
|
18132
|
+
softness: "hard",
|
|
18133
|
+
position: "bottom-right",
|
|
18134
|
+
colorToken: "text"
|
|
18135
|
+
},
|
|
18136
|
+
effects: { hover: [{ effectId: "press-down" }] }
|
|
18137
|
+
}
|
|
17510
18138
|
},
|
|
17511
|
-
|
|
17512
|
-
|
|
17513
|
-
|
|
17514
|
-
|
|
17515
|
-
|
|
17516
|
-
|
|
18139
|
+
secondary: {
|
|
18140
|
+
kind: "complete",
|
|
18141
|
+
appearance: {
|
|
18142
|
+
background: {
|
|
18143
|
+
type: "surface",
|
|
18144
|
+
role: "link"
|
|
18145
|
+
},
|
|
18146
|
+
borderRadius: "rounded-full",
|
|
18147
|
+
border: { widthClass: "border-2" },
|
|
18148
|
+
shadow: {
|
|
18149
|
+
elevation: "high",
|
|
18150
|
+
softness: "hard",
|
|
18151
|
+
position: "bottom-right",
|
|
18152
|
+
colorToken: "secondary"
|
|
18153
|
+
},
|
|
18154
|
+
effects: { hover: [{ effectId: "press-down" }] }
|
|
18155
|
+
}
|
|
17517
18156
|
},
|
|
17518
|
-
|
|
17519
|
-
|
|
17520
|
-
|
|
17521
|
-
name: "Secondary",
|
|
17522
|
-
enabled: true,
|
|
17523
|
-
priority: 2,
|
|
17524
|
-
background: {
|
|
17525
|
-
type: "surface",
|
|
17526
|
-
role: "link"
|
|
18157
|
+
outline: {
|
|
18158
|
+
kind: "derive",
|
|
18159
|
+
from: "secondary"
|
|
17527
18160
|
},
|
|
17528
|
-
|
|
17529
|
-
|
|
17530
|
-
|
|
17531
|
-
|
|
17532
|
-
|
|
17533
|
-
|
|
17534
|
-
|
|
18161
|
+
ghost: {
|
|
18162
|
+
kind: "complete",
|
|
18163
|
+
appearance: {
|
|
18164
|
+
background: {
|
|
18165
|
+
type: "surface",
|
|
18166
|
+
role: "link"
|
|
18167
|
+
},
|
|
18168
|
+
borderRadius: "rounded-full",
|
|
18169
|
+
effects: { hover: [{ effectId: "press-down" }] }
|
|
18170
|
+
}
|
|
17535
18171
|
},
|
|
17536
|
-
|
|
17537
|
-
|
|
18172
|
+
accent: {
|
|
18173
|
+
kind: "derive",
|
|
18174
|
+
from: "primary",
|
|
18175
|
+
overrides: { background: {
|
|
18176
|
+
type: "solid",
|
|
18177
|
+
colorToken: "accent"
|
|
18178
|
+
} }
|
|
18179
|
+
}
|
|
18180
|
+
}
|
|
17538
18181
|
}
|
|
17539
18182
|
});
|
|
17540
|
-
|
|
17541
|
-
//#region ../theme-core/src/buttons/personalities/ornate-ritual.ts
|
|
17542
|
-
/**
|
|
17543
|
-
* Ornate Ritual — framed, ceremonial buttons with jewel-toned fills and
|
|
17544
|
-
* deliberate spacing. Designed for music, ceremony, and soulful event sites.
|
|
17545
|
-
*/
|
|
17546
|
-
const ornateRitual = defineButtonPersonality({
|
|
18183
|
+
const ornateRitualRecipe = defineStaticButtonStyleRecipe({
|
|
17547
18184
|
id: "ornate-ritual",
|
|
17548
|
-
|
|
17549
|
-
description: "Ceremonial framed buttons with jewel-toned fills and quiet color-change hover states.",
|
|
18185
|
+
accessibilityLabel: "Uppercase framed buttons with restrained movement",
|
|
17550
18186
|
tags: {
|
|
17551
18187
|
tone: "classic",
|
|
17552
18188
|
energy: "vibrant",
|
|
17553
18189
|
motion: "subtle",
|
|
17554
18190
|
era: "organic"
|
|
17555
18191
|
},
|
|
17556
|
-
|
|
18192
|
+
system: {
|
|
17557
18193
|
global: {
|
|
17558
18194
|
cornerStyle: "rounded",
|
|
17559
18195
|
textTransform: "uppercase",
|
|
@@ -17581,622 +18217,150 @@ const ornateRitual = defineButtonPersonality({
|
|
|
17581
18217
|
fontSize: "text-base"
|
|
17582
18218
|
}
|
|
17583
18219
|
},
|
|
17584
|
-
|
|
17585
|
-
{
|
|
17586
|
-
|
|
17587
|
-
|
|
17588
|
-
|
|
17589
|
-
|
|
17590
|
-
|
|
17591
|
-
type: "solid",
|
|
17592
|
-
colorToken: "primary"
|
|
17593
|
-
},
|
|
17594
|
-
borderRadius: "rounded-md",
|
|
17595
|
-
border: { widthClass: "border" },
|
|
17596
|
-
effects: {
|
|
17597
|
-
hover: [{
|
|
17598
|
-
effectId: "background-on-hover",
|
|
17599
|
-
options: { colorToken: "primary-100" }
|
|
17600
|
-
}],
|
|
17601
|
-
active: [{
|
|
17602
|
-
effectId: "scale-down",
|
|
17603
|
-
options: { scale: "0.98" }
|
|
17604
|
-
}]
|
|
17605
|
-
}
|
|
17606
|
-
},
|
|
17607
|
-
{
|
|
17608
|
-
id: "secondary",
|
|
17609
|
-
name: "Secondary",
|
|
17610
|
-
enabled: true,
|
|
17611
|
-
priority: 2,
|
|
17612
|
-
background: {
|
|
17613
|
-
type: "solid",
|
|
17614
|
-
colorToken: "secondary"
|
|
17615
|
-
},
|
|
17616
|
-
borderRadius: "rounded-md",
|
|
17617
|
-
border: { widthClass: "border" },
|
|
17618
|
-
effects: { hover: [{
|
|
17619
|
-
effectId: "background-on-hover",
|
|
17620
|
-
options: { colorToken: "surface" }
|
|
17621
|
-
}] }
|
|
17622
|
-
},
|
|
17623
|
-
{
|
|
17624
|
-
id: "outline",
|
|
17625
|
-
name: "Outline",
|
|
17626
|
-
enabled: true,
|
|
17627
|
-
priority: 3,
|
|
17628
|
-
background: {
|
|
17629
|
-
type: "surface",
|
|
17630
|
-
role: "link"
|
|
17631
|
-
},
|
|
17632
|
-
borderRadius: "rounded-md",
|
|
17633
|
-
border: { widthClass: "border" },
|
|
17634
|
-
effects: { hover: [{
|
|
17635
|
-
effectId: "background-on-hover",
|
|
17636
|
-
options: { colorToken: "muted" }
|
|
17637
|
-
}] }
|
|
17638
|
-
},
|
|
17639
|
-
{
|
|
17640
|
-
id: "ghost",
|
|
17641
|
-
name: "Ghost",
|
|
17642
|
-
enabled: true,
|
|
17643
|
-
priority: 3,
|
|
17644
|
-
background: {
|
|
17645
|
-
type: "surface",
|
|
17646
|
-
role: "link"
|
|
17647
|
-
},
|
|
17648
|
-
borderRadius: "rounded-none",
|
|
17649
|
-
sizes: {
|
|
17650
|
-
sm: {
|
|
17651
|
-
padding: "0.375rem 0",
|
|
17652
|
-
fontSize: "text-xs"
|
|
17653
|
-
},
|
|
17654
|
-
md: {
|
|
17655
|
-
padding: "0.5rem 0",
|
|
17656
|
-
fontSize: "text-sm"
|
|
17657
|
-
},
|
|
17658
|
-
lg: {
|
|
17659
|
-
padding: "0.625rem 0",
|
|
17660
|
-
fontSize: "text-base"
|
|
18220
|
+
roles: {
|
|
18221
|
+
primary: {
|
|
18222
|
+
kind: "complete",
|
|
18223
|
+
appearance: {
|
|
18224
|
+
background: {
|
|
18225
|
+
type: "solid",
|
|
18226
|
+
colorToken: "primary"
|
|
17661
18227
|
},
|
|
17662
|
-
|
|
17663
|
-
|
|
17664
|
-
|
|
17665
|
-
|
|
17666
|
-
|
|
17667
|
-
|
|
17668
|
-
|
|
17669
|
-
|
|
17670
|
-
|
|
17671
|
-
|
|
17672
|
-
|
|
18228
|
+
borderRadius: "rounded-md",
|
|
18229
|
+
border: { widthClass: "border" },
|
|
18230
|
+
effects: {
|
|
18231
|
+
hover: [{
|
|
18232
|
+
effectId: "background-on-hover",
|
|
18233
|
+
options: { colorToken: "primary-100" }
|
|
18234
|
+
}],
|
|
18235
|
+
active: [{
|
|
18236
|
+
effectId: "scale-down",
|
|
18237
|
+
options: { scale: "0.98" }
|
|
18238
|
+
}]
|
|
17673
18239
|
}
|
|
17674
|
-
}
|
|
17675
|
-
}
|
|
17676
|
-
]
|
|
17677
|
-
}
|
|
17678
|
-
});
|
|
17679
|
-
//#endregion
|
|
17680
|
-
//#region ../theme-core/src/buttons/personalities/pebble.ts
|
|
17681
|
-
/**
|
|
17682
|
-
* Pebble — large pill primaries with generous padding. Reads as spa-luxurious
|
|
17683
|
-
* and natural; pairs well with wellness/yoga/dance brands.
|
|
17684
|
-
*/
|
|
17685
|
-
const pebble = defineButtonPersonality({
|
|
17686
|
-
id: "pebble",
|
|
17687
|
-
name: "Pebble",
|
|
17688
|
-
description: "Generous pill buttons with a quiet colour-softening hover.",
|
|
17689
|
-
tags: {
|
|
17690
|
-
tone: "classic",
|
|
17691
|
-
energy: "calm",
|
|
17692
|
-
motion: "standard",
|
|
17693
|
-
era: "organic"
|
|
17694
|
-
},
|
|
17695
|
-
buttonSystem: {
|
|
17696
|
-
global: {
|
|
17697
|
-
cornerStyle: "pill",
|
|
17698
|
-
textTransform: "none",
|
|
17699
|
-
fontWeight: 500,
|
|
17700
|
-
borderWidth: 2,
|
|
17701
|
-
hoverTransform: "none",
|
|
17702
|
-
hoverColor: "none"
|
|
17703
|
-
},
|
|
17704
|
-
sizes: {
|
|
17705
|
-
sm: {
|
|
17706
|
-
padding: "0.625rem 1.75rem",
|
|
17707
|
-
fontSize: "text-sm"
|
|
17708
|
-
},
|
|
17709
|
-
md: { padding: "0.875rem 2.25rem" },
|
|
17710
|
-
lg: {
|
|
17711
|
-
padding: "1.125rem 2.75rem",
|
|
17712
|
-
fontSize: "text-lg"
|
|
17713
|
-
},
|
|
17714
|
-
xl: {
|
|
17715
|
-
padding: "1.5rem 3.5rem",
|
|
17716
|
-
fontSize: "text-xl"
|
|
17717
|
-
}
|
|
17718
|
-
},
|
|
17719
|
-
variants: [
|
|
17720
|
-
{
|
|
17721
|
-
id: "primary",
|
|
17722
|
-
name: "Primary",
|
|
17723
|
-
enabled: true,
|
|
17724
|
-
priority: 1,
|
|
17725
|
-
background: {
|
|
17726
|
-
type: "solid",
|
|
17727
|
-
colorToken: "primary"
|
|
17728
|
-
},
|
|
17729
|
-
borderRadius: "rounded-full",
|
|
17730
|
-
effects: { hover: [{
|
|
17731
|
-
effectId: "darken-background",
|
|
17732
|
-
options: { amount: 100 }
|
|
17733
|
-
}] }
|
|
18240
|
+
}
|
|
17734
18241
|
},
|
|
17735
|
-
{
|
|
17736
|
-
|
|
17737
|
-
|
|
17738
|
-
|
|
17739
|
-
|
|
17740
|
-
|
|
17741
|
-
|
|
17742
|
-
|
|
17743
|
-
|
|
17744
|
-
|
|
17745
|
-
|
|
17746
|
-
|
|
17747
|
-
|
|
17748
|
-
|
|
17749
|
-
}] }
|
|
18242
|
+
secondary: {
|
|
18243
|
+
kind: "complete",
|
|
18244
|
+
appearance: {
|
|
18245
|
+
background: {
|
|
18246
|
+
type: "solid",
|
|
18247
|
+
colorToken: "secondary"
|
|
18248
|
+
},
|
|
18249
|
+
borderRadius: "rounded-md",
|
|
18250
|
+
border: { widthClass: "border" },
|
|
18251
|
+
effects: { hover: [{
|
|
18252
|
+
effectId: "background-on-hover",
|
|
18253
|
+
options: { colorToken: "surface" }
|
|
18254
|
+
}] }
|
|
18255
|
+
}
|
|
17750
18256
|
},
|
|
17751
|
-
{
|
|
17752
|
-
|
|
17753
|
-
|
|
17754
|
-
|
|
17755
|
-
|
|
17756
|
-
|
|
17757
|
-
|
|
17758
|
-
|
|
17759
|
-
|
|
17760
|
-
|
|
17761
|
-
|
|
17762
|
-
|
|
17763
|
-
|
|
17764
|
-
|
|
17765
|
-
}] }
|
|
18257
|
+
outline: {
|
|
18258
|
+
kind: "complete",
|
|
18259
|
+
appearance: {
|
|
18260
|
+
background: {
|
|
18261
|
+
type: "surface",
|
|
18262
|
+
role: "link"
|
|
18263
|
+
},
|
|
18264
|
+
borderRadius: "rounded-md",
|
|
18265
|
+
border: { widthClass: "border" },
|
|
18266
|
+
effects: { hover: [{
|
|
18267
|
+
effectId: "background-on-hover",
|
|
18268
|
+
options: { colorToken: "muted" }
|
|
18269
|
+
}] }
|
|
18270
|
+
}
|
|
17766
18271
|
},
|
|
17767
|
-
{
|
|
17768
|
-
|
|
17769
|
-
|
|
17770
|
-
|
|
17771
|
-
|
|
17772
|
-
|
|
17773
|
-
type: "surface",
|
|
17774
|
-
role: "link"
|
|
17775
|
-
},
|
|
17776
|
-
borderRadius: "rounded-full",
|
|
17777
|
-
sizes: {
|
|
17778
|
-
sm: {
|
|
17779
|
-
padding: "0.375rem 0.875rem",
|
|
17780
|
-
fontSize: "text-sm"
|
|
18272
|
+
ghost: {
|
|
18273
|
+
kind: "complete",
|
|
18274
|
+
appearance: {
|
|
18275
|
+
background: {
|
|
18276
|
+
type: "surface",
|
|
18277
|
+
role: "link"
|
|
17781
18278
|
},
|
|
17782
|
-
|
|
17783
|
-
|
|
17784
|
-
|
|
17785
|
-
|
|
18279
|
+
borderRadius: "rounded-none",
|
|
18280
|
+
sizes: {
|
|
18281
|
+
sm: {
|
|
18282
|
+
padding: "0.375rem 0",
|
|
18283
|
+
fontSize: "text-xs"
|
|
18284
|
+
},
|
|
18285
|
+
md: {
|
|
18286
|
+
padding: "0.5rem 0",
|
|
18287
|
+
fontSize: "text-sm"
|
|
18288
|
+
},
|
|
18289
|
+
lg: {
|
|
18290
|
+
padding: "0.625rem 0",
|
|
18291
|
+
fontSize: "text-base"
|
|
18292
|
+
},
|
|
18293
|
+
xl: {
|
|
18294
|
+
padding: "0.75rem 0",
|
|
18295
|
+
fontSize: "text-lg"
|
|
18296
|
+
}
|
|
17786
18297
|
},
|
|
17787
|
-
|
|
17788
|
-
|
|
17789
|
-
|
|
17790
|
-
|
|
18298
|
+
effects: { base: [{
|
|
18299
|
+
effectId: "border-bottom-grow",
|
|
18300
|
+
options: {
|
|
18301
|
+
height: 1,
|
|
18302
|
+
colorToken: "accent",
|
|
18303
|
+
origin: "left"
|
|
18304
|
+
}
|
|
18305
|
+
}] }
|
|
17791
18306
|
}
|
|
17792
|
-
}
|
|
17793
|
-
]
|
|
17794
|
-
}
|
|
17795
|
-
});
|
|
17796
|
-
//#endregion
|
|
17797
|
-
//#region ../theme-core/src/buttons/personalities/quiet-arrow.ts
|
|
17798
|
-
/**
|
|
17799
|
-
* Quiet Arrow — wide, flat editorial buttons for grounded service businesses.
|
|
17800
|
-
* Primary and secondary keep stable semantic colours; surrounding surfaces are
|
|
17801
|
-
* responsible for contrast rather than reversing the button roles.
|
|
17802
|
-
*/
|
|
17803
|
-
const quietArrow = defineButtonPersonality({
|
|
17804
|
-
id: "quiet-arrow",
|
|
17805
|
-
name: "Quiet Arrow",
|
|
17806
|
-
description: "Wide, flat arrow buttons with a solid primary and a primary-colour outlined secondary.",
|
|
17807
|
-
tags: {
|
|
17808
|
-
tone: "classic",
|
|
17809
|
-
energy: "calm",
|
|
17810
|
-
motion: "subtle",
|
|
17811
|
-
era: "editorial"
|
|
17812
|
-
},
|
|
17813
|
-
buttonSystem: {
|
|
17814
|
-
global: {
|
|
17815
|
-
cornerStyle: "rounded",
|
|
17816
|
-
textTransform: "uppercase",
|
|
17817
|
-
fontWeight: 500,
|
|
17818
|
-
borderWidth: 1,
|
|
17819
|
-
typography: "body",
|
|
17820
|
-
fontSize: "text-sm",
|
|
17821
|
-
letterSpacing: "loose",
|
|
17822
|
-
hoverTransform: "none",
|
|
17823
|
-
hoverColor: "none"
|
|
17824
|
-
},
|
|
17825
|
-
sizes: {
|
|
17826
|
-
sm: {
|
|
17827
|
-
padding: "0.625rem 1.25rem",
|
|
17828
|
-
fontSize: "text-xs"
|
|
17829
|
-
},
|
|
17830
|
-
md: {
|
|
17831
|
-
padding: "0.8125rem 1.75rem",
|
|
17832
|
-
fontSize: "text-sm"
|
|
17833
18307
|
},
|
|
17834
|
-
|
|
17835
|
-
|
|
17836
|
-
|
|
17837
|
-
|
|
17838
|
-
xl: {
|
|
17839
|
-
padding: "1.0625rem 2.5rem",
|
|
17840
|
-
fontSize: "text-base"
|
|
17841
|
-
}
|
|
17842
|
-
},
|
|
17843
|
-
variants: [
|
|
17844
|
-
{
|
|
17845
|
-
id: "primary",
|
|
17846
|
-
name: "Primary",
|
|
17847
|
-
enabled: true,
|
|
17848
|
-
priority: 1,
|
|
17849
|
-
background: {
|
|
17850
|
-
type: "solid",
|
|
17851
|
-
colorToken: "primary"
|
|
17852
|
-
},
|
|
17853
|
-
borderRadius: "rounded-xl",
|
|
17854
|
-
affordance: { iconId: "ArrowRight" },
|
|
17855
|
-
effects: { hover: [{
|
|
17856
|
-
effectId: "darken-background",
|
|
17857
|
-
options: { amount: 100 }
|
|
17858
|
-
}] }
|
|
17859
|
-
},
|
|
17860
|
-
{
|
|
17861
|
-
id: "secondary",
|
|
17862
|
-
name: "Secondary",
|
|
17863
|
-
enabled: true,
|
|
17864
|
-
priority: 2,
|
|
17865
|
-
background: {
|
|
17866
|
-
type: "surface",
|
|
17867
|
-
role: "link"
|
|
17868
|
-
},
|
|
17869
|
-
borderRadius: "rounded-xl",
|
|
17870
|
-
border: { widthClass: "border" },
|
|
17871
|
-
affordance: { iconId: "ArrowRight" },
|
|
17872
|
-
effects: { hover: [{
|
|
17873
|
-
effectId: "background-on-hover",
|
|
17874
|
-
options: { colorToken: "surfaceAlt" }
|
|
17875
|
-
}] }
|
|
17876
|
-
},
|
|
17877
|
-
{
|
|
17878
|
-
id: "outline",
|
|
17879
|
-
name: "Outline",
|
|
17880
|
-
enabled: true,
|
|
17881
|
-
priority: 3,
|
|
17882
|
-
background: {
|
|
17883
|
-
type: "surface",
|
|
17884
|
-
role: "link"
|
|
17885
|
-
},
|
|
17886
|
-
borderRadius: "rounded-xl",
|
|
17887
|
-
border: { widthClass: "border" }
|
|
17888
|
-
},
|
|
17889
|
-
{
|
|
17890
|
-
id: "ghost",
|
|
17891
|
-
name: "Ghost",
|
|
17892
|
-
enabled: true,
|
|
17893
|
-
priority: 3,
|
|
17894
|
-
background: {
|
|
17895
|
-
type: "surface",
|
|
17896
|
-
role: "link"
|
|
17897
|
-
},
|
|
17898
|
-
borderRadius: "rounded-xl"
|
|
17899
|
-
}
|
|
17900
|
-
]
|
|
17901
|
-
}
|
|
17902
|
-
});
|
|
17903
|
-
//#endregion
|
|
17904
|
-
//#region ../theme-core/src/buttons/personalities/showtime-pill.ts
|
|
17905
|
-
/**
|
|
17906
|
-
* Showtime Pill — bold, spacious, fully rounded buttons with playful pop
|
|
17907
|
-
* motion. Suits energetic schools, performers, festivals, and community brands
|
|
17908
|
-
* that need calls to action to feel loud without becoming visually chaotic.
|
|
17909
|
-
*/
|
|
17910
|
-
const showtimePill = defineButtonPersonality({
|
|
17911
|
-
id: "showtime-pill",
|
|
17912
|
-
name: "Showtime Pill",
|
|
17913
|
-
description: "Bold pill buttons with uppercase labels, generous padding, and a playful pop.",
|
|
17914
|
-
tags: {
|
|
17915
|
-
tone: "bold",
|
|
17916
|
-
energy: "vibrant",
|
|
17917
|
-
motion: "expressive",
|
|
17918
|
-
era: "modern"
|
|
17919
|
-
},
|
|
17920
|
-
buttonSystem: {
|
|
17921
|
-
global: {
|
|
17922
|
-
cornerStyle: "pill",
|
|
17923
|
-
shadow: "low",
|
|
17924
|
-
textTransform: "uppercase",
|
|
17925
|
-
fontWeight: 700,
|
|
17926
|
-
borderWidth: 2,
|
|
17927
|
-
hoverTransform: "lift",
|
|
17928
|
-
hoverColor: "darken",
|
|
17929
|
-
typography: "body",
|
|
17930
|
-
paddingPreset: "spacious",
|
|
17931
|
-
italic: false
|
|
17932
|
-
},
|
|
17933
|
-
sizes: {
|
|
17934
|
-
sm: {
|
|
17935
|
-
padding: "0.625rem 1.25rem",
|
|
17936
|
-
fontSize: "0.875rem"
|
|
17937
|
-
},
|
|
17938
|
-
md: {
|
|
17939
|
-
padding: "0.875rem 1.75rem",
|
|
17940
|
-
fontSize: "1rem"
|
|
17941
|
-
},
|
|
17942
|
-
lg: {
|
|
17943
|
-
padding: "1.125rem 2.25rem",
|
|
17944
|
-
fontSize: "1.125rem"
|
|
17945
|
-
},
|
|
17946
|
-
xl: {
|
|
17947
|
-
padding: "1.125rem 2.25rem",
|
|
17948
|
-
fontSize: "1.125rem"
|
|
17949
|
-
}
|
|
17950
|
-
},
|
|
17951
|
-
variants: [
|
|
17952
|
-
{
|
|
17953
|
-
id: "primary",
|
|
17954
|
-
name: "Primary",
|
|
17955
|
-
enabled: true,
|
|
17956
|
-
priority: 1,
|
|
17957
|
-
background: {
|
|
17958
|
-
type: "solid",
|
|
17959
|
-
colorToken: "primary"
|
|
17960
|
-
},
|
|
17961
|
-
borderRadius: "rounded-full",
|
|
17962
|
-
effects: { hover: [{ effectId: "pop" }] }
|
|
17963
|
-
},
|
|
17964
|
-
{
|
|
17965
|
-
id: "secondary",
|
|
17966
|
-
name: "Secondary",
|
|
17967
|
-
enabled: true,
|
|
17968
|
-
priority: 2,
|
|
17969
|
-
background: {
|
|
17970
|
-
type: "surface",
|
|
17971
|
-
role: "link"
|
|
17972
|
-
},
|
|
17973
|
-
borderRadius: "rounded-full",
|
|
17974
|
-
border: { widthClass: "border-2" },
|
|
17975
|
-
effects: { hover: [{ effectId: "pop" }] }
|
|
17976
|
-
},
|
|
17977
|
-
{
|
|
17978
|
-
id: "hero",
|
|
17979
|
-
name: "Hero",
|
|
17980
|
-
enabled: true,
|
|
17981
|
-
priority: 1,
|
|
17982
|
-
background: {
|
|
17983
|
-
type: "solid",
|
|
17984
|
-
colorToken: "secondary"
|
|
17985
|
-
},
|
|
17986
|
-
borderRadius: "rounded-full",
|
|
17987
|
-
effects: { hover: [{ effectId: "pop" }] }
|
|
17988
|
-
},
|
|
17989
|
-
{
|
|
17990
|
-
id: "header",
|
|
17991
|
-
name: "Header",
|
|
17992
|
-
enabled: true,
|
|
17993
|
-
priority: 2,
|
|
17994
|
-
background: {
|
|
18308
|
+
accent: {
|
|
18309
|
+
kind: "derive",
|
|
18310
|
+
from: "primary",
|
|
18311
|
+
overrides: { background: {
|
|
17995
18312
|
type: "solid",
|
|
17996
|
-
colorToken: "
|
|
17997
|
-
}
|
|
17998
|
-
borderRadius: "rounded-full",
|
|
17999
|
-
border: { widthClass: "border-2" },
|
|
18000
|
-
effects: { hover: [{
|
|
18001
|
-
effectId: "background-on-hover",
|
|
18002
|
-
options: { colorToken: "surface" }
|
|
18003
|
-
}] }
|
|
18004
|
-
},
|
|
18005
|
-
{
|
|
18006
|
-
id: "outline",
|
|
18007
|
-
name: "Outline",
|
|
18008
|
-
enabled: true,
|
|
18009
|
-
priority: 3,
|
|
18010
|
-
background: {
|
|
18011
|
-
type: "surface",
|
|
18012
|
-
role: "link"
|
|
18013
|
-
},
|
|
18014
|
-
borderRadius: "rounded-full",
|
|
18015
|
-
border: { widthClass: "border-2" },
|
|
18016
|
-
effects: { hover: [{
|
|
18017
|
-
effectId: "background-on-hover",
|
|
18018
|
-
options: { colorToken: "background" }
|
|
18019
|
-
}] }
|
|
18020
|
-
},
|
|
18021
|
-
{
|
|
18022
|
-
id: "ghost",
|
|
18023
|
-
name: "Ghost",
|
|
18024
|
-
enabled: true,
|
|
18025
|
-
priority: 3,
|
|
18026
|
-
background: {
|
|
18027
|
-
type: "surface",
|
|
18028
|
-
role: "link"
|
|
18029
|
-
},
|
|
18030
|
-
borderRadius: "rounded-full",
|
|
18031
|
-
effects: { hover: [{
|
|
18032
|
-
effectId: "background-on-hover",
|
|
18033
|
-
options: { colorToken: "surface" }
|
|
18034
|
-
}] }
|
|
18035
|
-
}
|
|
18036
|
-
]
|
|
18037
|
-
}
|
|
18038
|
-
});
|
|
18039
|
-
//#endregion
|
|
18040
|
-
//#region ../theme-core/src/buttons/personalities/soft-pill.ts
|
|
18041
|
-
/**
|
|
18042
|
-
* Soft Pill — rounded-full pill buttons with a hover lift. The default for
|
|
18043
|
-
* Calm Studio and Modern Wellness; reads as quietly modern and welcoming.
|
|
18044
|
-
*/
|
|
18045
|
-
const softPill = defineButtonPersonality({
|
|
18046
|
-
id: "soft-pill",
|
|
18047
|
-
name: "Soft Pill",
|
|
18048
|
-
description: "Rounded pills with a gentle lift on hover. Quietly modern.",
|
|
18049
|
-
tags: {
|
|
18050
|
-
tone: "classic",
|
|
18051
|
-
energy: "calm",
|
|
18052
|
-
motion: "subtle",
|
|
18053
|
-
era: "organic"
|
|
18054
|
-
},
|
|
18055
|
-
buttonSystem: {
|
|
18056
|
-
global: {
|
|
18057
|
-
cornerStyle: "pill",
|
|
18058
|
-
shadow: "low",
|
|
18059
|
-
textTransform: "none",
|
|
18060
|
-
fontWeight: 500,
|
|
18061
|
-
borderWidth: 2,
|
|
18062
|
-
hoverTransform: "lift",
|
|
18063
|
-
hoverColor: "none"
|
|
18064
|
-
},
|
|
18065
|
-
variants: [
|
|
18066
|
-
{
|
|
18067
|
-
id: "primary",
|
|
18068
|
-
name: "Primary",
|
|
18069
|
-
enabled: true,
|
|
18070
|
-
priority: 1,
|
|
18071
|
-
background: {
|
|
18072
|
-
type: "solid",
|
|
18073
|
-
colorToken: "primary"
|
|
18074
|
-
},
|
|
18075
|
-
borderRadius: "rounded-full",
|
|
18076
|
-
shadow: {
|
|
18077
|
-
elevation: "low",
|
|
18078
|
-
softness: "soft",
|
|
18079
|
-
position: "bottom"
|
|
18080
|
-
},
|
|
18081
|
-
effects: {
|
|
18082
|
-
hover: [{
|
|
18083
|
-
effectId: "lift",
|
|
18084
|
-
options: { translateY: "-1px" }
|
|
18085
|
-
}],
|
|
18086
|
-
active: [{
|
|
18087
|
-
effectId: "scale-down",
|
|
18088
|
-
options: { scale: "0.98" }
|
|
18089
|
-
}]
|
|
18090
|
-
}
|
|
18091
|
-
},
|
|
18092
|
-
{
|
|
18093
|
-
id: "secondary",
|
|
18094
|
-
name: "Secondary",
|
|
18095
|
-
enabled: true,
|
|
18096
|
-
priority: 2,
|
|
18097
|
-
background: {
|
|
18098
|
-
type: "surface",
|
|
18099
|
-
role: "link"
|
|
18100
|
-
},
|
|
18101
|
-
borderRadius: "rounded-full",
|
|
18102
|
-
border: { widthClass: "border-2" },
|
|
18103
|
-
effects: { hover: [{
|
|
18104
|
-
effectId: "background-on-hover",
|
|
18105
|
-
options: { colorToken: "surface" }
|
|
18106
|
-
}] }
|
|
18107
|
-
},
|
|
18108
|
-
{
|
|
18109
|
-
id: "outline",
|
|
18110
|
-
name: "Outline",
|
|
18111
|
-
enabled: true,
|
|
18112
|
-
priority: 3,
|
|
18113
|
-
background: {
|
|
18114
|
-
type: "surface",
|
|
18115
|
-
role: "link"
|
|
18116
|
-
},
|
|
18117
|
-
borderRadius: "rounded-full",
|
|
18118
|
-
border: { widthClass: "border" },
|
|
18119
|
-
effects: { hover: [{
|
|
18120
|
-
effectId: "background-on-hover",
|
|
18121
|
-
options: { colorToken: "surface" }
|
|
18122
|
-
}] }
|
|
18123
|
-
},
|
|
18124
|
-
{
|
|
18125
|
-
id: "ghost",
|
|
18126
|
-
name: "Ghost",
|
|
18127
|
-
enabled: true,
|
|
18128
|
-
priority: 3,
|
|
18129
|
-
background: {
|
|
18130
|
-
type: "surface",
|
|
18131
|
-
role: "link"
|
|
18132
|
-
},
|
|
18133
|
-
borderRadius: "rounded-full",
|
|
18134
|
-
effects: { hover: [{
|
|
18135
|
-
effectId: "background-on-hover",
|
|
18136
|
-
options: { colorToken: "surface" }
|
|
18137
|
-
}] }
|
|
18313
|
+
colorToken: "accent"
|
|
18314
|
+
} }
|
|
18138
18315
|
}
|
|
18139
|
-
|
|
18316
|
+
}
|
|
18140
18317
|
}
|
|
18141
18318
|
});
|
|
18142
18319
|
//#endregion
|
|
18143
|
-
//#region ../theme-core/src/buttons/
|
|
18144
|
-
const
|
|
18145
|
-
|
|
18146
|
-
|
|
18147
|
-
|
|
18148
|
-
|
|
18149
|
-
|
|
18150
|
-
|
|
18151
|
-
|
|
18152
|
-
|
|
18153
|
-
|
|
18154
|
-
|
|
18155
|
-
|
|
18156
|
-
|
|
18157
|
-
position: "bottom"
|
|
18158
|
-
},
|
|
18159
|
-
effects: {
|
|
18160
|
-
hover: [{
|
|
18161
|
-
effectId: "background-on-hover-alpha",
|
|
18162
|
-
options: {
|
|
18163
|
-
colorToken: "secondary",
|
|
18164
|
-
opacity: 88
|
|
18165
|
-
}
|
|
18166
|
-
}],
|
|
18167
|
-
active: [{
|
|
18168
|
-
effectId: "scale-down",
|
|
18169
|
-
options: { scale: "0.98" }
|
|
18170
|
-
}]
|
|
18171
|
-
}
|
|
18172
|
-
};
|
|
18173
|
-
//#endregion
|
|
18174
|
-
//#region ../theme-core/src/buttons/personalities/index.ts
|
|
18175
|
-
const buttonPersonalities = [
|
|
18176
|
-
softPill,
|
|
18177
|
-
defineButtonPersonality({
|
|
18178
|
-
id: "two-tone-pill",
|
|
18179
|
-
name: "Two-tone Pill",
|
|
18180
|
-
description: "Rounded pills with distinct solid primary and secondary brand colours.",
|
|
18181
|
-
tags: softPill.tags,
|
|
18182
|
-
buttonSystem: {
|
|
18183
|
-
...softPill.buttonSystem,
|
|
18184
|
-
variants: softPill.buttonSystem.variants.map((variant) => variant.id === "secondary" ? solidSecondary : variant)
|
|
18185
|
-
}
|
|
18186
|
-
}),
|
|
18187
|
-
earthPill,
|
|
18188
|
-
confidentChip,
|
|
18189
|
-
editorialLink,
|
|
18190
|
-
pebble,
|
|
18191
|
-
inkStamp,
|
|
18192
|
-
flatInk,
|
|
18193
|
-
brushedWash,
|
|
18194
|
-
showtimePill,
|
|
18195
|
-
joyStamp,
|
|
18196
|
-
ornateRitual,
|
|
18197
|
-
quietArrow
|
|
18320
|
+
//#region ../theme-core/src/buttons/styles/registry.ts
|
|
18321
|
+
const buttonStyleRecipes = [
|
|
18322
|
+
softPillRecipe,
|
|
18323
|
+
earthPillRecipe,
|
|
18324
|
+
confidentChipRecipe,
|
|
18325
|
+
editorialLinkRecipe,
|
|
18326
|
+
pebbleRecipe,
|
|
18327
|
+
inkStampRecipe,
|
|
18328
|
+
flatInkRecipe,
|
|
18329
|
+
brushedWashRecipe,
|
|
18330
|
+
showtimePillRecipe,
|
|
18331
|
+
joyStampRecipe,
|
|
18332
|
+
ornateRitualRecipe,
|
|
18333
|
+
quietArrowRecipe
|
|
18198
18334
|
];
|
|
18199
|
-
new Map(
|
|
18335
|
+
const recipesById = new Map(buttonStyleRecipes.map((recipe) => [recipe.id, recipe]));
|
|
18336
|
+
function findButtonStyleRecipe(id) {
|
|
18337
|
+
const recipe = recipesById.get(id);
|
|
18338
|
+
if (recipe === void 0) throw new Error(`Button style registry is missing known style ${id}`);
|
|
18339
|
+
return recipe;
|
|
18340
|
+
}
|
|
18341
|
+
function resolveButtonStyleSelection(selection) {
|
|
18342
|
+
switch (selection.styleId) {
|
|
18343
|
+
case "soft-pill": return resolveButtonStyleRecipe(softPillRecipe, selection.parameters);
|
|
18344
|
+
case "earth-pill": return resolveButtonStyleRecipe(earthPillRecipe, selection.parameters);
|
|
18345
|
+
case "confident-chip": return resolveButtonStyleRecipe(confidentChipRecipe, selection.parameters);
|
|
18346
|
+
case "editorial-link": return resolveButtonStyleRecipe(editorialLinkRecipe, selection.parameters);
|
|
18347
|
+
case "pebble": return resolveButtonStyleRecipe(pebbleRecipe, selection.parameters);
|
|
18348
|
+
case "ink-stamp": return resolveButtonStyleRecipe(inkStampRecipe, selection.parameters);
|
|
18349
|
+
case "flat-ink": return resolveButtonStyleRecipe(flatInkRecipe, selection.parameters);
|
|
18350
|
+
case "brushed-wash": return resolveButtonStyleRecipe(brushedWashRecipe, selection.parameters);
|
|
18351
|
+
case "showtime-pill": return resolveButtonStyleRecipe(showtimePillRecipe, selection.parameters);
|
|
18352
|
+
case "joy-stamp": return resolveButtonStyleRecipe(joyStampRecipe, selection.parameters);
|
|
18353
|
+
case "ornate-ritual": return resolveButtonStyleRecipe(ornateRitualRecipe, selection.parameters);
|
|
18354
|
+
case "quiet-arrow": return resolveButtonStyleRecipe(quietArrowRecipe, selection.parameters);
|
|
18355
|
+
}
|
|
18356
|
+
}
|
|
18357
|
+
function defaultButtonStyleSelectionFor(styleId) {
|
|
18358
|
+
return {
|
|
18359
|
+
styleId,
|
|
18360
|
+
parameters: findButtonStyleRecipe(styleId).defaultParameters
|
|
18361
|
+
};
|
|
18362
|
+
}
|
|
18363
|
+
if (buttonStyleRecipes.map((recipe) => recipe.id).length !== BUTTON_STYLE_IDS.length || BUTTON_STYLE_IDS.some((id) => !recipesById.has(id))) throw new Error("Button style registry and ButtonStyleId catalog are out of sync");
|
|
18200
18364
|
//#endregion
|
|
18201
18365
|
//#region ../theme-core/src/accordions/siteStyleDefaults.ts
|
|
18202
18366
|
/**
|
|
@@ -19957,76 +20121,9 @@ function headerConfigurationKey(configuration) {
|
|
|
19957
20121
|
function asFooterLookId(value) {
|
|
19958
20122
|
return value;
|
|
19959
20123
|
}
|
|
19960
|
-
function
|
|
19961
|
-
return value;
|
|
19962
|
-
}
|
|
19963
|
-
function asFooterStyleId(value) {
|
|
19964
|
-
return value;
|
|
19965
|
-
}
|
|
19966
|
-
const footerLayoutCatalog = defineExactCatalog()([
|
|
19967
|
-
{
|
|
19968
|
-
id: asFooterLayoutId("identity"),
|
|
19969
|
-
label: "Identity",
|
|
19970
|
-
description: "Logo, site text, address, and legal copy without relying on footer navigation."
|
|
19971
|
-
},
|
|
19972
|
-
{
|
|
19973
|
-
id: asFooterLayoutId("centered"),
|
|
19974
|
-
label: "Centered",
|
|
19975
|
-
description: "A calm centered stack for identity, short copy, and optional compact navigation.",
|
|
19976
|
-
maxRecommendedNavDensity: "sparse"
|
|
19977
|
-
},
|
|
19978
|
-
{
|
|
19979
|
-
id: asFooterLayoutId("split"),
|
|
19980
|
-
label: "Split",
|
|
19981
|
-
description: "Navigation and brand signoff separated into a wider split footer.",
|
|
19982
|
-
requiresFooterNav: true,
|
|
19983
|
-
maxRecommendedNavDensity: "balanced"
|
|
19984
|
-
},
|
|
19985
|
-
{
|
|
19986
|
-
id: asFooterLayoutId("columns"),
|
|
19987
|
-
label: "Columns",
|
|
19988
|
-
description: "Grouped footer navigation columns with a supporting bottom line.",
|
|
19989
|
-
requiresFooterNav: true,
|
|
19990
|
-
requiresFooterNavGroups: true
|
|
19991
|
-
}
|
|
19992
|
-
]);
|
|
19993
|
-
const footerStyleCatalog = defineExactCatalog()([
|
|
19994
|
-
{
|
|
19995
|
-
id: asFooterStyleId("quiet"),
|
|
19996
|
-
label: "Quiet",
|
|
19997
|
-
description: "Lightweight, practical footer treatment."
|
|
19998
|
-
},
|
|
19999
|
-
{
|
|
20000
|
-
id: asFooterStyleId("calm"),
|
|
20001
|
-
label: "Calm",
|
|
20002
|
-
description: "Soft centered treatment with restrained dividers."
|
|
20003
|
-
},
|
|
20004
|
-
{
|
|
20005
|
-
id: asFooterStyleId("editorial"),
|
|
20006
|
-
label: "Editorial",
|
|
20007
|
-
description: "Text-forward treatment with fine-line structure."
|
|
20008
|
-
},
|
|
20009
|
-
{
|
|
20010
|
-
id: asFooterStyleId("brand-band"),
|
|
20011
|
-
label: "Brand band",
|
|
20012
|
-
description: "High-contrast brand treatment with a stronger bottom bar."
|
|
20013
|
-
}
|
|
20014
|
-
]);
|
|
20015
|
-
new Map(footerLayoutCatalog.map((layout) => [layout.id, layout]));
|
|
20016
|
-
new Map(footerStyleCatalog.map((style) => [style.id, style]));
|
|
20017
|
-
/**
|
|
20018
|
-
* No-nav-safe identity footer: brand and legal/supporting copy carry the
|
|
20019
|
-
* footer without implying missing navigation.
|
|
20020
|
-
*/
|
|
20021
|
-
function identityQuietFooter(theme) {
|
|
20124
|
+
function quietFooterLinks(theme) {
|
|
20022
20125
|
return {
|
|
20023
20126
|
...theme.footer,
|
|
20024
|
-
variant: "simple",
|
|
20025
|
-
maxWidth: "container",
|
|
20026
|
-
background: {
|
|
20027
|
-
type: "color",
|
|
20028
|
-
color: "surface"
|
|
20029
|
-
},
|
|
20030
20127
|
navStyle: "minimal",
|
|
20031
20128
|
navWeight: "regular",
|
|
20032
20129
|
navColor: "text",
|
|
@@ -20039,285 +20136,38 @@ function identityQuietFooter(theme) {
|
|
|
20039
20136
|
hoverColorToken: "primary",
|
|
20040
20137
|
padding: "none",
|
|
20041
20138
|
borderRadius: "none"
|
|
20042
|
-
},
|
|
20043
|
-
navLayout: {
|
|
20044
|
-
layout: "inline-wrap",
|
|
20045
|
-
align: "start",
|
|
20046
|
-
gapX: "default",
|
|
20047
|
-
gapY: "tight"
|
|
20048
|
-
},
|
|
20049
|
-
logo: {
|
|
20050
|
-
showLogo: true,
|
|
20051
|
-
showLogoText: true,
|
|
20052
|
-
placement: "left",
|
|
20053
|
-
size: "sm",
|
|
20054
|
-
align: "start"
|
|
20055
|
-
},
|
|
20056
|
-
bottomBar: {
|
|
20057
|
-
enabled: false,
|
|
20058
|
-
fullBleed: false,
|
|
20059
|
-
textAlign: "left",
|
|
20060
|
-
paddingX: "default",
|
|
20061
|
-
paddingY: "compact",
|
|
20062
|
-
borderTop: { width: "none" }
|
|
20063
20139
|
}
|
|
20064
20140
|
};
|
|
20065
20141
|
}
|
|
20066
|
-
|
|
20067
|
-
* Back-compat alias for the previous default footer Look. It keeps existing
|
|
20068
|
-
* persisted selections valid while staying hidden from the new layout/style UI.
|
|
20069
|
-
*/
|
|
20070
|
-
function mutedGroundingFooter(theme) {
|
|
20071
|
-
return {
|
|
20072
|
-
...identityQuietFooter(theme),
|
|
20073
|
-
background: theme.footer.background,
|
|
20074
|
-
navStyle: theme.footer.navStyle,
|
|
20075
|
-
navColor: theme.footer.navColor,
|
|
20076
|
-
navWeight: theme.footer.navWeight,
|
|
20077
|
-
navLinkStyle: theme.footer.navLinkStyle,
|
|
20078
|
-
bottomTextLinkStyle: theme.footer.bottomTextLinkStyle
|
|
20079
|
-
};
|
|
20080
|
-
}
|
|
20081
|
-
/** Applies a high-contrast brand band with a darker full-bleed bottom bar. */
|
|
20082
|
-
function brandTwoBandFooter(theme) {
|
|
20142
|
+
function emphasizedFooterLinks(theme) {
|
|
20083
20143
|
return {
|
|
20084
20144
|
...theme.footer,
|
|
20085
|
-
variant: "split",
|
|
20086
|
-
maxWidth: "container",
|
|
20087
|
-
background: {
|
|
20088
|
-
type: "color",
|
|
20089
|
-
color: "primary-800"
|
|
20090
|
-
},
|
|
20091
20145
|
navStyle: "minimal",
|
|
20092
20146
|
navWeight: "medium",
|
|
20093
|
-
navColor: "primaryForeground",
|
|
20094
|
-
navLinkStyle: {
|
|
20095
|
-
typography: "body",
|
|
20096
|
-
fontWeight: "medium",
|
|
20097
|
-
textTransform: "none",
|
|
20098
|
-
italic: false,
|
|
20099
|
-
colorToken: "primaryForeground",
|
|
20100
|
-
hoverColorToken: "secondary",
|
|
20101
|
-
padding: "none",
|
|
20102
|
-
borderRadius: "none"
|
|
20103
|
-
},
|
|
20104
|
-
bottomTextLinkStyle: {
|
|
20105
|
-
colorToken: "secondary",
|
|
20106
|
-
decorationColorToken: "secondary"
|
|
20107
|
-
},
|
|
20108
|
-
navLayout: {
|
|
20109
|
-
layout: "inline-wrap",
|
|
20110
|
-
align: "start",
|
|
20111
|
-
gapX: "default",
|
|
20112
|
-
gapY: "tight"
|
|
20113
|
-
},
|
|
20114
|
-
logo: {
|
|
20115
|
-
showLogo: true,
|
|
20116
|
-
showLogoText: false,
|
|
20117
|
-
placement: "left",
|
|
20118
|
-
size: "sm",
|
|
20119
|
-
align: "start"
|
|
20120
|
-
},
|
|
20121
|
-
bottomBar: {
|
|
20122
|
-
enabled: true,
|
|
20123
|
-
fullBleed: true,
|
|
20124
|
-
background: {
|
|
20125
|
-
type: "color",
|
|
20126
|
-
color: "primary-900"
|
|
20127
|
-
},
|
|
20128
|
-
textColor: "primaryForeground",
|
|
20129
|
-
textAlign: "center",
|
|
20130
|
-
paddingX: "default",
|
|
20131
|
-
paddingY: "compact",
|
|
20132
|
-
borderTop: { width: "none" }
|
|
20133
|
-
}
|
|
20134
|
-
};
|
|
20135
|
-
}
|
|
20136
|
-
/**
|
|
20137
|
-
* Centered stack on a softly tinted band: logo, inline nav, address, and a
|
|
20138
|
-
* hairline-topped copyright line, all centered.
|
|
20139
|
-
*/
|
|
20140
|
-
function centeredCalmFooter(theme) {
|
|
20141
|
-
return {
|
|
20142
|
-
...theme.footer,
|
|
20143
|
-
variant: "simple",
|
|
20144
|
-
maxWidth: "container",
|
|
20145
|
-
background: {
|
|
20146
|
-
type: "color",
|
|
20147
|
-
color: "surfaceAlt"
|
|
20148
|
-
},
|
|
20149
|
-
navStyle: "minimal",
|
|
20150
|
-
navWeight: "regular",
|
|
20151
|
-
navColor: "text",
|
|
20152
|
-
navLinkStyle: {
|
|
20153
|
-
typography: "body",
|
|
20154
|
-
fontWeight: "regular",
|
|
20155
|
-
textTransform: "none",
|
|
20156
|
-
italic: false,
|
|
20157
|
-
colorToken: "text",
|
|
20158
|
-
hoverColorToken: "primary",
|
|
20159
|
-
padding: "none",
|
|
20160
|
-
borderRadius: "none"
|
|
20161
|
-
},
|
|
20162
|
-
navLayout: {
|
|
20163
|
-
layout: "inline-wrap",
|
|
20164
|
-
align: "center",
|
|
20165
|
-
gapX: "relaxed",
|
|
20166
|
-
gapY: "tight"
|
|
20167
|
-
},
|
|
20168
|
-
logo: {
|
|
20169
|
-
showLogo: true,
|
|
20170
|
-
showLogoText: false,
|
|
20171
|
-
placement: "above",
|
|
20172
|
-
size: "sm",
|
|
20173
|
-
align: "center"
|
|
20174
|
-
},
|
|
20175
|
-
bottomBar: {
|
|
20176
|
-
enabled: true,
|
|
20177
|
-
fullBleed: false,
|
|
20178
|
-
textAlign: "center",
|
|
20179
|
-
paddingX: "default",
|
|
20180
|
-
paddingY: "compact",
|
|
20181
|
-
borderTop: { width: "thin" }
|
|
20182
|
-
}
|
|
20183
|
-
};
|
|
20184
|
-
}
|
|
20185
|
-
/** Editorial split footer: compact nav on one side, brand signoff on the other. */
|
|
20186
|
-
function splitEditorialFooter(theme) {
|
|
20187
|
-
return {
|
|
20188
|
-
...theme.footer,
|
|
20189
|
-
variant: "split",
|
|
20190
|
-
maxWidth: "container",
|
|
20191
|
-
background: {
|
|
20192
|
-
type: "color",
|
|
20193
|
-
color: "surface"
|
|
20194
|
-
},
|
|
20195
|
-
navStyle: "minimal",
|
|
20196
|
-
navWeight: "regular",
|
|
20197
|
-
navColor: "text",
|
|
20198
|
-
navLinkStyle: {
|
|
20199
|
-
typography: "body",
|
|
20200
|
-
fontWeight: "regular",
|
|
20201
|
-
textTransform: "none",
|
|
20202
|
-
italic: false,
|
|
20203
|
-
colorToken: "text",
|
|
20204
|
-
hoverColorToken: "primary",
|
|
20205
|
-
padding: "none",
|
|
20206
|
-
borderRadius: "none"
|
|
20207
|
-
},
|
|
20208
|
-
navLayout: {
|
|
20209
|
-
layout: "inline-wrap",
|
|
20210
|
-
align: "start",
|
|
20211
|
-
gapX: "relaxed",
|
|
20212
|
-
gapY: "tight"
|
|
20213
|
-
},
|
|
20214
|
-
logo: {
|
|
20215
|
-
showLogo: true,
|
|
20216
|
-
showLogoText: true,
|
|
20217
|
-
placement: "right",
|
|
20218
|
-
size: "sm",
|
|
20219
|
-
align: "end"
|
|
20220
|
-
},
|
|
20221
|
-
bottomBar: {
|
|
20222
|
-
enabled: true,
|
|
20223
|
-
fullBleed: false,
|
|
20224
|
-
textAlign: "left",
|
|
20225
|
-
paddingX: "default",
|
|
20226
|
-
paddingY: "compact",
|
|
20227
|
-
borderTop: { width: "thin" }
|
|
20228
|
-
}
|
|
20229
|
-
};
|
|
20230
|
-
}
|
|
20231
|
-
/**
|
|
20232
|
-
* Editorial columns: site name and supporting copy on the left, inline nav on
|
|
20233
|
-
* the right, with a hairline-topped bottom line. Uses the footer block's
|
|
20234
|
-
* columns layout.
|
|
20235
|
-
*/
|
|
20236
|
-
function editorialColumnsFooter(theme) {
|
|
20237
|
-
return {
|
|
20238
|
-
...theme.footer,
|
|
20239
|
-
variant: "columns",
|
|
20240
|
-
maxWidth: "container",
|
|
20241
|
-
background: {
|
|
20242
|
-
type: "color",
|
|
20243
|
-
color: "surface"
|
|
20244
|
-
},
|
|
20245
|
-
navStyle: "minimal",
|
|
20246
|
-
navWeight: "regular",
|
|
20247
20147
|
navColor: "text",
|
|
20248
20148
|
navLinkStyle: {
|
|
20249
20149
|
typography: "body",
|
|
20250
|
-
fontWeight: "
|
|
20150
|
+
fontWeight: "medium",
|
|
20251
20151
|
textTransform: "none",
|
|
20252
20152
|
italic: false,
|
|
20253
20153
|
colorToken: "text",
|
|
20254
20154
|
hoverColorToken: "primary",
|
|
20255
20155
|
padding: "none",
|
|
20256
20156
|
borderRadius: "none"
|
|
20257
|
-
},
|
|
20258
|
-
logo: {
|
|
20259
|
-
showLogo: true,
|
|
20260
|
-
showLogoText: true,
|
|
20261
|
-
placement: "left",
|
|
20262
|
-
size: "sm",
|
|
20263
|
-
align: "start"
|
|
20264
|
-
},
|
|
20265
|
-
bottomBar: {
|
|
20266
|
-
enabled: true,
|
|
20267
|
-
fullBleed: false,
|
|
20268
|
-
textAlign: "center",
|
|
20269
|
-
paddingX: "default",
|
|
20270
|
-
paddingY: "compact",
|
|
20271
|
-
borderTop: { width: "thin" }
|
|
20272
20157
|
}
|
|
20273
20158
|
};
|
|
20274
20159
|
}
|
|
20275
|
-
const footerLookCatalog = defineExactCatalog()([
|
|
20276
|
-
|
|
20277
|
-
|
|
20278
|
-
|
|
20279
|
-
|
|
20280
|
-
|
|
20281
|
-
|
|
20282
|
-
|
|
20283
|
-
|
|
20284
|
-
|
|
20285
|
-
|
|
20286
|
-
layoutId: asFooterLayoutId("identity"),
|
|
20287
|
-
styleId: asFooterStyleId("quiet"),
|
|
20288
|
-
hiddenFromLayoutStyleControls: true,
|
|
20289
|
-
compile: mutedGroundingFooter
|
|
20290
|
-
},
|
|
20291
|
-
{
|
|
20292
|
-
id: asFooterLookId("footer-centered-calm"),
|
|
20293
|
-
label: "Centered calm footer",
|
|
20294
|
-
layoutId: asFooterLayoutId("centered"),
|
|
20295
|
-
styleId: asFooterStyleId("calm"),
|
|
20296
|
-
compile: centeredCalmFooter
|
|
20297
|
-
},
|
|
20298
|
-
{
|
|
20299
|
-
id: asFooterLookId("footer-split-editorial"),
|
|
20300
|
-
label: "Split editorial footer",
|
|
20301
|
-
layoutId: asFooterLayoutId("split"),
|
|
20302
|
-
styleId: asFooterStyleId("editorial"),
|
|
20303
|
-
compile: splitEditorialFooter
|
|
20304
|
-
},
|
|
20305
|
-
{
|
|
20306
|
-
id: asFooterLookId("footer-editorial-columns"),
|
|
20307
|
-
label: "Editorial columns footer",
|
|
20308
|
-
layoutId: asFooterLayoutId("columns"),
|
|
20309
|
-
styleId: asFooterStyleId("editorial"),
|
|
20310
|
-
compile: editorialColumnsFooter
|
|
20311
|
-
},
|
|
20312
|
-
{
|
|
20313
|
-
id: asFooterLookId("site-footer-brand-two-band"),
|
|
20314
|
-
label: "Two-band brand footer",
|
|
20315
|
-
layoutId: asFooterLayoutId("split"),
|
|
20316
|
-
styleId: asFooterStyleId("brand-band"),
|
|
20317
|
-
allowedContentPresence: ["default-footer", "default-and-blocks"],
|
|
20318
|
-
compile: brandTwoBandFooter
|
|
20319
|
-
}
|
|
20320
|
-
]);
|
|
20160
|
+
const footerLookCatalog = defineExactCatalog()([{
|
|
20161
|
+
id: asFooterLookId("footer-links-quiet"),
|
|
20162
|
+
label: "Quiet links",
|
|
20163
|
+
description: "Regular-weight footer navigation with a restrained hover.",
|
|
20164
|
+
compile: quietFooterLinks
|
|
20165
|
+
}, {
|
|
20166
|
+
id: asFooterLookId("footer-links-emphasized"),
|
|
20167
|
+
label: "Emphasized links",
|
|
20168
|
+
description: "Medium-weight footer navigation with a clearer emphasis.",
|
|
20169
|
+
compile: emphasizedFooterLinks
|
|
20170
|
+
}]);
|
|
20321
20171
|
new Map(footerLookCatalog.map((look) => [look.id, look]));
|
|
20322
20172
|
//#endregion
|
|
20323
20173
|
//#region ../theme-core/src/site-styles/sourceCatalogs.ts
|
|
@@ -23381,23 +23231,27 @@ function resolveBoxShadow(variant, global, theme, tokens) {
|
|
|
23381
23231
|
const color = shadowConfig.colorToken ? tokens.getColor(shadowConfig.colorToken) : void 0;
|
|
23382
23232
|
return generateShadowValue$1(shadowConfig.elevation, shadowConfig.softness, shadowConfig.position ?? "bottom", color);
|
|
23383
23233
|
}
|
|
23384
|
-
|
|
23385
|
-
|
|
23386
|
-
|
|
23387
|
-
|
|
23388
|
-
|
|
23389
|
-
|
|
23390
|
-
|
|
23391
|
-
|
|
23392
|
-
|
|
23393
|
-
|
|
23394
|
-
}
|
|
23395
|
-
|
|
23396
|
-
|
|
23234
|
+
buttonStyleRecipes.map((recipe) => {
|
|
23235
|
+
const resolved = resolveButtonStyleSelection(defaultButtonStyleSelectionFor(recipe.id));
|
|
23236
|
+
if (resolved.kind === "error") throw new Error(`Invalid registered button style ${recipe.id}: ${resolved.error.issues.join(", ")}`);
|
|
23237
|
+
return {
|
|
23238
|
+
id: recipe.id,
|
|
23239
|
+
name: recipe.accessibilityLabel,
|
|
23240
|
+
description: recipe.accessibilityLabel,
|
|
23241
|
+
category: presetCategory(recipe),
|
|
23242
|
+
buttonSystem: resolved.buttonSystem,
|
|
23243
|
+
compatibility: {
|
|
23244
|
+
...recipe.tags.tone ? { tones: [recipe.tags.tone] } : {},
|
|
23245
|
+
...recipe.tags.energy ? { energies: [recipe.tags.energy] } : {}
|
|
23246
|
+
}
|
|
23247
|
+
};
|
|
23248
|
+
});
|
|
23249
|
+
function presetCategory(recipe) {
|
|
23250
|
+
switch (recipe.tags.era) {
|
|
23397
23251
|
case "retro": return "retro";
|
|
23398
23252
|
case "editorial": return "minimal";
|
|
23399
23253
|
case "organic": return "artistic";
|
|
23400
|
-
case "modern": return
|
|
23254
|
+
case "modern": return recipe.tags.tone === "bold" ? "modern" : "technical";
|
|
23401
23255
|
case "technical": return "technical";
|
|
23402
23256
|
case void 0: return "modern";
|
|
23403
23257
|
}
|
|
@@ -26286,17 +26140,21 @@ function defineCuratedSiteStyle(input) {
|
|
|
26286
26140
|
})),
|
|
26287
26141
|
recommendedHeaderLookIds: legacyHeaderLookIds.map(asHeaderLookId),
|
|
26288
26142
|
recommendedFooterLookIds: (input.recommendedFooterLookIds ?? []).map(asFooterLookId),
|
|
26289
|
-
|
|
26143
|
+
buttonStyleChoices: input.buttonStyleChoices,
|
|
26290
26144
|
paletteRecommendations: input.paletteRecommendations,
|
|
26291
26145
|
typography: input.typography ?? defaultTypographyForRecipe(input.tokenRecipes.typography),
|
|
26292
26146
|
...input.heroTypography ? { heroTypography: input.heroTypography } : {}
|
|
26293
26147
|
};
|
|
26294
26148
|
}
|
|
26295
|
-
function buttonChoice(
|
|
26149
|
+
function buttonChoice(styleId, note, parameters) {
|
|
26150
|
+
const selection = parameters === void 0 ? defaultButtonStyleSelectionFor(styleId) : buttonStyleSelectionSchema.parse({
|
|
26151
|
+
styleId,
|
|
26152
|
+
parameters
|
|
26153
|
+
});
|
|
26296
26154
|
return note ? {
|
|
26297
|
-
|
|
26155
|
+
...selection,
|
|
26298
26156
|
note
|
|
26299
|
-
} :
|
|
26157
|
+
} : selection;
|
|
26300
26158
|
}
|
|
26301
26159
|
function paletteRecommendation(authoringKey, note) {
|
|
26302
26160
|
const valueKey = requireCuratedPaletteValueKey(asCuratedPaletteAuthoringKey(authoringKey));
|
|
@@ -26481,9 +26339,8 @@ const curatedSiteStyles = [
|
|
|
26481
26339
|
"minimal-transparent",
|
|
26482
26340
|
"clean-base"
|
|
26483
26341
|
],
|
|
26484
|
-
|
|
26342
|
+
buttonStyleChoices: [
|
|
26485
26343
|
buttonChoice("soft-pill"),
|
|
26486
|
-
buttonChoice("two-tone-pill"),
|
|
26487
26344
|
buttonChoice("pebble"),
|
|
26488
26345
|
buttonChoice("editorial-link"),
|
|
26489
26346
|
buttonChoice("brushed-wash")
|
|
@@ -26519,7 +26376,7 @@ const curatedSiteStyles = [
|
|
|
26519
26376
|
"brand-solid",
|
|
26520
26377
|
"clean-base"
|
|
26521
26378
|
],
|
|
26522
|
-
|
|
26379
|
+
buttonStyleChoices: [
|
|
26523
26380
|
buttonChoice("confident-chip"),
|
|
26524
26381
|
buttonChoice("soft-pill"),
|
|
26525
26382
|
buttonChoice("editorial-link")
|
|
@@ -26558,7 +26415,7 @@ const curatedSiteStyles = [
|
|
|
26558
26415
|
"minimal-transparent",
|
|
26559
26416
|
"centered-calm"
|
|
26560
26417
|
],
|
|
26561
|
-
|
|
26418
|
+
buttonStyleChoices: [
|
|
26562
26419
|
buttonChoice("editorial-link"),
|
|
26563
26420
|
buttonChoice("soft-pill"),
|
|
26564
26421
|
buttonChoice("brushed-wash")
|
|
@@ -26598,7 +26455,7 @@ const curatedSiteStyles = [
|
|
|
26598
26455
|
"practical-utility",
|
|
26599
26456
|
"clean-base"
|
|
26600
26457
|
],
|
|
26601
|
-
|
|
26458
|
+
buttonStyleChoices: [
|
|
26602
26459
|
buttonChoice("pebble"),
|
|
26603
26460
|
buttonChoice("brushed-wash"),
|
|
26604
26461
|
buttonChoice("confident-chip")
|
|
@@ -26659,7 +26516,7 @@ const curatedSiteStyles = [
|
|
|
26659
26516
|
"serif-line",
|
|
26660
26517
|
"clean-base"
|
|
26661
26518
|
],
|
|
26662
|
-
|
|
26519
|
+
buttonStyleChoices: [
|
|
26663
26520
|
buttonChoice("editorial-link"),
|
|
26664
26521
|
buttonChoice("confident-chip"),
|
|
26665
26522
|
buttonChoice("soft-pill")
|
|
@@ -26721,7 +26578,7 @@ const curatedSiteStyles = [
|
|
|
26721
26578
|
"brand-solid",
|
|
26722
26579
|
"clean-base"
|
|
26723
26580
|
],
|
|
26724
|
-
|
|
26581
|
+
buttonStyleChoices: [
|
|
26725
26582
|
buttonChoice("confident-chip"),
|
|
26726
26583
|
buttonChoice("pebble"),
|
|
26727
26584
|
buttonChoice("ink-stamp")
|
|
@@ -26760,7 +26617,7 @@ const curatedSiteStyles = [
|
|
|
26760
26617
|
"minimal-transparent",
|
|
26761
26618
|
"clean-base"
|
|
26762
26619
|
],
|
|
26763
|
-
|
|
26620
|
+
buttonStyleChoices: [
|
|
26764
26621
|
buttonChoice("soft-pill"),
|
|
26765
26622
|
buttonChoice("pebble"),
|
|
26766
26623
|
buttonChoice("confident-chip")
|
|
@@ -26833,7 +26690,7 @@ const curatedSiteStyles = [
|
|
|
26833
26690
|
"clean-base",
|
|
26834
26691
|
"centered-calm"
|
|
26835
26692
|
],
|
|
26836
|
-
|
|
26693
|
+
buttonStyleChoices: [
|
|
26837
26694
|
buttonChoice("pebble"),
|
|
26838
26695
|
buttonChoice("soft-pill"),
|
|
26839
26696
|
buttonChoice("editorial-link")
|
|
@@ -26952,12 +26809,8 @@ const curatedSiteStyles = [
|
|
|
26952
26809
|
"serif-line",
|
|
26953
26810
|
"minimal-transparent"
|
|
26954
26811
|
],
|
|
26955
|
-
recommendedFooterLookIds: [
|
|
26956
|
-
|
|
26957
|
-
"footer-editorial-columns",
|
|
26958
|
-
"footer-muted-grounding"
|
|
26959
|
-
],
|
|
26960
|
-
buttonPersonalityChoices: [
|
|
26812
|
+
recommendedFooterLookIds: ["footer-links-quiet"],
|
|
26813
|
+
buttonStyleChoices: [
|
|
26961
26814
|
buttonChoice("soft-pill"),
|
|
26962
26815
|
buttonChoice("pebble"),
|
|
26963
26816
|
buttonChoice("editorial-link")
|
|
@@ -27031,7 +26884,7 @@ const curatedSiteStyles = [
|
|
|
27031
26884
|
"centered-calm",
|
|
27032
26885
|
"minimal-transparent"
|
|
27033
26886
|
],
|
|
27034
|
-
|
|
26887
|
+
buttonStyleChoices: [
|
|
27035
26888
|
buttonChoice("editorial-link"),
|
|
27036
26889
|
buttonChoice("soft-pill"),
|
|
27037
26890
|
buttonChoice("brushed-wash")
|
|
@@ -27104,8 +26957,8 @@ const curatedSiteStyles = [
|
|
|
27104
26957
|
"practical-utility",
|
|
27105
26958
|
"clean-base"
|
|
27106
26959
|
],
|
|
27107
|
-
recommendedFooterLookIds: ["
|
|
27108
|
-
|
|
26960
|
+
recommendedFooterLookIds: ["footer-links-emphasized", "footer-links-quiet"],
|
|
26961
|
+
buttonStyleChoices: [
|
|
27109
26962
|
buttonChoice("pebble"),
|
|
27110
26963
|
buttonChoice("confident-chip"),
|
|
27111
26964
|
buttonChoice("ink-stamp"),
|
|
@@ -27226,8 +27079,8 @@ const curatedSiteStyles = [
|
|
|
27226
27079
|
"minimal-transparent",
|
|
27227
27080
|
"serif-line"
|
|
27228
27081
|
],
|
|
27229
|
-
recommendedFooterLookIds: ["footer-
|
|
27230
|
-
|
|
27082
|
+
recommendedFooterLookIds: ["footer-links-quiet", "footer-links-emphasized"],
|
|
27083
|
+
buttonStyleChoices: [
|
|
27231
27084
|
buttonChoice("earth-pill"),
|
|
27232
27085
|
buttonChoice("soft-pill"),
|
|
27233
27086
|
buttonChoice("pebble"),
|
|
@@ -27298,7 +27151,7 @@ const curatedSiteStyles = [
|
|
|
27298
27151
|
"floating-glass",
|
|
27299
27152
|
"brand-solid"
|
|
27300
27153
|
],
|
|
27301
|
-
|
|
27154
|
+
buttonStyleChoices: [
|
|
27302
27155
|
buttonChoice("ink-stamp"),
|
|
27303
27156
|
buttonChoice("confident-chip"),
|
|
27304
27157
|
buttonChoice("brushed-wash"),
|
|
@@ -27353,8 +27206,8 @@ const curatedSiteStyles = [
|
|
|
27353
27206
|
"transparent-overlay",
|
|
27354
27207
|
"practical-utility"
|
|
27355
27208
|
],
|
|
27356
|
-
recommendedFooterLookIds: ["
|
|
27357
|
-
|
|
27209
|
+
recommendedFooterLookIds: ["footer-links-emphasized", "footer-links-quiet"],
|
|
27210
|
+
buttonStyleChoices: [
|
|
27358
27211
|
buttonChoice("showtime-pill"),
|
|
27359
27212
|
buttonChoice("confident-chip"),
|
|
27360
27213
|
buttonChoice("ink-stamp"),
|
|
@@ -27435,8 +27288,8 @@ const curatedSiteStyles = [
|
|
|
27435
27288
|
headerStyleChoice("glass")
|
|
27436
27289
|
] },
|
|
27437
27290
|
recommendedHeaderLookIds: ["minimal-transparent"],
|
|
27438
|
-
recommendedFooterLookIds: ["
|
|
27439
|
-
|
|
27291
|
+
recommendedFooterLookIds: ["footer-links-emphasized", "footer-links-quiet"],
|
|
27292
|
+
buttonStyleChoices: [
|
|
27440
27293
|
buttonChoice("ornate-ritual"),
|
|
27441
27294
|
buttonChoice("joy-stamp"),
|
|
27442
27295
|
buttonChoice("ink-stamp")
|
|
@@ -27489,8 +27342,8 @@ const curatedSiteStyles = [
|
|
|
27489
27342
|
headerStyleChoice("glass")
|
|
27490
27343
|
] },
|
|
27491
27344
|
recommendedHeaderLookIds: ["minimal-transparent"],
|
|
27492
|
-
recommendedFooterLookIds: ["
|
|
27493
|
-
|
|
27345
|
+
recommendedFooterLookIds: ["footer-links-emphasized", "footer-links-quiet"],
|
|
27346
|
+
buttonStyleChoices: [
|
|
27494
27347
|
buttonChoice("joy-stamp"),
|
|
27495
27348
|
buttonChoice("ink-stamp"),
|
|
27496
27349
|
buttonChoice("showtime-pill")
|
|
@@ -27580,8 +27433,8 @@ const curatedSiteStyles = [
|
|
|
27580
27433
|
"centered-calm",
|
|
27581
27434
|
"clean-base"
|
|
27582
27435
|
],
|
|
27583
|
-
recommendedFooterLookIds: ["footer-
|
|
27584
|
-
|
|
27436
|
+
recommendedFooterLookIds: ["footer-links-quiet"],
|
|
27437
|
+
buttonStyleChoices: [
|
|
27585
27438
|
buttonChoice("flat-ink"),
|
|
27586
27439
|
buttonChoice("confident-chip"),
|
|
27587
27440
|
buttonChoice("editorial-link")
|
|
@@ -27658,14 +27511,9 @@ const curatedSiteStyles = [
|
|
|
27658
27511
|
"serif-line",
|
|
27659
27512
|
"clean-base"
|
|
27660
27513
|
],
|
|
27661
|
-
recommendedFooterLookIds: [
|
|
27662
|
-
|
|
27663
|
-
"
|
|
27664
|
-
"footer-identity-quiet"
|
|
27665
|
-
],
|
|
27666
|
-
buttonPersonalityChoices: [
|
|
27667
|
-
buttonChoice("quiet-arrow"),
|
|
27668
|
-
buttonChoice("two-tone-pill"),
|
|
27514
|
+
recommendedFooterLookIds: ["footer-links-quiet"],
|
|
27515
|
+
buttonStyleChoices: [
|
|
27516
|
+
buttonChoice("quiet-arrow", void 0, { secondaryTreatment: "solid-accent" }),
|
|
27669
27517
|
buttonChoice("flat-ink"),
|
|
27670
27518
|
buttonChoice("editorial-link")
|
|
27671
27519
|
],
|
|
@@ -30862,25 +30710,41 @@ const heroCopyFragment = defineFragment({
|
|
|
30862
30710
|
]
|
|
30863
30711
|
});
|
|
30864
30712
|
//#endregion
|
|
30713
|
+
//#region ../blocks/src/system/constants/buttonRoles.ts
|
|
30714
|
+
/**
|
|
30715
|
+
* Semantic button roles available to block authors.
|
|
30716
|
+
*
|
|
30717
|
+
* These roles are deliberately independent of a site's visual button style:
|
|
30718
|
+
* the active theme owns how each role looks.
|
|
30719
|
+
*/
|
|
30720
|
+
const BLOCK_BUTTON_ROLES = PUBLIC_BUTTON_ROLES;
|
|
30721
|
+
const blockButtonRoleSchema = z$1.enum(BLOCK_BUTTON_ROLES);
|
|
30722
|
+
/**
|
|
30723
|
+
* Temporary rollout boundary for persisted content written before issue #1220.
|
|
30724
|
+
* Authoring remains strict through `blockButtonRoleSchema`; this parser exists
|
|
30725
|
+
* only until the post-deploy role rewrite has been audited in production.
|
|
30726
|
+
*/
|
|
30727
|
+
function canonicalizePersistedBlockButtonRole(value) {
|
|
30728
|
+
return value === "link" || value === "tertiary" ? "ghost" : value;
|
|
30729
|
+
}
|
|
30730
|
+
const persistedBlockButtonRoleSchema = z$1.preprocess((value) => typeof value === "string" ? canonicalizePersistedBlockButtonRole(value) : value, blockButtonRoleSchema);
|
|
30731
|
+
const BLOCK_BUTTON_ROLE_LABELS = {
|
|
30732
|
+
primary: "Primary",
|
|
30733
|
+
secondary: "Secondary",
|
|
30734
|
+
outline: "Outline",
|
|
30735
|
+
ghost: "Ghost",
|
|
30736
|
+
accent: "Accent"
|
|
30737
|
+
};
|
|
30738
|
+
const BLOCK_BUTTON_ROLE_OPTIONS = BLOCK_BUTTON_ROLES.map((value) => ({
|
|
30739
|
+
value,
|
|
30740
|
+
label: BLOCK_BUTTON_ROLE_LABELS[value]
|
|
30741
|
+
}));
|
|
30742
|
+
function isBlockButtonRole(value) {
|
|
30743
|
+
return blockButtonRoleSchema.safeParse(value).success;
|
|
30744
|
+
}
|
|
30745
|
+
//#endregion
|
|
30865
30746
|
//#region ../blocks/src/system/fields/button.ts
|
|
30866
|
-
const DEFAULT_THEME_BUTTON_VARIANTS =
|
|
30867
|
-
{
|
|
30868
|
-
value: "primary",
|
|
30869
|
-
label: "Primary"
|
|
30870
|
-
},
|
|
30871
|
-
{
|
|
30872
|
-
value: "secondary",
|
|
30873
|
-
label: "Secondary"
|
|
30874
|
-
},
|
|
30875
|
-
{
|
|
30876
|
-
value: "outline",
|
|
30877
|
-
label: "Outline"
|
|
30878
|
-
},
|
|
30879
|
-
{
|
|
30880
|
-
value: "link",
|
|
30881
|
-
label: "Link"
|
|
30882
|
-
}
|
|
30883
|
-
];
|
|
30747
|
+
const DEFAULT_THEME_BUTTON_VARIANTS = BLOCK_BUTTON_ROLE_OPTIONS;
|
|
30884
30748
|
function createButtonVariantField(options = {}) {
|
|
30885
30749
|
return {
|
|
30886
30750
|
id: options.id ?? "buttonVariant",
|
|
@@ -30898,20 +30762,7 @@ function createButtonVariantField(options = {}) {
|
|
|
30898
30762
|
};
|
|
30899
30763
|
}
|
|
30900
30764
|
function createButtonGroup(options = {}) {
|
|
30901
|
-
const { variants =
|
|
30902
|
-
{
|
|
30903
|
-
value: "primary",
|
|
30904
|
-
label: "Primary"
|
|
30905
|
-
},
|
|
30906
|
-
{
|
|
30907
|
-
value: "secondary",
|
|
30908
|
-
label: "Secondary"
|
|
30909
|
-
},
|
|
30910
|
-
{
|
|
30911
|
-
value: "outline",
|
|
30912
|
-
label: "Outline"
|
|
30913
|
-
}
|
|
30914
|
-
], defaultVariant, includeSize = true, defaultSize = "md", showGroupLabel = false, groupId = "button", groupLabel = "Button", flattenInRepeater = true } = options;
|
|
30765
|
+
const { variants = BLOCK_BUTTON_ROLE_OPTIONS, defaultVariant, includeSize = true, defaultSize = "md", showGroupLabel = false, groupId = "button", groupLabel = "Button", flattenInRepeater = true } = options;
|
|
30915
30766
|
const mainFields = [
|
|
30916
30767
|
{
|
|
30917
30768
|
id: "label",
|
|
@@ -31047,29 +30898,7 @@ const ctaRowFragment = defineFragment({
|
|
|
31047
30898
|
fields: [createCtasRepeater({
|
|
31048
30899
|
label: "Calls to action",
|
|
31049
30900
|
itemLabel: "CTA",
|
|
31050
|
-
maxItems: 3
|
|
31051
|
-
button: { variants: [
|
|
31052
|
-
{
|
|
31053
|
-
value: "primary",
|
|
31054
|
-
label: "Primary"
|
|
31055
|
-
},
|
|
31056
|
-
{
|
|
31057
|
-
value: "secondary",
|
|
31058
|
-
label: "Secondary"
|
|
31059
|
-
},
|
|
31060
|
-
{
|
|
31061
|
-
value: "outline",
|
|
31062
|
-
label: "Outline"
|
|
31063
|
-
},
|
|
31064
|
-
{
|
|
31065
|
-
value: "link",
|
|
31066
|
-
label: "Link"
|
|
31067
|
-
},
|
|
31068
|
-
{
|
|
31069
|
-
value: "accent",
|
|
31070
|
-
label: "Accent"
|
|
31071
|
-
}
|
|
31072
|
-
] }
|
|
30901
|
+
maxItems: 3
|
|
31073
30902
|
})],
|
|
31074
30903
|
layout: [ctaRow({
|
|
31075
30904
|
collectionPath: "content.ctas",
|
|
@@ -31088,10 +30917,6 @@ const heroCtaRowFragment = defineFragment({
|
|
|
31088
30917
|
defaultValue: [],
|
|
31089
30918
|
button: {
|
|
31090
30919
|
variants: [
|
|
31091
|
-
{
|
|
31092
|
-
value: "default",
|
|
31093
|
-
label: "Default"
|
|
31094
|
-
},
|
|
31095
30920
|
{
|
|
31096
30921
|
value: "primary",
|
|
31097
30922
|
label: "Primary"
|
|
@@ -31103,9 +30928,17 @@ const heroCtaRowFragment = defineFragment({
|
|
|
31103
30928
|
{
|
|
31104
30929
|
value: "outline",
|
|
31105
30930
|
label: "Outline"
|
|
30931
|
+
},
|
|
30932
|
+
{
|
|
30933
|
+
value: "ghost",
|
|
30934
|
+
label: "Ghost"
|
|
30935
|
+
},
|
|
30936
|
+
{
|
|
30937
|
+
value: "accent",
|
|
30938
|
+
label: "Accent"
|
|
31106
30939
|
}
|
|
31107
30940
|
],
|
|
31108
|
-
defaultVariant: "
|
|
30941
|
+
defaultVariant: "primary",
|
|
31109
30942
|
includeSize: true,
|
|
31110
30943
|
defaultSize: "lg"
|
|
31111
30944
|
}
|
|
@@ -31880,11 +31713,13 @@ const blogFeaturedPostFragment = defineFragment({
|
|
|
31880
31713
|
as: "p",
|
|
31881
31714
|
style: textColorStyle("text/80")
|
|
31882
31715
|
}, bind("post.excerpt", { fallback: "Select a blog post to display its preview." })),
|
|
31883
|
-
|
|
31884
|
-
className: "rb-
|
|
31885
|
-
|
|
31886
|
-
|
|
31887
|
-
|
|
31716
|
+
button({
|
|
31717
|
+
className: "rb-self-start",
|
|
31718
|
+
href: { $bind: { from: "post.path" } },
|
|
31719
|
+
variantId: "ghost",
|
|
31720
|
+
size: "sm",
|
|
31721
|
+
linkRequired: true
|
|
31722
|
+
}, [text({ as: "span" }, props({ value: "Read more" }))])
|
|
31888
31723
|
])], when("post")), stack({
|
|
31889
31724
|
gap: "sm",
|
|
31890
31725
|
className: "rb-rounded-xl rb-border rb-border-dashed rb-p-6",
|
|
@@ -33175,21 +33010,7 @@ const newsletterFormFragment = defineFragment({
|
|
|
33175
33010
|
createButtonVariantField({
|
|
33176
33011
|
id: "buttonVariant",
|
|
33177
33012
|
label: "Button style",
|
|
33178
|
-
defaultValue: "primary"
|
|
33179
|
-
variants: [
|
|
33180
|
-
{
|
|
33181
|
-
value: "primary",
|
|
33182
|
-
label: "Primary"
|
|
33183
|
-
},
|
|
33184
|
-
{
|
|
33185
|
-
value: "secondary",
|
|
33186
|
-
label: "Secondary"
|
|
33187
|
-
},
|
|
33188
|
-
{
|
|
33189
|
-
value: "outline",
|
|
33190
|
-
label: "Outline"
|
|
33191
|
-
}
|
|
33192
|
-
]
|
|
33013
|
+
defaultValue: "primary"
|
|
33193
33014
|
}),
|
|
33194
33015
|
{
|
|
33195
33016
|
id: "successMessage",
|
|
@@ -34119,7 +33940,8 @@ function postExcerpt(className) {
|
|
|
34119
33940
|
function postReadMore() {
|
|
34120
33941
|
return button({
|
|
34121
33942
|
href: { $bind: { from: "post.path" } },
|
|
34122
|
-
className: "rb-self-start"
|
|
33943
|
+
className: "rb-self-start",
|
|
33944
|
+
variantId: "ghost"
|
|
34123
33945
|
}, [text({ as: "span" }, bind("content.readMoreText", { fallback: "Read more" }), when("content.readMoreText")), text({
|
|
34124
33946
|
as: "span",
|
|
34125
33947
|
value: "Read more"
|
|
@@ -37855,31 +37677,7 @@ const featureCardsBlockDefinition = { manifest: createBlockManifest({
|
|
|
37855
37677
|
label: "Calls to action",
|
|
37856
37678
|
itemLabel: "CTA",
|
|
37857
37679
|
maxItems: 1,
|
|
37858
|
-
button: {
|
|
37859
|
-
variants: [
|
|
37860
|
-
{
|
|
37861
|
-
value: "primary",
|
|
37862
|
-
label: "Primary"
|
|
37863
|
-
},
|
|
37864
|
-
{
|
|
37865
|
-
value: "secondary",
|
|
37866
|
-
label: "Secondary"
|
|
37867
|
-
},
|
|
37868
|
-
{
|
|
37869
|
-
value: "outline",
|
|
37870
|
-
label: "Outline"
|
|
37871
|
-
},
|
|
37872
|
-
{
|
|
37873
|
-
value: "ghost",
|
|
37874
|
-
label: "Ghost"
|
|
37875
|
-
},
|
|
37876
|
-
{
|
|
37877
|
-
value: "link",
|
|
37878
|
-
label: "Link"
|
|
37879
|
-
}
|
|
37880
|
-
],
|
|
37881
|
-
defaultVariant: "ghost"
|
|
37882
|
-
}
|
|
37680
|
+
button: { defaultVariant: "ghost" }
|
|
37883
37681
|
})
|
|
37884
37682
|
] }
|
|
37885
37683
|
},
|
|
@@ -40091,17 +39889,8 @@ function readAmount(value) {
|
|
|
40091
39889
|
//#endregion
|
|
40092
39890
|
//#region ../blocks/src/system/runtime/nodes/shared/contract-schemas.ts
|
|
40093
39891
|
const previewStageSchema = z$1.enum(["preview", "published"]);
|
|
40094
|
-
const registrationButtonVariantSchema =
|
|
40095
|
-
|
|
40096
|
-
"secondary",
|
|
40097
|
-
"outline"
|
|
40098
|
-
]);
|
|
40099
|
-
const eventButtonVariantSchema = z$1.enum([
|
|
40100
|
-
"primary",
|
|
40101
|
-
"secondary",
|
|
40102
|
-
"outline",
|
|
40103
|
-
"link"
|
|
40104
|
-
]);
|
|
39892
|
+
const registrationButtonVariantSchema = blockButtonRoleSchema;
|
|
39893
|
+
const eventButtonVariantSchema = persistedBlockButtonRoleSchema;
|
|
40105
39894
|
const eventLayoutSchema = z$1.enum(eventCalendarListLayoutValues);
|
|
40106
39895
|
const eventCalendarDisplayModeSchema = z$1.enum(eventCalendarDisplayModeValues);
|
|
40107
39896
|
const eventCalendarDefaultViewSchema = z$1.enum(eventCalendarDefaultViewValues);
|
|
@@ -40478,23 +40267,7 @@ const eventRegistrationBlockDefinition = {
|
|
|
40478
40267
|
defaultValue: "Complete Registration",
|
|
40479
40268
|
maxLength: 40
|
|
40480
40269
|
},
|
|
40481
|
-
createButtonVariantField(
|
|
40482
|
-
description: "Choose a button style from your theme",
|
|
40483
|
-
variants: [
|
|
40484
|
-
{
|
|
40485
|
-
value: "primary",
|
|
40486
|
-
label: "Primary"
|
|
40487
|
-
},
|
|
40488
|
-
{
|
|
40489
|
-
value: "secondary",
|
|
40490
|
-
label: "Secondary"
|
|
40491
|
-
},
|
|
40492
|
-
{
|
|
40493
|
-
value: "outline",
|
|
40494
|
-
label: "Outline"
|
|
40495
|
-
}
|
|
40496
|
-
]
|
|
40497
|
-
})
|
|
40270
|
+
createButtonVariantField()
|
|
40498
40271
|
],
|
|
40499
40272
|
layout: [styledSection({
|
|
40500
40273
|
baseClass: "",
|
|
@@ -40983,23 +40756,7 @@ const courseRegistrationBlockDefinition = {
|
|
|
40983
40756
|
defaultValue: "Sign up",
|
|
40984
40757
|
maxLength: 40
|
|
40985
40758
|
},
|
|
40986
|
-
createButtonVariantField(
|
|
40987
|
-
description: "Choose a button style from your theme",
|
|
40988
|
-
variants: [
|
|
40989
|
-
{
|
|
40990
|
-
value: "primary",
|
|
40991
|
-
label: "Primary"
|
|
40992
|
-
},
|
|
40993
|
-
{
|
|
40994
|
-
value: "secondary",
|
|
40995
|
-
label: "Secondary"
|
|
40996
|
-
},
|
|
40997
|
-
{
|
|
40998
|
-
value: "outline",
|
|
40999
|
-
label: "Outline"
|
|
41000
|
-
}
|
|
41001
|
-
]
|
|
41002
|
-
})
|
|
40759
|
+
createButtonVariantField()
|
|
41003
40760
|
],
|
|
41004
40761
|
layout: [styledSection({
|
|
41005
40762
|
baseClass: "",
|
|
@@ -46631,36 +46388,7 @@ const offeringsPreviewFields = [
|
|
|
46631
46388
|
ui: { intent: "content" },
|
|
46632
46389
|
schema: { fields: groupOverrideFields }
|
|
46633
46390
|
},
|
|
46634
|
-
|
|
46635
|
-
id: "buttonVariant",
|
|
46636
|
-
type: "select",
|
|
46637
|
-
label: "Button style",
|
|
46638
|
-
required: false,
|
|
46639
|
-
multiple: false,
|
|
46640
|
-
defaultValue: "primary",
|
|
46641
|
-
options: [
|
|
46642
|
-
{
|
|
46643
|
-
value: "primary",
|
|
46644
|
-
label: "Primary"
|
|
46645
|
-
},
|
|
46646
|
-
{
|
|
46647
|
-
value: "secondary",
|
|
46648
|
-
label: "Secondary"
|
|
46649
|
-
},
|
|
46650
|
-
{
|
|
46651
|
-
value: "outline",
|
|
46652
|
-
label: "Outline"
|
|
46653
|
-
},
|
|
46654
|
-
{
|
|
46655
|
-
value: "link",
|
|
46656
|
-
label: "Link"
|
|
46657
|
-
}
|
|
46658
|
-
],
|
|
46659
|
-
ui: {
|
|
46660
|
-
intent: "display",
|
|
46661
|
-
widget: "buttonVariant"
|
|
46662
|
-
}
|
|
46663
|
-
},
|
|
46391
|
+
createButtonVariantField(),
|
|
46664
46392
|
{
|
|
46665
46393
|
id: "buttonText",
|
|
46666
46394
|
type: "text",
|
|
@@ -46866,7 +46594,7 @@ function normalizeOfferingsPreviewGroupOverride(value) {
|
|
|
46866
46594
|
return [override];
|
|
46867
46595
|
}
|
|
46868
46596
|
function isButtonVariant(value) {
|
|
46869
|
-
return value ===
|
|
46597
|
+
return value === null || isBlockButtonRole(value);
|
|
46870
46598
|
}
|
|
46871
46599
|
function normalizeCardStylesContent(value) {
|
|
46872
46600
|
return isRecord$19(value) || value === null ? value : void 0;
|
|
@@ -48718,12 +48446,7 @@ const shopSourceSchema = z$1.object({
|
|
|
48718
48446
|
showPrices: z$1.boolean().optional(),
|
|
48719
48447
|
showValidityPeriod: z$1.boolean().optional(),
|
|
48720
48448
|
showPricePerCredit: z$1.boolean().nullable().optional(),
|
|
48721
|
-
buttonVariant:
|
|
48722
|
-
"primary",
|
|
48723
|
-
"secondary",
|
|
48724
|
-
"outline",
|
|
48725
|
-
"link"
|
|
48726
|
-
]).optional(),
|
|
48449
|
+
buttonVariant: blockButtonRoleSchema.optional(),
|
|
48727
48450
|
passesHeading: z$1.string().optional(),
|
|
48728
48451
|
membershipsHeading: z$1.string().optional(),
|
|
48729
48452
|
buyButtonText: z$1.string().optional(),
|
|
@@ -48868,12 +48591,7 @@ const passesMembershipsHydrationSchema = z$1.object({
|
|
|
48868
48591
|
passes: z$1.array(publicPassProductSchema),
|
|
48869
48592
|
memberships: z$1.array(publicMembershipProductSchema),
|
|
48870
48593
|
passPurchaseMode: z$1.enum(["add_to_cart", "buy_now"]),
|
|
48871
|
-
buttonVariant:
|
|
48872
|
-
"primary",
|
|
48873
|
-
"secondary",
|
|
48874
|
-
"outline",
|
|
48875
|
-
"link"
|
|
48876
|
-
])
|
|
48594
|
+
buttonVariant: blockButtonRoleSchema
|
|
48877
48595
|
});
|
|
48878
48596
|
const productListHydrationSchema = z$1.object({
|
|
48879
48597
|
products: z$1.array(publicProductSchema),
|
|
@@ -50301,11 +50019,7 @@ const newsletterPresetSchema = z$1.enum([
|
|
|
50301
50019
|
"emailNameCompany"
|
|
50302
50020
|
]);
|
|
50303
50021
|
const newsletterDestinationProviderSchema = z$1.enum(["riverbank", "mailchimp"]);
|
|
50304
|
-
const newsletterButtonVariantSchema =
|
|
50305
|
-
"primary",
|
|
50306
|
-
"secondary",
|
|
50307
|
-
"outline"
|
|
50308
|
-
]);
|
|
50022
|
+
const newsletterButtonVariantSchema = blockButtonRoleSchema;
|
|
50309
50023
|
const newsletterFieldSchema = z$1.object({
|
|
50310
50024
|
id: z$1.string(),
|
|
50311
50025
|
type: z$1.enum(["email", "text"]),
|
|
@@ -53355,7 +53069,7 @@ const ButtonNode = ({ value, children, href, variantId = "primary", size = "md",
|
|
|
53355
53069
|
return null;
|
|
53356
53070
|
}
|
|
53357
53071
|
const extraClassName = affordanceIcon ? [className, AFFORDANCE_SUPPRESS_CLASS].filter(Boolean).join(" ") : className;
|
|
53358
|
-
const resolvedVariantId = parseThemeButtonVariantId(variantId);
|
|
53072
|
+
const resolvedVariantId = parseThemeButtonVariantId(canonicalizePersistedBlockButtonRole(variantId));
|
|
53359
53073
|
const combinedClassName = resolvedVariantId ? themeButtonClassName({
|
|
53360
53074
|
variant: resolvedVariantId,
|
|
53361
53075
|
size,
|
|
@@ -53454,12 +53168,6 @@ const FeatureCardIconNode = ({ value, treatment, generatedIconSizePx, className,
|
|
|
53454
53168
|
};
|
|
53455
53169
|
//#endregion
|
|
53456
53170
|
//#region ../blocks/src/system/runtime/nodes/file-download.tsx
|
|
53457
|
-
const FILE_DOWNLOAD_BUTTON_VARIANTS = [
|
|
53458
|
-
"primary",
|
|
53459
|
-
"secondary",
|
|
53460
|
-
"outline",
|
|
53461
|
-
"link"
|
|
53462
|
-
];
|
|
53463
53171
|
function isDownloadableMediaType(type) {
|
|
53464
53172
|
return typeof type === "string" && PUBLIC_DOWNLOAD_MEDIA_TYPES.includes(type);
|
|
53465
53173
|
}
|
|
@@ -53491,7 +53199,7 @@ function iconForMediaType(type) {
|
|
|
53491
53199
|
}
|
|
53492
53200
|
}
|
|
53493
53201
|
function normalizeButtonVariant(value) {
|
|
53494
|
-
return
|
|
53202
|
+
return isBlockButtonRole(value) ? value : "primary";
|
|
53495
53203
|
}
|
|
53496
53204
|
function FileDownloadNode({ value, title, description, buttonLabel, buttonVariant, className }) {
|
|
53497
53205
|
if (!value || !isDownloadableMediaType(value.type)) return null;
|
|
@@ -57493,8 +57201,11 @@ function LocationMapView({ addressText, location, zoom, heightPx, showAddressTex
|
|
|
57493
57201
|
href: directionsUrl,
|
|
57494
57202
|
target: "_blank",
|
|
57495
57203
|
rel: "noreferrer",
|
|
57496
|
-
className:
|
|
57497
|
-
|
|
57204
|
+
className: themeButtonClassName({
|
|
57205
|
+
variant: "ghost",
|
|
57206
|
+
size: "sm",
|
|
57207
|
+
extraClassName: "rb-w-fit"
|
|
57208
|
+
}),
|
|
57498
57209
|
children: directionsLabel
|
|
57499
57210
|
}) : null
|
|
57500
57211
|
]
|
|
@@ -58892,7 +58603,11 @@ function WeeklySlotAvailabilityView({ availability, loading = false, error, empt
|
|
|
58892
58603
|
]
|
|
58893
58604
|
}),
|
|
58894
58605
|
resolvedCtaUrl ? /* @__PURE__ */ jsx("a", {
|
|
58895
|
-
className:
|
|
58606
|
+
className: themeButtonClassName({
|
|
58607
|
+
variant: "ghost",
|
|
58608
|
+
size: "sm",
|
|
58609
|
+
extraClassName: "weekly-slot-availability__cta"
|
|
58610
|
+
}),
|
|
58896
58611
|
href: buildSlotCtaUrl(resolvedCtaUrl, slot),
|
|
58897
58612
|
"aria-label": buildSlotCtaLabel(resolvedCtaText, slot),
|
|
58898
58613
|
children: resolvedCtaText
|
|
@@ -87267,7 +86982,7 @@ var CircuitOpenError = class extends Error {
|
|
|
87267
86982
|
* 1. This constant
|
|
87268
86983
|
* 2. The "version" field in package.json
|
|
87269
86984
|
*/
|
|
87270
|
-
const SDK_VERSION = "0.
|
|
86985
|
+
const SDK_VERSION = "0.111.0";
|
|
87271
86986
|
//#endregion
|
|
87272
86987
|
//#region src/next/content-load-failure.ts
|
|
87273
86988
|
const SdkContentLoadError = RiverbankContentLoadError;
|