@riverbankcms/sdk 0.152.0 → 0.154.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/CHANGELOG.md +15 -0
- package/dist/{EventEmbeddedCheckoutStep-DVQXWFm6.mjs → EventEmbeddedCheckoutStep-ba9npQtb.mjs} +1 -1
- package/dist/{PreviewEditorSidebar-Dr4NJi3Q.mjs → PreviewEditorSidebar-C7FiaxlF.mjs} +194 -22
- package/dist/{PreviewEditorUI-DSZXQbyh.mjs → PreviewEditorUI-DFst50q1.mjs} +20 -44
- package/dist/{SdkPreviewModeRuntime-Dl4GyMc3.mjs → SdkPreviewModeRuntime-BUNV_YHZ.mjs} +266 -143
- package/dist/{SiteChromeCustomizeContext-DgBe-FlM.mjs → SiteChromeCustomizeContext-DEj7qppF.mjs} +5340 -4329
- package/dist/{ThemedButton-B8ViBnLK.mjs → ThemedButton-C8kzu0hY.mjs} +610 -116
- package/dist/_dts/ai/src/contracts/proposals.d.ts +416 -182
- package/dist/_dts/ai/src/contracts/siteStyleProposalSchemas.d.ts +3270 -8214
- package/dist/_dts/api/src/billing.d.ts +2 -0
- package/dist/_dts/api/src/billingEndpointDefinitions.d.ts +78 -0
- package/dist/_dts/api/src/bookingAdjustments.d.ts +3 -2
- package/dist/_dts/api/src/bookingOperations.d.ts +7 -2
- package/dist/_dts/api/src/bookingPeople.d.ts +19 -0
- package/dist/_dts/api/src/bookingPeopleEndpointDefinitions.d.ts +8 -0
- package/dist/_dts/api/src/bookingRecords.d.ts +4 -106
- package/dist/_dts/api/src/bookings.d.ts +2 -3
- package/dist/_dts/api/src/communications.d.ts +19 -5
- package/dist/_dts/api/src/contentRuntime.d.ts +1 -0
- package/dist/_dts/api/src/endpoints.d.ts +88 -43
- package/dist/_dts/api/src/index.d.ts +4 -2
- package/dist/_dts/api/src/indexCoreTypes.d.ts +1 -0
- package/dist/_dts/api/src/indexExtendedTypes.d.ts +1 -1
- package/dist/_dts/api/src/moneyPayments.d.ts +116 -0
- package/dist/_dts/api/src/onboarding/surfaceData.d.ts +2 -0
- package/dist/_dts/api/src/sdk-event-upsert.d.ts +2 -2
- package/dist/_dts/api/src/sdkThemeWire.d.ts +348 -1537
- package/dist/_dts/api/src/shared-contracts.d.ts +10 -0
- package/dist/_dts/api/src/siteInfrastructure.d.ts +2 -1
- package/dist/_dts/api/src/sitePlatformEndpoints.d.ts +18 -0
- package/dist/_dts/api/src/siteRuntimeEndpoints.d.ts +17 -16
- package/dist/_dts/api/src/siteSettings.d.ts +1 -0
- package/dist/_dts/api/src/stripeConnectSetup.d.ts +90 -0
- package/dist/_dts/api/src/teamMembers.d.ts +2 -27
- package/dist/_dts/api/src/types.d.ts +11 -31
- package/dist/_dts/api/src/wholeSeriesRuns.d.ts +2 -4
- package/dist/_dts/block-form/src/widgets/RepeaterField/components/layoutGridDomain.d.ts +3 -13
- package/dist/_dts/blocks/src/client/site-chrome.d.ts +1 -1
- package/dist/_dts/blocks/src/contracts/index.d.ts +1 -0
- package/dist/_dts/blocks/src/contracts/proof-block-islands.d.ts +8 -96
- package/dist/_dts/blocks/src/index.d.ts +1 -0
- package/dist/_dts/blocks/src/lib/media.d.ts +1 -0
- package/dist/_dts/blocks/src/lib/picsum.d.ts +2 -2
- package/dist/_dts/blocks/src/pageRendererContracts.d.ts +2 -1
- package/dist/_dts/blocks/src/primitives/content/components/RichText.d.ts +1 -1
- package/dist/_dts/blocks/src/primitives/content/primitives.d.ts +4 -1
- package/dist/_dts/blocks/src/primitives/layout/Section.d.ts +1 -0
- package/dist/_dts/blocks/src/system/blocks/events/event-calendar.d.ts +1 -1
- package/dist/_dts/blocks/src/system/blocks/events/eventSelectionFields.d.ts +2 -2
- package/dist/_dts/blocks/src/system/blocks/events/shared/fields.d.ts +0 -4
- package/dist/_dts/blocks/src/system/blocks/events/shared/index.d.ts +0 -1
- package/dist/_dts/blocks/src/system/blocks/events/shared/schemas.d.ts +276 -884
- package/dist/_dts/blocks/src/system/blocks/events/shared/types.d.ts +2 -2
- package/dist/_dts/blocks/src/system/blocks/form.d.ts +10 -0
- package/dist/_dts/blocks/src/system/blocks/image-gallery/fields.d.ts +1 -0
- package/dist/_dts/blocks/src/system/blocks/image-gallery.d.ts +6 -1
- package/dist/_dts/blocks/src/system/blocks/location-map.d.ts +2 -2
- package/dist/_dts/blocks/src/system/blocks/media-text.d.ts +92 -90
- package/dist/_dts/blocks/src/system/blocks/newsletter-signup.d.ts +12 -0
- package/dist/_dts/blocks/src/system/blocks/shared/teamMembers.d.ts +4 -7
- package/dist/_dts/blocks/src/system/blocks/site-footer-runtime-layout.d.ts +23 -0
- package/dist/_dts/blocks/src/system/blocks/site-footer-runtime-profile.d.ts +20 -0
- package/dist/_dts/blocks/src/system/blocks/site-footer-runtime.d.ts +17 -16
- package/dist/_dts/blocks/src/system/blocks/site-footer.d.ts +1 -1
- package/dist/_dts/blocks/src/system/blocks/team-members.d.ts +2 -2
- package/dist/_dts/blocks/src/system/customize/backgrounds.d.ts +6 -6
- package/dist/_dts/blocks/src/system/customize/facets.d.ts +75 -9
- package/dist/_dts/blocks/src/system/fields/backgroundContent.d.ts +377 -1
- package/dist/_dts/blocks/src/system/helpers/backgroundMedia.d.ts +6 -2
- package/dist/_dts/blocks/src/system/helpers/resolveBackground.d.ts +3 -3
- package/dist/_dts/blocks/src/system/layout/repeaterGrid.d.ts +12 -5
- package/dist/_dts/blocks/src/system/manifest/fieldValidation/index.d.ts +3 -3
- package/dist/_dts/blocks/src/system/manifest/schema.d.ts +48 -48
- package/dist/_dts/blocks/src/system/manifest/validation.d.ts +2 -0
- package/dist/_dts/blocks/src/system/node/fragments/index.d.ts +1 -0
- package/dist/_dts/blocks/src/system/node/fragments/lookSlot.d.ts +1 -1
- package/dist/_dts/blocks/src/system/node/fragments/responsiveTwoColumn.d.ts +3 -1
- package/dist/_dts/blocks/src/system/node/fragments/sectionHead.d.ts +15 -0
- package/dist/_dts/blocks/src/system/runtime/components/registry.client.d.ts +18 -198
- package/dist/_dts/blocks/src/system/runtime/components/runtime-backed-blocks.d.ts +9 -99
- package/dist/_dts/blocks/src/system/runtime/hooks/useBookingFlowController.d.ts +1 -1
- package/dist/_dts/blocks/src/system/runtime/hooks/useHeadlessBookingFlow.d.ts +2 -0
- package/dist/_dts/blocks/src/system/runtime/lookSurfaces.d.ts +18 -6
- package/dist/_dts/blocks/src/system/runtime/nodes/ImageResolveContext.d.ts +1 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/appointment-services.d.ts +50 -202
- package/dist/_dts/blocks/src/system/runtime/nodes/basic.d.ts +2 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/booking-form.headless.state.d.ts +28 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/event-details/lookPresentation.d.ts +12 -6
- package/dist/_dts/blocks/src/system/runtime/nodes/event-details/presentation.d.ts +1 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/events/domain/dates.d.ts +1 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/events/shared/CardListItem.d.ts +1 -1
- package/dist/_dts/blocks/src/system/runtime/nodes/events/shared/eventCollectionContract.d.ts +289 -885
- package/dist/_dts/blocks/src/system/runtime/nodes/file-download.d.ts +3 -2
- package/dist/_dts/blocks/src/system/runtime/nodes/form.fields.d.ts +5 -2
- package/dist/_dts/blocks/src/system/runtime/nodes/form.interactive.d.ts +11 -79
- package/dist/_dts/blocks/src/system/runtime/nodes/form.parts.d.ts +7 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/form.server.d.ts +2 -13
- package/dist/_dts/blocks/src/system/runtime/nodes/media.d.ts +22 -90
- package/dist/_dts/blocks/src/system/runtime/nodes/mediaContext.d.ts +69 -0
- package/dist/_dts/blocks/src/system/runtime/nodes/newsletter-form.interactive.d.ts +8 -72
- package/dist/_dts/blocks/src/system/runtime/nodes/newsletter-form.parts.d.ts +6 -6
- package/dist/_dts/blocks/src/system/runtime/nodes/newsletter-form.types.d.ts +3 -2
- package/dist/_dts/blocks/src/system/runtime/nodes/shared/contract-schemas.d.ts +2 -2
- package/dist/_dts/blocks/src/system/transforms/registry/_utils/surfaceForegroundStyles.d.ts +3 -0
- package/dist/_dts/blocks/src/system/transforms/registry/footerArrangement.d.ts +6 -0
- package/dist/_dts/blocks/src/system/transforms/registry/index.d.ts +1 -0
- package/dist/_dts/blocks/src/system/transforms/registry/layout.d.ts +0 -11
- package/dist/_dts/blocks/src/system/transforms/registry/links.d.ts +3 -3
- package/dist/_dts/blocks/src/system/transforms/typed.d.ts +1 -10
- package/dist/_dts/commerce/src/purchase/orderConfirmationPlanning.d.ts +1 -0
- package/dist/_dts/content-editor/src/FooterComposerOverview.d.ts +5 -2
- package/dist/_dts/content-editor/src/FooterComposerPanel.d.ts +1 -1
- package/dist/_dts/content-editor/src/FooterNavigationLayoutControl.d.ts +6 -3
- package/dist/_dts/content-editor/src/controller/editorLeaseParticipation.d.ts +1 -1
- package/dist/_dts/content-editor/src/footerComposer.d.ts +2 -1
- package/dist/_dts/content-editor/src/footerComposerPanelTypes.d.ts +3 -1
- package/dist/_dts/content-editor/src/footerNavigationLayoutState.d.ts +56 -0
- package/dist/_dts/content-editor/src/footerPreviewRuntime.d.ts +2 -1
- package/dist/_dts/content-editor/src/useFooterComposerState.d.ts +3 -4
- package/dist/_dts/content-editor/src/useFooterNavigationLayout.d.ts +11 -8
- package/dist/_dts/content-model/src/content-types/schema.d.ts +3 -3
- package/dist/_dts/core/src/booking-refunds.d.ts +2 -0
- package/dist/_dts/core/src/date-display.d.ts +85 -0
- package/dist/_dts/core/src/date-time-formatter.d.ts +2 -0
- package/dist/_dts/core/src/footer-arrangement.d.ts +8 -1
- package/dist/_dts/core/src/footer-composition-types.d.ts +6 -1
- package/dist/_dts/core/src/footer-composition.d.ts +1 -1
- package/dist/_dts/core/src/footer-navigation-layout.d.ts +3 -0
- package/dist/_dts/core/src/index.d.ts +2 -0
- package/dist/_dts/core/src/mailing-list-runtime.d.ts +2 -2
- package/dist/_dts/core/src/mailing-list-setup-parser.d.ts +9 -1
- package/dist/_dts/core/src/mailing-list-setup.d.ts +12 -1
- package/dist/_dts/core/src/mailing-list-submission.d.ts +7 -2
- package/dist/_dts/core/src/mailing-list-targeting.d.ts +9 -1
- package/dist/_dts/core/src/public-profile.d.ts +3 -1
- package/dist/_dts/core/src/scheduled-date-time.d.ts +69 -0
- package/dist/_dts/db/src/generated/supabase/database.types.d.ts +105 -13
- package/dist/_dts/db/src/schemas/forms.d.ts +16 -16
- package/dist/_dts/editor-blocks/src/index.d.ts +1 -0
- package/dist/_dts/editor-blocks/src/media/MediaField.d.ts +2 -2
- package/dist/_dts/editor-blocks/src/media/admitEditorMediaField.d.ts +4 -0
- package/dist/_dts/editor-blocks/src/widgets/mailing-list-targeting/targetingState.d.ts +2 -2
- package/dist/_dts/media-core/src/assetsInUseSummary.d.ts +6 -0
- package/dist/_dts/media-core/src/contentMediaAudit.d.ts +3 -2
- package/dist/_dts/media-core/src/index.d.ts +4 -0
- package/dist/_dts/media-core/src/media.d.ts +406 -0
- package/dist/_dts/media-core/src/mediaIdentifierSchema.d.ts +3 -0
- package/dist/_dts/media-core/src/mediaKinds.d.ts +2 -0
- package/dist/_dts/media-core/src/mediaUsageProjection.d.ts +13 -1
- package/dist/_dts/media-core/src/mediaWriteNormalizer.d.ts +2 -6
- package/dist/_dts/media-core/src/portableMediaReferences.d.ts +8 -21
- package/dist/_dts/media-core/src/renderableMediaAsset.d.ts +28 -14
- package/dist/_dts/media-core/src/renderableMediaAssetAdmission.d.ts +15 -0
- package/dist/_dts/media-editor/src/CropDialog.d.ts +6 -3
- package/dist/_dts/media-editor/src/MediaEditor.d.ts +2 -1
- package/dist/_dts/media-editor/src/MediaPreview.d.ts +3 -3
- package/dist/_dts/media-editor/src/cropEditorSource.d.ts +5 -7
- package/dist/_dts/media-editor/src/editorMediaState.d.ts +29 -0
- package/dist/_dts/media-editor/src/mediaSelection.d.ts +1 -2
- package/dist/_dts/media-editor/src/runtimeMediaAssetState.d.ts +4 -5
- package/dist/_dts/media-editor/src/types.d.ts +1 -1
- package/dist/_dts/media-editor/src/utils.d.ts +0 -1
- package/dist/_dts/media-react/src/components/cropChangePolicy.d.ts +4 -1
- package/dist/_dts/media-react/src/components/cropGeometry.d.ts +1 -0
- package/dist/_dts/media-react/src/components/useImageCropperController.d.ts +1 -0
- package/dist/_dts/preview-next/src/client/blocks/ArrangementBlockToolbar.d.ts +2 -1
- package/dist/_dts/preview-next/src/client/blocks/BlockBackgroundChooser.d.ts +2 -1
- package/dist/_dts/preview-next/src/client/blocks/previewCustomizeSelectedMedia.d.ts +11 -12
- package/dist/_dts/preview-next/src/client/preview/PreviewShell.d.ts +1 -0
- package/dist/_dts/preview-next/src/client/preview/PreviewShellLayout.d.ts +1 -0
- package/dist/_dts/preview-next/src/client/preview/SiteChromeCustomizeContext.d.ts +4 -1
- package/dist/_dts/preview-next/src/client/preview/siteChromeSavePlan.d.ts +27 -5
- package/dist/_dts/preview-next/src/client/preview/siteStylePreviewPlanner.d.ts +2 -0
- package/dist/_dts/preview-next/src/client/preview/useConfirmedPreferenceRecord.d.ts +12 -0
- package/dist/_dts/preview-next/src/client/preview/usePersistedFooterPreferences.d.ts +26 -0
- package/dist/_dts/preview-next/src/client/preview/usePersistedHeaderPreferences.d.ts +40 -2
- package/dist/_dts/sdk/src/config/validation.d.ts +3 -3
- package/dist/_dts/sdk/src/contracts/content.d.ts +2 -45
- package/dist/_dts/sdk/src/contracts/index.d.ts +1 -1
- package/dist/_dts/sdk/src/contracts/rendering.d.ts +3 -3
- package/dist/_dts/sdk/src/contracts/system-block-content.d.ts +4 -46
- package/dist/_dts/sdk/src/date-time/index.d.ts +2 -68
- package/dist/_dts/sdk/src/index.d.ts +1 -0
- package/dist/_dts/sdk/src/public-api/contracts.d.ts +1 -0
- package/dist/_dts/sdk/src/rendering/image.d.ts +5 -5
- package/dist/_dts/sdk/src/rendering/index.d.ts +2 -1
- package/dist/_dts/sdk/src/rendering/islands/types.d.ts +1 -1
- package/dist/_dts/sdk/src/rendering/link.d.ts +3 -7
- package/dist/_dts/sdk/src/rendering/mediaAssets.d.ts +2 -4
- package/dist/_dts/sdk/src/version.d.ts +1 -1
- package/dist/_dts/theme-core/src/accordions/types.d.ts +1 -1
- package/dist/_dts/theme-core/src/boxBackgroundSchema.d.ts +397 -26
- package/dist/_dts/theme-core/src/buttons/buttonColourContract.d.ts +2 -0
- package/dist/_dts/theme-core/src/buttons/resolveButtonColourStates.d.ts +2 -0
- package/dist/_dts/theme-core/src/buttons/styles/recipes/lanternRecipes.d.ts +60 -0
- package/dist/_dts/theme-core/src/buttons/styles/registry.d.ts +57 -0
- package/dist/_dts/theme-core/src/buttons/styles/selection.d.ts +10 -1
- package/dist/_dts/theme-core/src/buttons/types.d.ts +378 -66
- package/dist/_dts/theme-core/src/buttons/typography.d.ts +24 -0
- package/dist/_dts/theme-core/src/cards/types.d.ts +42 -42
- package/dist/_dts/theme-core/src/footer/effectiveNavLinkStyle.d.ts +1 -1
- package/dist/_dts/theme-core/src/footer/generateFooterCss.d.ts +4 -1
- package/dist/_dts/theme-core/src/footer/mode.d.ts +2 -11
- package/dist/_dts/theme-core/src/generated/containerResponsiveThemeCss.d.ts +1 -1
- package/dist/_dts/theme-core/src/inputs/types.d.ts +3 -3
- package/dist/_dts/theme-core/src/lib/media.d.ts +2 -616
- package/dist/_dts/theme-core/src/mock-themes/all.d.ts +495 -2766
- package/dist/_dts/theme-core/src/navigation/types.d.ts +4 -4
- package/dist/_dts/theme-core/src/palette/curated/types.d.ts +1 -1
- package/dist/_dts/theme-core/src/schema.d.ts +838 -3369
- package/dist/_dts/theme-core/src/site-styles/appearancePresetTypes.d.ts +23 -7
- package/dist/_dts/theme-core/src/site-styles/backgroundAppearance.d.ts +2 -2
- package/dist/_dts/theme-core/src/site-styles/compilationPlan.d.ts +4 -6
- package/dist/_dts/theme-core/src/site-styles/compileFooterAgainstRow.d.ts +121 -0
- package/dist/_dts/theme-core/src/site-styles/curatedSiteStyles.d.ts +25 -0
- package/dist/_dts/theme-core/src/site-styles/footerLookDefaults.d.ts +45 -0
- package/dist/_dts/theme-core/src/site-styles/footerLookRecipe.d.ts +50 -0
- package/dist/_dts/theme-core/src/site-styles/footerLooks.d.ts +9 -35
- package/dist/_dts/theme-core/src/site-styles/footerPreferences.d.ts +29 -0
- package/dist/_dts/theme-core/src/site-styles/headerPreferencesPersistence.d.ts +2 -3
- package/dist/_dts/theme-core/src/site-styles/index.d.ts +4 -0
- package/dist/_dts/theme-core/src/site-styles/lookResolution.d.ts +2 -2
- package/dist/_dts/theme-core/src/site-styles/previewCompiler.d.ts +1 -1
- package/dist/_dts/theme-core/src/site-styles/runtimeBackgroundResolution.d.ts +9 -9
- package/dist/_dts/theme-core/src/site-styles/siteChromeBackgrounds.d.ts +8 -0
- package/dist/_dts/theme-core/src/site-styles/styleTags.d.ts +1 -1
- package/dist/_dts/theme-core/src/site-styles/themeParity.d.ts +1 -1
- package/dist/_dts/theme-core/src/site-styles/tokenRecipes.d.ts +2 -2
- package/dist/_dts/theme-core/src/styles/skinTokens.d.ts +2 -2
- package/dist/_dts/theme-core/src/typography/schema.d.ts +2 -2
- package/dist/_dts/ui/src/card.d.ts +1 -1
- package/dist/client/{BookingMailingListNote-CBuMKN0w.mjs → BookingMailingListNote-CNoSqFtf.mjs} +2 -2
- package/dist/client/{CardListItem-Dc9XTXhB.mjs → CardListItem-BkTkqBkh.mjs} +5 -4
- package/dist/client/{CheckboxChoice-CIqx_o0E.mjs → CheckboxChoice-CHJpsty4.mjs} +1 -1
- package/dist/client/{DemoBookingPortalAccess-D3VQ_kLj.mjs → DemoBookingPortalAccess-C7KQKFNt.mjs} +2 -2
- package/dist/client/{EventCombined.client-BHGEKise.mjs → EventCombined.client-BgeYMjHJ.mjs} +5 -6
- package/dist/client/{EventEmbeddedCheckoutStep-Bo1Cm23R.mjs → EventEmbeddedCheckoutStep-BTc_lTkM.mjs} +2 -2
- package/dist/client/{EventListing.client-D5OQgVPr.mjs → EventListing.client-ChRs9Hl2.mjs} +2 -2
- package/dist/client/{LeafletStaticMap-CLL5cWrr.mjs → LeafletStaticMap-C_dNQgd0.mjs} +1 -1
- package/dist/client/{RichText-BoDmnopf.mjs → RichText-BI9bzbjo.mjs} +106 -60
- package/dist/client/{ThemedButton-Ciltp0IK.mjs → ThemedButton-wl3Z3wkH.mjs} +1 -2
- package/dist/client/{accordion-DOkRS64-.mjs → accordion-6Yz8Wd83.mjs} +1 -1
- package/dist/client/{bookingForm-wlMVwo9h.mjs → bookingForm-i_pKIGiY.mjs} +42 -15
- package/dist/client/bookings.mjs +118357 -22833
- package/dist/client/{carousel-CGWk-Z0u.mjs → carousel-DNqd_PjC.mjs} +2 -2
- package/dist/client/{carousel.client-kX5mN1Eg.mjs → carousel.client-BUgjPbb6.mjs} +1 -1
- package/dist/client/{cart-OBBPlaH4.mjs → cart-D8OBHuF4.mjs} +3 -3
- package/dist/client/{checkout-Bmw2WjQX.mjs → checkout-F3-9IGLU.mjs} +3 -3
- package/dist/client/client.mjs +20785 -19238
- package/dist/client/{context-BI77UFAn.mjs → context-Dg4ZrxDD.mjs} +1 -1
- package/dist/client/{eventCalendar-qkej2Edn.mjs → eventCalendar-BUc7YIBM.mjs} +8 -9
- package/dist/client/{eventCombined-DApKHvat.mjs → eventCombined-BwfShk2a.mjs} +4 -4
- package/dist/client/{eventDetails-BQyUDPH0.mjs → eventDetails-BMOVC3go.mjs} +3 -3
- package/dist/client/{eventListing-CeAnshlZ.mjs → eventListing-BwE9PM-t.mjs} +4 -4
- package/dist/client/{eventRegistration-C3A3NyBO.mjs → eventRegistration-CCWPYDc7.mjs} +10 -10
- package/dist/client/{form-DW8rU7jO.mjs → form-CXFr0Gd5.mjs} +115 -52
- package/dist/client/{headerSection-CkIhsoNm.mjs → headerSection-BX8qw8kH.mjs} +3 -3
- package/dist/client/hooks.mjs +17908 -16797
- package/dist/client/{locationMap-D4O8wbli.mjs → locationMap-B3La71m0.mjs} +3 -4
- package/dist/client/{media-C5K_0xPd.mjs → media-B1Cbv721.mjs} +183 -362
- package/dist/client/mediaContext-CwbbimYB.mjs +135 -0
- package/dist/client/{newsletterForm-B7IxSPuz.mjs → newsletterForm-DnGyR0x7.mjs} +51 -15
- package/dist/client/{productDetail-Bqxpwy5N.mjs → productDetail-BVgTqvkb.mjs} +3 -3
- package/dist/client/{productList-u9Lz8V15.mjs → productList-CcO7kUQw.mjs} +3 -3
- package/dist/client/{propsDecoder-Bf1jucUp.mjs → propsDecoder-B1OeWavE.mjs} +2193 -374
- package/dist/client/renderableMediaAssetAdmission-CHkXYDC_.mjs +143 -0
- package/dist/client/rendering/client.mjs +22424 -21488
- package/dist/client/rendering/islands.mjs +20 -23
- package/dist/client/rendering.mjs +21025 -19413
- package/dist/client/{routeIslandApiConfig-BgP-aPMl.mjs → routeIslandApiConfig-Dl4vglJm.mjs} +1 -1
- package/dist/client/{shop-B_eykR-_.mjs → shop-P72nX5Fs.mjs} +7 -7
- package/dist/client/{shop-commerce-CT0APkFV.mjs → shop-commerce-Bt7uraDx.mjs} +8 -8
- package/dist/client/{shop-commerce-store-DcvZxdEK.mjs → shop-commerce-store-C1-mxSye.mjs} +1 -1
- package/dist/client/{shopShared-BVJOiUiJ.mjs → shopShared-Db-cRGu3.mjs} +5 -5
- package/dist/client/{useDiscountCodeUi-DPmYDunz.mjs → useDiscountCodeUi-jvAiUoUX.mjs} +1 -1
- package/dist/client/{useEventPagination-8-U55vH5.mjs → useEventPagination-BdWpCniq.mjs} +6 -7
- package/dist/preview-next/before-render.mjs +222 -55
- package/dist/preview-next/client/runtime.mjs +3 -3
- package/dist/preview-next/editor-chrome.css +5 -2
- package/dist/preview-next/keepAlive.mjs +133 -51
- package/dist/preview-next/middleware.mjs +133 -51
- package/dist/{sdk-runtime-C5jPdSrk.mjs → sdk-runtime-DLhjF2Nw.mjs} +1 -1
- package/dist/server/components.mjs +21541 -20118
- package/dist/server/config-validation.mjs +2466 -1403
- package/dist/server/config.mjs +2466 -1403
- package/dist/server/data.mjs +17842 -16759
- package/dist/server/date-time.mjs +258 -116
- package/dist/server/index.mjs +360 -53
- package/dist/server/next.mjs +21913 -20539
- package/dist/server/page-converter.mjs +8121 -7322
- package/dist/server/prebuild.mjs +1 -1
- package/dist/server/rendering/server.mjs +21196 -19760
- package/dist/server/rendering.mjs +21554 -20123
- package/dist/server/routing.mjs +19806 -18607
- package/dist/server/server.mjs +2907 -1845
- package/dist/server/theme-bridge.mjs +991 -160
- package/dist/server/theme.mjs +501 -100
- package/dist/{spinner-B-ab2rJp.mjs → spinner-MTooKfck.mjs} +1 -1
- package/dist/styles/index.css +254 -1
- package/package.json +1 -1
- package/dist/_dts/blocks/src/system/blocks/events/shared/layout.d.ts +0 -12
- package/dist/client/aspectTransforms-D-TnDdq4.mjs +0 -93
- package/dist/client/colorStyles-ECDNPE_P.mjs +0 -1253
|
@@ -1,1253 +0,0 @@
|
|
|
1
|
-
import { z } from "zod";
|
|
2
|
-
//#region ../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
|
|
3
|
-
function r(e) {
|
|
4
|
-
var t, f, n = "";
|
|
5
|
-
if ("string" == typeof e || "number" == typeof e) n += e;
|
|
6
|
-
else if ("object" == typeof e) if (Array.isArray(e)) {
|
|
7
|
-
var o = e.length;
|
|
8
|
-
for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
|
|
9
|
-
} else for (f in e) e[f] && (n && (n += " "), n += f);
|
|
10
|
-
return n;
|
|
11
|
-
}
|
|
12
|
-
function clsx() {
|
|
13
|
-
for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
|
|
14
|
-
return n;
|
|
15
|
-
}
|
|
16
|
-
//#endregion
|
|
17
|
-
//#region ../core/src/result.ts
|
|
18
|
-
function ok(value) {
|
|
19
|
-
return {
|
|
20
|
-
ok: true,
|
|
21
|
-
value
|
|
22
|
-
};
|
|
23
|
-
}
|
|
24
|
-
function err(error) {
|
|
25
|
-
return {
|
|
26
|
-
ok: false,
|
|
27
|
-
error
|
|
28
|
-
};
|
|
29
|
-
}
|
|
30
|
-
//#endregion
|
|
31
|
-
//#region ../theme-core/src/surfaces/foregroundContract.ts
|
|
32
|
-
const SURFACE_FOREGROUND_CSS_VARS = {
|
|
33
|
-
text: "--rb-surface-text-color",
|
|
34
|
-
heading: "--rb-surface-heading-color",
|
|
35
|
-
link: "--rb-surface-link-color",
|
|
36
|
-
linkHover: "--rb-surface-link-hover-color",
|
|
37
|
-
supporting: "--rb-surface-supporting-color",
|
|
38
|
-
muted: "--rb-surface-muted-color",
|
|
39
|
-
line: "--rb-surface-line-color",
|
|
40
|
-
mark: "--rb-surface-mark-color"
|
|
41
|
-
};
|
|
42
|
-
const DEFAULT_SURFACE_TEXT_COLOR = "rgb(var(--tb-text, 17 24 39))";
|
|
43
|
-
const DEFAULT_SURFACE_LINK_COLOR = "rgb(var(--tb-primary, var(--tb-text, 17 24 39)))";
|
|
44
|
-
const DEFAULT_SURFACE_SUPPORTING_COLOR = "rgb(var(--tb-mutedText, 100 116 139))";
|
|
45
|
-
const DEFAULT_ROLE_FALLBACKS = {
|
|
46
|
-
text: DEFAULT_SURFACE_TEXT_COLOR,
|
|
47
|
-
heading: DEFAULT_SURFACE_TEXT_COLOR,
|
|
48
|
-
link: DEFAULT_SURFACE_LINK_COLOR,
|
|
49
|
-
linkHover: DEFAULT_SURFACE_LINK_COLOR,
|
|
50
|
-
supporting: DEFAULT_SURFACE_SUPPORTING_COLOR,
|
|
51
|
-
muted: DEFAULT_SURFACE_SUPPORTING_COLOR
|
|
52
|
-
};
|
|
53
|
-
function requireSurfaceColorValue(role, value) {
|
|
54
|
-
const normalized = value.trim();
|
|
55
|
-
if (normalized.length === 0) throw new RangeError(`Surface foreground ${role} must be a non-empty CSS color.`);
|
|
56
|
-
return normalized;
|
|
57
|
-
}
|
|
58
|
-
function completeSurfaceForegrounds(input) {
|
|
59
|
-
const text = requireSurfaceColorValue("text", input.text);
|
|
60
|
-
const link = input.link === void 0 ? text : requireSurfaceColorValue("link", input.link);
|
|
61
|
-
return {
|
|
62
|
-
text,
|
|
63
|
-
heading: input.heading === void 0 ? text : requireSurfaceColorValue("heading", input.heading),
|
|
64
|
-
link,
|
|
65
|
-
linkHover: input.linkHover === void 0 ? link : requireSurfaceColorValue("linkHover", input.linkHover),
|
|
66
|
-
muted: input.muted === void 0 ? text : requireSurfaceColorValue("muted", input.muted),
|
|
67
|
-
supporting: input.supporting === void 0 ? text : requireSurfaceColorValue("supporting", input.supporting)
|
|
68
|
-
};
|
|
69
|
-
}
|
|
70
|
-
function surfaceForegroundValue(role, outsideProviderFallback = DEFAULT_ROLE_FALLBACKS[role]) {
|
|
71
|
-
const roleVariable = SURFACE_FOREGROUND_CSS_VARS[role];
|
|
72
|
-
const fallback = requireSurfaceColorValue("fallback", outsideProviderFallback);
|
|
73
|
-
if (role === "text") return `var(${roleVariable}, ${fallback})`;
|
|
74
|
-
if (role === "linkHover") return `var(${roleVariable}, ${surfaceForegroundValue("link", fallback)})`;
|
|
75
|
-
return `var(${roleVariable}, var(${SURFACE_FOREGROUND_CSS_VARS.text}, ${fallback}))`;
|
|
76
|
-
}
|
|
77
|
-
function surfaceForegroundValueWithOpacity(role, opacityPercent) {
|
|
78
|
-
if (!Number.isFinite(opacityPercent) || opacityPercent < 0 || opacityPercent > 100) throw new RangeError("Surface foreground opacity must be between 0 and 100.");
|
|
79
|
-
return `color-mix(in srgb, ${surfaceForegroundValue(role)} ${opacityPercent}%, transparent)`;
|
|
80
|
-
}
|
|
81
|
-
function surfaceForegroundStyle(input) {
|
|
82
|
-
const foregrounds = completeSurfaceForegrounds(input);
|
|
83
|
-
return {
|
|
84
|
-
color: foregrounds.text,
|
|
85
|
-
[SURFACE_FOREGROUND_CSS_VARS.text]: foregrounds.text,
|
|
86
|
-
[SURFACE_FOREGROUND_CSS_VARS.heading]: foregrounds.heading,
|
|
87
|
-
[SURFACE_FOREGROUND_CSS_VARS.link]: foregrounds.link,
|
|
88
|
-
[SURFACE_FOREGROUND_CSS_VARS.linkHover]: foregrounds.linkHover,
|
|
89
|
-
[SURFACE_FOREGROUND_CSS_VARS.supporting]: foregrounds.supporting,
|
|
90
|
-
...input.muted === void 0 ? {} : { [SURFACE_FOREGROUND_CSS_VARS.muted]: foregrounds.muted },
|
|
91
|
-
"--rb-surface-link-hover-decoration": hoverDecoration(input)
|
|
92
|
-
};
|
|
93
|
-
}
|
|
94
|
-
function surfaceForegroundDeclarations(input) {
|
|
95
|
-
return Object.entries(surfaceForegroundStyle(input)).map(([property, value]) => `${property}: ${value};`);
|
|
96
|
-
}
|
|
97
|
-
function hoverDecoration(input) {
|
|
98
|
-
return input.hoverDecoration ?? "underline";
|
|
99
|
-
}
|
|
100
|
-
//#endregion
|
|
101
|
-
//#region ../theme-core/src/palette/utils/colorConversion.ts
|
|
102
|
-
function hexToRgb(hex) {
|
|
103
|
-
const h = hex.replace(/^#/, "");
|
|
104
|
-
const m = h.length === 3 ? h.split("").map((c) => c + c).join("") : h;
|
|
105
|
-
if (m.length !== 6) throw new Error("Bad hex");
|
|
106
|
-
const int = parseInt(m, 16);
|
|
107
|
-
return {
|
|
108
|
-
r: int >> 16 & 255,
|
|
109
|
-
g: int >> 8 & 255,
|
|
110
|
-
b: int & 255
|
|
111
|
-
};
|
|
112
|
-
}
|
|
113
|
-
function srgbToLinear(u) {
|
|
114
|
-
const x = u / 255;
|
|
115
|
-
return x <= .04045 ? x / 12.92 : Math.pow((x + .055) / 1.055, 2.4);
|
|
116
|
-
}
|
|
117
|
-
//#endregion
|
|
118
|
-
//#region ../theme-core/src/palette/utils/contrast.ts
|
|
119
|
-
function relativeLuminance(r, g, b) {
|
|
120
|
-
const R = srgbToLinear(r), G = srgbToLinear(g), B = srgbToLinear(b);
|
|
121
|
-
return .2126 * R + .7152 * G + .0722 * B;
|
|
122
|
-
}
|
|
123
|
-
//#endregion
|
|
124
|
-
//#region ../theme-core/src/tokens/colorTokenParts.ts
|
|
125
|
-
function parseOpacityPercent(source) {
|
|
126
|
-
const trimmed = source.trim();
|
|
127
|
-
if (!trimmed) return null;
|
|
128
|
-
if (!/^\d{1,3}(?:\.\d+)?$/.test(trimmed)) return null;
|
|
129
|
-
const value = Number(trimmed);
|
|
130
|
-
if (!Number.isFinite(value)) return null;
|
|
131
|
-
if (value < 0 || value > 100) return null;
|
|
132
|
-
return value;
|
|
133
|
-
}
|
|
134
|
-
function parseColorTokenParts(source) {
|
|
135
|
-
const trimmed = source.trim();
|
|
136
|
-
if (trimmed.startsWith("raw:")) return {
|
|
137
|
-
kind: "raw",
|
|
138
|
-
value: trimmed.slice(4)
|
|
139
|
-
};
|
|
140
|
-
const [token, opacityRaw, extra] = trimmed.split("/");
|
|
141
|
-
if (!token || extra !== void 0) return {
|
|
142
|
-
kind: "invalid",
|
|
143
|
-
token: trimmed
|
|
144
|
-
};
|
|
145
|
-
if (opacityRaw === void 0) return {
|
|
146
|
-
kind: "token",
|
|
147
|
-
token,
|
|
148
|
-
opacityPercent: null
|
|
149
|
-
};
|
|
150
|
-
const opacityPercent = parseOpacityPercent(opacityRaw);
|
|
151
|
-
if (opacityPercent === null) return {
|
|
152
|
-
kind: "invalid",
|
|
153
|
-
token: trimmed
|
|
154
|
-
};
|
|
155
|
-
return {
|
|
156
|
-
kind: "token",
|
|
157
|
-
token,
|
|
158
|
-
opacityPercent
|
|
159
|
-
};
|
|
160
|
-
}
|
|
161
|
-
//#endregion
|
|
162
|
-
//#region ../theme-core/src/tokens/blockColorTokens.ts
|
|
163
|
-
const blockColorTokenNames = [
|
|
164
|
-
"text",
|
|
165
|
-
"heading",
|
|
166
|
-
"mutedText",
|
|
167
|
-
"surface",
|
|
168
|
-
"background",
|
|
169
|
-
"foreground",
|
|
170
|
-
"border",
|
|
171
|
-
"primary",
|
|
172
|
-
"secondary",
|
|
173
|
-
"accent",
|
|
174
|
-
"success",
|
|
175
|
-
"warning",
|
|
176
|
-
"info",
|
|
177
|
-
"error",
|
|
178
|
-
"destructive",
|
|
179
|
-
"scrim",
|
|
180
|
-
"shadow",
|
|
181
|
-
"onPrimary",
|
|
182
|
-
"onSecondary",
|
|
183
|
-
"onAccent",
|
|
184
|
-
"onSuccess",
|
|
185
|
-
"onWarning",
|
|
186
|
-
"onInfo",
|
|
187
|
-
"onError",
|
|
188
|
-
"onDestructive",
|
|
189
|
-
"onSurface",
|
|
190
|
-
"onText"
|
|
191
|
-
];
|
|
192
|
-
new Set(blockColorTokenNames);
|
|
193
|
-
//#endregion
|
|
194
|
-
//#region ../theme-core/src/tokens/themeColorTokens.ts
|
|
195
|
-
/**
|
|
196
|
-
* Known palette role token names. This is the low-level source of truth for
|
|
197
|
-
* palette roles used by palette variants, Theme V2 schemas, and runtime color
|
|
198
|
-
* reference parsing.
|
|
199
|
-
*/
|
|
200
|
-
const PALETTE_TOKEN_NAMES = [
|
|
201
|
-
"primary",
|
|
202
|
-
"primaryForeground",
|
|
203
|
-
"secondary",
|
|
204
|
-
"accent",
|
|
205
|
-
"success",
|
|
206
|
-
"warning",
|
|
207
|
-
"destructive",
|
|
208
|
-
"background",
|
|
209
|
-
"surface",
|
|
210
|
-
"surfaceAlt",
|
|
211
|
-
"muted",
|
|
212
|
-
"text",
|
|
213
|
-
"border"
|
|
214
|
-
];
|
|
215
|
-
const paletteTokenNameSchema = z.enum(PALETTE_TOKEN_NAMES);
|
|
216
|
-
const themeColorBaseTokenNames = [
|
|
217
|
-
...PALETTE_TOKEN_NAMES,
|
|
218
|
-
...blockColorTokenNames,
|
|
219
|
-
"white",
|
|
220
|
-
"neutral",
|
|
221
|
-
"primaryText",
|
|
222
|
-
"secondaryForeground",
|
|
223
|
-
"accentForeground"
|
|
224
|
-
];
|
|
225
|
-
const themeColorBaseTokenSet = new Set(themeColorBaseTokenNames);
|
|
226
|
-
const themeColorShadeSteps = [
|
|
227
|
-
"50",
|
|
228
|
-
"100",
|
|
229
|
-
"200",
|
|
230
|
-
"300",
|
|
231
|
-
"400",
|
|
232
|
-
"500",
|
|
233
|
-
"600",
|
|
234
|
-
"700",
|
|
235
|
-
"800",
|
|
236
|
-
"900",
|
|
237
|
-
"950"
|
|
238
|
-
];
|
|
239
|
-
const shadeStepSet = new Set(themeColorShadeSteps);
|
|
240
|
-
function isKnownBaseToken(value) {
|
|
241
|
-
return themeColorBaseTokenSet.has(value);
|
|
242
|
-
}
|
|
243
|
-
function isKnownShadeToken(value) {
|
|
244
|
-
const match = value.match(/^([a-zA-Z][a-zA-Z0-9]*)(?:-([0-9]{2,3}))$/);
|
|
245
|
-
if (!match) return false;
|
|
246
|
-
const [, base, shade] = match;
|
|
247
|
-
return Boolean(base && shade && isKnownBaseToken(base) && shadeStepSet.has(shade));
|
|
248
|
-
}
|
|
249
|
-
function isThemeColorTokenBase(value) {
|
|
250
|
-
return isKnownBaseToken(value) || isKnownShadeToken(value);
|
|
251
|
-
}
|
|
252
|
-
function isThemeColorToken(value) {
|
|
253
|
-
if (typeof value !== "string") return false;
|
|
254
|
-
const parts = parseColorTokenParts(value);
|
|
255
|
-
return parts.kind === "token" && isThemeColorTokenBase(parts.token);
|
|
256
|
-
}
|
|
257
|
-
function parseThemeColorToken(value) {
|
|
258
|
-
if (!isThemeColorToken(value)) return null;
|
|
259
|
-
return value.trim();
|
|
260
|
-
}
|
|
261
|
-
const themeColorTokenSchema = z.string().min(1).refine((value) => Boolean(isThemeColorToken(value)), "Expected a known Theme V2 color token");
|
|
262
|
-
//#endregion
|
|
263
|
-
//#region ../theme-core/src/palette/colors.ts
|
|
264
|
-
const HEX_COLOR_REGEX = /^#[0-9a-f]{6}$/;
|
|
265
|
-
const NORMALIZABLE_HEX_REGEX = /^#(?:[0-9a-f]{3}|[0-9a-f]{6})$/i;
|
|
266
|
-
const THEME_PALETTE_COLOR_ORDER = [
|
|
267
|
-
"primary",
|
|
268
|
-
"secondary",
|
|
269
|
-
"accent",
|
|
270
|
-
"success",
|
|
271
|
-
"warning",
|
|
272
|
-
"destructive",
|
|
273
|
-
"background",
|
|
274
|
-
"surface",
|
|
275
|
-
"surfaceAlt",
|
|
276
|
-
"muted",
|
|
277
|
-
"text",
|
|
278
|
-
"primaryForeground",
|
|
279
|
-
"border"
|
|
280
|
-
];
|
|
281
|
-
const hexColorSchema = z.string().regex(HEX_COLOR_REGEX, "Hex must be #RRGGBB (lowercase)").transform((value) => value);
|
|
282
|
-
const paletteModeSchema = z.enum(["light", "dark"]);
|
|
283
|
-
const PALETTE_VALUE_KEY_PREFIX = "palette-value:v1|";
|
|
284
|
-
z.string().regex(/^[0-9a-f]{64}$/, "Palette hash must be a lowercase SHA-256 value").transform((value) => value);
|
|
285
|
-
const paletteColorsSchema = z.object({
|
|
286
|
-
primary: hexColorSchema,
|
|
287
|
-
primaryForeground: hexColorSchema,
|
|
288
|
-
secondary: hexColorSchema,
|
|
289
|
-
accent: hexColorSchema,
|
|
290
|
-
success: hexColorSchema,
|
|
291
|
-
warning: hexColorSchema,
|
|
292
|
-
destructive: hexColorSchema,
|
|
293
|
-
background: hexColorSchema,
|
|
294
|
-
surface: hexColorSchema,
|
|
295
|
-
surfaceAlt: hexColorSchema,
|
|
296
|
-
muted: hexColorSchema,
|
|
297
|
-
text: hexColorSchema,
|
|
298
|
-
border: hexColorSchema
|
|
299
|
-
}).strict().transform((value) => value);
|
|
300
|
-
function normalizePaletteHex(value) {
|
|
301
|
-
if (!NORMALIZABLE_HEX_REGEX.test(value)) return null;
|
|
302
|
-
const normalized = value.toLowerCase();
|
|
303
|
-
if (normalized.length === 7) return normalized;
|
|
304
|
-
const triplet = normalized.slice(1);
|
|
305
|
-
const red = triplet.charAt(0);
|
|
306
|
-
const green = triplet.charAt(1);
|
|
307
|
-
const blue = triplet.charAt(2);
|
|
308
|
-
return `#${red}${red}${green}${green}${blue}${blue}`;
|
|
309
|
-
}
|
|
310
|
-
function paletteColorsFromEntries(entries) {
|
|
311
|
-
const values = {};
|
|
312
|
-
for (const entry of entries) {
|
|
313
|
-
const parsedRole = paletteTokenNameSchema.safeParse(entry.name);
|
|
314
|
-
if (!parsedRole.success) return {
|
|
315
|
-
ok: false,
|
|
316
|
-
error: {
|
|
317
|
-
kind: "unknown-role",
|
|
318
|
-
role: entry.name
|
|
319
|
-
}
|
|
320
|
-
};
|
|
321
|
-
const role = parsedRole.data;
|
|
322
|
-
if (values[role] !== void 0) return {
|
|
323
|
-
ok: false,
|
|
324
|
-
error: {
|
|
325
|
-
kind: "duplicate-role",
|
|
326
|
-
role
|
|
327
|
-
}
|
|
328
|
-
};
|
|
329
|
-
const hex = normalizePaletteHex(entry.hex);
|
|
330
|
-
if (!hex) return {
|
|
331
|
-
ok: false,
|
|
332
|
-
error: {
|
|
333
|
-
kind: "invalid-color",
|
|
334
|
-
role,
|
|
335
|
-
value: entry.hex
|
|
336
|
-
}
|
|
337
|
-
};
|
|
338
|
-
values[role] = hex;
|
|
339
|
-
}
|
|
340
|
-
const missing = PALETTE_TOKEN_NAMES.filter((role) => values[role] === void 0);
|
|
341
|
-
if (missing.length > 0) return {
|
|
342
|
-
ok: false,
|
|
343
|
-
error: {
|
|
344
|
-
kind: "missing-roles",
|
|
345
|
-
roles: missing
|
|
346
|
-
}
|
|
347
|
-
};
|
|
348
|
-
return {
|
|
349
|
-
ok: true,
|
|
350
|
-
colors: paletteColorsSchema.parse(values)
|
|
351
|
-
};
|
|
352
|
-
}
|
|
353
|
-
function requirePaletteColorsFromEntries(entries) {
|
|
354
|
-
const result = paletteColorsFromEntries(entries);
|
|
355
|
-
if (result.ok) return result.colors;
|
|
356
|
-
throw new Error(`Invalid complete palette: ${result.error.kind}`);
|
|
357
|
-
}
|
|
358
|
-
function paletteColorEntries(colors) {
|
|
359
|
-
return THEME_PALETTE_COLOR_ORDER.map((name) => ({
|
|
360
|
-
name,
|
|
361
|
-
hex: colors[name]
|
|
362
|
-
}));
|
|
363
|
-
}
|
|
364
|
-
function paletteColorFingerprint(colors) {
|
|
365
|
-
return PALETTE_TOKEN_NAMES.map((name) => `${name}:${colors[name]}`).join("|");
|
|
366
|
-
}
|
|
367
|
-
function canonicalPaletteHashInput(colors, mode) {
|
|
368
|
-
return `${mode}|${paletteColorFingerprint(colors)}`;
|
|
369
|
-
}
|
|
370
|
-
/**
|
|
371
|
-
* Stable curated-catalogue identity. Do not reorder roles: the order comes
|
|
372
|
-
* from PALETTE_TOKEN_NAMES through canonicalPaletteHashInput.
|
|
373
|
-
*/
|
|
374
|
-
function paletteValueKey(colors, mode) {
|
|
375
|
-
return `${PALETTE_VALUE_KEY_PREFIX}${canonicalPaletteHashInput(colors, mode)}`;
|
|
376
|
-
}
|
|
377
|
-
/** Parses only the exact v1 canonical form emitted by paletteValueKey. */
|
|
378
|
-
function parsePaletteValueKey(value) {
|
|
379
|
-
if (typeof value !== "string" || !value.startsWith(PALETTE_VALUE_KEY_PREFIX)) return null;
|
|
380
|
-
const [rawMode, ...rawRoles] = value.slice(17).split("|");
|
|
381
|
-
const mode = paletteModeSchema.safeParse(rawMode);
|
|
382
|
-
if (!mode.success || rawRoles.length !== PALETTE_TOKEN_NAMES.length) return null;
|
|
383
|
-
const colors = paletteColorsFromEntries(rawRoles.map((roleValue) => {
|
|
384
|
-
const separator = roleValue.indexOf(":");
|
|
385
|
-
return separator === -1 ? {
|
|
386
|
-
name: "",
|
|
387
|
-
hex: ""
|
|
388
|
-
} : {
|
|
389
|
-
name: roleValue.slice(0, separator),
|
|
390
|
-
hex: roleValue.slice(separator + 1)
|
|
391
|
-
};
|
|
392
|
-
}));
|
|
393
|
-
if (!colors.ok || paletteValueKey(colors.colors, mode.data) !== value) return null;
|
|
394
|
-
return value;
|
|
395
|
-
}
|
|
396
|
-
const paletteValueKeySchema = z.string().transform((value, ctx) => {
|
|
397
|
-
const parsed = parsePaletteValueKey(value);
|
|
398
|
-
if (parsed) return parsed;
|
|
399
|
-
ctx.addIssue({
|
|
400
|
-
code: "custom",
|
|
401
|
-
message: "Invalid canonical palette value key"
|
|
402
|
-
});
|
|
403
|
-
return z.NEVER;
|
|
404
|
-
});
|
|
405
|
-
//#endregion
|
|
406
|
-
//#region ../theme-core/src/buttons/types.ts
|
|
407
|
-
/**
|
|
408
|
-
* Standard semantic variant roles a theme exposes.
|
|
409
|
-
*
|
|
410
|
-
* Block content references variants by role; the active theme determines
|
|
411
|
-
* what each role looks like.
|
|
412
|
-
*/
|
|
413
|
-
const VARIANT_ROLES = [
|
|
414
|
-
"primary",
|
|
415
|
-
"secondary",
|
|
416
|
-
"outline",
|
|
417
|
-
"ghost",
|
|
418
|
-
"accent"
|
|
419
|
-
];
|
|
420
|
-
/**
|
|
421
|
-
* Canonical persisted/CSS-safe button variant identifier.
|
|
422
|
-
*
|
|
423
|
-
* IDs become class selectors, so keep the contract deliberately narrower than
|
|
424
|
-
* an arbitrary string and shared with every authoring/runtime boundary.
|
|
425
|
-
*/
|
|
426
|
-
const buttonVariantIdSchema = z.string().min(1).max(50).regex(/^[a-z0-9-]+$/, "Button variant IDs may contain lowercase letters, numbers, and hyphens only").refine((value) => value !== "link" && value !== "tertiary", { message: "Retired button role IDs are not valid variant IDs" });
|
|
427
|
-
/**
|
|
428
|
-
* Magic alias the CSS generator emits for the highest-priority variant.
|
|
429
|
-
*
|
|
430
|
-
* Shared between generator and renderer so neither side hard-codes the string.
|
|
431
|
-
*/
|
|
432
|
-
const DEFAULT_VARIANT_ALIAS_ID = "default";
|
|
433
|
-
function parseOpaqueButtonColourToken(value) {
|
|
434
|
-
const token = parseThemeColorToken(value);
|
|
435
|
-
if (token === null) return null;
|
|
436
|
-
const parts = parseColorTokenParts(token);
|
|
437
|
-
return parts.kind === "token" && parts.opacityPercent === null ? token : null;
|
|
438
|
-
}
|
|
439
|
-
function unsafeAsOpaqueButtonColourToken(value) {
|
|
440
|
-
return value;
|
|
441
|
-
}
|
|
442
|
-
const opaqueButtonColourTokenSchema = themeColorTokenSchema.refine((value) => parseOpaqueButtonColourToken(value) !== null, "Button colour tokens must be opaque").transform((value) => {
|
|
443
|
-
const token = parseOpaqueButtonColourToken(value);
|
|
444
|
-
if (token === null) throw new Error("Invariant: opaque button token passed its schema");
|
|
445
|
-
return token;
|
|
446
|
-
});
|
|
447
|
-
const contextualButtonHoverSchema = z.strictObject({
|
|
448
|
-
kind: z.literal("shade-shift"),
|
|
449
|
-
seedToken: opaqueButtonColourTokenSchema,
|
|
450
|
-
fallbackDirection: z.enum(["lighter", "darker"]),
|
|
451
|
-
preferredToken: opaqueButtonColourTokenSchema.optional()
|
|
452
|
-
});
|
|
453
|
-
const buttonShadeAmountSchema = z.number().finite().min(0).max(900).multipleOf(100);
|
|
454
|
-
const buttonShadowIntensitySchema = z.enum([
|
|
455
|
-
"subtle",
|
|
456
|
-
"medium",
|
|
457
|
-
"strong"
|
|
458
|
-
]);
|
|
459
|
-
/**
|
|
460
|
-
* The complete persisted button-effect contract.
|
|
461
|
-
*
|
|
462
|
-
* Navigation has its own generic interactive-effect model. Button variants use
|
|
463
|
-
* this closed union so unsupported effect IDs, unknown option keys, and unsafe
|
|
464
|
-
* CSS values cannot become representable after the schema boundary.
|
|
465
|
-
*/
|
|
466
|
-
const buttonPressOffsetSchema = z.strictObject({
|
|
467
|
-
x: z.number().int().min(0).max(12),
|
|
468
|
-
y: z.number().int().min(0).max(12)
|
|
469
|
-
});
|
|
470
|
-
const buttonEffectApplicationSchema = z.discriminatedUnion("effectId", [
|
|
471
|
-
z.strictObject({
|
|
472
|
-
effectId: z.literal("darken-background"),
|
|
473
|
-
options: z.strictObject({ amount: buttonShadeAmountSchema.optional() }).optional()
|
|
474
|
-
}),
|
|
475
|
-
z.strictObject({
|
|
476
|
-
effectId: z.literal("lighten-background"),
|
|
477
|
-
options: z.strictObject({ amount: buttonShadeAmountSchema.optional() }).optional()
|
|
478
|
-
}),
|
|
479
|
-
z.strictObject({
|
|
480
|
-
effectId: z.literal("background-on-hover"),
|
|
481
|
-
options: z.strictObject({ colorToken: opaqueButtonColourTokenSchema.optional() }).optional()
|
|
482
|
-
}),
|
|
483
|
-
z.strictObject({
|
|
484
|
-
effectId: z.literal("animated-gradient"),
|
|
485
|
-
options: z.strictObject({ direction: z.enum(["horizontal", "vertical"]).optional() }).optional()
|
|
486
|
-
}),
|
|
487
|
-
z.strictObject({
|
|
488
|
-
effectId: z.literal("drop-shadow"),
|
|
489
|
-
options: z.strictObject({ intensity: buttonShadowIntensitySchema.optional() }).optional()
|
|
490
|
-
}),
|
|
491
|
-
z.strictObject({
|
|
492
|
-
effectId: z.literal("inner-shadow"),
|
|
493
|
-
options: z.strictObject({}).optional()
|
|
494
|
-
}),
|
|
495
|
-
z.strictObject({
|
|
496
|
-
effectId: z.literal("neumorphic-shadow"),
|
|
497
|
-
options: z.strictObject({
|
|
498
|
-
mode: z.enum(["raised", "pressed"]).optional(),
|
|
499
|
-
intensity: buttonShadowIntensitySchema.optional()
|
|
500
|
-
}).optional()
|
|
501
|
-
}),
|
|
502
|
-
z.strictObject({
|
|
503
|
-
effectId: z.literal("retro-3d-shadow"),
|
|
504
|
-
options: z.strictObject({}).optional()
|
|
505
|
-
}),
|
|
506
|
-
z.strictObject({
|
|
507
|
-
effectId: z.literal("scale-up"),
|
|
508
|
-
options: z.strictObject({ scale: z.enum([
|
|
509
|
-
"1.02",
|
|
510
|
-
"1.03",
|
|
511
|
-
"1.05",
|
|
512
|
-
"1.10"
|
|
513
|
-
]).optional() }).optional()
|
|
514
|
-
}),
|
|
515
|
-
z.strictObject({
|
|
516
|
-
effectId: z.literal("scale-down"),
|
|
517
|
-
options: z.strictObject({ scale: z.enum([
|
|
518
|
-
"0.90",
|
|
519
|
-
"0.95",
|
|
520
|
-
"0.97",
|
|
521
|
-
"0.98"
|
|
522
|
-
]).optional() }).optional()
|
|
523
|
-
}),
|
|
524
|
-
z.strictObject({
|
|
525
|
-
effectId: z.literal("lift"),
|
|
526
|
-
options: z.strictObject({ amount: z.enum([
|
|
527
|
-
"0.25",
|
|
528
|
-
"0.5",
|
|
529
|
-
"1"
|
|
530
|
-
]).optional() }).optional()
|
|
531
|
-
}),
|
|
532
|
-
z.strictObject({
|
|
533
|
-
effectId: z.literal("press-down"),
|
|
534
|
-
options: z.strictObject({ offset: buttonPressOffsetSchema.optional() }).optional()
|
|
535
|
-
}),
|
|
536
|
-
z.strictObject({
|
|
537
|
-
effectId: z.literal("pop"),
|
|
538
|
-
options: z.strictObject({ intensity: z.enum([
|
|
539
|
-
"subtle",
|
|
540
|
-
"medium",
|
|
541
|
-
"dramatic"
|
|
542
|
-
]).optional() }).optional()
|
|
543
|
-
}),
|
|
544
|
-
z.strictObject({
|
|
545
|
-
effectId: z.literal("border-bottom-grow"),
|
|
546
|
-
options: z.strictObject({
|
|
547
|
-
height: z.union([z.literal(1), z.literal(2)]).optional(),
|
|
548
|
-
origin: z.enum([
|
|
549
|
-
"left",
|
|
550
|
-
"center",
|
|
551
|
-
"right"
|
|
552
|
-
]).optional(),
|
|
553
|
-
persistent: z.boolean().optional(),
|
|
554
|
-
colourRole: z.literal("mark").optional()
|
|
555
|
-
}).optional()
|
|
556
|
-
}),
|
|
557
|
-
z.strictObject({
|
|
558
|
-
effectId: z.literal("sketchy-border"),
|
|
559
|
-
options: z.strictObject({ intensity: buttonShadowIntensitySchema.optional() }).optional()
|
|
560
|
-
})
|
|
561
|
-
]);
|
|
562
|
-
const cornerStyleSchema = z.enum([
|
|
563
|
-
"square",
|
|
564
|
-
"rounded",
|
|
565
|
-
"pill"
|
|
566
|
-
]);
|
|
567
|
-
const shadowSizeSchema = z.enum([
|
|
568
|
-
"none",
|
|
569
|
-
"low",
|
|
570
|
-
"medium",
|
|
571
|
-
"high"
|
|
572
|
-
]);
|
|
573
|
-
const textTransformSchema = z.enum([
|
|
574
|
-
"none",
|
|
575
|
-
"uppercase",
|
|
576
|
-
"lowercase",
|
|
577
|
-
"capitalize"
|
|
578
|
-
]);
|
|
579
|
-
const fontWeightSchema = z.union([
|
|
580
|
-
z.literal(500),
|
|
581
|
-
z.literal(600),
|
|
582
|
-
z.literal(700),
|
|
583
|
-
z.literal(800)
|
|
584
|
-
]);
|
|
585
|
-
const buttonTypographySchema = z.enum(["body", "heading"]);
|
|
586
|
-
const letterSpacingSchema = z.enum([
|
|
587
|
-
"tight",
|
|
588
|
-
"normal",
|
|
589
|
-
"loose"
|
|
590
|
-
]);
|
|
591
|
-
const hoverTransformSchema = z.enum([
|
|
592
|
-
"none",
|
|
593
|
-
"lift",
|
|
594
|
-
"scale",
|
|
595
|
-
"press"
|
|
596
|
-
]);
|
|
597
|
-
z.enum(["none", "token"]);
|
|
598
|
-
const buttonPaddingPresetSchema = z.enum([
|
|
599
|
-
"compact",
|
|
600
|
-
"default",
|
|
601
|
-
"spacious"
|
|
602
|
-
]);
|
|
603
|
-
const gradientStyleSchema = z.enum([
|
|
604
|
-
"linear",
|
|
605
|
-
"radial",
|
|
606
|
-
"conic"
|
|
607
|
-
]);
|
|
608
|
-
const gradientSharpnessSchema = z.enum([
|
|
609
|
-
"smooth",
|
|
610
|
-
"medium",
|
|
611
|
-
"hard"
|
|
612
|
-
]);
|
|
613
|
-
const prioritySchema = z.union([
|
|
614
|
-
z.literal(1),
|
|
615
|
-
z.literal(2),
|
|
616
|
-
z.literal(3)
|
|
617
|
-
]);
|
|
618
|
-
const variantRoleSchema = z.enum(VARIANT_ROLES);
|
|
619
|
-
const buttonSurfaceFallbackSchema = z.discriminatedUnion("kind", [z.strictObject({ kind: z.literal("surface-outline") }), z.strictObject({
|
|
620
|
-
kind: z.literal("variant"),
|
|
621
|
-
role: variantRoleSchema
|
|
622
|
-
})]);
|
|
623
|
-
const standardButtonSurfacePolicy = {
|
|
624
|
-
primary: [{ kind: "surface-outline" }],
|
|
625
|
-
secondary: [{ kind: "surface-outline" }, {
|
|
626
|
-
kind: "variant",
|
|
627
|
-
role: "primary"
|
|
628
|
-
}],
|
|
629
|
-
outline: [{ kind: "surface-outline" }],
|
|
630
|
-
ghost: [{ kind: "surface-outline" }],
|
|
631
|
-
accent: [{ kind: "surface-outline" }, {
|
|
632
|
-
kind: "variant",
|
|
633
|
-
role: "primary"
|
|
634
|
-
}]
|
|
635
|
-
};
|
|
636
|
-
const STANDARD_BUTTON_SURFACE_POLICY = Object.freeze(Object.fromEntries(VARIANT_ROLES.map((role) => [role, Object.freeze([...standardButtonSurfacePolicy[role]])])));
|
|
637
|
-
function createStandardButtonSurfacePolicy() {
|
|
638
|
-
return Object.fromEntries(VARIANT_ROLES.map((role) => [role, [...STANDARD_BUTTON_SURFACE_POLICY[role]]]));
|
|
639
|
-
}
|
|
640
|
-
const buttonSurfacePolicyShape = Object.fromEntries(VARIANT_ROLES.map((role) => [role, z.array(buttonSurfaceFallbackSchema).max(VARIANT_ROLES.length)]));
|
|
641
|
-
const buttonSurfacePolicySchema = z.strictObject(buttonSurfacePolicyShape);
|
|
642
|
-
const buttonSizeNameSchema = z.enum([
|
|
643
|
-
"sm",
|
|
644
|
-
"md",
|
|
645
|
-
"lg",
|
|
646
|
-
"xl"
|
|
647
|
-
]);
|
|
648
|
-
/**
|
|
649
|
-
* CSS padding string in `"<vertical> <horizontal>"` shorthand form.
|
|
650
|
-
*
|
|
651
|
-
* Exactly two space-separated CSS length tokens. Each token is either the
|
|
652
|
-
* literal `0` or a number followed by `rem`/`em`/`px`/`%`. This lets the
|
|
653
|
-
* generator trust the shape rather than defensively defaulting downstream.
|
|
654
|
-
*/
|
|
655
|
-
const PADDING_TOKEN_PATTERN = /^(?:0|\d+(?:\.\d+)?(?:rem|em|px|%))$/;
|
|
656
|
-
const paddingShorthandSchema = z.string().refine((value) => {
|
|
657
|
-
const parts = value.split(/\s+/).filter(Boolean);
|
|
658
|
-
return parts.length === 2 && parts.every((token) => PADDING_TOKEN_PATTERN.test(token));
|
|
659
|
-
}, { message: "Padding must be two space-separated CSS length tokens (e.g. \"0.5rem 1rem\"). Use `0` for zero." });
|
|
660
|
-
const buttonSizeConfigSchema = z.object({
|
|
661
|
-
padding: paddingShorthandSchema,
|
|
662
|
-
fontSize: z.string().optional()
|
|
663
|
-
});
|
|
664
|
-
/**
|
|
665
|
-
* `xl` is optional on the wire so themes persisted before the `xl` size was
|
|
666
|
-
* added (e.g. SWTS) continue to parse. When `xl` is missing the schema
|
|
667
|
-
* backfills it from `lg`, keeping `ButtonSizes` a complete `sm/md/lg/xl` map
|
|
668
|
-
* downstream — generators never need to deal with an undefined `xl`.
|
|
669
|
-
*/
|
|
670
|
-
const buttonSizesSchema = z.object({
|
|
671
|
-
sm: buttonSizeConfigSchema,
|
|
672
|
-
md: buttonSizeConfigSchema,
|
|
673
|
-
lg: buttonSizeConfigSchema,
|
|
674
|
-
xl: buttonSizeConfigSchema.optional()
|
|
675
|
-
}).transform(({ sm, md, lg, xl }) => ({
|
|
676
|
-
sm,
|
|
677
|
-
md,
|
|
678
|
-
lg,
|
|
679
|
-
xl: xl ?? lg
|
|
680
|
-
}));
|
|
681
|
-
const buttonGlobalSettingsBaseSchema = z.strictObject({
|
|
682
|
-
cornerStyle: cornerStyleSchema,
|
|
683
|
-
cornerRadius: z.number().min(0).max(24).optional(),
|
|
684
|
-
/**
|
|
685
|
-
* Family-level shadow inherited by variants that don't set their own.
|
|
686
|
-
* Optional and flat-by-default: when omitted, buttons carry no drop shadow
|
|
687
|
-
* (`elevation: 'none'`). A personality opts the whole family into a shadow by
|
|
688
|
-
* setting this; individual variants still override. There is no system-level
|
|
689
|
-
* shadow-by-default — shadows only appear when explicitly declared.
|
|
690
|
-
*/
|
|
691
|
-
shadow: shadowSizeSchema.optional(),
|
|
692
|
-
textTransform: textTransformSchema,
|
|
693
|
-
fontWeight: fontWeightSchema,
|
|
694
|
-
typography: buttonTypographySchema.optional(),
|
|
695
|
-
fontSize: z.string().optional(),
|
|
696
|
-
letterSpacing: letterSpacingSchema.optional(),
|
|
697
|
-
italic: z.boolean().optional(),
|
|
698
|
-
paddingPreset: buttonPaddingPresetSchema.optional(),
|
|
699
|
-
hoverTransform: hoverTransformSchema,
|
|
700
|
-
gradientStyle: gradientStyleSchema.optional(),
|
|
701
|
-
gradientAngle: z.number().min(0).max(360).optional(),
|
|
702
|
-
gradientSharpness: gradientSharpnessSchema.optional()
|
|
703
|
-
});
|
|
704
|
-
const buttonGlobalSettingsSchema = z.discriminatedUnion("hoverColor", [buttonGlobalSettingsBaseSchema.extend({
|
|
705
|
-
hoverColor: z.literal("none"),
|
|
706
|
-
hoverColorToken: z.never().optional()
|
|
707
|
-
}), buttonGlobalSettingsBaseSchema.extend({
|
|
708
|
-
hoverColor: z.literal("token"),
|
|
709
|
-
hoverColorToken: opaqueButtonColourTokenSchema
|
|
710
|
-
})]);
|
|
711
|
-
const gradientDirectionSchema = z.enum([
|
|
712
|
-
"to-r",
|
|
713
|
-
"to-l",
|
|
714
|
-
"to-t",
|
|
715
|
-
"to-b",
|
|
716
|
-
"to-tr",
|
|
717
|
-
"to-tl",
|
|
718
|
-
"to-br",
|
|
719
|
-
"to-bl"
|
|
720
|
-
]);
|
|
721
|
-
const buttonColourTreatmentSchema = z.discriminatedUnion("type", [
|
|
722
|
-
z.strictObject({
|
|
723
|
-
type: z.literal("solid"),
|
|
724
|
-
colorToken: opaqueButtonColourTokenSchema
|
|
725
|
-
}),
|
|
726
|
-
z.strictObject({
|
|
727
|
-
type: z.literal("gradient"),
|
|
728
|
-
stops: z.array(opaqueButtonColourTokenSchema).min(2).transform((stops) => {
|
|
729
|
-
const [first, second, ...rest] = stops;
|
|
730
|
-
if (first === void 0 || second === void 0) throw new Error("Invariant: gradient stops passed the minimum length schema");
|
|
731
|
-
return [
|
|
732
|
-
first,
|
|
733
|
-
second,
|
|
734
|
-
...rest
|
|
735
|
-
];
|
|
736
|
-
}),
|
|
737
|
-
direction: gradientDirectionSchema,
|
|
738
|
-
foregroundToken: opaqueButtonColourTokenSchema
|
|
739
|
-
}),
|
|
740
|
-
z.strictObject({
|
|
741
|
-
type: z.literal("surface"),
|
|
742
|
-
role: z.literal("link")
|
|
743
|
-
})
|
|
744
|
-
]);
|
|
745
|
-
const buttonBackgroundSchema = buttonColourTreatmentSchema;
|
|
746
|
-
const buttonBorderSchema = z.strictObject({
|
|
747
|
-
widthClass: z.string(),
|
|
748
|
-
marksBoundary: z.literal(true).optional(),
|
|
749
|
-
ring: z.literal(true).optional(),
|
|
750
|
-
boundaryInk: opaqueButtonColourTokenSchema.optional()
|
|
751
|
-
});
|
|
752
|
-
const buttonVariantAffordanceSchema = z.strictObject({ iconId: z.string().min(1) });
|
|
753
|
-
const variantShadowSchema = z.strictObject({
|
|
754
|
-
elevation: z.enum([
|
|
755
|
-
"none",
|
|
756
|
-
"low",
|
|
757
|
-
"medium",
|
|
758
|
-
"high"
|
|
759
|
-
]),
|
|
760
|
-
softness: z.enum([
|
|
761
|
-
"crisp",
|
|
762
|
-
"soft",
|
|
763
|
-
"hard"
|
|
764
|
-
]).nullable(),
|
|
765
|
-
position: z.enum(["bottom", "bottom-right"]).default("bottom"),
|
|
766
|
-
colorToken: opaqueButtonColourTokenSchema.optional()
|
|
767
|
-
});
|
|
768
|
-
/** Recipe states own every visual property; treatment owns its readable label. */
|
|
769
|
-
const buttonVisualAppearanceSchema = z.strictObject({
|
|
770
|
-
background: buttonColourTreatmentSchema,
|
|
771
|
-
text: z.literal("treatment"),
|
|
772
|
-
border: z.union([z.literal("none"), buttonBorderSchema]),
|
|
773
|
-
borderRadius: z.string(),
|
|
774
|
-
shadow: z.union([z.literal("focus-indicator"), variantShadowSchema]),
|
|
775
|
-
sizes: buttonSizesSchema,
|
|
776
|
-
typography: z.strictObject({
|
|
777
|
-
fontWeight: fontWeightSchema,
|
|
778
|
-
typography: buttonTypographySchema,
|
|
779
|
-
fontSize: z.string().nullable(),
|
|
780
|
-
letterSpacing: z.union([letterSpacingSchema, z.literal("heading")]).nullable(),
|
|
781
|
-
italic: z.boolean(),
|
|
782
|
-
textTransform: textTransformSchema
|
|
783
|
-
}),
|
|
784
|
-
effects: z.array(buttonEffectApplicationSchema),
|
|
785
|
-
contextualHover: contextualButtonHoverSchema.optional()
|
|
786
|
-
});
|
|
787
|
-
const buttonVisualStatesSchema = z.strictObject({
|
|
788
|
-
base: buttonVisualAppearanceSchema.extend({ shadow: variantShadowSchema }),
|
|
789
|
-
hover: buttonVisualAppearanceSchema.extend({ shadow: variantShadowSchema }),
|
|
790
|
-
focus: buttonVisualAppearanceSchema.extend({ shadow: z.literal("focus-indicator") }),
|
|
791
|
-
active: buttonVisualAppearanceSchema.extend({ shadow: variantShadowSchema }),
|
|
792
|
-
disabled: buttonVisualAppearanceSchema.extend({ shadow: variantShadowSchema })
|
|
793
|
-
});
|
|
794
|
-
const variantEffectsSchema = z.strictObject({
|
|
795
|
-
base: z.array(buttonEffectApplicationSchema).optional(),
|
|
796
|
-
hover: z.array(buttonEffectApplicationSchema).optional(),
|
|
797
|
-
active: z.array(buttonEffectApplicationSchema).optional(),
|
|
798
|
-
focus: z.array(buttonEffectApplicationSchema).optional()
|
|
799
|
-
});
|
|
800
|
-
/**
|
|
801
|
-
* Per-variant size overrides schema — every entry is optional.
|
|
802
|
-
*
|
|
803
|
-
* For each size key present, the values override the theme's `sizes` config
|
|
804
|
-
* for that size on this variant. Missing sizes fall through to theme.sizes,
|
|
805
|
-
* then system defaults.
|
|
806
|
-
*/
|
|
807
|
-
const variantSizeOverridesSchema = z.object({
|
|
808
|
-
sm: buttonSizeConfigSchema.optional(),
|
|
809
|
-
md: buttonSizeConfigSchema.optional(),
|
|
810
|
-
lg: buttonSizeConfigSchema.optional(),
|
|
811
|
-
xl: buttonSizeConfigSchema.optional()
|
|
812
|
-
});
|
|
813
|
-
/**
|
|
814
|
-
* Unified variant schema. Every variant participates in the size system; the
|
|
815
|
-
* optional `sizes` field lets a variant scale differently than the theme
|
|
816
|
-
* default (e.g. link-style variants declaring zero horizontal padding at
|
|
817
|
-
* every size).
|
|
818
|
-
*/
|
|
819
|
-
const buttonVariantSchema = z.strictObject({
|
|
820
|
-
id: buttonVariantIdSchema,
|
|
821
|
-
name: z.string().min(1).max(20),
|
|
822
|
-
enabled: z.boolean(),
|
|
823
|
-
priority: prioritySchema,
|
|
824
|
-
visualStates: buttonVisualStatesSchema.optional(),
|
|
825
|
-
background: buttonBackgroundSchema,
|
|
826
|
-
/** Tailwind radius token (e.g. `'rounded-md'`). Omit to inherit from `global.cornerStyle`. */
|
|
827
|
-
borderRadius: z.string().optional(),
|
|
828
|
-
shadow: variantShadowSchema.optional(),
|
|
829
|
-
border: buttonBorderSchema.optional(),
|
|
830
|
-
hoverBackgroundToken: opaqueButtonColourTokenSchema.optional(),
|
|
831
|
-
contextualHover: contextualButtonHoverSchema.optional(),
|
|
832
|
-
effects: variantEffectsSchema.optional(),
|
|
833
|
-
sizes: variantSizeOverridesSchema.optional(),
|
|
834
|
-
affordance: buttonVariantAffordanceSchema.optional()
|
|
835
|
-
});
|
|
836
|
-
const buttonSystemSchema = z.strictObject({
|
|
837
|
-
global: buttonGlobalSettingsSchema,
|
|
838
|
-
variants: z.array(buttonVariantSchema).min(1).max(6),
|
|
839
|
-
sizes: buttonSizesSchema.optional(),
|
|
840
|
-
surfacePolicy: buttonSurfacePolicySchema.optional(),
|
|
841
|
-
surfaceContexts: z.record(z.string(), z.strictObject({ primary: opaqueButtonColourTokenSchema })).optional()
|
|
842
|
-
}).superRefine((system, ctx) => {
|
|
843
|
-
const seen = /* @__PURE__ */ new Set();
|
|
844
|
-
system.variants.forEach((variant, index) => {
|
|
845
|
-
if (seen.has(variant.id)) ctx.addIssue({
|
|
846
|
-
code: "custom",
|
|
847
|
-
path: [
|
|
848
|
-
"variants",
|
|
849
|
-
index,
|
|
850
|
-
"id"
|
|
851
|
-
],
|
|
852
|
-
message: `Duplicate button variant ID: ${variant.id}`
|
|
853
|
-
});
|
|
854
|
-
seen.add(variant.id);
|
|
855
|
-
});
|
|
856
|
-
});
|
|
857
|
-
//#endregion
|
|
858
|
-
//#region ../theme-core/src/buttons/styles/domain.ts
|
|
859
|
-
const PUBLIC_BUTTON_ROLES = VARIANT_ROLES;
|
|
860
|
-
function defineButtonStyleRecipe(recipe) {
|
|
861
|
-
return recipe;
|
|
862
|
-
}
|
|
863
|
-
function mapButtonVisualAppearances(states, transform) {
|
|
864
|
-
return {
|
|
865
|
-
base: transform(states.base, "base"),
|
|
866
|
-
hover: transform(states.hover, "hover"),
|
|
867
|
-
focus: transform(states.focus, "focus"),
|
|
868
|
-
active: transform(states.active, "active"),
|
|
869
|
-
disabled: transform(states.disabled, "disabled")
|
|
870
|
-
};
|
|
871
|
-
}
|
|
872
|
-
function mapButtonRoleAppearances(roles, transform) {
|
|
873
|
-
const role = (name) => transform(roles[name], name);
|
|
874
|
-
return {
|
|
875
|
-
primary: role("primary"),
|
|
876
|
-
secondary: role("secondary"),
|
|
877
|
-
outline: role("outline"),
|
|
878
|
-
ghost: role("ghost"),
|
|
879
|
-
accent: role("accent")
|
|
880
|
-
};
|
|
881
|
-
}
|
|
882
|
-
function materializeButtonRoles(definitions) {
|
|
883
|
-
return {
|
|
884
|
-
primary: materializeCompleteRole("primary", definitions.primary),
|
|
885
|
-
secondary: materializeCompleteRole("secondary", definitions.secondary),
|
|
886
|
-
outline: materializeCompleteRole("outline", definitions.outline),
|
|
887
|
-
ghost: materializeCompleteRole("ghost", definitions.ghost),
|
|
888
|
-
accent: materializeCompleteRole("accent", definitions.accent)
|
|
889
|
-
};
|
|
890
|
-
}
|
|
891
|
-
function resolveButtonStyleRecipe(recipe, parameters) {
|
|
892
|
-
const parsedParameters = recipe.parameterSchema.safeParse(parameters);
|
|
893
|
-
if (!parsedParameters.success) return {
|
|
894
|
-
kind: "error",
|
|
895
|
-
error: {
|
|
896
|
-
kind: "invalid-parameters",
|
|
897
|
-
styleId: recipe.id,
|
|
898
|
-
issues: parsedParameters.error.issues.map((issue) => issue.message)
|
|
899
|
-
}
|
|
900
|
-
};
|
|
901
|
-
const definition = recipe.defineSystem(parsedParameters.data);
|
|
902
|
-
const roles = materializeButtonRoles(definition.roles);
|
|
903
|
-
const buttonSystem = {
|
|
904
|
-
global: buttonFamilyProjection(roles.primary),
|
|
905
|
-
sizes: roles.primary.visualStates?.base.sizes,
|
|
906
|
-
variants: PUBLIC_BUTTON_ROLES.map((role) => roles[role]),
|
|
907
|
-
surfacePolicy: definition.surfacePolicy ?? createStandardButtonSurfacePolicy()
|
|
908
|
-
};
|
|
909
|
-
const parsedButtonSystem = buttonSystemSchema.safeParse(buttonSystem);
|
|
910
|
-
if (!parsedButtonSystem.success) return {
|
|
911
|
-
kind: "error",
|
|
912
|
-
error: {
|
|
913
|
-
kind: "invalid-button-system",
|
|
914
|
-
styleId: recipe.id,
|
|
915
|
-
issues: parsedButtonSystem.error.issues.map((issue) => issue.message)
|
|
916
|
-
}
|
|
917
|
-
};
|
|
918
|
-
return {
|
|
919
|
-
kind: "resolved",
|
|
920
|
-
buttonSystem: parsedButtonSystem.data
|
|
921
|
-
};
|
|
922
|
-
}
|
|
923
|
-
/** Historical family metadata remains a projection; recipes never read it. */
|
|
924
|
-
function buttonFamilyProjection(primary) {
|
|
925
|
-
const base = primary.visualStates.base;
|
|
926
|
-
const type = base.typography;
|
|
927
|
-
return {
|
|
928
|
-
cornerStyle: base.borderRadius === "rounded-none" ? "square" : base.borderRadius === "rounded-full" ? "pill" : "rounded",
|
|
929
|
-
shadow: base.shadow.elevation,
|
|
930
|
-
fontWeight: type.fontWeight,
|
|
931
|
-
textTransform: type.textTransform,
|
|
932
|
-
typography: type.typography,
|
|
933
|
-
...type.fontSize === null ? {} : { fontSize: type.fontSize },
|
|
934
|
-
...type.letterSpacing === null || type.letterSpacing === "heading" ? {} : { letterSpacing: type.letterSpacing },
|
|
935
|
-
...type.italic ? { italic: true } : {},
|
|
936
|
-
hoverTransform: "none",
|
|
937
|
-
hoverColor: "none"
|
|
938
|
-
};
|
|
939
|
-
}
|
|
940
|
-
function materializeCompleteRole(role, appearance) {
|
|
941
|
-
return {
|
|
942
|
-
visualStates: appearance.states,
|
|
943
|
-
background: appearance.states.base.background,
|
|
944
|
-
borderRadius: appearance.states.base.borderRadius,
|
|
945
|
-
...appearance.states.base.border === "none" ? {} : { border: appearance.states.base.border },
|
|
946
|
-
shadow: appearance.states.base.shadow,
|
|
947
|
-
sizes: appearance.states.base.sizes,
|
|
948
|
-
effects: Object.fromEntries([
|
|
949
|
-
"base",
|
|
950
|
-
"hover",
|
|
951
|
-
"focus",
|
|
952
|
-
"active"
|
|
953
|
-
].flatMap((state) => {
|
|
954
|
-
const effects = appearance.states[state].effects;
|
|
955
|
-
return effects.length === 0 ? [] : [[state, effects]];
|
|
956
|
-
})),
|
|
957
|
-
...appearance.states.hover.contextualHover ? { contextualHover: appearance.states.hover.contextualHover } : {},
|
|
958
|
-
...appearance.affordance ? { affordance: appearance.affordance } : {},
|
|
959
|
-
id: role,
|
|
960
|
-
name: roleName(role),
|
|
961
|
-
enabled: true,
|
|
962
|
-
priority: rolePriority(role)
|
|
963
|
-
};
|
|
964
|
-
}
|
|
965
|
-
function roleName(role) {
|
|
966
|
-
return role.charAt(0).toUpperCase() + role.slice(1);
|
|
967
|
-
}
|
|
968
|
-
function rolePriority(role) {
|
|
969
|
-
if (role === "primary") return 1;
|
|
970
|
-
if (role === "secondary") return 2;
|
|
971
|
-
return 3;
|
|
972
|
-
}
|
|
973
|
-
//#endregion
|
|
974
|
-
//#region ../theme-core/src/utils/tokenOrColor.ts
|
|
975
|
-
/**
|
|
976
|
-
* Runtime color-reference fields intentionally accept any string, including
|
|
977
|
-
* the legacy empty-string "no color" sentinel. Semantic validation needs
|
|
978
|
-
* palette context and happens in `parseThemeColorReference`.
|
|
979
|
-
*/
|
|
980
|
-
const tokenOrCssColorValueSchema = z.string();
|
|
981
|
-
const CSS_COLOR_FUNCTION_PATTERN = /^(?:rgb|rgba|hsl|hsla|hwb|lab|lch|oklab|oklch|color|color-mix|light-dark)\(/i;
|
|
982
|
-
const CSS_HEX_COLOR_PATTERN = /^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i;
|
|
983
|
-
const CSS_COLOR_KEYWORDS = /* @__PURE__ */ new Set([
|
|
984
|
-
"transparent",
|
|
985
|
-
"currentcolor",
|
|
986
|
-
"inherit",
|
|
987
|
-
"initial",
|
|
988
|
-
"revert",
|
|
989
|
-
"revert-layer",
|
|
990
|
-
"unset"
|
|
991
|
-
]);
|
|
992
|
-
const COMMON_CSS_NAMED_COLORS = /* @__PURE__ */ new Set([
|
|
993
|
-
"black",
|
|
994
|
-
"blue",
|
|
995
|
-
"gray",
|
|
996
|
-
"green",
|
|
997
|
-
"grey",
|
|
998
|
-
"orange",
|
|
999
|
-
"pink",
|
|
1000
|
-
"purple",
|
|
1001
|
-
"red",
|
|
1002
|
-
"white",
|
|
1003
|
-
"yellow"
|
|
1004
|
-
]);
|
|
1005
|
-
function isCssColorLiteral(value) {
|
|
1006
|
-
const trimmed = value.trim();
|
|
1007
|
-
if (!trimmed) return false;
|
|
1008
|
-
return CSS_HEX_COLOR_PATTERN.test(trimmed) || CSS_COLOR_FUNCTION_PATTERN.test(trimmed) || /^var\(/i.test(trimmed) || CSS_COLOR_KEYWORDS.has(trimmed.toLowerCase());
|
|
1009
|
-
}
|
|
1010
|
-
function parseThemeToken(token) {
|
|
1011
|
-
const trimmed = token.trim();
|
|
1012
|
-
const match = trimmed.match(/^(.*?)-(\d{2,3})$/);
|
|
1013
|
-
if (!match) return {
|
|
1014
|
-
role: trimmed,
|
|
1015
|
-
shade: null
|
|
1016
|
-
};
|
|
1017
|
-
const role = match[1] ?? trimmed;
|
|
1018
|
-
const shade = match[2] ? Number(match[2]) : null;
|
|
1019
|
-
return {
|
|
1020
|
-
role,
|
|
1021
|
-
shade: Number.isFinite(shade) ? shade : null
|
|
1022
|
-
};
|
|
1023
|
-
}
|
|
1024
|
-
function parseContextThemeColorToken(value, context) {
|
|
1025
|
-
const parts = parseColorTokenParts(value);
|
|
1026
|
-
if (parts.kind !== "token") return null;
|
|
1027
|
-
if (!(Boolean(context?.palette?.[value.trim()]) || parts.opacityPercent !== null && Boolean(context?.palette?.[parts.token]))) return null;
|
|
1028
|
-
return value.trim();
|
|
1029
|
-
}
|
|
1030
|
-
function isTokenShapedTypo(value) {
|
|
1031
|
-
if (COMMON_CSS_NAMED_COLORS.has(value.toLowerCase())) return false;
|
|
1032
|
-
if (!/^[a-zA-Z][a-zA-Z0-9]*(?:-[a-zA-Z0-9]+)*(?:\/[^/]+)?$/.test(value)) return false;
|
|
1033
|
-
return !isCssColorLiteral(value);
|
|
1034
|
-
}
|
|
1035
|
-
function warnUnknownThemeColorReference(value) {
|
|
1036
|
-
if (!isTokenShapedTypo(value)) return;
|
|
1037
|
-
console.warn(`[theme-core] Unknown Theme V2 color token "${value}" treated as literal CSS. Use raw:* for deliberate custom CSS values.`);
|
|
1038
|
-
}
|
|
1039
|
-
function parseThemeColorReference(input, context) {
|
|
1040
|
-
const trimmed = input.trim();
|
|
1041
|
-
if (trimmed.startsWith("raw:")) return {
|
|
1042
|
-
kind: "literal-css",
|
|
1043
|
-
value: trimmed.slice(4)
|
|
1044
|
-
};
|
|
1045
|
-
const contextToken = parseContextThemeColorToken(trimmed, context);
|
|
1046
|
-
if (contextToken) return {
|
|
1047
|
-
kind: "palette-context-token",
|
|
1048
|
-
token: contextToken
|
|
1049
|
-
};
|
|
1050
|
-
const knownToken = parseThemeColorToken(trimmed);
|
|
1051
|
-
if (knownToken) return {
|
|
1052
|
-
kind: "theme-token",
|
|
1053
|
-
token: knownToken
|
|
1054
|
-
};
|
|
1055
|
-
warnUnknownThemeColorReference(trimmed);
|
|
1056
|
-
return {
|
|
1057
|
-
kind: "literal-css",
|
|
1058
|
-
value: trimmed
|
|
1059
|
-
};
|
|
1060
|
-
}
|
|
1061
|
-
function resolveThemeColorReferenceValue(input, context) {
|
|
1062
|
-
const reference = parseThemeColorReference(input, context);
|
|
1063
|
-
return reference.kind === "literal-css" ? reference.value : rgbColorValue(reference.token);
|
|
1064
|
-
}
|
|
1065
|
-
function resolveTokenOrCssColorValue(input, context) {
|
|
1066
|
-
return resolveThemeColorReferenceValue(input, context);
|
|
1067
|
-
}
|
|
1068
|
-
function resolveOnColorForThemeToken(token) {
|
|
1069
|
-
if (!parseThemeColorToken(token)) return null;
|
|
1070
|
-
const parts = parseColorTokenParts(token);
|
|
1071
|
-
if (parts.kind !== "token") return null;
|
|
1072
|
-
const { role, shade } = parseThemeToken(parts.token);
|
|
1073
|
-
const normalizedRole = role.trim();
|
|
1074
|
-
if (!normalizedRole) return null;
|
|
1075
|
-
if (!shade) return rgbColorValue(`on${normalizedRole.charAt(0).toUpperCase() + normalizedRole.slice(1)}`);
|
|
1076
|
-
return shade <= 400 ? "#000000" : "#FFFFFF";
|
|
1077
|
-
}
|
|
1078
|
-
//#endregion
|
|
1079
|
-
//#region ../theme-core/src/buttons/buttonColourContract.ts
|
|
1080
|
-
const BUTTON_VISUAL_STATES = [
|
|
1081
|
-
"base",
|
|
1082
|
-
"hover",
|
|
1083
|
-
"focus",
|
|
1084
|
-
"active",
|
|
1085
|
-
"disabled"
|
|
1086
|
-
];
|
|
1087
|
-
//#endregion
|
|
1088
|
-
//#region ../theme-core/src/buttons/buttonSurfaceContext.ts
|
|
1089
|
-
/**
|
|
1090
|
-
* Break an inherited surface contract when a nested element establishes a
|
|
1091
|
-
* backing whose colours cannot be proven (for example an image or gradient).
|
|
1092
|
-
*/
|
|
1093
|
-
function contextualButtonSurfaceResetStyles() {
|
|
1094
|
-
return Object.fromEntries(VARIANT_ROLES.flatMap((role) => Object.entries(resetActionVariables(role))));
|
|
1095
|
-
}
|
|
1096
|
-
function resetActionVariables(role) {
|
|
1097
|
-
const styles = {};
|
|
1098
|
-
for (const state of BUTTON_VISUAL_STATES) for (const property of [
|
|
1099
|
-
"background-color",
|
|
1100
|
-
"background-image",
|
|
1101
|
-
"color"
|
|
1102
|
-
]) styles[actionVariableName(role, state, property)] = "initial";
|
|
1103
|
-
for (const [state, property] of [
|
|
1104
|
-
["base", "outline"],
|
|
1105
|
-
["base", "outline-offset"],
|
|
1106
|
-
["focus", "outline"],
|
|
1107
|
-
["focus", "outline-offset"],
|
|
1108
|
-
["focus", "box-shadow"]
|
|
1109
|
-
]) styles[actionVariableName(role, state, property)] = "initial";
|
|
1110
|
-
return styles;
|
|
1111
|
-
}
|
|
1112
|
-
function actionVariableName(role, state, property) {
|
|
1113
|
-
return `--rb-action-${role}-${state}-${property}`;
|
|
1114
|
-
}
|
|
1115
|
-
//#endregion
|
|
1116
|
-
//#region ../theme-core/src/surfaces/opaqueSurface.ts
|
|
1117
|
-
/**
|
|
1118
|
-
* The declarations that make an element own its surface: `color`, every
|
|
1119
|
-
* `--rb-surface-*` role and every `--rb-action-*` variable. Card roles and
|
|
1120
|
-
* opaque block panels both publish through this, so a nested surface can never
|
|
1121
|
-
* inherit a band's light text or its band-resolved buttons.
|
|
1122
|
-
*/
|
|
1123
|
-
function opaqueSurfaceDeclarations(surface, arrangement = false) {
|
|
1124
|
-
if (surface.kind === "inherit") return inheritedSurfaceDeclarations(arrangement);
|
|
1125
|
-
const foreground = surface.foreground;
|
|
1126
|
-
return [
|
|
1127
|
-
...surfaceForegroundDeclarations({
|
|
1128
|
-
text: colorValue(foreground.text),
|
|
1129
|
-
heading: colorValue(foreground.heading),
|
|
1130
|
-
link: colorValue(foreground.link),
|
|
1131
|
-
linkHover: colorValue(foreground.linkHover),
|
|
1132
|
-
supporting: colorValue(foreground.supporting),
|
|
1133
|
-
...arrangement ? { muted: colorValue(foreground.muted) } : {},
|
|
1134
|
-
hoverDecoration: surface.hoverDecoration
|
|
1135
|
-
}),
|
|
1136
|
-
...arrangement && surface.decorations !== void 0 ? [`${SURFACE_FOREGROUND_CSS_VARS.line}: ${surface.decorations.line};`, `${SURFACE_FOREGROUND_CSS_VARS.mark}: ${surface.decorations.mark};`] : [],
|
|
1137
|
-
...Object.entries(surface.buttonContext.styles).map(([property, value]) => `${property}: ${value};`)
|
|
1138
|
-
];
|
|
1139
|
-
}
|
|
1140
|
-
function colorValue(token) {
|
|
1141
|
-
const parsed = parseThemeColorToken(token);
|
|
1142
|
-
return parsed ? rgbColorValue(parsed) : token;
|
|
1143
|
-
}
|
|
1144
|
-
/** Every property a surface publishes, set to `inherit`. */
|
|
1145
|
-
function inheritedSurfaceDeclarations(arrangement) {
|
|
1146
|
-
return [
|
|
1147
|
-
"color",
|
|
1148
|
-
...Object.entries(SURFACE_FOREGROUND_CSS_VARS).filter(([role]) => arrangement || role !== "line" && role !== "mark" && role !== "muted").map(([, variable]) => variable),
|
|
1149
|
-
"--rb-surface-link-hover-decoration",
|
|
1150
|
-
...Object.keys(contextualButtonSurfaceResetStyles())
|
|
1151
|
-
].map((property) => `${property}: inherit;`);
|
|
1152
|
-
}
|
|
1153
|
-
//#endregion
|
|
1154
|
-
//#region ../theme-core/src/utils/colorStyles.ts
|
|
1155
|
-
const COLOR_VAR_PREFIX = "--tb-";
|
|
1156
|
-
function parseToken(source) {
|
|
1157
|
-
const parts = parseColorTokenParts(source);
|
|
1158
|
-
if (parts.kind === "raw") return {
|
|
1159
|
-
token: source,
|
|
1160
|
-
raw: parts.value
|
|
1161
|
-
};
|
|
1162
|
-
if (parts.kind === "invalid") return { token: source };
|
|
1163
|
-
return {
|
|
1164
|
-
token: parts.token,
|
|
1165
|
-
opacityPercent: parts.opacityPercent === null ? void 0 : parts.opacityPercent
|
|
1166
|
-
};
|
|
1167
|
-
}
|
|
1168
|
-
const SURFACE_TEXT_ROLE_BY_TOKEN = {
|
|
1169
|
-
text: "text",
|
|
1170
|
-
heading: "heading",
|
|
1171
|
-
mutedText: "supporting"
|
|
1172
|
-
};
|
|
1173
|
-
function surfaceRoleForTextToken(token) {
|
|
1174
|
-
return Object.prototype.hasOwnProperty.call(SURFACE_TEXT_ROLE_BY_TOKEN, token) ? SURFACE_TEXT_ROLE_BY_TOKEN[token] : null;
|
|
1175
|
-
}
|
|
1176
|
-
/**
|
|
1177
|
-
* Converts a theme color token to a CSS rgb value.
|
|
1178
|
-
* This is the primary function for applying theme colors to CSS properties.
|
|
1179
|
-
*
|
|
1180
|
-
* @param token - Theme color token (semantic, with opacity, or raw)
|
|
1181
|
-
* @returns CSS color value (rgb with optional alpha, or raw CSS value)
|
|
1182
|
-
*
|
|
1183
|
-
* @example
|
|
1184
|
-
* rgbColorValue('primary') // => 'rgb(var(--tb-primary))'
|
|
1185
|
-
* rgbColorValue('surface/95') // => 'rgb(var(--tb-surface) / 0.95)'
|
|
1186
|
-
* rgbColorValue('raw:transparent') // => 'transparent'
|
|
1187
|
-
*/
|
|
1188
|
-
function rgbColorValue(token) {
|
|
1189
|
-
const { token: baseToken, opacityPercent, raw } = parseToken(token);
|
|
1190
|
-
if (raw) return raw;
|
|
1191
|
-
const cssVar = `${COLOR_VAR_PREFIX}${baseToken}`;
|
|
1192
|
-
if (opacityPercent === void 0) return `rgb(var(${cssVar}))`;
|
|
1193
|
-
return `rgb(var(${cssVar}) / ${opacityPercent / 100})`;
|
|
1194
|
-
}
|
|
1195
|
-
/**
|
|
1196
|
-
* Creates a backgroundColor style object from a theme token.
|
|
1197
|
-
*
|
|
1198
|
-
* @param token - Theme color token
|
|
1199
|
-
* @returns CSSProperties with backgroundColor
|
|
1200
|
-
*/
|
|
1201
|
-
function backgroundColorStyle(token) {
|
|
1202
|
-
return { backgroundColor: rgbColorValue(token) };
|
|
1203
|
-
}
|
|
1204
|
-
/**
|
|
1205
|
-
* Converts a text color token to a CSS color value that follows the enclosing
|
|
1206
|
-
* surface. The semantic text tokens (`text`, `heading`, `mutedText`) resolve
|
|
1207
|
-
* to the surface foreground variables, so text adapts when a section's
|
|
1208
|
-
* background changes; any other token is a fixed theme color.
|
|
1209
|
-
*
|
|
1210
|
-
* @param token - Theme color token
|
|
1211
|
-
* @returns CSS color value
|
|
1212
|
-
*/
|
|
1213
|
-
function textColorValue(token) {
|
|
1214
|
-
const parsed = parseToken(token);
|
|
1215
|
-
const surfaceRole = parsed.raw ? null : surfaceRoleForTextToken(parsed.token);
|
|
1216
|
-
if (!surfaceRole) return rgbColorValue(token);
|
|
1217
|
-
return parsed.opacityPercent === void 0 ? surfaceForegroundValue(surfaceRole) : surfaceForegroundValueWithOpacity(surfaceRole, parsed.opacityPercent);
|
|
1218
|
-
}
|
|
1219
|
-
/**
|
|
1220
|
-
* Creates a text color style object from a theme token.
|
|
1221
|
-
*
|
|
1222
|
-
* @param token - Theme color token
|
|
1223
|
-
* @returns CSSProperties with color
|
|
1224
|
-
*/
|
|
1225
|
-
function textColorStyle(token) {
|
|
1226
|
-
return { color: textColorValue(token) };
|
|
1227
|
-
}
|
|
1228
|
-
/**
|
|
1229
|
-
* Merges multiple CSSProperties objects into a single object.
|
|
1230
|
-
* Later styles override earlier ones. Undefined values are filtered out.
|
|
1231
|
-
* Returns undefined if the merged result is empty.
|
|
1232
|
-
*
|
|
1233
|
-
* @param styles - Variable number of CSSProperties objects (can be undefined)
|
|
1234
|
-
* @returns Merged CSSProperties object, or undefined if empty
|
|
1235
|
-
*
|
|
1236
|
-
* @example
|
|
1237
|
-
* mergeStyles(
|
|
1238
|
-
* backgroundColorStyle('surface'),
|
|
1239
|
-
* textColorStyle('text'),
|
|
1240
|
-
* borderColorStyle('border')
|
|
1241
|
-
* )
|
|
1242
|
-
* // => { backgroundColor: '...', color: '...', borderColor: '...' }
|
|
1243
|
-
*/
|
|
1244
|
-
function mergeStyles(...styles) {
|
|
1245
|
-
const merged = {};
|
|
1246
|
-
for (const style of styles) {
|
|
1247
|
-
if (!style) continue;
|
|
1248
|
-
Object.assign(merged, style);
|
|
1249
|
-
}
|
|
1250
|
-
return Object.keys(merged).length ? merged : void 0;
|
|
1251
|
-
}
|
|
1252
|
-
//#endregion
|
|
1253
|
-
export { themeColorTokenSchema as A, paletteColorsSchema as C, requirePaletteColorsFromEntries as D, paletteValueKeySchema as E, clsx as F, hexToRgb as M, err as N, parseThemeColorToken as O, ok as P, paletteColorsFromEntries as S, paletteValueKey as T, buttonSystemSchema as _, isCssColorLiteral as a, hexColorSchema as b, tokenOrCssColorValueSchema as c, mapButtonRoleAppearances as d, mapButtonVisualAppearances as f, buttonSizeNameSchema as g, VARIANT_ROLES as h, opaqueSurfaceDeclarations as i, relativeLuminance as j, themeColorShadeSteps as k, PUBLIC_BUTTON_ROLES as l, DEFAULT_VARIANT_ALIAS_ID as m, mergeStyles as n, resolveOnColorForThemeToken as o, resolveButtonStyleRecipe as p, textColorStyle as r, resolveTokenOrCssColorValue as s, backgroundColorStyle as t, defineButtonStyleRecipe as u, buttonVisualStatesSchema as v, paletteModeSchema as w, paletteColorEntries as x, unsafeAsOpaqueButtonColourToken as y };
|