@anker-in/headless-ui 1.3.11 → 1.3.12
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/cjs/biz-components/ImageTextFeature/ImageTextFeature.js +1 -1
- package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.js.map +2 -2
- package/dist/cjs/biz-components/LotteryShared/ChanceMethods.js +1 -1
- package/dist/cjs/biz-components/LotteryShared/ChanceMethods.js.map +2 -2
- package/dist/cjs/biz-components/LotteryShared/types.d.ts +2 -0
- package/dist/cjs/biz-components/LotteryShared/types.js.map +2 -2
- package/dist/cjs/biz-components/ProductLottery/index.js +1 -1
- package/dist/cjs/biz-components/ProductLottery/index.js.map +3 -3
- package/dist/cjs/biz-components/ProductLottery/types.d.ts +7 -1
- package/dist/cjs/biz-components/ProductLottery/types.js.map +2 -2
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.js +1 -1
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.js.map +2 -2
- package/dist/esm/biz-components/LotteryShared/ChanceMethods.js +1 -1
- package/dist/esm/biz-components/LotteryShared/ChanceMethods.js.map +2 -2
- package/dist/esm/biz-components/LotteryShared/types.d.ts +2 -0
- package/dist/esm/biz-components/LotteryShared/types.js.map +2 -2
- package/dist/esm/biz-components/ProductLottery/index.js +1 -1
- package/dist/esm/biz-components/ProductLottery/index.js.map +3 -3
- package/dist/esm/biz-components/ProductLottery/types.d.ts +7 -1
- package/dist/esm/biz-components/ProductLottery/types.js.map +2 -2
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/ProductLottery/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport { useState, useCallback, useImperativeHandle, forwardRef, useEffect, useRef } from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { DEFAULT_CHANCE_TITLE } from './types.js'\nimport { DEFAULT_CHANCE_METHODS } from '../LotteryShared/types.js'\nimport { Grid, GridItem } from '../../components/grid.js'\nimport { MediaDrawArea } from './MediaDrawArea.js'\nimport { PrizePool } from '../LotteryShared/PrizePool.js'\nimport { ChanceMethods } from '../LotteryShared/ChanceMethods.js'\nimport { WinnerModal } from '../LotteryShared/WinnerModal.js'\nimport { RulesModal } from '../LotteryShared/RulesModal.js'\nimport { MyRewardsModal } from '../LotteryShared/MyRewardsModal.js'\nimport { ErrorModal } from '../LotteryShared/ErrorModal.js'\nimport { ShareModal } from '../LotteryShared/ShareModal.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef, buildTrackingRef } from '../../shared/trackUrlRef.js'\n\nimport type { ProductLotteryProps, ProductLotteryHandle } from './types.js'\nimport type { Prize, WinnerModalConfig, ChanceInputConfig } from '../LotteryShared/types.js'\n\nconst LOTTERY_COMPONENT_TYPE = 'image'\nconst LOTTERY_COMPONENT_NAME = 'lottery_banner'\nconst LOTTERY_COMPONENT_TITLE = '\u4EA7\u54C1\u62BD\u5956'\nconst LOTTERY_CLICK_TYPE = 'copy'\nconst LOTTERY_MODAL_COMPONENT_NAME = 'lottery_pop'\nconst LOTTERY_MODAL_COMPONENT_TYPE = 'image'\n\nexport const ProductLottery = forwardRef<ProductLotteryHandle, ProductLotteryProps>(\n (\n {\n prizes,\n media,\n theme,\n ctaButton,\n videoAutoPlay,\n videoMuted,\n videoLoop,\n chanceMethods = DEFAULT_CHANCE_METHODS,\n chanceTitle = DEFAULT_CHANCE_TITLE,\n chanceSubtitle,\n chanceFooterNote,\n chanceMethodsText,\n mechanismType,\n inputConfig,\n inputPlaceholder,\n inputSubmitText,\n inputType,\n inputValidationErrorText,\n winnerTickerData = [],\n winningInfos,\n winnerNameTemplate,\n prizesTitle,\n onDrawStart,\n onDrawEnd,\n onDrawError,\n winnerModalConfig,\n rulesModalConfig = {},\n actionButtonConfig,\n myRewardsModalConfig = {},\n errorModalConfig = {},\n shareModalConfig = {},\n error,\n tryAgain,\n userData,\n loginPrompt,\n loginPromptText = 'Please log in to participate',\n loginButtonText = 'Log In',\n onLoginRequired,\n onCopyCode,\n opportunitiesPrefix,\n opportunitiesText = ['Number of draws remaining today:'],\n dealsType,\n className,\n },\n ref\n ) => {\n // \u2500\u2500 CMS field normalization \u2500\u2500\n // CMS-primary strategy: CMS fields take precedence over legacy backward-compat fields.\n // If a CMS field is provided, it overrides the corresponding legacy field.\n const resolvedLoginPrompt = loginPrompt ?? loginPromptText ?? 'Please log in to participate'\n const resolvedOpportunitiesText: string[] = opportunitiesPrefix\n ? [opportunitiesPrefix]\n : (opportunitiesText ?? ['Number of draws remaining today:'])\n const resolvedInputConfig: ChanceInputConfig | undefined =\n inputPlaceholder || inputSubmitText || inputType || inputValidationErrorText\n ? {\n ...(inputConfig ?? {}),\n placeholder: inputPlaceholder ?? inputConfig?.placeholder ?? 'Enter your order number',\n submitText: inputSubmitText ?? inputConfig?.submitText ?? 'Spin and Win',\n inputType: inputType ?? inputConfig?.inputType ?? 'text',\n validationErrorText: inputValidationErrorText ?? inputConfig?.validationErrorText,\n }\n : inputConfig\n const resolvedErrorConfig = error\n ? {\n title: error.title ?? errorModalConfig?.title,\n message: error.defaultMessage ?? errorModalConfig?.message,\n confirmText: error.confirmButton ?? errorModalConfig?.confirmText,\n exchangeFailedTitle: error.exchangeFailedTitle,\n exchangeFailedMessage: error.exchangeFailedMessage,\n }\n : errorModalConfig\n const resolvedWinnerConfig: WinnerModalConfig = {\n ...winningInfos,\n ...winnerModalConfig,\n confirmText: winnerModalConfig?.confirmText ?? winningInfos?.confirmButton,\n }\n\n const { rulesData, rulesText = 'Rules' } = rulesModalConfig\n const shouldShowActionButton = Boolean(actionButtonConfig?.text && actionButtonConfig?.url)\n const {\n rewardsData,\n myRewardsText = 'My Rewards',\n codeText = 'CODE:',\n copyText = 'COPY',\n copiedText = 'COPIED',\n prizeText = 'Prize time:',\n emptyText,\n copyError,\n availableText,\n usedStatusText,\n expiredText,\n notFoundText,\n } = myRewardsModalConfig\n const completedText = chanceMethodsText?.completedText\n const usedText = chanceMethodsText?.usedText\n const isLoggedIn = userData?.isLoggedIn ?? false\n const availableChances = userData?.availableChances ?? 0\n const hasRightPanel = chanceMethods.length > 0 || mechanismType === 'input'\n const hasAgreementNotice = mechanismType === 'input' && Boolean(inputConfig?.agreementNotice)\n\n // State\n const [isDrawing, setIsDrawing] = useState(false)\n const [winningPrize, setWinningPrize] = useState<Prize | null>(null)\n const [showWinnerModal, setShowWinnerModal] = useState(false)\n const [showRulesModal, setShowRulesModal] = useState(false)\n const [showRewardsModal, setShowRewardsModal] = useState(false)\n const [showErrorModal, setShowErrorModal] = useState(false)\n const [showNoWinModal, setShowNoWinModal] = useState(false)\n const [showShareModal, setShowShareModal] = useState(false)\n const [errorMessage, setErrorMessage] = useState('')\n const [errorTitle, setErrorTitle] = useState<string | undefined>()\n const [errorConfirmText, setErrorConfirmText] = useState<string | undefined>()\n const [noWinTitle, setNoWinTitle] = useState<string | undefined>()\n const [noWinMessage, setNoWinMessage] = useState<string | undefined>()\n const [noWinConfirmText, setNoWinConfirmText] = useState<string | undefined>()\n const [externalWinnerConfig, setExternalWinnerConfig] = useState<Partial<WinnerModalConfig> | undefined>()\n const [isAgreementChecked, setIsAgreementChecked] = useState(false)\n\n // Exposure tracking\n const containerRef = useRef<HTMLDivElement>(null)\n useExposure(containerRef, {\n componentType: LOTTERY_COMPONENT_TYPE,\n componentName: LOTTERY_COMPONENT_NAME,\n componentTitle: LOTTERY_COMPONENT_TITLE,\n })\n\n // Tracking\n const { trackingData, pageHandle } = useAiuiContext()\n\n // Modal impression tracking \u2014 fires once per open\n useEffect(() => {\n if (!showWinnerModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Winner',\n },\n })\n }, [showWinnerModal, trackingData])\n\n useEffect(() => {\n if (!showNoWinModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Better Luck Next Time',\n },\n })\n }, [showNoWinModal, trackingData])\n\n useEffect(() => {\n if (!showRulesModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Rules',\n },\n })\n }, [showRulesModal, trackingData])\n\n useEffect(() => {\n if (!showRewardsModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'My Rewards',\n },\n })\n }, [showRewardsModal, trackingData])\n\n useEffect(() => {\n if (!showShareModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Share',\n },\n })\n }, [showShareModal, trackingData])\n\n useEffect(() => {\n if (!showErrorModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Error',\n },\n })\n }, [showErrorModal, trackingData])\n\n useImperativeHandle(\n ref,\n () => ({\n showError: ({ message, title, confirmText }) => {\n setErrorMessage(message)\n setErrorTitle(title)\n setErrorConfirmText(confirmText)\n setShowErrorModal(true)\n },\n hideError: () => {\n setShowErrorModal(false)\n },\n showNoWin: config => {\n setNoWinTitle(config?.title)\n setNoWinMessage(config?.message)\n setNoWinConfirmText(config?.confirmText)\n setShowNoWinModal(true)\n },\n hideNoWin: () => {\n setShowNoWinModal(false)\n },\n showWinner: (prize, config) => {\n setWinningPrize(prize)\n setExternalWinnerConfig(config)\n setShowWinnerModal(true)\n },\n hideWinner: () => {\n setShowWinnerModal(false)\n },\n showRules: () => {\n setShowRulesModal(true)\n },\n hideRules: () => {\n setShowRulesModal(false)\n },\n showRewards: () => {\n setShowRewardsModal(true)\n },\n hideRewards: () => {\n setShowRewardsModal(false)\n },\n showShare: () => {\n setShowShareModal(true)\n },\n hideShare: () => {\n setShowShareModal(false)\n },\n hideAllModals: () => {\n setShowWinnerModal(false)\n setShowRulesModal(false)\n setShowRewardsModal(false)\n setShowErrorModal(false)\n setShowNoWinModal(false)\n setShowShareModal(false)\n },\n }),\n []\n )\n\n const handleDrawStart = useCallback(async () => {\n if (isDrawing) return\n\n if (hasAgreementNotice && !isAgreementChecked) {\n setErrorMessage(inputConfig?.agreementWarningText || 'Please agree to the terms before continuing')\n setShowErrorModal(false)\n return\n }\n\n if (!userData?.isLoggedIn) {\n onLoginRequired?.()\n return\n }\n\n if (userData.availableChances <= 0) {\n return\n }\n\n setIsDrawing(true)\n\n try {\n let prizeId: string | undefined\n\n if (onDrawStart) {\n prizeId = await onDrawStart()\n }\n\n const prize = prizes.find(p => p.prizeKey === prizeId) || prizes[0]\n setWinningPrize(prize)\n setIsDrawing(false)\n\n if (onDrawEnd) {\n onDrawEnd(prize)\n } else {\n setTimeout(() => {\n if (prize.prizeKey === 'try-again') {\n setShowNoWinModal(true)\n } else {\n setShowWinnerModal(true)\n }\n }, 300)\n }\n } catch (error) {\n setIsDrawing(false)\n setErrorMessage((error as Error).message || 'An error occurred')\n setShowErrorModal(true)\n onDrawError?.(error as Error)\n }\n }, [\n hasAgreementNotice,\n inputConfig?.agreementWarningText,\n isAgreementChecked,\n isDrawing,\n prizes,\n onDrawStart,\n onDrawEnd,\n onDrawError,\n userData,\n onLoginRequired,\n ])\n\n const handleDrawClick = useCallback(() => {\n if (!isLoggedIn) {\n onLoginRequired?.()\n return\n }\n void handleDrawStart()\n }, [handleDrawStart, isLoggedIn, onLoginRequired])\n\n const handleCloseWinnerModal = useCallback(() => {\n setShowWinnerModal(false)\n }, [])\n\n const handleCloseNoWinModal = useCallback(() => {\n setShowNoWinModal(false)\n }, [])\n\n // \u2500\u2500 TryAgain / no-win modal normalization \u2500\u2500\n const resolvedTryAgainTitle = noWinTitle || tryAgain?.title\n const resolvedTryAgainMessage = noWinMessage || tryAgain?.message\n const resolvedTryAgainConfirmText = noWinConfirmText || tryAgain?.confirmText\n\n return (\n <div\n ref={containerRef}\n className={cn('product-lottery-container', 'w-full', theme === 'dark' ? 'aiui-dark' : '', className)}\n >\n {/* ARIA Live Region */}\n <div role=\"status\" aria-live=\"polite\" aria-atomic=\"true\" className=\"sr-only\">\n {isDrawing && 'Drawing in progress...'}\n {winningPrize && !isDrawing && `Prize won: ${winningPrize.name}`}\n </div>\n\n {/* Main Content \u2014 Responsive Grid */}\n <Grid className={cn('product-lottery-main', 'tablet:mb-4 mb-3')}>\n {/* Left: Media Draw Area */}\n <GridItem\n span={hasRightPanel ? 7 : 12}\n className={cn(\n 'media-section',\n 'relative flex w-full flex-1 items-center justify-center overflow-hidden',\n 'rounded-box',\n 'laptop:min-h-[288px] min-h-[240px]',\n 'lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[480]',\n 'desktop:aspect-w-[759] desktop:aspect-h-[384]',\n 'laptop:aspect-w-[516] laptop:aspect-h-[288]',\n 'l-tablet:col-span-12',\n 'l-tablet:mb-3',\n theme === 'dark' ? 'bg-[#1E2024]' : 'bg-[#EAEAEC]'\n )}\n >\n <div\n className={cn(\n 'size-full px-[16px] pt-[16px]',\n 'lg-desktop:pb-[32px] lg-desktop:px-[32px]',\n 'desktop:pt-[24px] desktop:px-[24px]',\n 'laptop:pt-[16px] laptop:px-[16px]',\n 'tablet:px-[24px]',\n 'l-tablet:absolute l-tablet:top-0 l-tablet:inset-x-0 l-tablet:z-10',\n 'flex flex-col'\n )}\n >\n {/* Top bar: chances + rules/rewards links */}\n <div className=\"relative z-30 mb-2 flex max-h-[24px] w-full flex-wrap items-center justify-between gap-3\">\n <div>\n <p className=\"text-info-primary font-[700]\">\n {resolvedOpportunitiesText?.[0]}\n <span className=\"ml-1 text-[#FF6B35]\">{availableChances}</span>\n {resolvedOpportunitiesText?.[1] || ''}\n </p>\n </div>\n <div className=\"flex items-center gap-4\">\n {rulesData && rulesData.length > 0 && (\n <button\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n setShowRulesModal(true)\n }}\n className=\"cursor-pointer touch-manipulation\"\n type=\"button\"\n data-headless-type-name={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n data-headless-title-desc-button={`${LOTTERY_COMPONENT_TITLE}##${rulesText}`}\n >\n <span className=\"text-info-primary font-[700] underline\">{rulesText}</span>\n </button>\n )}\n {rewardsData && (\n <button\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n if (!isLoggedIn) {\n onLoginRequired?.()\n return\n }\n setShowRewardsModal(true)\n }}\n className=\"cursor-pointer touch-manipulation whitespace-nowrap\"\n type=\"button\"\n data-headless-type-name={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n data-headless-title-desc-button={`${LOTTERY_COMPONENT_TITLE}##${myRewardsText}`}\n >\n <span className=\"text-info-primary font-[700] underline\">{myRewardsText}</span>\n </button>\n )}\n {shouldShowActionButton && (\n <a\n href={trackUrlRef(\n actionButtonConfig?.url ?? '',\n buildTrackingRef(pageHandle ?? '', LOTTERY_CLICK_TYPE, LOTTERY_COMPONENT_NAME)\n )}\n className=\"cursor-pointer touch-manipulation whitespace-nowrap\"\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n if (actionButtonConfig?.url) {\n window.location.href = trackUrlRef(\n actionButtonConfig.url,\n buildTrackingRef(pageHandle ?? '', LOTTERY_CLICK_TYPE, LOTTERY_COMPONENT_NAME)\n )\n }\n }}\n data-headless-type-name={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n data-headless-title-desc-button={`${LOTTERY_COMPONENT_TITLE}##${actionButtonConfig?.text}`}\n >\n <span className=\"text-info-primary font-[700] underline\">{actionButtonConfig?.text}</span>\n </a>\n )}\n </div>\n </div>\n\n {/* Media Draw Area */}\n <MediaDrawArea\n className=\"min-h-0 w-full flex-1\"\n theme={theme}\n media={media}\n ctaButton={ctaButton}\n videoAutoPlay={videoAutoPlay}\n videoMuted={videoMuted}\n videoLoop={videoLoop}\n isDrawing={isDrawing}\n onClick={handleDrawClick}\n ctaTrackTypeName={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n ctaTrackTitleDescButton={`${LOTTERY_COMPONENT_TITLE}##${ctaButton?.text ?? ''}`}\n />\n </div>\n </GridItem>\n\n {/* Right: Chance Methods */}\n {hasRightPanel && (\n <GridItem\n span={5}\n className={cn(\n 'info-section',\n 'rounded-box',\n 'relative flex flex-col overflow-hidden',\n 'lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[480]',\n 'desktop:aspect-w-[536] desktop:aspect-h-[384]',\n 'laptop:aspect-w-[364] laptop:aspect-h-[288]',\n 'l-tablet:min-h-[280px] laptop:max-h-[320px]',\n 'w-full',\n 'l-tablet:col-span-12',\n theme === 'dark' ? 'bg-[#1E2024]' : 'bg-[#EAEAEC]'\n )}\n >\n <ChanceMethods\n theme={theme}\n userData={userData}\n methods={chanceMethods}\n title={chanceTitle}\n subtitle={chanceSubtitle}\n footerNote={chanceFooterNote}\n onOpenShareModal={() => setShowShareModal(true)}\n chanceBadgeText={chanceMethodsText?.chanceBadgeText}\n completedText={completedText}\n usedText={usedText}\n loadingText={chanceMethodsText?.loadingText}\n mechanismType={mechanismType}\n inputConfig={{\n ...resolvedInputConfig,\n submitTrackTypeName: `${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`,\n submitTrackTitleDescButton: `${LOTTERY_COMPONENT_TITLE}##${resolvedInputConfig?.submitText ?? 'Spin and Win'}`,\n }}\n isAgreementChecked={isAgreementChecked}\n onAgreementCheckedChange={checked => {\n setIsAgreementChecked(checked)\n if (checked) {\n setErrorMessage('')\n }\n }}\n agreementErrorText={errorMessage}\n />\n </GridItem>\n )}\n </Grid>\n\n {/* Footer: Prize Pool */}\n <div\n className={cn(\n 'product-lottery-footer',\n 'rounded-box',\n 'flex flex-col overflow-hidden',\n theme === 'dark' ? 'bg-[#1E2024]' : 'bg-[#EAEAEC]'\n )}\n >\n <PrizePool\n theme={theme}\n prizes={prizes}\n title={prizesTitle}\n winningInfos={winnerTickerData}\n winnerNameTemplate={winnerNameTemplate}\n />\n </div>\n\n {/* Winner Modal */}\n <WinnerModal\n isOpen={showWinnerModal}\n prize={winningPrize}\n title={externalWinnerConfig?.title || resolvedWinnerConfig.title}\n prizeTitle={externalWinnerConfig?.prizeTitle || resolvedWinnerConfig.prizeTitle}\n prizeImage={externalWinnerConfig?.prizeImage || resolvedWinnerConfig.prizeImage}\n prizeDescription={externalWinnerConfig?.prizeDescription || resolvedWinnerConfig.prizeDescription}\n winnerNote={\n externalWinnerConfig?.winnerNote ??\n winningPrize?.winnerModalConfig?.winnerNote ??\n resolvedWinnerConfig.winnerNote\n }\n learnMoreUrl={\n externalWinnerConfig?.learnMoreUrl ||\n winningPrize?.winnerModalConfig?.learnMoreUrl ||\n resolvedWinnerConfig.learnMoreUrl\n }\n learnMoreText={\n externalWinnerConfig?.learnMoreText ||\n winningPrize?.winnerModalConfig?.learnMoreText ||\n resolvedWinnerConfig.learnMoreText\n }\n couponCode={externalWinnerConfig?.couponCode || resolvedWinnerConfig.couponCode}\n expiresAt={externalWinnerConfig?.expiresAt || resolvedWinnerConfig.expiresAt}\n expiresAtLabel={externalWinnerConfig?.expiresAtLabel || resolvedWinnerConfig.expiresAtLabel}\n couponDiscount={externalWinnerConfig?.couponDiscount || resolvedWinnerConfig.couponDiscount}\n couponUnit={externalWinnerConfig?.couponUnit || resolvedWinnerConfig.couponUnit}\n confirmText={\n externalWinnerConfig?.confirmText ||\n winningPrize?.winnerModalConfig?.confirmText ||\n resolvedWinnerConfig.confirmText\n }\n confirmUrl={\n externalWinnerConfig?.confirmUrl ||\n winningPrize?.winnerModalConfig?.confirmUrl ||\n resolvedWinnerConfig.confirmUrl\n }\n copyText={externalWinnerConfig?.copyText || resolvedWinnerConfig.copyText || copyText}\n copiedText={externalWinnerConfig?.copiedText || resolvedWinnerConfig.copiedText || copiedText}\n onClose={handleCloseWinnerModal}\n theme={theme}\n />\n\n {/* Rules Modal */}\n {rulesData && rulesData.length > 0 && (\n <RulesModal\n title={rulesText}\n isOpen={showRulesModal}\n onClose={() => setShowRulesModal(false)}\n rules={rulesData}\n theme={theme}\n />\n )}\n\n {/* My Rewards Modal */}\n {rewardsData && (\n <MyRewardsModal\n isOpen={showRewardsModal}\n onClose={() => setShowRewardsModal(false)}\n rewards={rewardsData}\n onCopyCode={onCopyCode}\n codeText={codeText}\n copyText={copyText}\n copiedText={copiedText}\n prizeText={prizeText}\n emptyText={emptyText}\n copyError={copyError}\n availableText={availableText}\n usedStatusText={usedStatusText}\n expiredText={expiredText}\n notFoundText={notFoundText}\n theme={theme}\n title={myRewardsText}\n />\n )}\n\n {/* Error Modal */}\n <ErrorModal\n isOpen={showErrorModal}\n onClose={() => setShowErrorModal(false)}\n title={errorTitle || resolvedErrorConfig?.title}\n message={errorMessage || resolvedErrorConfig?.message}\n confirmText={errorConfirmText || resolvedErrorConfig?.confirmText}\n exchangeFailedTitle={resolvedErrorConfig?.exchangeFailedTitle}\n exchangeFailedMessage={resolvedErrorConfig?.exchangeFailedMessage}\n theme={theme}\n />\n\n {/* No-Win Modal */}\n <ErrorModal\n isOpen={showNoWinModal}\n onClose={handleCloseNoWinModal}\n title={resolvedTryAgainTitle}\n message={resolvedTryAgainMessage}\n confirmText={resolvedTryAgainConfirmText}\n theme={theme}\n />\n\n {/* Share Modal */}\n <ShareModal\n isOpen={showShareModal}\n onClose={() => setShowShareModal(false)}\n title={shareModalConfig?.title}\n subtitle={shareModalConfig?.subtitle}\n note={shareModalConfig?.note}\n platforms={shareModalConfig?.platforms}\n onShareSuccess={shareModalConfig?.onShareSuccess}\n theme={theme}\n />\n </div>\n )\n }\n)\n\nProductLottery.displayName = 'ProductLottery'\n\nexport default withLayout(ProductLottery)\nexport { WinnerModal } from '../LotteryShared/WinnerModal.js'\nexport { RulesModal } from '../LotteryShared/RulesModal.js'\nexport { MyRewardsModal } from '../LotteryShared/MyRewardsModal.js'\nexport { ErrorModal } from '../LotteryShared/ErrorModal.js'\nexport { ShareModal } from '../LotteryShared/ShareModal.js'\nexport { BaseModal } from '../LotteryShared/BaseModal.js'\nexport type {\n ProductLotteryProps,\n ProductLotteryHandle,\n MediaConfig,\n CtaButtonConfig,\n MediaDrawAreaProps,\n} from './types.js'\nexport type {\n Prize,\n ChanceMethod,\n ChanceMethodStatus,\n WinningInfo,\n PrizePoolProps,\n ChanceMethodsProps,\n WinnerModalProps,\n WinnerModalConfig,\n UserData,\n ShareModalConfig,\n SocialPlatform,\n SharePlatformConfig,\n} from '../LotteryShared/types.js'\nexport type { RulesModalProps, RuleItem } from '../LotteryShared/RulesModal.js'\nexport type { MyRewardsModalProps, Reward, RewardStatus } from '../LotteryShared/MyRewardsModal.js'\nexport type { ErrorModalProps } from '../LotteryShared/ErrorModal.js'\nexport type { ShareModalProps } from '../LotteryShared/ShareModal.js'\nexport type { BaseModalProps } from '../LotteryShared/BaseModal.js'\nexport type { ContainerProps } from '../../shared/Styles.js'\n"],
|
|
5
|
-
"mappings": "ocAAA,IAAAA,GAAA,GAAAC,GAAAD,GAAA,iHAAAE,GAAA,qGAAAC,KAAA,eAAAC,GAAAJ,
|
|
6
|
-
"names": ["ProductLottery_exports", "__export", "ProductLottery", "ProductLottery_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_helpers", "import_types", "import_grid", "import_MediaDrawArea", "import_PrizePool", "import_ChanceMethods", "import_WinnerModal", "import_RulesModal", "import_MyRewardsModal", "import_ErrorModal", "import_ShareModal", "import_Styles", "import_track", "import_AiuiProvider", "import_useExposure", "import_trackUrlRef", "import_BaseModal", "LOTTERY_COMPONENT_TYPE", "LOTTERY_COMPONENT_NAME", "LOTTERY_COMPONENT_TITLE", "LOTTERY_CLICK_TYPE", "LOTTERY_MODAL_COMPONENT_NAME", "LOTTERY_MODAL_COMPONENT_TYPE", "prizes", "media", "theme", "ctaButton", "videoAutoPlay", "videoMuted", "videoLoop", "chanceMethods", "chanceTitle", "chanceSubtitle", "chanceFooterNote", "chanceMethodsText", "mechanismType", "inputConfig", "inputPlaceholder", "inputSubmitText", "inputType", "inputValidationErrorText", "winnerTickerData", "winningInfos", "winnerNameTemplate", "prizesTitle", "onDrawStart", "onDrawEnd", "onDrawError", "winnerModalConfig", "rulesModalConfig", "actionButtonConfig", "myRewardsModalConfig", "errorModalConfig", "shareModalConfig", "error", "tryAgain", "userData", "loginPrompt", "loginPromptText", "loginButtonText", "onLoginRequired", "onCopyCode", "opportunitiesPrefix", "opportunitiesText", "dealsType", "className", "ref", "resolvedLoginPrompt", "resolvedOpportunitiesText", "resolvedInputConfig", "resolvedErrorConfig", "resolvedWinnerConfig", "rulesData", "rulesText", "shouldShowActionButton", "rewardsData", "myRewardsText", "codeText", "copyText", "copiedText", "prizeText", "emptyText", "copyError", "availableText", "usedStatusText", "expiredText", "notFoundText", "completedText", "usedText", "isLoggedIn", "availableChances", "hasRightPanel", "hasAgreementNotice", "isDrawing", "setIsDrawing", "winningPrize", "setWinningPrize", "showWinnerModal", "setShowWinnerModal", "showRulesModal", "setShowRulesModal", "showRewardsModal", "setShowRewardsModal", "showErrorModal", "setShowErrorModal", "showNoWinModal", "setShowNoWinModal", "showShareModal", "setShowShareModal", "errorMessage", "setErrorMessage", "errorTitle", "setErrorTitle", "errorConfirmText", "setErrorConfirmText", "noWinTitle", "setNoWinTitle", "noWinMessage", "setNoWinMessage", "noWinConfirmText", "setNoWinConfirmText", "externalWinnerConfig", "setExternalWinnerConfig", "isAgreementChecked", "setIsAgreementChecked", "containerRef", "trackingData", "pageHandle", "message", "title", "confirmText", "config", "prize", "handleDrawStart", "prizeId", "p", "handleDrawClick", "handleCloseWinnerModal", "handleCloseNoWinModal", "resolvedTryAgainTitle", "resolvedTryAgainMessage", "resolvedTryAgainConfirmText", "e", "checked"]
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport { useState, useCallback, useImperativeHandle, forwardRef, useEffect, useRef } from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { DEFAULT_CHANCE_TITLE } from './types.js'\nimport { DEFAULT_CHANCE_METHODS } from '../LotteryShared/types.js'\nimport { Grid, GridItem } from '../../components/grid.js'\nimport { MediaDrawArea } from './MediaDrawArea.js'\nimport { PrizePool } from '../LotteryShared/PrizePool.js'\nimport { ChanceMethods } from '../LotteryShared/ChanceMethods.js'\nimport { WinnerModal } from '../LotteryShared/WinnerModal.js'\nimport { RulesModal } from '../LotteryShared/RulesModal.js'\nimport { MyRewardsModal } from '../LotteryShared/MyRewardsModal.js'\nimport { ErrorModal } from '../LotteryShared/ErrorModal.js'\nimport { ShareModal } from '../LotteryShared/ShareModal.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef, buildTrackingRef } from '../../shared/trackUrlRef.js'\n\nimport type { ProductLotteryProps, ProductLotteryHandle } from './types.js'\nimport type { Prize, WinnerModalConfig, ChanceInputConfig } from '../LotteryShared/types.js'\n\nconst LOTTERY_COMPONENT_TYPE = 'image'\nconst LOTTERY_COMPONENT_NAME = 'lottery_banner'\nconst LOTTERY_COMPONENT_TITLE = '\u4EA7\u54C1\u62BD\u5956'\nconst LOTTERY_CLICK_TYPE = 'copy'\nconst LOTTERY_MODAL_COMPONENT_NAME = 'lottery_pop'\nconst LOTTERY_MODAL_COMPONENT_TYPE = 'image'\n\nexport const ProductLottery = forwardRef<ProductLotteryHandle, ProductLotteryProps>(\n (\n {\n prizes,\n media,\n theme,\n ctaButton,\n videoAutoPlay,\n videoMuted,\n videoLoop,\n chanceMethods = DEFAULT_CHANCE_METHODS,\n chanceTitle = DEFAULT_CHANCE_TITLE,\n chanceSubtitle,\n chanceFooterNote,\n chanceMethodsText,\n mechanismType,\n inputConfig,\n inputPlaceholder,\n inputSubmitText,\n inputType,\n inputValidationErrorText,\n inputLoadingText,\n winnerTickerData = [],\n winningInfos,\n winnerNameTemplate,\n prizesTitle,\n onDrawStart,\n onDrawEnd,\n onDrawError,\n winnerModalConfig,\n rulesModalConfig = {},\n actionButtonConfig,\n myRewardsModalConfig = {},\n errorModalConfig = {},\n shareModalConfig = {},\n error,\n tryAgain,\n userData,\n loginPrompt,\n loginPromptText = 'Please log in to participate',\n loginButtonText = 'Log In',\n onLoginRequired,\n onCopyCode,\n opportunitiesPrefix,\n opportunitiesText = ['Number of draws remaining today:'],\n dealsType,\n className,\n },\n ref\n ) => {\n // \u2500\u2500 CMS field normalization \u2500\u2500\n // CMS-primary strategy: CMS fields take precedence over legacy backward-compat fields.\n // If a CMS field is provided, it overrides the corresponding legacy field.\n const resolvedLoginPrompt = loginPrompt ?? loginPromptText ?? 'Please log in to participate'\n const resolvedOpportunitiesText: string[] = opportunitiesPrefix\n ? [opportunitiesPrefix]\n : (opportunitiesText ?? ['Number of draws remaining today:'])\n const resolvedInputConfig: ChanceInputConfig | undefined =\n inputPlaceholder || inputSubmitText || inputType || inputValidationErrorText || inputLoadingText\n ? {\n ...(inputConfig ?? {}),\n placeholder: inputPlaceholder ?? inputConfig?.placeholder ?? 'Enter your order number',\n submitText: inputSubmitText ?? inputConfig?.submitText ?? 'Spin and Win',\n inputType: inputType ?? inputConfig?.inputType ?? 'text',\n validationErrorText: inputValidationErrorText ?? inputConfig?.validationErrorText,\n loadingText: inputLoadingText ?? inputConfig?.loadingText,\n }\n : inputConfig\n const resolvedErrorConfig = error\n ? {\n title: error.title ?? errorModalConfig?.title,\n message: error.defaultMessage ?? errorModalConfig?.message,\n confirmText: error.confirmButton ?? errorModalConfig?.confirmText,\n exchangeFailedTitle: error.exchangeFailedTitle,\n exchangeFailedMessage: error.exchangeFailedMessage,\n }\n : errorModalConfig\n const resolvedWinnerConfig: WinnerModalConfig = {\n ...winningInfos,\n ...winnerModalConfig,\n confirmText: winnerModalConfig?.confirmText ?? winningInfos?.confirmButton,\n }\n\n const { rulesData, rulesText = 'Rules' } = rulesModalConfig\n const shouldShowActionButton = Boolean(actionButtonConfig?.text && actionButtonConfig?.url)\n const {\n rewardsData,\n myRewardsText = 'My Rewards',\n codeText = 'CODE:',\n copyText = 'COPY',\n copiedText = 'COPIED',\n prizeText = 'Prize time:',\n emptyText,\n copyError,\n availableText,\n usedStatusText,\n expiredText,\n notFoundText,\n } = myRewardsModalConfig\n const completedText = chanceMethodsText?.completedText\n const usedText = chanceMethodsText?.usedText\n const isLoggedIn = userData?.isLoggedIn ?? false\n const availableChances = userData?.availableChances ?? 0\n const hasRightPanel = chanceMethods.length > 0 || mechanismType === 'input'\n const hasAgreementNotice = mechanismType === 'input' && Boolean(inputConfig?.agreementNotice)\n\n // State\n const [isDrawing, setIsDrawing] = useState(false)\n const [winningPrize, setWinningPrize] = useState<Prize | null>(null)\n const [showWinnerModal, setShowWinnerModal] = useState(false)\n const [showRulesModal, setShowRulesModal] = useState(false)\n const [showRewardsModal, setShowRewardsModal] = useState(false)\n const [showErrorModal, setShowErrorModal] = useState(false)\n const [showNoWinModal, setShowNoWinModal] = useState(false)\n const [showShareModal, setShowShareModal] = useState(false)\n const [errorMessage, setErrorMessage] = useState('')\n const [errorTitle, setErrorTitle] = useState<string | undefined>()\n const [errorConfirmText, setErrorConfirmText] = useState<string | undefined>()\n const [noWinTitle, setNoWinTitle] = useState<string | undefined>()\n const [noWinMessage, setNoWinMessage] = useState<string | undefined>()\n const [noWinConfirmText, setNoWinConfirmText] = useState<string | undefined>()\n const [externalWinnerConfig, setExternalWinnerConfig] = useState<Partial<WinnerModalConfig> | undefined>()\n const [isAgreementChecked, setIsAgreementChecked] = useState(false)\n\n // Exposure tracking\n const containerRef = useRef<HTMLDivElement>(null)\n useExposure(containerRef, {\n componentType: LOTTERY_COMPONENT_TYPE,\n componentName: LOTTERY_COMPONENT_NAME,\n componentTitle: LOTTERY_COMPONENT_TITLE,\n })\n\n // Tracking\n const { trackingData, pageHandle } = useAiuiContext()\n\n // Modal impression tracking \u2014 fires once per open\n useEffect(() => {\n if (!showWinnerModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Winner',\n },\n })\n }, [showWinnerModal, trackingData])\n\n useEffect(() => {\n if (!showNoWinModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Better Luck Next Time',\n },\n })\n }, [showNoWinModal, trackingData])\n\n useEffect(() => {\n if (!showRulesModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Rules',\n },\n })\n }, [showRulesModal, trackingData])\n\n useEffect(() => {\n if (!showRewardsModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'My Rewards',\n },\n })\n }, [showRewardsModal, trackingData])\n\n useEffect(() => {\n if (!showShareModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Share',\n },\n })\n }, [showShareModal, trackingData])\n\n useEffect(() => {\n if (!showErrorModal) return\n gaTrack({\n event: 'ga4Event',\n event_name: 'component_impression',\n event_parameters: {\n page_group: trackingData?.pageGroup || 'Home Page',\n component_type: LOTTERY_MODAL_COMPONENT_TYPE,\n component_name: LOTTERY_MODAL_COMPONENT_NAME,\n component_title: 'Error',\n },\n })\n }, [showErrorModal, trackingData])\n\n useImperativeHandle(\n ref,\n () => ({\n showError: ({ message, title, confirmText }) => {\n setErrorMessage(message)\n setErrorTitle(title)\n setErrorConfirmText(confirmText)\n setShowErrorModal(true)\n },\n hideError: () => {\n setShowErrorModal(false)\n },\n showNoWin: config => {\n setNoWinTitle(config?.title)\n setNoWinMessage(config?.message)\n setNoWinConfirmText(config?.confirmText)\n setShowNoWinModal(true)\n },\n hideNoWin: () => {\n setShowNoWinModal(false)\n },\n showWinner: (prize, config) => {\n setWinningPrize(prize)\n setExternalWinnerConfig(config)\n setShowWinnerModal(true)\n },\n hideWinner: () => {\n setShowWinnerModal(false)\n },\n showRules: () => {\n setShowRulesModal(true)\n },\n hideRules: () => {\n setShowRulesModal(false)\n },\n showRewards: () => {\n setShowRewardsModal(true)\n },\n hideRewards: () => {\n setShowRewardsModal(false)\n },\n showShare: () => {\n setShowShareModal(true)\n },\n hideShare: () => {\n setShowShareModal(false)\n },\n hideAllModals: () => {\n setShowWinnerModal(false)\n setShowRulesModal(false)\n setShowRewardsModal(false)\n setShowErrorModal(false)\n setShowNoWinModal(false)\n setShowShareModal(false)\n },\n }),\n []\n )\n\n const handleDrawStart = useCallback(async () => {\n if (isDrawing) return\n\n if (hasAgreementNotice && !isAgreementChecked) {\n setErrorMessage(inputConfig?.agreementWarningText || 'Please agree to the terms before continuing')\n setShowErrorModal(false)\n return\n }\n\n if (!userData?.isLoggedIn) {\n onLoginRequired?.()\n return\n }\n\n if (userData.availableChances <= 0) {\n return\n }\n\n setIsDrawing(true)\n\n try {\n let prizeId: string | undefined\n\n if (onDrawStart) {\n prizeId = await onDrawStart()\n }\n\n const prize = prizes.find(p => p.prizeKey === prizeId) || prizes[0]\n setWinningPrize(prize)\n setIsDrawing(false)\n\n if (onDrawEnd) {\n onDrawEnd(prize)\n } else {\n setTimeout(() => {\n if (prize.prizeKey === 'try-again') {\n setShowNoWinModal(true)\n } else {\n setShowWinnerModal(true)\n }\n }, 300)\n }\n } catch (error) {\n setIsDrawing(false)\n setErrorMessage((error as Error).message || 'An error occurred')\n setShowErrorModal(true)\n onDrawError?.(error as Error)\n }\n }, [\n hasAgreementNotice,\n inputConfig?.agreementWarningText,\n isAgreementChecked,\n isDrawing,\n prizes,\n onDrawStart,\n onDrawEnd,\n onDrawError,\n userData,\n onLoginRequired,\n ])\n\n const handleDrawClick = useCallback(() => {\n if (!isLoggedIn) {\n onLoginRequired?.()\n return\n }\n void handleDrawStart()\n }, [handleDrawStart, isLoggedIn, onLoginRequired])\n\n const handleCloseWinnerModal = useCallback(() => {\n setShowWinnerModal(false)\n }, [])\n\n const handleCloseNoWinModal = useCallback(() => {\n setShowNoWinModal(false)\n }, [])\n\n // \u2500\u2500 TryAgain / no-win modal normalization \u2500\u2500\n const resolvedTryAgainTitle = noWinTitle || tryAgain?.title\n const resolvedTryAgainMessage = noWinMessage || tryAgain?.message\n const resolvedTryAgainConfirmText = noWinConfirmText || tryAgain?.confirmText\n\n return (\n <div\n ref={containerRef}\n className={cn('product-lottery-container', 'w-full', theme === 'dark' ? 'aiui-dark' : '', className)}\n >\n {/* ARIA Live Region */}\n <div role=\"status\" aria-live=\"polite\" aria-atomic=\"true\" className=\"sr-only\">\n {isDrawing && 'Drawing in progress...'}\n {winningPrize && !isDrawing && `Prize won: ${winningPrize.name}`}\n </div>\n\n {/* Main Content \u2014 Responsive Grid */}\n <Grid className={cn('product-lottery-main', 'tablet:mb-4 mb-3')}>\n {/* Left: Media Draw Area */}\n <GridItem\n span={hasRightPanel ? 7 : 12}\n className={cn(\n 'media-section',\n 'relative flex w-full flex-1 items-center justify-center overflow-hidden',\n 'rounded-box',\n 'laptop:min-h-[288px] min-h-[240px]',\n 'lg-desktop:aspect-w-[964] lg-desktop:aspect-h-[480]',\n 'desktop:aspect-w-[759] desktop:aspect-h-[384]',\n 'laptop:aspect-w-[516] laptop:aspect-h-[288]',\n 'l-tablet:col-span-12',\n 'l-tablet:mb-3',\n theme === 'dark' ? 'bg-[#1E2024]' : 'bg-[#EAEAEC]'\n )}\n >\n <div\n className={cn(\n 'size-full px-[16px] pt-[16px]',\n 'lg-desktop:pb-[32px] lg-desktop:px-[32px]',\n 'desktop:pt-[24px] desktop:px-[24px]',\n 'laptop:pt-[16px] laptop:px-[16px]',\n 'tablet:px-[24px]',\n 'l-tablet:absolute l-tablet:top-0 l-tablet:inset-x-0 l-tablet:z-10',\n 'flex flex-col'\n )}\n >\n {/* Top bar: chances + rules/rewards links */}\n <div className=\"relative z-30 mb-2 flex max-h-[24px] w-full flex-wrap items-center justify-between gap-3\">\n <div>\n <p className=\"text-info-primary font-[700]\">\n {resolvedOpportunitiesText?.[0]}\n <span className=\"ml-1 text-[#FF6B35]\">{availableChances}</span>\n {resolvedOpportunitiesText?.[1] || ''}\n </p>\n </div>\n <div className=\"flex items-center gap-4\">\n {rulesData && rulesData.length > 0 && (\n <button\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n setShowRulesModal(true)\n }}\n className=\"cursor-pointer touch-manipulation\"\n type=\"button\"\n data-headless-type-name={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n data-headless-title-desc-button={`${LOTTERY_COMPONENT_TITLE}##${rulesText}`}\n >\n <span className=\"text-info-primary font-[700] underline\">{rulesText}</span>\n </button>\n )}\n {rewardsData && (\n <button\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n if (!isLoggedIn) {\n onLoginRequired?.()\n return\n }\n setShowRewardsModal(true)\n }}\n className=\"cursor-pointer touch-manipulation whitespace-nowrap\"\n type=\"button\"\n data-headless-type-name={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n data-headless-title-desc-button={`${LOTTERY_COMPONENT_TITLE}##${myRewardsText}`}\n >\n <span className=\"text-info-primary font-[700] underline\">{myRewardsText}</span>\n </button>\n )}\n {shouldShowActionButton && (\n <a\n href={trackUrlRef(\n actionButtonConfig?.url ?? '',\n buildTrackingRef(pageHandle ?? '', LOTTERY_CLICK_TYPE, LOTTERY_COMPONENT_NAME)\n )}\n className=\"cursor-pointer touch-manipulation whitespace-nowrap\"\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n if (actionButtonConfig?.url) {\n window.location.href = trackUrlRef(\n actionButtonConfig.url,\n buildTrackingRef(pageHandle ?? '', LOTTERY_CLICK_TYPE, LOTTERY_COMPONENT_NAME)\n )\n }\n }}\n data-headless-type-name={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n data-headless-title-desc-button={`${LOTTERY_COMPONENT_TITLE}##${actionButtonConfig?.text}`}\n >\n <span className=\"text-info-primary font-[700] underline\">{actionButtonConfig?.text}</span>\n </a>\n )}\n </div>\n </div>\n\n {/* Media Draw Area */}\n <MediaDrawArea\n className=\"min-h-0 w-full flex-1\"\n theme={theme}\n media={media}\n ctaButton={ctaButton}\n videoAutoPlay={videoAutoPlay}\n videoMuted={videoMuted}\n videoLoop={videoLoop}\n isDrawing={isDrawing}\n onClick={handleDrawClick}\n ctaTrackTypeName={`${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`}\n ctaTrackTitleDescButton={`${LOTTERY_COMPONENT_TITLE}##${ctaButton?.text ?? ''}`}\n />\n </div>\n </GridItem>\n\n {/* Right: Chance Methods */}\n {hasRightPanel && (\n <GridItem\n span={5}\n className={cn(\n 'info-section',\n 'rounded-box',\n 'relative flex flex-col overflow-hidden',\n 'lg-desktop:aspect-w-[684] lg-desktop:aspect-h-[480]',\n 'desktop:aspect-w-[536] desktop:aspect-h-[384]',\n 'laptop:aspect-w-[364] laptop:aspect-h-[288]',\n 'l-tablet:min-h-[280px] laptop:max-h-[320px]',\n 'w-full',\n 'l-tablet:col-span-12',\n theme === 'dark' ? 'bg-[#1E2024]' : 'bg-[#EAEAEC]'\n )}\n >\n <ChanceMethods\n theme={theme}\n userData={userData}\n methods={chanceMethods}\n title={chanceTitle}\n subtitle={chanceSubtitle}\n footerNote={chanceFooterNote}\n onOpenShareModal={() => setShowShareModal(true)}\n chanceBadgeText={chanceMethodsText?.chanceBadgeText}\n completedText={completedText}\n usedText={usedText}\n loadingText={chanceMethodsText?.loadingText}\n mechanismType={mechanismType}\n inputConfig={{\n ...resolvedInputConfig,\n submitTrackTypeName: `${LOTTERY_CLICK_TYPE}#${LOTTERY_COMPONENT_NAME}`,\n submitTrackTitleDescButton: `${LOTTERY_COMPONENT_TITLE}##${resolvedInputConfig?.submitText ?? 'Spin and Win'}`,\n }}\n isAgreementChecked={isAgreementChecked}\n onAgreementCheckedChange={checked => {\n setIsAgreementChecked(checked)\n if (checked) {\n setErrorMessage('')\n }\n }}\n agreementErrorText={errorMessage}\n />\n </GridItem>\n )}\n </Grid>\n\n {/* Footer: Prize Pool */}\n <div\n className={cn(\n 'product-lottery-footer',\n 'rounded-box',\n 'flex flex-col overflow-hidden',\n theme === 'dark' ? 'bg-[#1E2024]' : 'bg-[#EAEAEC]'\n )}\n >\n <PrizePool\n theme={theme}\n prizes={prizes}\n title={prizesTitle}\n winningInfos={winnerTickerData}\n winnerNameTemplate={winnerNameTemplate}\n />\n </div>\n\n {/* Winner Modal */}\n <WinnerModal\n isOpen={showWinnerModal}\n prize={winningPrize}\n title={externalWinnerConfig?.title || resolvedWinnerConfig.title}\n prizeTitle={externalWinnerConfig?.prizeTitle || resolvedWinnerConfig.prizeTitle}\n prizeImage={externalWinnerConfig?.prizeImage || resolvedWinnerConfig.prizeImage}\n prizeDescription={externalWinnerConfig?.prizeDescription || resolvedWinnerConfig.prizeDescription}\n winnerNote={\n externalWinnerConfig?.winnerNote ??\n winningPrize?.winnerModalConfig?.winnerNote ??\n resolvedWinnerConfig.winnerNote\n }\n learnMoreUrl={\n externalWinnerConfig?.learnMoreUrl ||\n winningPrize?.winnerModalConfig?.learnMoreUrl ||\n resolvedWinnerConfig.learnMoreUrl\n }\n learnMoreText={\n externalWinnerConfig?.learnMoreText ||\n winningPrize?.winnerModalConfig?.learnMoreText ||\n resolvedWinnerConfig.learnMoreText\n }\n couponCode={externalWinnerConfig?.couponCode || resolvedWinnerConfig.couponCode}\n expiresAt={externalWinnerConfig?.expiresAt || resolvedWinnerConfig.expiresAt}\n expiresAtLabel={externalWinnerConfig?.expiresAtLabel || resolvedWinnerConfig.expiresAtLabel}\n couponDiscount={externalWinnerConfig?.couponDiscount || resolvedWinnerConfig.couponDiscount}\n couponUnit={externalWinnerConfig?.couponUnit || resolvedWinnerConfig.couponUnit}\n confirmText={\n externalWinnerConfig?.confirmText ||\n winningPrize?.winnerModalConfig?.confirmText ||\n resolvedWinnerConfig.confirmText\n }\n confirmUrl={\n externalWinnerConfig?.confirmUrl ||\n winningPrize?.winnerModalConfig?.confirmUrl ||\n resolvedWinnerConfig.confirmUrl\n }\n copyText={externalWinnerConfig?.copyText || resolvedWinnerConfig.copyText || copyText}\n copiedText={externalWinnerConfig?.copiedText || resolvedWinnerConfig.copiedText || copiedText}\n onClose={handleCloseWinnerModal}\n theme={theme}\n />\n\n {/* Rules Modal */}\n {rulesData && rulesData.length > 0 && (\n <RulesModal\n title={rulesText}\n isOpen={showRulesModal}\n onClose={() => setShowRulesModal(false)}\n rules={rulesData}\n theme={theme}\n />\n )}\n\n {/* My Rewards Modal */}\n {rewardsData && (\n <MyRewardsModal\n isOpen={showRewardsModal}\n onClose={() => setShowRewardsModal(false)}\n rewards={rewardsData}\n onCopyCode={onCopyCode}\n codeText={codeText}\n copyText={copyText}\n copiedText={copiedText}\n prizeText={prizeText}\n emptyText={emptyText}\n copyError={copyError}\n availableText={availableText}\n usedStatusText={usedStatusText}\n expiredText={expiredText}\n notFoundText={notFoundText}\n theme={theme}\n title={myRewardsText}\n />\n )}\n\n {/* Error Modal */}\n <ErrorModal\n isOpen={showErrorModal}\n onClose={() => setShowErrorModal(false)}\n title={errorTitle || resolvedErrorConfig?.title}\n message={errorMessage || resolvedErrorConfig?.message}\n confirmText={errorConfirmText || resolvedErrorConfig?.confirmText}\n exchangeFailedTitle={resolvedErrorConfig?.exchangeFailedTitle}\n exchangeFailedMessage={resolvedErrorConfig?.exchangeFailedMessage}\n theme={theme}\n />\n\n {/* No-Win Modal */}\n <ErrorModal\n isOpen={showNoWinModal}\n onClose={handleCloseNoWinModal}\n title={resolvedTryAgainTitle}\n message={resolvedTryAgainMessage}\n confirmText={resolvedTryAgainConfirmText}\n theme={theme}\n />\n\n {/* Share Modal */}\n <ShareModal\n isOpen={showShareModal}\n onClose={() => setShowShareModal(false)}\n title={shareModalConfig?.title}\n subtitle={shareModalConfig?.subtitle}\n note={shareModalConfig?.note}\n platforms={shareModalConfig?.platforms}\n onShareSuccess={shareModalConfig?.onShareSuccess}\n theme={theme}\n />\n </div>\n )\n }\n)\n\nProductLottery.displayName = 'ProductLottery'\n\nexport default withLayout(ProductLottery)\nexport { WinnerModal } from '../LotteryShared/WinnerModal.js'\nexport { RulesModal } from '../LotteryShared/RulesModal.js'\nexport { MyRewardsModal } from '../LotteryShared/MyRewardsModal.js'\nexport { ErrorModal } from '../LotteryShared/ErrorModal.js'\nexport { ShareModal } from '../LotteryShared/ShareModal.js'\nexport { BaseModal } from '../LotteryShared/BaseModal.js'\nexport type {\n ProductLotteryProps,\n ProductLotteryHandle,\n MediaConfig,\n CtaButtonConfig,\n MediaDrawAreaProps,\n} from './types.js'\nexport type {\n Prize,\n ChanceMethod,\n ChanceMethodStatus,\n WinningInfo,\n PrizePoolProps,\n ChanceMethodsProps,\n WinnerModalProps,\n WinnerModalConfig,\n UserData,\n ShareModalConfig,\n SocialPlatform,\n SharePlatformConfig,\n} from '../LotteryShared/types.js'\nexport type { RulesModalProps, RuleItem } from '../LotteryShared/RulesModal.js'\nexport type { MyRewardsModalProps, Reward, RewardStatus } from '../LotteryShared/MyRewardsModal.js'\nexport type { ErrorModalProps } from '../LotteryShared/ErrorModal.js'\nexport type { ShareModalProps } from '../LotteryShared/ShareModal.js'\nexport type { BaseModalProps } from '../LotteryShared/BaseModal.js'\nexport type { ContainerProps } from '../../shared/Styles.js'\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["ProductLottery_exports", "__export", "ProductLottery", "ProductLottery_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_helpers", "import_types", "import_grid", "import_MediaDrawArea", "import_PrizePool", "import_ChanceMethods", "import_WinnerModal", "import_RulesModal", "import_MyRewardsModal", "import_ErrorModal", "import_ShareModal", "import_Styles", "import_track", "import_AiuiProvider", "import_useExposure", "import_trackUrlRef", "import_BaseModal", "LOTTERY_COMPONENT_TYPE", "LOTTERY_COMPONENT_NAME", "LOTTERY_COMPONENT_TITLE", "LOTTERY_CLICK_TYPE", "LOTTERY_MODAL_COMPONENT_NAME", "LOTTERY_MODAL_COMPONENT_TYPE", "prizes", "media", "theme", "ctaButton", "videoAutoPlay", "videoMuted", "videoLoop", "chanceMethods", "chanceTitle", "chanceSubtitle", "chanceFooterNote", "chanceMethodsText", "mechanismType", "inputConfig", "inputPlaceholder", "inputSubmitText", "inputType", "inputValidationErrorText", "inputLoadingText", "winnerTickerData", "winningInfos", "winnerNameTemplate", "prizesTitle", "onDrawStart", "onDrawEnd", "onDrawError", "winnerModalConfig", "rulesModalConfig", "actionButtonConfig", "myRewardsModalConfig", "errorModalConfig", "shareModalConfig", "error", "tryAgain", "userData", "loginPrompt", "loginPromptText", "loginButtonText", "onLoginRequired", "onCopyCode", "opportunitiesPrefix", "opportunitiesText", "dealsType", "className", "ref", "resolvedLoginPrompt", "resolvedOpportunitiesText", "resolvedInputConfig", "resolvedErrorConfig", "resolvedWinnerConfig", "rulesData", "rulesText", "shouldShowActionButton", "rewardsData", "myRewardsText", "codeText", "copyText", "copiedText", "prizeText", "emptyText", "copyError", "availableText", "usedStatusText", "expiredText", "notFoundText", "completedText", "usedText", "isLoggedIn", "availableChances", "hasRightPanel", "hasAgreementNotice", "isDrawing", "setIsDrawing", "winningPrize", "setWinningPrize", "showWinnerModal", "setShowWinnerModal", "showRulesModal", "setShowRulesModal", "showRewardsModal", "setShowRewardsModal", "showErrorModal", "setShowErrorModal", "showNoWinModal", "setShowNoWinModal", "showShareModal", "setShowShareModal", "errorMessage", "setErrorMessage", "errorTitle", "setErrorTitle", "errorConfirmText", "setErrorConfirmText", "noWinTitle", "setNoWinTitle", "noWinMessage", "setNoWinMessage", "noWinConfirmText", "setNoWinConfirmText", "externalWinnerConfig", "setExternalWinnerConfig", "isAgreementChecked", "setIsAgreementChecked", "containerRef", "trackingData", "pageHandle", "message", "title", "confirmText", "config", "prize", "handleDrawStart", "prizeId", "p", "handleDrawClick", "handleCloseWinnerModal", "handleCloseNoWinModal", "resolvedTryAgainTitle", "resolvedTryAgainMessage", "resolvedTryAgainConfirmText", "e", "checked"]
|
|
7
7
|
}
|
|
@@ -313,9 +313,15 @@ export interface ProductLotteryProps {
|
|
|
313
313
|
* @optional
|
|
314
314
|
*/
|
|
315
315
|
inputValidationErrorText?: string;
|
|
316
|
+
/**
|
|
317
|
+
* 输入框提交中 loading 按钮文案（CMS: `inputLoadingText`）
|
|
318
|
+
* @default "Loading..."
|
|
319
|
+
* @optional
|
|
320
|
+
*/
|
|
321
|
+
inputLoadingText?: string;
|
|
316
322
|
/**
|
|
317
323
|
* 输入框配置（当 mechanismType 为 'input' 时使用）
|
|
318
|
-
* @deprecated Use flat input fields (`inputPlaceholder`, `inputSubmitText`, `inputType`, `inputValidationErrorText`) instead (CMS field names)
|
|
324
|
+
* @deprecated Use flat input fields (`inputPlaceholder`, `inputSubmitText`, `inputType`, `inputValidationErrorText`, `inputLoadingText`) instead (CMS field names)
|
|
319
325
|
* @optional
|
|
320
326
|
*/
|
|
321
327
|
inputConfig?: ChanceInputConfig;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/ProductLottery/types.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * ProductLottery - \u4EA7\u54C1\u62BD\u5956\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n *\n * \u57FA\u4E8E\u5A92\u4F53\u5C55\u793A\uFF08\u56FE\u7247/\u89C6\u9891\uFF09\u7684\u62BD\u5956\u7EC4\u4EF6\uFF0C\u70B9\u51FB CTA \u6309\u94AE\u89E6\u53D1\u62BD\u5956\u3002\n * \u5171\u4EAB\u7C7B\u578B\u6765\u81EA LotteryShared/types.ts\u3002\n *\n * @module ProductLotteryTypes\n * @date 2026-04-07\n */\n\nimport type {\n Prize,\n WinnerModalConfig,\n ShareModalConfig,\n ChanceMethod,\n WinningInfo,\n RulesModalConfig,\n ActionButtonConfig,\n MyRewardsModalConfig,\n ErrorModalConfig,\n UserData,\n ChanceMechanismType,\n ChanceInputConfig,\n} from '../LotteryShared/types.js'\n\nimport type { Theme, Media } from '../../types/props.js'\n\n// Re-export shared types for convenience\nexport type { Theme, Media }\n\n// ============================================================================\n// \u5A92\u4F53\u914D\u7F6E\u7C7B\u578B\n// ============================================================================\n\n/**\n * \u5A92\u4F53\u914D\u7F6E\uFF08MediaConfig\uFF09\n *\n * \u7CBE\u786E\u5BF9\u9F50 CMS block \u5B57\u6BB5\u7ED3\u6784\uFF0C\u76F4\u63A5\u6620\u5C04\u65E0\u9700\u989D\u5916\u8F6C\u6362\u3002\n *\n * @example\n * ```tsx\n * // \u56FE\u7247\u6A21\u5F0F\uFF08\u54CD\u5E94\u5F0F\uFF09\n * const imageMedia: MediaConfig = {\n * type: 'image',\n * image: { url: '/img/banner-sm.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageTablet: { url: '/img/banner-md.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageLaptop: { url: '/img/banner-lg.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageDesktop: { url: '/img/banner-xl.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageLgDesktop: { url: '/img/banner-xxl.jpg', alt: 'Banner', thumbnailURL: '' },\n * }\n *\n * // \u89C6\u9891\u6A21\u5F0F\n * const videoMedia: MediaConfig = {\n * type: 'video',\n * video: {\n * url: 'https://cdn.example.com/promo.mp4',\n * alt: 'Product Lottery Video',\n * thumbnailURL: 'https://cdn.example.com/poster.jpg',\n * mimeType: 'video/mp4',\n * },\n * }\n * ```\n */\nexport interface MediaConfig {\n /** \u5A92\u4F53\u7C7B\u578B */\n type: 'image' | 'video'\n\n // \u2014\u2014 \u56FE\u7247\u5B57\u6BB5\uFF08type === 'image' \u65F6\u4F7F\u7528\uFF09\u2014\u2014\n\n /** \u9ED8\u8BA4/\u79FB\u52A8\u7AEF\u56FE\u7247\uFF08<768px\uFF09 */\n image?: Media\n /** \u5E73\u677F\u7AEF\u56FE\u7247\uFF08\u2265768px\uFF09 */\n imageTablet?: Media\n /** \u5C0F\u684C\u9762\u56FE\u7247\uFF08\u22651025px\uFF09 */\n imageLaptop?: Media\n /** \u5927\u684C\u9762\u56FE\u7247\uFF08\u22651440px\uFF09 */\n imageDesktop?: Media\n /** \u8D85\u5927\u5C4F\u56FE\u7247\uFF08\u22651920px\uFF09 */\n imageLgDesktop?: Media\n\n // \u2014\u2014 \u89C6\u9891\u5B57\u6BB5\uFF08type === 'video' \u65F6\u4F7F\u7528\uFF09\u2014\u2014\n\n /** \u89C6\u9891\u5A92\u4F53\uFF08mimeType: 'video/mp4'\uFF0CthumbnailURL \u4F5C\u5C01\u9762\u56FE\uFF09 */\n video?: Media\n}\n\n// ============================================================================\n// CTA \u6309\u94AE\u914D\u7F6E\n// ============================================================================\n\n/**\n * CTA \u6309\u94AE\u914D\u7F6E\uFF08CtaButtonConfig\uFF09\n *\n * \u914D\u7F6E\u8986\u76D6\u5728\u5A92\u4F53\u533A\u57DF\u4E0A\u7684\u884C\u52A8\u53F7\u53EC\u6309\u94AE\u3002\n *\n * @example\n * ```tsx\n * const ctaButton: CtaButtonConfig = {\n * text: 'Join the Draw',\n * style: 'primary',\n * }\n * ```\n */\nexport interface CtaButtonConfig {\n /**\n * \u6309\u94AE\u6587\u6848\n * @default \"Join the Draw\"\n * @optional\n */\n text?: string\n\n /**\n * \u6309\u94AE\u6837\u5F0F\n * @default \"primary\"\n * @optional\n */\n style?: 'primary' | 'secondary' | 'outline'\n}\n\n// ============================================================================\n// \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08CMS error group\uFF09\n// ============================================================================\n\n/**\n * \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08ErrorConfig\uFF09\n *\n * \u5BF9\u9F50 CMS `error` group \u5B57\u6BB5\u7ED3\u6784\u3002\n *\n * CMS \u5B57\u6BB5\u6620\u5C04:\n * - `title` \u2192 \u5F39\u7A97\u6807\u9898\n * - `defaultMessage` \u2192 \u9ED8\u8BA4\u9519\u8BEF\u5185\u5BB9\u6587\u6848\n * - `confirmButton` \u2192 \u786E\u8BA4\u6309\u94AE\u6587\u6848\n * - `exchangeFailedTitle` \u2192 \u5151\u6362\u5931\u8D25\u5F39\u7A97\u6807\u9898\n * - `exchangeFailedMessage` \u2192 \u5151\u6362\u5931\u8D25\u5F39\u7A97\u5185\u5BB9\n */\nexport interface ErrorConfig {\n title?: string\n defaultMessage?: string\n confirmButton?: string\n exchangeFailedTitle?: string\n exchangeFailedMessage?: string\n}\n\n// ============================================================================\n// \u672A\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08CMS tryAgain group\uFF09\n// ============================================================================\n\n/**\n * \u672A\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08TryAgainConfig\uFF09\n *\n * \u5BF9\u9F50 CMS `tryAgain` group \u5B57\u6BB5\u7ED3\u6784\u3002\n *\n * CMS \u5B57\u6BB5\u6620\u5C04:\n * - `title` \u2192 \u5F39\u7A97\u6807\u9898\n * - `message` \u2192 \u5185\u5BB9\u6587\u6848\n * - `confirmText` \u2192 \u786E\u8BA4\u6309\u94AE\u6587\u6848\n */\nexport interface TryAgainConfig {\n title?: string\n message?: string\n confirmText?: string\n}\n\n// ============================================================================\n// Imperative Handle \u63A5\u53E3\n// ============================================================================\n\n/**\n * ProductLottery \u7EC4\u4EF6\u547D\u4EE4\u5F0F\u63A7\u5236\u63A5\u53E3\n *\n * \u901A\u8FC7 ref \u66B4\u9732\u7ED9\u7236\u7EC4\u4EF6\uFF0C\u7528\u4E8E\u5916\u90E8\u63A7\u5236\u5F39\u7A97\u7B49\u72B6\u6001\u3002\n * \u4E0E WheelLotteryHandle \u4FDD\u6301\u4E00\u81F4\u7684\u5F39\u7A97\u63A7\u5236\u65B9\u6CD5\u3002\n *\n * @example\n * ```tsx\n * const lotteryRef = useRef<ProductLotteryHandle>(null)\n *\n * <ProductLottery ref={lotteryRef} prizes={prizes} media={media} />\n *\n * // \u5916\u90E8\u89E6\u53D1\u9519\u8BEF\u5F39\u7A97\n * lotteryRef.current?.showError({\n * title: 'Network Error',\n * message: 'Failed to connect to server',\n * confirmText: 'Retry'\n * })\n *\n * // \u663E\u793A\u89C4\u5219\u5F39\u7A97\n * lotteryRef.current?.showRules()\n *\n * // \u5173\u95ED\u6240\u6709\u5F39\u7A97\n * lotteryRef.current?.hideAllModals()\n * ```\n */\nexport interface ProductLotteryHandle {\n /** \u663E\u793A\u9519\u8BEF\u5F39\u7A97 */\n showError: (config: { message: string; title?: string; confirmText?: string }) => void\n\n /** \u9690\u85CF\u9519\u8BEF\u5F39\u7A97 */\n hideError: () => void\n\n /** \u663E\u793A\u672A\u4E2D\u5956\u5F39\u7A97 */\n showNoWin: (config?: { title?: string; message?: string; confirmText?: string }) => void\n\n /** \u9690\u85CF\u672A\u4E2D\u5956\u5F39\u7A97 */\n hideNoWin: () => void\n\n /** \u663E\u793A\u4E2D\u5956\u5F39\u7A97 */\n showWinner: (prize: Prize, config?: Partial<WinnerModalConfig>) => void\n\n /** \u9690\u85CF\u4E2D\u5956\u5F39\u7A97 */\n hideWinner: () => void\n\n /** \u663E\u793A\u89C4\u5219\u5F39\u7A97 */\n showRules: () => void\n\n /** \u9690\u85CF\u89C4\u5219\u5F39\u7A97 */\n hideRules: () => void\n\n /** \u663E\u793A\u6211\u7684\u5956\u52B1\u5F39\u7A97 */\n showRewards: () => void\n\n /** \u9690\u85CF\u6211\u7684\u5956\u52B1\u5F39\u7A97 */\n hideRewards: () => void\n\n /** \u663E\u793A\u5206\u4EAB\u5F39\u7A97 */\n showShare: (config?: Partial<ShareModalConfig>) => void\n\n /** \u9690\u85CF\u5206\u4EAB\u5F39\u7A97 */\n hideShare: () => void\n\n /** \u5173\u95ED\u6240\u6709\u5F39\u7A97 */\n hideAllModals: () => void\n}\n\n// ============================================================================\n// MediaDrawArea \u5B50\u7EC4\u4EF6 Props\n// ============================================================================\n\n/**\n * MediaDrawArea \u5B50\u7EC4\u4EF6 Props\n *\n * \u5A92\u4F53\u62BD\u5956\u533A\u57DF\uFF0C\u5C55\u793A\u56FE\u7247/\u89C6\u9891\u5E76\u53E0\u52A0 CTA \u6309\u94AE\u3002\n */\nexport interface MediaDrawAreaProps {\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: Theme\n\n /** \u5A92\u4F53\u914D\u7F6E\uFF08\u5FC5\u9700\uFF09 */\n media: MediaConfig\n\n /** CTA \u6309\u9492\u914D\u7F6E */\n ctaButton?: CtaButtonConfig\n\n /**\n * \u89C6\u9891\u81EA\u52A8\u64AD\u653E\uFF08\u4EC5 mimeType='video/mp4' \u65F6\u6709\u6548\uFF09\n * @default true\n */\n videoAutoPlay?: boolean\n\n /**\n * \u89C6\u9891\u9759\u97F3\uFF08\u4EC5 mimeType='video/mp4' \u65F6\u6709\u6548\uFF09\n * @default true\n */\n videoMuted?: boolean\n\n /**\n * \u89C6\u9891\u5FAA\u73AF\uFF08\u4EC5 mimeType='video/mp4' \u65F6\u6709\u6548\uFF09\n * @default true\n */\n videoLoop?: boolean\n\n /** \u662F\u5426\u6B63\u5728\u62BD\u5956\u4E2D */\n isDrawing?: boolean\n\n /** \u662F\u5426\u7981\u7528\uFF08\u672A\u767B\u5F55\u6216\u65E0\u6B21\u6570\uFF09 */\n isDisabled?: boolean\n\n /** \u70B9\u51FB\u62BD\u5956\u56DE\u8C03 */\n onClick: () => void\n\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n\n /** \u70B9\u51FB\u8FFD\u8E2A\uFF1Adata-headless-type-name \u5C5E\u6027\u503C\uFF0C\u683C\u5F0F `{clickType}#{componentName}` */\n ctaTrackTypeName?: string\n\n /** \u70B9\u51FB\u8FFD\u8E2A\uFF1Adata-headless-title-desc-button \u5C5E\u6027\u503C\uFF0C\u683C\u5F0F `{title}#{desc}#{buttonName}` */\n ctaTrackTitleDescButton?: string\n}\n\n// ============================================================================\n// \u4E3B\u7EC4\u4EF6 Props\n// ============================================================================\n\n/**\n * ProductLottery \u7EC4\u4EF6 Props\n *\n * \u57FA\u4E8E\u5A92\u4F53\u5C55\u793A\u7684\u4EA7\u54C1\u62BD\u5956\u7EC4\u4EF6\u3002\u5DE6\u4FA7\u4E3A\u53EF\u70B9\u51FB\u7684\u5A92\u4F53\u533A\u57DF\uFF08\u56FE\u7247/\u89C6\u9891\uFF09\uFF0C\n * \u53F3\u4FA7\u4E3A\u83B7\u53D6\u673A\u4F1A\u533A\u57DF\uFF0C\u5E95\u90E8\u4E3A\u5956\u54C1\u6C60\u3002\n *\n * @example\n * ```tsx\n * <ProductLottery\n * prizes={prizes}\n * media={{ type: 'image', src: '/banner.jpg', alt: 'Lottery' }}\n * ctaButton={{ text: 'Draw Now' }}\n * onDrawStart={async () => {\n * const result = await fetch('/api/lottery')\n * const data = await result.json()\n * return data.prizeId\n * }}\n * onDrawEnd={(prize) => console.log('Won:', prize.name)}\n * />\n * ```\n */\nexport interface ProductLotteryProps {\n // ========== \u5FC5\u9700 Props ==========\n\n /**\n * 8 \u4E2A\u5956\u54C1\u6570\u7EC4\uFF08\u5FC5\u9700\uFF09\n * @minLength 8\n * @maxLength 8\n */\n prizes: Prize[]\n\n /**\n * \u5A92\u4F53\u914D\u7F6E\uFF08\u5FC5\u9700\uFF09\n * \u914D\u7F6E\u5DE6\u4FA7\u62BD\u5956\u533A\u57DF\u5C55\u793A\u7684\u56FE\u7247\u6216\u89C6\u9891\uFF0C\u65E0\u9700 type/src \u5305\u88C5\u5C42\n */\n media: MediaConfig\n\n /**\n * \u89C6\u9891\u81EA\u52A8\u64AD\u653E\uFF08\u5F53 media.mimeType === 'video/mp4' \u65F6\u751F\u6548\uFF09\n * @default true\n * @optional\n */\n videoAutoPlay?: boolean\n\n /**\n * \u89C6\u9891\u9759\u97F3\uFF08\u5F53 media.mimeType === 'video/mp4' \u65F6\u751F\u6548\uFF09\n * @default true\n * @optional\n */\n videoMuted?: boolean\n\n /**\n * \u89C6\u9891\u5FAA\u73AF\uFF08\u5F53 media.mimeType === 'video/mp4' \u65F6\u751F\u6548\uFF09\n * @default true\n * @optional\n */\n videoLoop?: boolean\n\n // ========== \u4E3B\u9898\u548C\u6837\u5F0F ==========\n\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: Theme\n\n /** CTA \u6309\u94AE\u914D\u7F6E */\n ctaButton?: CtaButtonConfig\n\n // ========== CMS \u9876\u5C42\u5B57\u6BB5 ==========\n\n /**\n * \u62BD\u5956\u6D3B\u52A8\u7C7B\u578B\uFF08CMS: `dealsType`\uFF09\n * \u7528\u4E8E\u6807\u8BC6\u62BD\u5956\u6D3B\u52A8\u7684\u552F\u4E00\u7C7B\u578B\uFF0C\u5982\uFF1A`ipc-2614`\n * @optional\n */\n dealsType?: string\n\n // ========== \u83B7\u53D6\u673A\u4F1A\u533A\u57DF Props ==========\n\n /**\n * \u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u6570\u7EC4\n * @optional\n */\n chanceMethods?: ChanceMethod[]\n\n /**\n * \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u673A\u5236\u7C7B\u578B\n * @default \"methods\"\n * @optional\n */\n mechanismType?: ChanceMechanismType\n\n // \u2500\u2500 CMS flat input fields\uFF08mechanismType='input' \u65F6\u4F7F\u7528\uFF09\u2500\u2500\n\n /**\n * \u8F93\u5165\u6846\u5360\u4F4D\u6587\u672C\uFF08CMS: `inputPlaceholder`\uFF09\n * @default \"Enter your order number\"\n * @optional\n */\n inputPlaceholder?: string\n\n /**\n * \u63D0\u4EA4\u6309\u94AE\u6587\u6848\uFF08CMS: `inputSubmitText`\uFF09\n * @default \"Spin and Win\"\n * @optional\n */\n inputSubmitText?: string\n\n /**\n * \u8F93\u5165\u6846\u7C7B\u578B\uFF08CMS: `inputType`\uFF09\n * @default \"text\"\n * @optional\n */\n inputType?: 'text' | 'email' | 'number'\n\n /**\n * \u8F93\u5165\u683C\u5F0F\u9519\u8BEF\u63D0\u793A\u6587\u6848\uFF08CMS: `inputValidationErrorText`\uFF09\n * @optional\n */\n inputValidationErrorText?: string\n\n /**\n * \u8F93\u5165\u6846\u914D\u7F6E\uFF08\u5F53 mechanismType \u4E3A 'input' \u65F6\u4F7F\u7528\uFF09\n * @deprecated Use flat input fields (`inputPlaceholder`, `inputSubmitText`, `inputType`, `inputValidationErrorText`) instead (CMS field names)\n * @optional\n */\n inputConfig?: ChanceInputConfig\n\n /**\n * \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u6807\u9898\n * @default \"Want more chances to win?\"\n * @optional\n */\n chanceTitle?: string\n\n /** \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u526F\u6807\u9898 */\n chanceSubtitle?: string\n\n /** \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u5E95\u90E8\u63D0\u793A */\n chanceFooterNote?: string\n\n /** \u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u6587\u6848\u914D\u7F6E */\n chanceMethodsText?: {\n chanceBadgeText?: string\n completedText?: string\n usedText?: string\n loadingText?: string\n }\n\n // ========== \u4E2D\u5956\u4FE1\u606F Props ==========\n\n /**\n * \u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08CMS: `winningInfos` group \u2014 \u4E3B\u540D\u79F0\uFF09\n *\n * CMS \u4E2D `winningInfos` \u662F\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E group\uFF0C\u5B57\u6BB5\uFF1A\n * `title`\u3001`confirmButton`\u3001`confirmUrl`\u3001`learnMoreUrl`\u3001`learnMoreText`\u3002\n */\n winningInfos?: WinnerModalConfig\n\n /**\n * \u5E95\u90E8\u6EDA\u52A8\u6761\u4E2D\u5956\u4EBA\u540D\u5355\u6570\u636E\n *\n * \u539F `winningInfos: WinningInfo[]` \u91CD\u547D\u540D\u4E3A `winnerTickerData` \u4EE5\u907F\u514D\n * \u4E0E CMS `winningInfos` group \u547D\u540D\u51B2\u7A81\u3002\n *\n * @default []\n */\n winnerTickerData?: WinningInfo[]\n\n /**\n * \u4E2D\u5956\u6EDA\u52A8 Ticker \u6587\u6848\u6A21\u677F\uFF0C\u652F\u6301 {{name}} \u548C {{prize}} \u53D8\u91CF\n * @default \"{{name}} just won {{prize}}!\"\n * @optional\n */\n winnerNameTemplate?: string\n\n /** \u5956\u54C1\u6C60\u5C55\u793A\u533A\u57DF\u6807\u9898 */\n prizesTitle?: string\n\n // ========== \u56DE\u8C03\u51FD\u6570 Props ==========\n\n /**\n * \u62BD\u5956\u5F00\u59CB\u65F6\u7684\u56DE\u8C03\uFF0C\u8FD4\u56DE Promise \u4EE5\u652F\u6301\u5F02\u6B65\u63A5\u53E3\u8C03\u7528\n * @returns Promise<string> - \u4E2D\u5956\u5956\u54C1\u7684 prizeKey\n */\n onDrawStart?: () => Promise<string>\n\n /**\n * \u62BD\u5956\u7ED3\u675F\u65F6\u7684\u56DE\u8C03\uFF0C\u4F20\u9012\u4E2D\u5956\u5956\u54C1\n * @param prize \u4E2D\u5956\u5956\u54C1\u5BF9\u8C61\n */\n onDrawEnd?: (prize: Prize) => void\n\n /**\n * \u62BD\u5956\u9519\u8BEF\u65F6\u7684\u56DE\u8C03\n * @param error \u9519\u8BEF\u4FE1\u606F\n */\n onDrawError?: (error: Error) => void\n\n // ========== \u5F39\u7A97\u914D\u7F6E Props ==========\n\n /** \u4E2D\u5956\u5F39\u7A97\u914D\u7F6E */\n winnerModalConfig?: WinnerModalConfig\n\n /** \u89C4\u5219\u5F39\u7A97\u914D\u7F6E */\n rulesModalConfig?: RulesModalConfig\n\n /** \u9876\u680F\u53F3\u4FA7\u8DF3\u8F6C\u6309\u94AE\u914D\u7F6E\uFF1B\u672A\u914D\u7F6E text \u6216 url \u65F6\u4E0D\u5C55\u793A */\n actionButtonConfig?: ActionButtonConfig\n\n /** \u6211\u7684\u5956\u52B1\u5F39\u7A97\u914D\u7F6E */\n myRewardsModalConfig?: MyRewardsModalConfig\n\n /**\n * \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08CMS: `error` group \u2014 \u4E3B\u540D\u79F0\uFF09\n *\n * \u5B57\u6BB5\uFF1A`title`\u3001`defaultMessage`\u3001`confirmButton`\u3001\n * `exchangeFailedTitle`\u3001`exchangeFailedMessage`\u3002\n */\n error?: ErrorConfig\n\n /**\n * \u672A\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08CMS: `tryAgain` group\uFF09\n *\n * \u5B57\u6BB5\uFF1A`title`\u3001`message`\u3001`confirmText`\u3002\n */\n tryAgain?: TryAgainConfig\n\n /**\n * \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08\u65E7\u7248\uFF09\n * @deprecated Use `error` instead (CMS field name)\n */\n errorModalConfig?: ErrorModalConfig\n\n /** \u5206\u4EAB\u5F39\u7A97\u914D\u7F6E */\n shareModalConfig?: ShareModalConfig\n\n // ========== CMS \u5E73\u94FA\u6587\u6848\u5B57\u6BB5\uFF08\u4E3B\u540D\u79F0\uFF09==========\n\n /**\n * \u672A\u767B\u5F55\u65F6\u7684\u63D0\u793A\u6587\u6848\uFF08CMS: `loginPrompt`\uFF09\n * @default \"Please log in to participate in the lottery\"\n */\n loginPrompt?: string\n\n /**\n * \u6B21\u6570\u4E0D\u8DB3\u65F6\u7684\u63D0\u793A\u6587\u6848\uFF08CMS: `noChances`\uFF09\n * @default \"You have no chances left. Get more chances below!\"\n */\n noChances?: string\n\n /**\n * \u673A\u4F1A\u8FDB\u5EA6\u524D\u7F00\u6587\u6848\uFF08CMS: `opportunitiesPrefix`\uFF09\n * @default \"Number of draws remaining today: \"\n */\n opportunitiesPrefix?: string\n\n // ========== \u7528\u6237\u76F8\u5173 Props ==========\n\n /** \u7528\u6237\u6570\u636E */\n userData?: UserData\n\n /**\n * \u672A\u767B\u5F55\u65F6\u7684\u63D0\u793A\u6587\u6848\n * @deprecated Use `loginPrompt` instead (CMS field name)\n * @default \"Please log in to participate\"\n */\n loginPromptText?: string\n\n /**\n * \u767B\u5F55\u6309\u94AE\u6587\u6848\n * @default \"Log In\"\n */\n loginButtonText?: string\n\n /**\n * \u6B21\u6570\u4E0D\u8DB3\u65F6\u7684\u63D0\u793A\u6587\u6848\n * @deprecated Use `noChances` instead (CMS field name)\n * @default \"You have no chances left\"\n */\n noChancesText?: string\n\n /**\n * \u672A\u767B\u5F55\u65F6\u70B9\u51FB\u62BD\u5956\u7684\u56DE\u8C03\n */\n onLoginRequired?: () => void\n\n // ========== \u5176\u4ED6\u914D\u7F6E ==========\n\n /** \u590D\u5236\u4F18\u60E0\u7801\u56DE\u8C03 */\n onCopyCode?: (code: string) => void\n\n /**\n * \u673A\u4F1A\u8FDB\u5EA6\u6587\u6848\u6570\u7EC4\uFF08\u65E7\u7248\uFF0C\u9996\u5143\u7D20\u4E3A\u524D\u7F00\uFF0C\u6B21\u5143\u7D20\u4E3A\u540E\u7F00\uFF09\n * @deprecated Use `opportunitiesPrefix` instead (CMS field name)\n * @default [\"Number of draws remaining today:\"]\n */\n opportunitiesText?: string[]\n\n /** \u81EA\u5B9A\u4E49 CSS \u7C7B\u540D */\n className?: string\n}\n\n// ============================================================================\n// \u9ED8\u8BA4\u914D\u7F6E\n// ============================================================================\n\n/** \u9ED8\u8BA4 CTA \u6309\u94AE\u914D\u7F6E */\nexport const DEFAULT_CTA_BUTTON: CtaButtonConfig = {\n text: '',\n style: 'primary',\n}\n\n/** \u9ED8\u8BA4\u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u6807\u9898 */\nexport const DEFAULT_CHANCE_TITLE = 'Want more chances to win?'\n"],
|
|
5
|
-
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,0BAAAE,EAAA,uBAAAC,IAAA,eAAAC,EAAAJ,
|
|
4
|
+
"sourcesContent": ["/**\n * ProductLottery - \u4EA7\u54C1\u62BD\u5956\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n *\n * \u57FA\u4E8E\u5A92\u4F53\u5C55\u793A\uFF08\u56FE\u7247/\u89C6\u9891\uFF09\u7684\u62BD\u5956\u7EC4\u4EF6\uFF0C\u70B9\u51FB CTA \u6309\u94AE\u89E6\u53D1\u62BD\u5956\u3002\n * \u5171\u4EAB\u7C7B\u578B\u6765\u81EA LotteryShared/types.ts\u3002\n *\n * @module ProductLotteryTypes\n * @date 2026-04-07\n */\n\nimport type {\n Prize,\n WinnerModalConfig,\n ShareModalConfig,\n ChanceMethod,\n WinningInfo,\n RulesModalConfig,\n ActionButtonConfig,\n MyRewardsModalConfig,\n ErrorModalConfig,\n UserData,\n ChanceMechanismType,\n ChanceInputConfig,\n} from '../LotteryShared/types.js'\n\nimport type { Theme, Media } from '../../types/props.js'\n\n// Re-export shared types for convenience\nexport type { Theme, Media }\n\n// ============================================================================\n// \u5A92\u4F53\u914D\u7F6E\u7C7B\u578B\n// ============================================================================\n\n/**\n * \u5A92\u4F53\u914D\u7F6E\uFF08MediaConfig\uFF09\n *\n * \u7CBE\u786E\u5BF9\u9F50 CMS block \u5B57\u6BB5\u7ED3\u6784\uFF0C\u76F4\u63A5\u6620\u5C04\u65E0\u9700\u989D\u5916\u8F6C\u6362\u3002\n *\n * @example\n * ```tsx\n * // \u56FE\u7247\u6A21\u5F0F\uFF08\u54CD\u5E94\u5F0F\uFF09\n * const imageMedia: MediaConfig = {\n * type: 'image',\n * image: { url: '/img/banner-sm.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageTablet: { url: '/img/banner-md.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageLaptop: { url: '/img/banner-lg.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageDesktop: { url: '/img/banner-xl.jpg', alt: 'Banner', thumbnailURL: '' },\n * imageLgDesktop: { url: '/img/banner-xxl.jpg', alt: 'Banner', thumbnailURL: '' },\n * }\n *\n * // \u89C6\u9891\u6A21\u5F0F\n * const videoMedia: MediaConfig = {\n * type: 'video',\n * video: {\n * url: 'https://cdn.example.com/promo.mp4',\n * alt: 'Product Lottery Video',\n * thumbnailURL: 'https://cdn.example.com/poster.jpg',\n * mimeType: 'video/mp4',\n * },\n * }\n * ```\n */\nexport interface MediaConfig {\n /** \u5A92\u4F53\u7C7B\u578B */\n type: 'image' | 'video'\n\n // \u2014\u2014 \u56FE\u7247\u5B57\u6BB5\uFF08type === 'image' \u65F6\u4F7F\u7528\uFF09\u2014\u2014\n\n /** \u9ED8\u8BA4/\u79FB\u52A8\u7AEF\u56FE\u7247\uFF08<768px\uFF09 */\n image?: Media\n /** \u5E73\u677F\u7AEF\u56FE\u7247\uFF08\u2265768px\uFF09 */\n imageTablet?: Media\n /** \u5C0F\u684C\u9762\u56FE\u7247\uFF08\u22651025px\uFF09 */\n imageLaptop?: Media\n /** \u5927\u684C\u9762\u56FE\u7247\uFF08\u22651440px\uFF09 */\n imageDesktop?: Media\n /** \u8D85\u5927\u5C4F\u56FE\u7247\uFF08\u22651920px\uFF09 */\n imageLgDesktop?: Media\n\n // \u2014\u2014 \u89C6\u9891\u5B57\u6BB5\uFF08type === 'video' \u65F6\u4F7F\u7528\uFF09\u2014\u2014\n\n /** \u89C6\u9891\u5A92\u4F53\uFF08mimeType: 'video/mp4'\uFF0CthumbnailURL \u4F5C\u5C01\u9762\u56FE\uFF09 */\n video?: Media\n}\n\n// ============================================================================\n// CTA \u6309\u94AE\u914D\u7F6E\n// ============================================================================\n\n/**\n * CTA \u6309\u94AE\u914D\u7F6E\uFF08CtaButtonConfig\uFF09\n *\n * \u914D\u7F6E\u8986\u76D6\u5728\u5A92\u4F53\u533A\u57DF\u4E0A\u7684\u884C\u52A8\u53F7\u53EC\u6309\u94AE\u3002\n *\n * @example\n * ```tsx\n * const ctaButton: CtaButtonConfig = {\n * text: 'Join the Draw',\n * style: 'primary',\n * }\n * ```\n */\nexport interface CtaButtonConfig {\n /**\n * \u6309\u94AE\u6587\u6848\n * @default \"Join the Draw\"\n * @optional\n */\n text?: string\n\n /**\n * \u6309\u94AE\u6837\u5F0F\n * @default \"primary\"\n * @optional\n */\n style?: 'primary' | 'secondary' | 'outline'\n}\n\n// ============================================================================\n// \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08CMS error group\uFF09\n// ============================================================================\n\n/**\n * \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08ErrorConfig\uFF09\n *\n * \u5BF9\u9F50 CMS `error` group \u5B57\u6BB5\u7ED3\u6784\u3002\n *\n * CMS \u5B57\u6BB5\u6620\u5C04:\n * - `title` \u2192 \u5F39\u7A97\u6807\u9898\n * - `defaultMessage` \u2192 \u9ED8\u8BA4\u9519\u8BEF\u5185\u5BB9\u6587\u6848\n * - `confirmButton` \u2192 \u786E\u8BA4\u6309\u94AE\u6587\u6848\n * - `exchangeFailedTitle` \u2192 \u5151\u6362\u5931\u8D25\u5F39\u7A97\u6807\u9898\n * - `exchangeFailedMessage` \u2192 \u5151\u6362\u5931\u8D25\u5F39\u7A97\u5185\u5BB9\n */\nexport interface ErrorConfig {\n title?: string\n defaultMessage?: string\n confirmButton?: string\n exchangeFailedTitle?: string\n exchangeFailedMessage?: string\n}\n\n// ============================================================================\n// \u672A\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08CMS tryAgain group\uFF09\n// ============================================================================\n\n/**\n * \u672A\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08TryAgainConfig\uFF09\n *\n * \u5BF9\u9F50 CMS `tryAgain` group \u5B57\u6BB5\u7ED3\u6784\u3002\n *\n * CMS \u5B57\u6BB5\u6620\u5C04:\n * - `title` \u2192 \u5F39\u7A97\u6807\u9898\n * - `message` \u2192 \u5185\u5BB9\u6587\u6848\n * - `confirmText` \u2192 \u786E\u8BA4\u6309\u94AE\u6587\u6848\n */\nexport interface TryAgainConfig {\n title?: string\n message?: string\n confirmText?: string\n}\n\n// ============================================================================\n// Imperative Handle \u63A5\u53E3\n// ============================================================================\n\n/**\n * ProductLottery \u7EC4\u4EF6\u547D\u4EE4\u5F0F\u63A7\u5236\u63A5\u53E3\n *\n * \u901A\u8FC7 ref \u66B4\u9732\u7ED9\u7236\u7EC4\u4EF6\uFF0C\u7528\u4E8E\u5916\u90E8\u63A7\u5236\u5F39\u7A97\u7B49\u72B6\u6001\u3002\n * \u4E0E WheelLotteryHandle \u4FDD\u6301\u4E00\u81F4\u7684\u5F39\u7A97\u63A7\u5236\u65B9\u6CD5\u3002\n *\n * @example\n * ```tsx\n * const lotteryRef = useRef<ProductLotteryHandle>(null)\n *\n * <ProductLottery ref={lotteryRef} prizes={prizes} media={media} />\n *\n * // \u5916\u90E8\u89E6\u53D1\u9519\u8BEF\u5F39\u7A97\n * lotteryRef.current?.showError({\n * title: 'Network Error',\n * message: 'Failed to connect to server',\n * confirmText: 'Retry'\n * })\n *\n * // \u663E\u793A\u89C4\u5219\u5F39\u7A97\n * lotteryRef.current?.showRules()\n *\n * // \u5173\u95ED\u6240\u6709\u5F39\u7A97\n * lotteryRef.current?.hideAllModals()\n * ```\n */\nexport interface ProductLotteryHandle {\n /** \u663E\u793A\u9519\u8BEF\u5F39\u7A97 */\n showError: (config: { message: string; title?: string; confirmText?: string }) => void\n\n /** \u9690\u85CF\u9519\u8BEF\u5F39\u7A97 */\n hideError: () => void\n\n /** \u663E\u793A\u672A\u4E2D\u5956\u5F39\u7A97 */\n showNoWin: (config?: { title?: string; message?: string; confirmText?: string }) => void\n\n /** \u9690\u85CF\u672A\u4E2D\u5956\u5F39\u7A97 */\n hideNoWin: () => void\n\n /** \u663E\u793A\u4E2D\u5956\u5F39\u7A97 */\n showWinner: (prize: Prize, config?: Partial<WinnerModalConfig>) => void\n\n /** \u9690\u85CF\u4E2D\u5956\u5F39\u7A97 */\n hideWinner: () => void\n\n /** \u663E\u793A\u89C4\u5219\u5F39\u7A97 */\n showRules: () => void\n\n /** \u9690\u85CF\u89C4\u5219\u5F39\u7A97 */\n hideRules: () => void\n\n /** \u663E\u793A\u6211\u7684\u5956\u52B1\u5F39\u7A97 */\n showRewards: () => void\n\n /** \u9690\u85CF\u6211\u7684\u5956\u52B1\u5F39\u7A97 */\n hideRewards: () => void\n\n /** \u663E\u793A\u5206\u4EAB\u5F39\u7A97 */\n showShare: (config?: Partial<ShareModalConfig>) => void\n\n /** \u9690\u85CF\u5206\u4EAB\u5F39\u7A97 */\n hideShare: () => void\n\n /** \u5173\u95ED\u6240\u6709\u5F39\u7A97 */\n hideAllModals: () => void\n}\n\n// ============================================================================\n// MediaDrawArea \u5B50\u7EC4\u4EF6 Props\n// ============================================================================\n\n/**\n * MediaDrawArea \u5B50\u7EC4\u4EF6 Props\n *\n * \u5A92\u4F53\u62BD\u5956\u533A\u57DF\uFF0C\u5C55\u793A\u56FE\u7247/\u89C6\u9891\u5E76\u53E0\u52A0 CTA \u6309\u94AE\u3002\n */\nexport interface MediaDrawAreaProps {\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: Theme\n\n /** \u5A92\u4F53\u914D\u7F6E\uFF08\u5FC5\u9700\uFF09 */\n media: MediaConfig\n\n /** CTA \u6309\u9492\u914D\u7F6E */\n ctaButton?: CtaButtonConfig\n\n /**\n * \u89C6\u9891\u81EA\u52A8\u64AD\u653E\uFF08\u4EC5 mimeType='video/mp4' \u65F6\u6709\u6548\uFF09\n * @default true\n */\n videoAutoPlay?: boolean\n\n /**\n * \u89C6\u9891\u9759\u97F3\uFF08\u4EC5 mimeType='video/mp4' \u65F6\u6709\u6548\uFF09\n * @default true\n */\n videoMuted?: boolean\n\n /**\n * \u89C6\u9891\u5FAA\u73AF\uFF08\u4EC5 mimeType='video/mp4' \u65F6\u6709\u6548\uFF09\n * @default true\n */\n videoLoop?: boolean\n\n /** \u662F\u5426\u6B63\u5728\u62BD\u5956\u4E2D */\n isDrawing?: boolean\n\n /** \u662F\u5426\u7981\u7528\uFF08\u672A\u767B\u5F55\u6216\u65E0\u6B21\u6570\uFF09 */\n isDisabled?: boolean\n\n /** \u70B9\u51FB\u62BD\u5956\u56DE\u8C03 */\n onClick: () => void\n\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n\n /** \u70B9\u51FB\u8FFD\u8E2A\uFF1Adata-headless-type-name \u5C5E\u6027\u503C\uFF0C\u683C\u5F0F `{clickType}#{componentName}` */\n ctaTrackTypeName?: string\n\n /** \u70B9\u51FB\u8FFD\u8E2A\uFF1Adata-headless-title-desc-button \u5C5E\u6027\u503C\uFF0C\u683C\u5F0F `{title}#{desc}#{buttonName}` */\n ctaTrackTitleDescButton?: string\n}\n\n// ============================================================================\n// \u4E3B\u7EC4\u4EF6 Props\n// ============================================================================\n\n/**\n * ProductLottery \u7EC4\u4EF6 Props\n *\n * \u57FA\u4E8E\u5A92\u4F53\u5C55\u793A\u7684\u4EA7\u54C1\u62BD\u5956\u7EC4\u4EF6\u3002\u5DE6\u4FA7\u4E3A\u53EF\u70B9\u51FB\u7684\u5A92\u4F53\u533A\u57DF\uFF08\u56FE\u7247/\u89C6\u9891\uFF09\uFF0C\n * \u53F3\u4FA7\u4E3A\u83B7\u53D6\u673A\u4F1A\u533A\u57DF\uFF0C\u5E95\u90E8\u4E3A\u5956\u54C1\u6C60\u3002\n *\n * @example\n * ```tsx\n * <ProductLottery\n * prizes={prizes}\n * media={{ type: 'image', src: '/banner.jpg', alt: 'Lottery' }}\n * ctaButton={{ text: 'Draw Now' }}\n * onDrawStart={async () => {\n * const result = await fetch('/api/lottery')\n * const data = await result.json()\n * return data.prizeId\n * }}\n * onDrawEnd={(prize) => console.log('Won:', prize.name)}\n * />\n * ```\n */\nexport interface ProductLotteryProps {\n // ========== \u5FC5\u9700 Props ==========\n\n /**\n * 8 \u4E2A\u5956\u54C1\u6570\u7EC4\uFF08\u5FC5\u9700\uFF09\n * @minLength 8\n * @maxLength 8\n */\n prizes: Prize[]\n\n /**\n * \u5A92\u4F53\u914D\u7F6E\uFF08\u5FC5\u9700\uFF09\n * \u914D\u7F6E\u5DE6\u4FA7\u62BD\u5956\u533A\u57DF\u5C55\u793A\u7684\u56FE\u7247\u6216\u89C6\u9891\uFF0C\u65E0\u9700 type/src \u5305\u88C5\u5C42\n */\n media: MediaConfig\n\n /**\n * \u89C6\u9891\u81EA\u52A8\u64AD\u653E\uFF08\u5F53 media.mimeType === 'video/mp4' \u65F6\u751F\u6548\uFF09\n * @default true\n * @optional\n */\n videoAutoPlay?: boolean\n\n /**\n * \u89C6\u9891\u9759\u97F3\uFF08\u5F53 media.mimeType === 'video/mp4' \u65F6\u751F\u6548\uFF09\n * @default true\n * @optional\n */\n videoMuted?: boolean\n\n /**\n * \u89C6\u9891\u5FAA\u73AF\uFF08\u5F53 media.mimeType === 'video/mp4' \u65F6\u751F\u6548\uFF09\n * @default true\n * @optional\n */\n videoLoop?: boolean\n\n // ========== \u4E3B\u9898\u548C\u6837\u5F0F ==========\n\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: Theme\n\n /** CTA \u6309\u94AE\u914D\u7F6E */\n ctaButton?: CtaButtonConfig\n\n // ========== CMS \u9876\u5C42\u5B57\u6BB5 ==========\n\n /**\n * \u62BD\u5956\u6D3B\u52A8\u7C7B\u578B\uFF08CMS: `dealsType`\uFF09\n * \u7528\u4E8E\u6807\u8BC6\u62BD\u5956\u6D3B\u52A8\u7684\u552F\u4E00\u7C7B\u578B\uFF0C\u5982\uFF1A`ipc-2614`\n * @optional\n */\n dealsType?: string\n\n // ========== \u83B7\u53D6\u673A\u4F1A\u533A\u57DF Props ==========\n\n /**\n * \u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u6570\u7EC4\n * @optional\n */\n chanceMethods?: ChanceMethod[]\n\n /**\n * \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u673A\u5236\u7C7B\u578B\n * @default \"methods\"\n * @optional\n */\n mechanismType?: ChanceMechanismType\n\n // \u2500\u2500 CMS flat input fields\uFF08mechanismType='input' \u65F6\u4F7F\u7528\uFF09\u2500\u2500\n\n /**\n * \u8F93\u5165\u6846\u5360\u4F4D\u6587\u672C\uFF08CMS: `inputPlaceholder`\uFF09\n * @default \"Enter your order number\"\n * @optional\n */\n inputPlaceholder?: string\n\n /**\n * \u63D0\u4EA4\u6309\u94AE\u6587\u6848\uFF08CMS: `inputSubmitText`\uFF09\n * @default \"Spin and Win\"\n * @optional\n */\n inputSubmitText?: string\n\n /**\n * \u8F93\u5165\u6846\u7C7B\u578B\uFF08CMS: `inputType`\uFF09\n * @default \"text\"\n * @optional\n */\n inputType?: 'text' | 'email' | 'number'\n\n /**\n * \u8F93\u5165\u683C\u5F0F\u9519\u8BEF\u63D0\u793A\u6587\u6848\uFF08CMS: `inputValidationErrorText`\uFF09\n * @optional\n */\n inputValidationErrorText?: string\n\n /**\n * \u8F93\u5165\u6846\u63D0\u4EA4\u4E2D loading \u6309\u94AE\u6587\u6848\uFF08CMS: `inputLoadingText`\uFF09\n * @default \"Loading...\"\n * @optional\n */\n inputLoadingText?: string\n\n /**\n * \u8F93\u5165\u6846\u914D\u7F6E\uFF08\u5F53 mechanismType \u4E3A 'input' \u65F6\u4F7F\u7528\uFF09\n * @deprecated Use flat input fields (`inputPlaceholder`, `inputSubmitText`, `inputType`, `inputValidationErrorText`, `inputLoadingText`) instead (CMS field names)\n * @optional\n */\n inputConfig?: ChanceInputConfig\n\n /**\n * \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u6807\u9898\n * @default \"Want more chances to win?\"\n * @optional\n */\n chanceTitle?: string\n\n /** \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u526F\u6807\u9898 */\n chanceSubtitle?: string\n\n /** \u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u5E95\u90E8\u63D0\u793A */\n chanceFooterNote?: string\n\n /** \u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u6587\u6848\u914D\u7F6E */\n chanceMethodsText?: {\n chanceBadgeText?: string\n completedText?: string\n usedText?: string\n loadingText?: string\n }\n\n // ========== \u4E2D\u5956\u4FE1\u606F Props ==========\n\n /**\n * \u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08CMS: `winningInfos` group \u2014 \u4E3B\u540D\u79F0\uFF09\n *\n * CMS \u4E2D `winningInfos` \u662F\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E group\uFF0C\u5B57\u6BB5\uFF1A\n * `title`\u3001`confirmButton`\u3001`confirmUrl`\u3001`learnMoreUrl`\u3001`learnMoreText`\u3002\n */\n winningInfos?: WinnerModalConfig\n\n /**\n * \u5E95\u90E8\u6EDA\u52A8\u6761\u4E2D\u5956\u4EBA\u540D\u5355\u6570\u636E\n *\n * \u539F `winningInfos: WinningInfo[]` \u91CD\u547D\u540D\u4E3A `winnerTickerData` \u4EE5\u907F\u514D\n * \u4E0E CMS `winningInfos` group \u547D\u540D\u51B2\u7A81\u3002\n *\n * @default []\n */\n winnerTickerData?: WinningInfo[]\n\n /**\n * \u4E2D\u5956\u6EDA\u52A8 Ticker \u6587\u6848\u6A21\u677F\uFF0C\u652F\u6301 {{name}} \u548C {{prize}} \u53D8\u91CF\n * @default \"{{name}} just won {{prize}}!\"\n * @optional\n */\n winnerNameTemplate?: string\n\n /** \u5956\u54C1\u6C60\u5C55\u793A\u533A\u57DF\u6807\u9898 */\n prizesTitle?: string\n\n // ========== \u56DE\u8C03\u51FD\u6570 Props ==========\n\n /**\n * \u62BD\u5956\u5F00\u59CB\u65F6\u7684\u56DE\u8C03\uFF0C\u8FD4\u56DE Promise \u4EE5\u652F\u6301\u5F02\u6B65\u63A5\u53E3\u8C03\u7528\n * @returns Promise<string> - \u4E2D\u5956\u5956\u54C1\u7684 prizeKey\n */\n onDrawStart?: () => Promise<string>\n\n /**\n * \u62BD\u5956\u7ED3\u675F\u65F6\u7684\u56DE\u8C03\uFF0C\u4F20\u9012\u4E2D\u5956\u5956\u54C1\n * @param prize \u4E2D\u5956\u5956\u54C1\u5BF9\u8C61\n */\n onDrawEnd?: (prize: Prize) => void\n\n /**\n * \u62BD\u5956\u9519\u8BEF\u65F6\u7684\u56DE\u8C03\n * @param error \u9519\u8BEF\u4FE1\u606F\n */\n onDrawError?: (error: Error) => void\n\n // ========== \u5F39\u7A97\u914D\u7F6E Props ==========\n\n /** \u4E2D\u5956\u5F39\u7A97\u914D\u7F6E */\n winnerModalConfig?: WinnerModalConfig\n\n /** \u89C4\u5219\u5F39\u7A97\u914D\u7F6E */\n rulesModalConfig?: RulesModalConfig\n\n /** \u9876\u680F\u53F3\u4FA7\u8DF3\u8F6C\u6309\u94AE\u914D\u7F6E\uFF1B\u672A\u914D\u7F6E text \u6216 url \u65F6\u4E0D\u5C55\u793A */\n actionButtonConfig?: ActionButtonConfig\n\n /** \u6211\u7684\u5956\u52B1\u5F39\u7A97\u914D\u7F6E */\n myRewardsModalConfig?: MyRewardsModalConfig\n\n /**\n * \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08CMS: `error` group \u2014 \u4E3B\u540D\u79F0\uFF09\n *\n * \u5B57\u6BB5\uFF1A`title`\u3001`defaultMessage`\u3001`confirmButton`\u3001\n * `exchangeFailedTitle`\u3001`exchangeFailedMessage`\u3002\n */\n error?: ErrorConfig\n\n /**\n * \u672A\u4E2D\u5956\u5F39\u7A97\u914D\u7F6E\uFF08CMS: `tryAgain` group\uFF09\n *\n * \u5B57\u6BB5\uFF1A`title`\u3001`message`\u3001`confirmText`\u3002\n */\n tryAgain?: TryAgainConfig\n\n /**\n * \u9519\u8BEF\u5F39\u7A97\u914D\u7F6E\uFF08\u65E7\u7248\uFF09\n * @deprecated Use `error` instead (CMS field name)\n */\n errorModalConfig?: ErrorModalConfig\n\n /** \u5206\u4EAB\u5F39\u7A97\u914D\u7F6E */\n shareModalConfig?: ShareModalConfig\n\n // ========== CMS \u5E73\u94FA\u6587\u6848\u5B57\u6BB5\uFF08\u4E3B\u540D\u79F0\uFF09==========\n\n /**\n * \u672A\u767B\u5F55\u65F6\u7684\u63D0\u793A\u6587\u6848\uFF08CMS: `loginPrompt`\uFF09\n * @default \"Please log in to participate in the lottery\"\n */\n loginPrompt?: string\n\n /**\n * \u6B21\u6570\u4E0D\u8DB3\u65F6\u7684\u63D0\u793A\u6587\u6848\uFF08CMS: `noChances`\uFF09\n * @default \"You have no chances left. Get more chances below!\"\n */\n noChances?: string\n\n /**\n * \u673A\u4F1A\u8FDB\u5EA6\u524D\u7F00\u6587\u6848\uFF08CMS: `opportunitiesPrefix`\uFF09\n * @default \"Number of draws remaining today: \"\n */\n opportunitiesPrefix?: string\n\n // ========== \u7528\u6237\u76F8\u5173 Props ==========\n\n /** \u7528\u6237\u6570\u636E */\n userData?: UserData\n\n /**\n * \u672A\u767B\u5F55\u65F6\u7684\u63D0\u793A\u6587\u6848\n * @deprecated Use `loginPrompt` instead (CMS field name)\n * @default \"Please log in to participate\"\n */\n loginPromptText?: string\n\n /**\n * \u767B\u5F55\u6309\u94AE\u6587\u6848\n * @default \"Log In\"\n */\n loginButtonText?: string\n\n /**\n * \u6B21\u6570\u4E0D\u8DB3\u65F6\u7684\u63D0\u793A\u6587\u6848\n * @deprecated Use `noChances` instead (CMS field name)\n * @default \"You have no chances left\"\n */\n noChancesText?: string\n\n /**\n * \u672A\u767B\u5F55\u65F6\u70B9\u51FB\u62BD\u5956\u7684\u56DE\u8C03\n */\n onLoginRequired?: () => void\n\n // ========== \u5176\u4ED6\u914D\u7F6E ==========\n\n /** \u590D\u5236\u4F18\u60E0\u7801\u56DE\u8C03 */\n onCopyCode?: (code: string) => void\n\n /**\n * \u673A\u4F1A\u8FDB\u5EA6\u6587\u6848\u6570\u7EC4\uFF08\u65E7\u7248\uFF0C\u9996\u5143\u7D20\u4E3A\u524D\u7F00\uFF0C\u6B21\u5143\u7D20\u4E3A\u540E\u7F00\uFF09\n * @deprecated Use `opportunitiesPrefix` instead (CMS field name)\n * @default [\"Number of draws remaining today:\"]\n */\n opportunitiesText?: string[]\n\n /** \u81EA\u5B9A\u4E49 CSS \u7C7B\u540D */\n className?: string\n}\n\n// ============================================================================\n// \u9ED8\u8BA4\u914D\u7F6E\n// ============================================================================\n\n/** \u9ED8\u8BA4 CTA \u6309\u94AE\u914D\u7F6E */\nexport const DEFAULT_CTA_BUTTON: CtaButtonConfig = {\n text: '',\n style: 'primary',\n}\n\n/** \u9ED8\u8BA4\u83B7\u53D6\u673A\u4F1A\u533A\u57DF\u6807\u9898 */\nexport const DEFAULT_CHANCE_TITLE = 'Want more chances to win?'\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,0BAAAE,EAAA,uBAAAC,IAAA,eAAAC,EAAAJ,GA+lBO,MAAMG,EAAsC,CACjD,KAAM,GACN,MAAO,SACT,EAGaD,EAAuB",
|
|
6
6
|
"names": ["types_exports", "__export", "DEFAULT_CHANCE_TITLE", "DEFAULT_CTA_BUTTON", "__toCommonJS"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
1
|
+
"use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import k,{useImperativeHandle as I,useRef as N}from"react";import{Heading as o,Picture as T,Text as s}from"../../components/index.js";import{cn as x}from"../../helpers/utils.js";import{withLayout as v}from"../../shared/Styles.js";import{useExposure as y}from"../../hooks/useExposure.js";const w="image",F="image_text_feature",f=k.forwardRef(({data:n,className:u},g)=>{const{title:r,subtitle:l,pcImage:t,mobileImage:c,padImage:d,items:_=[],imagePosition:a="left",theme:h="light"}=n,m=N(null);return y(m,{componentType:w,componentName:F,componentTitle:r,componentDescription:l}),I(g,()=>m.current),i("section",{ref:m,"data-ui-component-id":"ImageTextFeature",className:x("image-text-feature",h==="dark"?"aiui-dark":"","text-info-primary laptop:flex-row laptop:gap-[32px] desktop:gap-[48px] lg-desktop:gap-[64px] flex flex-col items-center gap-[24px]",u),children:[t?.url&&e(T,{source:`${t.url}, ${d?.url||t.url} 1024, ${c?.url||t.url} 768`,alt:t?.alt,className:x("image-text-feature__image tablet:aspect-[704/360] laptop:aspect-[824/560] aspect-[716/720] max-h-[560px] max-w-[824px] shrink-0",{"image-text-feature__image--left order-2 laptop:order-1 laptop:basis-[63%] desktop:basis-[57%]":a==="left","image-text-feature__image--right order-2 laptop:basis-[63%] desktop:basis-[57%]":a==="right"})}),i("div",{className:x("image-text-feature__content laptop:w-fit flex w-full flex-col items-start justify-center",{"order-1 laptop:order-2":a==="left","order-1":a==="right"}),children:[e(o,{size:4,html:r,as:"h3",className:"image-text-feature__title w-full text-left"}),l&&e(s,{size:4,html:l,as:"p",className:"image-text-feature__subtitle min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-left text-[14px]"}),e("div",{className:"image-text-feature__items tablet:flex-row tablet:justify-start tablet:gap-[90px] laptop:w-fit laptop:flex-col laptop:justify-around laptop:gap-0 flex w-full flex-col justify-around gap-0",children:_.map((p,b)=>i("div",{className:"image-text-feature__item laptop:mt-[32px] desktop:mt-[48px] mt-[24px]",children:[i("div",{className:"image-text-feature__item-header flex flex-row items-center gap-[8px]",children:[p.icon&&e("img",{src:p.icon,alt:"icon",className:"image-text-feature__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] -translate-y-[12%] md:text-[40px]"}),e(o,{size:5,as:"h6",className:"image-text-feature__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:p.text})]}),e(s,{size:4,as:"p",html:p.desc,className:"image-text-feature__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] -mt-[2px] text-[14px]"})]},b))})]})]})});f.displayName="ImageTextFeature";var L=v(f);export{L as default};
|
|
2
2
|
//# sourceMappingURL=ImageTextFeature.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/ImageTextFeature/ImageTextFeature.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { ImageTextFeatureProps, ImageTextFeatureItem } from './types.js'\n\nconst componentType = 'image'\nconst componentName = 'image_text_feature'\n\nconst ImageTextFeature = React.forwardRef<HTMLDivElement, ImageTextFeatureProps>(({ data, className }, ref) => {\n const { title, subtitle, pcImage, mobileImage, padImage, items = [], imagePosition = 'left', theme = 'light' } = data\n\n const boxRef = useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: title,\n componentDescription: subtitle,\n })\n\n useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n return (\n <section\n ref={boxRef}\n data-ui-component-id=\"ImageTextFeature\"\n className={cn(\n 'image-text-feature',\n theme === 'dark' ? 'aiui-dark' : '',\n 'text-info-primary laptop:flex-row laptop:gap-[32px] desktop:gap-[48px] lg-desktop:gap-[64px] flex flex-col items-center gap-[24px]',\n className\n )}\n >\n {/* \u56FE\u7247\u533A\u57DF */}\n <Picture\n
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { ImageTextFeatureProps, ImageTextFeatureItem } from './types.js'\n\nconst componentType = 'image'\nconst componentName = 'image_text_feature'\n\nconst ImageTextFeature = React.forwardRef<HTMLDivElement, ImageTextFeatureProps>(({ data, className }, ref) => {\n const { title, subtitle, pcImage, mobileImage, padImage, items = [], imagePosition = 'left', theme = 'light' } = data\n\n const boxRef = useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: title,\n componentDescription: subtitle,\n })\n\n useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n return (\n <section\n ref={boxRef}\n data-ui-component-id=\"ImageTextFeature\"\n className={cn(\n 'image-text-feature',\n theme === 'dark' ? 'aiui-dark' : '',\n 'text-info-primary laptop:flex-row laptop:gap-[32px] desktop:gap-[48px] lg-desktop:gap-[64px] flex flex-col items-center gap-[24px]',\n className\n )}\n >\n {/* \u56FE\u7247\u533A\u57DF */}\n {pcImage?.url && (\n <Picture\n source={`${pcImage.url}, ${padImage?.url || pcImage.url} 1024, ${mobileImage?.url || pcImage.url} 768`}\n alt={pcImage?.alt}\n className={cn(\n 'image-text-feature__image tablet:aspect-[704/360] laptop:aspect-[824/560] aspect-[716/720] max-h-[560px] max-w-[824px] shrink-0',\n {\n 'image-text-feature__image--left order-2 laptop:order-1 laptop:basis-[63%] desktop:basis-[57%]':\n imagePosition === 'left',\n 'image-text-feature__image--right order-2 laptop:basis-[63%] desktop:basis-[57%]':\n imagePosition === 'right',\n }\n )}\n />\n )}\n\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div\n className={cn('image-text-feature__content laptop:w-fit flex w-full flex-col items-start justify-center', {\n 'order-1 laptop:order-2': imagePosition === 'left',\n 'order-1': imagePosition === 'right',\n })}\n >\n {/* \u6807\u9898 */}\n <Heading size={4} html={title} as=\"h3\" className=\"image-text-feature__title w-full text-left\" />\n\n {/* \u526F\u6807\u9898 */}\n {subtitle && (\n <Text\n size={4}\n html={subtitle}\n as=\"p\"\n className=\"image-text-feature__subtitle min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-left text-[14px]\"\n />\n )}\n\n {/* \u529F\u80FD\u5217\u8868 */}\n <div className=\"image-text-feature__items tablet:flex-row tablet:justify-start tablet:gap-[90px] laptop:w-fit laptop:flex-col laptop:justify-around laptop:gap-0 flex w-full flex-col justify-around gap-0\">\n {items.map((item: ImageTextFeatureItem, index: number) => (\n <div key={index} className=\"image-text-feature__item laptop:mt-[32px] desktop:mt-[48px] mt-[24px]\">\n <div className=\"image-text-feature__item-header flex flex-row items-center gap-[8px]\">\n {item.icon && (\n <img\n src={item.icon}\n alt=\"icon\"\n className=\"image-text-feature__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] -translate-y-[12%] md:text-[40px]\"\n />\n )}\n <Heading\n size={5}\n as=\"h6\"\n className=\"image-text-feature__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent\"\n >\n {item.text}\n </Heading>\n </div>\n <Text\n size={4}\n as=\"p\"\n html={item.desc}\n className=\"image-text-feature__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] -mt-[2px] text-[14px]\"\n />\n </div>\n ))}\n </div>\n </div>\n </section>\n )\n})\n\nImageTextFeature.displayName = 'ImageTextFeature'\n\nexport default withLayout(ImageTextFeature)\n"],
|
|
5
|
+
"mappings": "aAsCQ,cAAAA,EAuCM,QAAAC,MAvCN,oBArCR,OAAOC,GAAS,uBAAAC,EAAqB,UAAAC,MAAc,QACnD,OAAS,WAAAC,EAAS,WAAAC,EAAS,QAAAC,MAAY,4BACvC,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAC3B,OAAS,eAAAC,MAAmB,6BAG5B,MAAMC,EAAgB,QAChBC,EAAgB,qBAEhBC,EAAmBX,EAAM,WAAkD,CAAC,CAAE,KAAAY,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CAC7G,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAU,QAAAC,EAAS,YAAAC,EAAa,SAAAC,EAAU,MAAAC,EAAQ,CAAC,EAAG,cAAAC,EAAgB,OAAQ,MAAAC,EAAQ,OAAQ,EAAIV,EAE3GW,EAASrB,EAAuB,IAAI,EAE1C,OAAAM,EAAYe,EAAQ,CAClB,cAAAd,EACA,cAAAC,EACA,eAAgBK,EAChB,qBAAsBC,CACxB,CAAC,EAEDf,EAAoBa,EAAK,IAAMS,EAAO,OAAyB,EAG7DxB,EAAC,WACC,IAAKwB,EACL,uBAAqB,mBACrB,UAAWjB,EACT,qBACAgB,IAAU,OAAS,YAAc,GACjC,qIACAT,CACF,EAGC,UAAAI,GAAS,KACRnB,EAACM,EAAA,CACC,OAAQ,GAAGa,EAAQ,GAAG,KAAKE,GAAU,KAAOF,EAAQ,GAAG,UAAUC,GAAa,KAAOD,EAAQ,GAAG,OAChG,IAAKA,GAAS,IACd,UAAWX,EACT,kIACA,CACE,gGACEe,IAAkB,OACpB,kFACEA,IAAkB,OACtB,CACF,EACF,EAIFtB,EAAC,OACC,UAAWO,EAAG,2FAA4F,CACxG,yBAA0Be,IAAkB,OAC5C,UAAWA,IAAkB,OAC/B,CAAC,EAGD,UAAAvB,EAACK,EAAA,CAAQ,KAAM,EAAG,KAAMY,EAAO,GAAG,KAAK,UAAU,6CAA6C,EAG7FC,GACClB,EAACO,EAAA,CACC,KAAM,EACN,KAAMW,EACN,GAAG,IACH,UAAU,yHACZ,EAIFlB,EAAC,OAAI,UAAU,6LACZ,SAAAsB,EAAM,IAAI,CAACI,EAA4BC,IACtC1B,EAAC,OAAgB,UAAU,wEACzB,UAAAA,EAAC,OAAI,UAAU,uEACZ,UAAAyB,EAAK,MACJ1B,EAAC,OACC,IAAK0B,EAAK,KACV,IAAI,OACJ,UAAU,4LACZ,EAEF1B,EAACK,EAAA,CACC,KAAM,EACN,GAAG,KACH,UAAU,2GAET,SAAAqB,EAAK,KACR,GACF,EACA1B,EAACO,EAAA,CACC,KAAM,EACN,GAAG,IACH,KAAMmB,EAAK,KACX,UAAU,uIACZ,IAtBQC,CAuBV,CACD,EACH,GACF,GACF,CAEJ,CAAC,EAEDd,EAAiB,YAAc,mBAE/B,IAAOe,EAAQnB,EAAWI,CAAgB",
|
|
6
6
|
"names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "Heading", "Picture", "Text", "cn", "withLayout", "useExposure", "componentType", "componentName", "ImageTextFeature", "data", "className", "ref", "title", "subtitle", "pcImage", "mobileImage", "padImage", "items", "imagePosition", "theme", "boxRef", "item", "index", "ImageTextFeature_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as a,jsxs as c}from"react/jsx-runtime";import g from"react";import{cn as s}from"../../helpers/index.js";import{Button as C,Checkbox as
|
|
1
|
+
"use client";import{jsx as a,jsxs as c}from"react/jsx-runtime";import g from"react";import{cn as s}from"../../helpers/index.js";import{Button as C,Checkbox as D,Heading as T,Text as A}from"../../components/index.js";const M=({theme:t,methods:e,title:x="Want more chances to win?",subtitle:r,footerNote:n,className:o,userData:h,onOpenShareModal:d,chanceBadgeText:l="Chance +1",completedText:m="Completed",usedText:p="Used",loadingText:u="Loading...",mechanismType:w="methods",inputConfig:k,isAgreementChecked:v,onAgreementCheckedChange:f,agreementErrorText:N})=>w==="input"&&k?c("div",{className:s("chance-methods-container","flex flex-col overflow-y-auto","p-[16px]","desktop:px-[24px] desktop:pt-[24px]","lg-desktop:px-[32px]","gap-[16px]","lg-desktop:gap-[16px]",t==="dark"?"aiui-dark":"",o),children:[c("div",{className:"chance-methods-header flex flex-col gap-[4px]",children:[a(T,{size:2,className:s("chance-methods-title","text-info-primary tracking-[-0.32px]"),children:x}),r&&a("p",{className:s("chance-methods-subtitle","text-[14px] font-semibold leading-[1.4]","lg-desktop:text-[18px] desktop:text-[16px]",t==="dark"?"text-[#8A8D92]":"text-[#4A4C56]"),children:r})]}),a(S,{theme:t,inputConfig:k,isAgreementChecked:v,onAgreementCheckedChange:f,agreementErrorText:N}),n&&a("p",{className:s("chance-methods-footer","font-semibold","text-[14px] leading-[1.4] ","desktop:pt-[24px] pt-[16px]",t==="dark"?"text-[#75787F]":"text-[#767880]"),children:n})]}):!e||e.length===0?null:c("div",{className:s("chance-methods-container","flex flex-col overflow-y-auto","p-[16px]","desktop:px-[24px] desktop:pt-[24px]","lg-desktop:px-[32px]","gap-[16px]","lg-desktop:gap-[16px]",t==="dark"?"aiui-dark":"",o),children:[c("div",{className:"chance-methods-header flex flex-col gap-[4px]",children:[a(T,{size:2,className:s("chance-methods-title","text-info-primary tracking-[-0.32px]"),children:x}),r&&a("p",{className:s("chance-methods-subtitle","text-[14px] font-semibold leading-[1.4]","lg-desktop:text-[18px] desktop:text-[16px]",t==="dark"?"text-[#8A8D92]":"text-[#4A4C56]"),children:r})]}),a("div",{className:"chance-methods-list flex grow flex-col gap-[16px]",children:e.map(b=>a(E,{method:b,userData:h,onOpenShareModal:d,chanceBadgeText:l,completedText:m,usedText:p,loadingText:u},b.methodKey))}),n&&a("p",{className:s("chance-methods-footer","font-semibold","text-[14px] leading-[1.4] ","desktop:pt-[24px] pt-[16px]",t==="dark"?"text-[#75787F]":"text-[#767880]"),children:n})]}),S=({theme:t,inputConfig:e,isAgreementChecked:x,onAgreementCheckedChange:r,agreementErrorText:n})=>{const[o,h]=g.useState(e.defaultValue||""),[d,l]=g.useState(""),[m,p]=g.useState(""),[u,w]=g.useState(!1),k=!!e.agreementNotice,v=x??u,f=!e.isSubmitting&&!!o.trim(),N=e.validationPattern??(e.inputType==="email"?"^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$":void 0);g.useEffect(()=>{e.defaultValue&&!o&&h(e.defaultValue)},[e.defaultValue]),g.useEffect(()=>{n&&p(n)},[n]);const b=async()=>{if(f){if(k&&!v){p(e.agreementWarningText||"Please agree to the terms before continuing");return}if(N&&!new RegExp(N).test(o.trim())){l(e.validationErrorText||"Invalid input");return}l(""),p("");try{await e.onSubmit?.(o.trim())}catch(i){console.error("[ChanceInputMode] onSubmit error:",i)}}};return c("div",{className:"chance-input-mode flex grow flex-col gap-[16px]",children:[a("input",{type:e.inputType||"text",value:o,onChange:i=>{h(i.target.value),l("")},placeholder:e.placeholder||"Enter your order number",disabled:e.isSubmitting||e.disabled,autoComplete:e.disableAutofill?"new-password":void 0,name:e.disableAutofill?"lottery-input":void 0,readOnly:e.disabled,className:s("rounded-btn laptop:h-[54px] laptop:px-[16px] h-[44px] w-full border bg-transparent px-[12px]","lg-desktop:text-[16px] text-[14px] leading-[1.4]","outline-none transition-colors focus:ring-0 focus-visible:outline-none focus-visible:ring-0","border-[#D1D5DB] placeholder:text-[#9CA3AF]",d?"border-red-500":"",t==="dark"?"text-white":"text-[#1E2024]"),onKeyDown:i=>{i.key==="Enter"&&f&&b()}}),a(C,{size:"lg",variant:t==="dark"?"primary":"secondary",onClick:b,disabled:!f,className:"w-fit","data-headless-type-name":e.submitTrackTypeName,"data-headless-title-desc-button":e.submitTrackTitleDescButton,children:e.isSubmitting?e.loadingText||"Loading...":e.submitText||"Spin and Win"}),d&&a("p",{className:"text-[12px] text-red-500",children:d}),m&&a("p",{className:"text-[12px] text-red-500",children:m}),k&&c("label",{className:"flex items-start gap-[8px] pt-[4px]",children:[a(D,{checked:v,onCheckedChange:i=>{const y=!!i;r?.(y),w(y),y&&p("")},className:s("mt-[2px] shrink-0",t==="dark"?"border-white/60 data-[state=checked]:border-white data-[state=checked]:bg-white data-[state=checked]:text-[#1D1D1F]":"border-[#1D1D1F]/40 data-[state=checked]:border-[#1D1D1F] data-[state=checked]:bg-[#1D1D1F] data-[state=checked]:text-white")}),a(A,{html:e.agreementNotice,className:s("text-[14px] font-[700] leading-[1.4]","[&_a]:underline [&_a]:underline-offset-2",t==="dark"?"text-white/95 [&_a]:text-white [&_a]:hover:text-white/80":"text-[#1E2024] [&_a]:text-[#1E2024] [&_a]:hover:text-[#1E2024]/80")})]})]})},E=({method:t,userData:e,onOpenShareModal:x,chanceBadgeText:r,completedText:n,usedText:o,loadingText:h})=>{const d=t.status||"pending",l=t.loading||!1,m=t.disabled||d==="completed"||d==="used"||l,p=()=>{if(!e?.isLoggedIn){t.onLoginRequired?.();return}t.openShareModal&&x&&x(),t.onClick()},u={pending:l?h:t?.buttonText||"Redeem now",completed:n,used:o};return c("div",{className:s("chance-method-item","flex flex-col items-start gap-[8px]","tablet:flex-row tablet:items-center tablet:gap-4","transition-all",{"opacity-60":m}),children:[c("div",{className:s("chance-method-info","flex flex-1 flex-col gap-[4px]","min-w-0"),children:[c("div",{className:"flex flex-wrap items-center gap-[4px]",children:[a("p",{className:s("chance-method-title","text-info-primary","text-[14px] font-[700] leading-[1.4] ","lg-desktop:text-[18px] desktop:text-[16px]"),children:t.title}),a("span",{className:s("chance-badge","text-[14px] leading-[1.4] ","lg-desktop:text-[18px] desktop:text-[16px]","font-[700]","shrink-0",{"text-[#ff6b35]":d==="pending","text-[#4caf50]":d==="completed","text-[#75787F]":d==="used"}),children:r})]}),a("p",{className:s("chance-method-description","text-info-primary","text-[14px] leading-[1.4] ","lg-desktop:text-[18px] desktop:text-[16px]","font-[700]"),children:t.description})]}),a("div",{className:"chance-method-action shrink-0",children:a(C,{onClick:p,disabled:m,className:s("chance-button","lg-desktop:min-w-[162px] min-w-[132px]",{"bg-[#4caf50]":d==="completed","bg-[#75787F]":d==="used"}),children:u[d]})})]})};var P=M;export{M as ChanceMethods,P as default};
|
|
2
2
|
//# sourceMappingURL=ChanceMethods.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/LotteryShared/ChanceMethods.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * ChanceMethods - \u83B7\u53D6\u62BD\u5956\u673A\u4F1A\u65B9\u5F0F\u7EC4\u4EF6\n *\n * \u5C55\u793A\u7528\u6237\u83B7\u53D6\u989D\u5916\u62BD\u5956\u673A\u4F1A\u7684\u591A\u79CD\u65B9\u5F0F(\u5982\u5206\u4EAB\u3001\u79EF\u5206\u5151\u6362\u3001\u63A8\u8350\u7B49)\u3002\n * \u57FA\u4E8E Figma \u8BBE\u8BA1\u7A3F\u5B9E\u73B0\u54CD\u5E94\u5F0F\u5E03\u5C40\u3002\n *\n * Figma \u8BBE\u8BA1\u7A3F: https://www.figma.com/design/DhWsPamqTM76eMHS0aIQqw\n * \u8BBE\u8BA1\u8282\u70B9: 498:6185 (Chance Methods section)\n *\n * @module ChanceMethods\n * @date 2025-12-17\n */\n\n'use client'\n\nimport React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport type { ChanceInputConfig, ChanceMethod, ChanceMethodsProps, UserData } from './types.js'\nimport { Button, Checkbox, Heading, Text } from '../../components/index.js'\n\n// ============================================================================\n// ChanceMethods \u7EC4\u4EF6\n// ============================================================================\n\n/**\n * ChanceMethods - \u83B7\u53D6\u62BD\u5956\u673A\u4F1A\u65B9\u5F0F\u7EC4\u4EF6\n *\n * \u7279\u6027:\n * - \u5C55\u793A\u591A\u79CD\u83B7\u53D6\u673A\u4F1A\u7684\u65B9\u5F0F(\u5206\u4EAB\u3001\u79EF\u5206\u3001\u63A8\u8350\u7B49)\n * - \u6BCF\u79CD\u65B9\u5F0F\u663E\u793A\u6807\u9898\u3001\u63CF\u8FF0\u3001Chance +1 \u5FBD\u7AE0\u548C\u884C\u52A8\u6309\u94AE\n * - \u652F\u6301\u7981\u7528\u72B6\u6001\n * - \u54CD\u5E94\u5F0F\u5E03\u5C40\n */\nexport const ChanceMethods: React.FC<ChanceMethodsProps> = ({\n theme,\n methods,\n title = 'Want more chances to win?',\n subtitle,\n footerNote,\n className,\n userData,\n onOpenShareModal,\n chanceBadgeText = 'Chance +1',\n completedText = 'Completed',\n usedText = 'Used',\n loadingText = 'Loading...',\n mechanismType = 'methods',\n inputConfig,\n isAgreementChecked,\n onAgreementCheckedChange,\n agreementErrorText,\n}) => {\n // \u8F93\u5165\u6846\u6A21\u5F0F\n if (mechanismType === 'input' && inputConfig) {\n return (\n <div\n className={cn(\n 'chance-methods-container',\n 'flex flex-col overflow-y-auto',\n 'p-[16px]',\n 'desktop:px-[24px] desktop:pt-[24px]',\n 'lg-desktop:px-[32px]',\n 'gap-[16px]',\n 'lg-desktop:gap-[16px]',\n theme === 'dark' ? 'aiui-dark' : '',\n className\n )}\n >\n {/* \u6807\u9898\u533A\u57DF */}\n <div className=\"chance-methods-header flex flex-col gap-[4px]\">\n <Heading size={2} className={cn('chance-methods-title', 'text-info-primary tracking-[-0.32px]')}>\n {title}\n </Heading>\n\n {subtitle && (\n <p\n className={cn(\n 'chance-methods-subtitle',\n 'text-[14px] font-semibold leading-[1.4]',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n theme === 'dark' ? 'text-[#8A8D92]' : 'text-[#4A4C56]'\n )}\n >\n {subtitle}\n </p>\n )}\n </div>\n\n {/* \u8F93\u5165\u6846 + \u63D0\u4EA4\u6309\u94AE */}\n <ChanceInputMode\n theme={theme}\n inputConfig={inputConfig}\n isAgreementChecked={isAgreementChecked}\n onAgreementCheckedChange={onAgreementCheckedChange}\n agreementErrorText={agreementErrorText}\n />\n\n {/* \u5E95\u90E8\u63D0\u793A */}\n {footerNote && (\n <p\n className={cn(\n 'chance-methods-footer',\n 'font-semibold',\n 'text-[14px] leading-[1.4] ',\n 'desktop:pt-[24px] pt-[16px]',\n theme === 'dark' ? 'text-[#75787F]' : 'text-[#767880]'\n )}\n >\n {footerNote}\n </p>\n )}\n </div>\n )\n }\n\n // \u9632\u5FA1\u6027\u7F16\u7A0B:\u5904\u7406 undefined \u6216\u7A7A\u6570\u7EC4\n if (!methods || methods.length === 0) {\n return null\n }\n\n return (\n <div\n className={cn(\n 'chance-methods-container',\n 'flex flex-col overflow-y-auto',\n 'p-[16px]',\n 'desktop:px-[24px] desktop:pt-[24px]',\n 'lg-desktop:px-[32px]',\n 'gap-[16px]', // \u9ED8\u8BA4\u95F4\u8DDD\n 'lg-desktop:gap-[16px]', // lg-desktop: Figma \u8BBE\u8BA1\u7A3F\u95F4\u8DDD\n theme === 'dark' ? 'aiui-dark' : '',\n className\n )}\n >\n {/* \u6807\u9898\u533A\u57DF */}\n <div className=\"chance-methods-header flex flex-col gap-[4px]\">\n <Heading size={2} className={cn('chance-methods-title', 'text-info-primary tracking-[-0.32px]')}>\n {title}\n </Heading>\n\n {subtitle && (\n <p\n className={cn(\n 'chance-methods-subtitle',\n 'text-[14px] font-semibold leading-[1.4]',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n theme === 'dark' ? 'text-[#8A8D92]' : 'text-[#4A4C56]'\n )}\n >\n {subtitle}\n </p>\n )}\n </div>\n\n {/* \u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u5217\u8868 */}\n <div className=\"chance-methods-list flex grow flex-col gap-[16px]\">\n {methods.map(method => (\n <ChanceMethodItem\n key={method.methodKey}\n method={method}\n userData={userData}\n onOpenShareModal={onOpenShareModal}\n chanceBadgeText={chanceBadgeText}\n completedText={completedText}\n usedText={usedText}\n loadingText={loadingText}\n />\n ))}\n </div>\n\n {/* \u5E95\u90E8\u63D0\u793A */}\n {footerNote && (\n <p\n className={cn(\n 'chance-methods-footer',\n 'font-semibold',\n 'text-[14px] leading-[1.4] ',\n 'desktop:pt-[24px] pt-[16px]',\n theme === 'dark' ? 'text-[#75787F]' : 'text-[#767880]'\n )}\n >\n {footerNote}\n </p>\n )}\n </div>\n )\n}\n\n// ============================================================================\n// ChanceInputMode \u5B50\u7EC4\u4EF6 - \u8F93\u5165\u6846\u6A21\u5F0F\n// ============================================================================\n\ninterface ChanceInputModeProps {\n theme?: 'light' | 'dark'\n inputConfig: ChanceInputConfig\n isAgreementChecked?: boolean\n onAgreementCheckedChange?: (checked: boolean) => void\n agreementErrorText?: string\n}\n\nconst ChanceInputMode: React.FC<ChanceInputModeProps> = ({\n theme,\n inputConfig,\n isAgreementChecked: controlledAgreementChecked,\n onAgreementCheckedChange,\n agreementErrorText,\n}) => {\n const [value, setValue] = React.useState(inputConfig.defaultValue || '')\n const [error, setError] = React.useState('')\n const [agreementError, setAgreementError] = React.useState('')\n const [internalAgreementChecked, setInternalAgreementChecked] = React.useState(false)\n\n const hasAgreementNotice = Boolean(inputConfig.agreementNotice)\n const isAgreementChecked = controlledAgreementChecked ?? internalAgreementChecked\n\n // Single source of truth for submit eligibility \u2014 shared by button, Enter key, and handleSubmit\n const canSubmit = !inputConfig.isSubmitting && Boolean(value.trim())\n\n const resolvedValidationPattern =\n inputConfig.validationPattern ?? (inputConfig.inputType === 'email' ? '^[^\\\\s@]+@[^\\\\s@]+\\\\.[^\\\\s@]+$' : undefined)\n\n React.useEffect(() => {\n if (inputConfig.defaultValue && !value) {\n setValue(inputConfig.defaultValue)\n }\n }, [inputConfig.defaultValue])\n\n React.useEffect(() => {\n if (agreementErrorText) {\n setAgreementError(agreementErrorText)\n }\n }, [agreementErrorText])\n\n const handleSubmit = async () => {\n if (!canSubmit) return\n\n if (hasAgreementNotice && !isAgreementChecked) {\n setAgreementError(inputConfig.agreementWarningText || 'Please agree to the terms before continuing')\n return\n }\n\n if (resolvedValidationPattern) {\n const regex = new RegExp(resolvedValidationPattern)\n if (!regex.test(value.trim())) {\n setError(inputConfig.validationErrorText || 'Invalid input')\n return\n }\n }\n setError('')\n setAgreementError('')\n try {\n await inputConfig.onSubmit?.(value.trim())\n } catch (error) {\n // \u9519\u8BEF\u5F39\u7A97\u7531\u7236\u7EC4\u4EF6 (showError / onDrawError) \u5904\u7406\uFF0C\u6B64\u5904\u4EC5\u9632\u6B62 unhandled rejection\n console.error('[ChanceInputMode] onSubmit error:', error)\n }\n }\n\n return (\n <div className=\"chance-input-mode flex grow flex-col gap-[16px]\">\n <input\n type={inputConfig.inputType || 'text'}\n value={value}\n onChange={e => {\n setValue(e.target.value)\n setError('')\n }}\n placeholder={inputConfig.placeholder || 'Enter your order number'}\n disabled={inputConfig.isSubmitting || inputConfig.disabled}\n autoComplete={inputConfig.disableAutofill ? 'new-password' : undefined}\n name={inputConfig.disableAutofill ? 'lottery-input' : undefined}\n readOnly={inputConfig.disabled}\n className={cn(\n 'rounded-btn laptop:h-[54px] laptop:px-[16px] h-[44px] w-full border bg-transparent px-[12px]',\n 'lg-desktop:text-[16px] text-[14px] leading-[1.4]',\n 'outline-none transition-colors focus:ring-0 focus-visible:outline-none focus-visible:ring-0',\n 'border-[#D1D5DB] placeholder:text-[#9CA3AF]',\n error ? 'border-red-500' : '',\n theme === 'dark' ? 'text-white' : 'text-[#1E2024]'\n )}\n onKeyDown={e => {\n if (e.key === 'Enter' && canSubmit) handleSubmit()\n }}\n />\n <Button\n size=\"lg\"\n variant={theme === 'dark' ? 'primary' : 'secondary'}\n onClick={handleSubmit}\n disabled={!canSubmit}\n className=\"w-fit\"\n data-headless-type-name={inputConfig.submitTrackTypeName}\n data-headless-title-desc-button={inputConfig.submitTrackTitleDescButton}\n >\n {inputConfig.isSubmitting ? 'Loading...' : inputConfig.submitText || 'Spin and Win'}\n </Button>\n {error && <p className=\"text-[12px] text-red-500\">{error}</p>}\n {agreementError && <p className=\"text-[12px] text-red-500\">{agreementError}</p>}\n\n {hasAgreementNotice && (\n <label className=\"flex items-start gap-[8px] pt-[4px]\">\n <Checkbox\n checked={isAgreementChecked}\n onCheckedChange={checked => {\n const nextChecked = Boolean(checked)\n onAgreementCheckedChange?.(nextChecked)\n setInternalAgreementChecked(nextChecked)\n if (nextChecked) {\n setAgreementError('')\n }\n }}\n className={cn(\n 'mt-[2px] shrink-0',\n theme === 'dark'\n ? 'border-white/60 data-[state=checked]:border-white data-[state=checked]:bg-white data-[state=checked]:text-[#1D1D1F]'\n : 'border-[#1D1D1F]/40 data-[state=checked]:border-[#1D1D1F] data-[state=checked]:bg-[#1D1D1F] data-[state=checked]:text-white'\n )}\n />\n <Text\n html={inputConfig.agreementNotice}\n className={cn(\n 'text-[14px] font-[700] leading-[1.4]',\n '[&_a]:underline [&_a]:underline-offset-2',\n theme === 'dark'\n ? 'text-white/95 [&_a]:text-white [&_a]:hover:text-white/80'\n : 'text-[#1E2024] [&_a]:text-[#1E2024] [&_a]:hover:text-[#1E2024]/80'\n )}\n />\n </label>\n )}\n </div>\n )\n}\n\n// ChanceMethodItem \u5B50\u7EC4\u4EF6 - \u5355\u4E2A\u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u5361\u7247\n// ============================================================================\n\ninterface ChanceMethodItemProps {\n method: ChanceMethod\n userData?: UserData\n onOpenShareModal?: () => void\n chanceBadgeText: string\n completedText: string\n usedText: string\n loadingText: string\n}\n\n/**\n * ChanceMethodItem - \u5355\u4E2A\u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u5361\u7247\n *\n * \u5C55\u793A\u65B9\u5F0F\u540D\u79F0\u3001\u63CF\u8FF0\u3001Chance +1 \u5FBD\u7AE0\u548C\u884C\u52A8\u6309\u94AE\u3002\n * \u652F\u6301\u4E09\u79CD\u72B6\u6001\uFF1Apending\uFF08\u672A\u5B8C\u6210\uFF09\u3001completed\uFF08\u5DF2\u5B8C\u6210\uFF09\u3001used\uFF08\u5DF2\u4F7F\u7528\uFF09\n */\nconst ChanceMethodItem: React.FC<ChanceMethodItemProps> = ({\n method,\n userData,\n onOpenShareModal,\n chanceBadgeText,\n completedText,\n usedText,\n loadingText,\n}) => {\n const status = method.status || 'pending'\n const isLoading = method.loading || false\n const isDisabledOrCompleted = method.disabled || status === 'completed' || status === 'used' || isLoading\n\n // \u5904\u7406\u6309\u94AE\u70B9\u51FB\n const handleClick = () => {\n // \u68C0\u67E5\u767B\u5F55\u72B6\u6001\n if (!userData?.isLoggedIn) {\n // \u672A\u767B\u5F55\u65F6\uFF0C\u53EA\u8C03\u7528\u767B\u5F55\u56DE\u8C03\uFF0C\u4E0D\u6253\u5F00\u5206\u4EAB\u5F39\u7A97\n method.onLoginRequired?.()\n return\n }\n\n // \u5DF2\u767B\u5F55\u65F6\uFF0C\u6267\u884C\u6B63\u5E38\u903B\u8F91\n // \u5982\u679C\u914D\u7F6E\u4E86 openShareModal\uFF0C\u5219\u6253\u5F00\u5206\u4EAB\u5F39\u7A97\n if (method.openShareModal && onOpenShareModal) {\n onOpenShareModal()\n }\n // \u6267\u884C\u539F\u6709\u7684 onClick \u56DE\u8C03\n method.onClick()\n }\n\n // \u72B6\u6001\u6587\u672C\u6620\u5C04\n const statusTextMap = {\n pending: isLoading ? loadingText : method?.buttonText || 'Redeem now',\n completed: completedText,\n used: usedText,\n }\n\n return (\n <div\n className={cn(\n 'chance-method-item',\n 'flex flex-col items-start gap-[8px]',\n 'tablet:flex-row tablet:items-center tablet:gap-4',\n 'transition-all',\n {\n 'opacity-60': isDisabledOrCompleted,\n }\n )}\n >\n {/* \u5DE6\u4FA7:\u65B9\u5F0F\u4FE1\u606F */}\n <div\n className={cn(\n 'chance-method-info',\n 'flex flex-1 flex-col gap-[4px]',\n 'min-w-0' // \u786E\u4FDD\u6587\u672C\u53EF\u4EE5\u88AB\u622A\u65AD\n )}\n >\n {/* \u6807\u9898 + Chance +1 \u5FBD\u7AE0 */}\n <div className=\"flex flex-wrap items-center gap-[4px]\">\n <p\n className={cn(\n 'chance-method-title',\n 'text-info-primary',\n 'text-[14px] font-[700] leading-[1.4] ',\n 'lg-desktop:text-[18px] desktop:text-[16px]'\n )}\n >\n {method.title}\n </p>\n\n <span\n className={cn(\n 'chance-badge',\n 'text-[14px] leading-[1.4] ',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n 'font-[700]',\n 'shrink-0',\n {\n 'text-[#ff6b35]': status === 'pending',\n 'text-[#4caf50]': status === 'completed',\n 'text-[#75787F]': status === 'used',\n }\n )}\n >\n {chanceBadgeText}\n </span>\n </div>\n\n {/* \u63CF\u8FF0\u6587\u672C */}\n <p\n className={cn(\n 'chance-method-description',\n 'text-info-primary',\n 'text-[14px] leading-[1.4] ',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n 'font-[700]'\n )}\n >\n {method.description}\n </p>\n </div>\n\n {/* \u53F3\u4FA7:\u884C\u52A8\u6309\u94AE */}\n <div className=\"chance-method-action shrink-0\">\n <Button\n onClick={handleClick}\n disabled={isDisabledOrCompleted}\n className={cn('chance-button', 'lg-desktop:min-w-[162px] min-w-[132px]', {\n 'bg-[#4caf50]': status === 'completed',\n 'bg-[#75787F]': status === 'used',\n })}\n >\n {statusTextMap[status]}\n </Button>\n </div>\n </div>\n )\n}\n\n// ============================================================================\n// \u9ED8\u8BA4\u5BFC\u51FA\n// ============================================================================\n\nexport default ChanceMethods\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["/**\n * ChanceMethods - \u83B7\u53D6\u62BD\u5956\u673A\u4F1A\u65B9\u5F0F\u7EC4\u4EF6\n *\n * \u5C55\u793A\u7528\u6237\u83B7\u53D6\u989D\u5916\u62BD\u5956\u673A\u4F1A\u7684\u591A\u79CD\u65B9\u5F0F(\u5982\u5206\u4EAB\u3001\u79EF\u5206\u5151\u6362\u3001\u63A8\u8350\u7B49)\u3002\n * \u57FA\u4E8E Figma \u8BBE\u8BA1\u7A3F\u5B9E\u73B0\u54CD\u5E94\u5F0F\u5E03\u5C40\u3002\n *\n * Figma \u8BBE\u8BA1\u7A3F: https://www.figma.com/design/DhWsPamqTM76eMHS0aIQqw\n * \u8BBE\u8BA1\u8282\u70B9: 498:6185 (Chance Methods section)\n *\n * @module ChanceMethods\n * @date 2025-12-17\n */\n\n'use client'\n\nimport React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport type { ChanceInputConfig, ChanceMethod, ChanceMethodsProps, UserData } from './types.js'\nimport { Button, Checkbox, Heading, Text } from '../../components/index.js'\n\n// ============================================================================\n// ChanceMethods \u7EC4\u4EF6\n// ============================================================================\n\n/**\n * ChanceMethods - \u83B7\u53D6\u62BD\u5956\u673A\u4F1A\u65B9\u5F0F\u7EC4\u4EF6\n *\n * \u7279\u6027:\n * - \u5C55\u793A\u591A\u79CD\u83B7\u53D6\u673A\u4F1A\u7684\u65B9\u5F0F(\u5206\u4EAB\u3001\u79EF\u5206\u3001\u63A8\u8350\u7B49)\n * - \u6BCF\u79CD\u65B9\u5F0F\u663E\u793A\u6807\u9898\u3001\u63CF\u8FF0\u3001Chance +1 \u5FBD\u7AE0\u548C\u884C\u52A8\u6309\u94AE\n * - \u652F\u6301\u7981\u7528\u72B6\u6001\n * - \u54CD\u5E94\u5F0F\u5E03\u5C40\n */\nexport const ChanceMethods: React.FC<ChanceMethodsProps> = ({\n theme,\n methods,\n title = 'Want more chances to win?',\n subtitle,\n footerNote,\n className,\n userData,\n onOpenShareModal,\n chanceBadgeText = 'Chance +1',\n completedText = 'Completed',\n usedText = 'Used',\n loadingText = 'Loading...',\n mechanismType = 'methods',\n inputConfig,\n isAgreementChecked,\n onAgreementCheckedChange,\n agreementErrorText,\n}) => {\n // \u8F93\u5165\u6846\u6A21\u5F0F\n if (mechanismType === 'input' && inputConfig) {\n return (\n <div\n className={cn(\n 'chance-methods-container',\n 'flex flex-col overflow-y-auto',\n 'p-[16px]',\n 'desktop:px-[24px] desktop:pt-[24px]',\n 'lg-desktop:px-[32px]',\n 'gap-[16px]',\n 'lg-desktop:gap-[16px]',\n theme === 'dark' ? 'aiui-dark' : '',\n className\n )}\n >\n {/* \u6807\u9898\u533A\u57DF */}\n <div className=\"chance-methods-header flex flex-col gap-[4px]\">\n <Heading size={2} className={cn('chance-methods-title', 'text-info-primary tracking-[-0.32px]')}>\n {title}\n </Heading>\n\n {subtitle && (\n <p\n className={cn(\n 'chance-methods-subtitle',\n 'text-[14px] font-semibold leading-[1.4]',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n theme === 'dark' ? 'text-[#8A8D92]' : 'text-[#4A4C56]'\n )}\n >\n {subtitle}\n </p>\n )}\n </div>\n\n {/* \u8F93\u5165\u6846 + \u63D0\u4EA4\u6309\u94AE */}\n <ChanceInputMode\n theme={theme}\n inputConfig={inputConfig}\n isAgreementChecked={isAgreementChecked}\n onAgreementCheckedChange={onAgreementCheckedChange}\n agreementErrorText={agreementErrorText}\n />\n\n {/* \u5E95\u90E8\u63D0\u793A */}\n {footerNote && (\n <p\n className={cn(\n 'chance-methods-footer',\n 'font-semibold',\n 'text-[14px] leading-[1.4] ',\n 'desktop:pt-[24px] pt-[16px]',\n theme === 'dark' ? 'text-[#75787F]' : 'text-[#767880]'\n )}\n >\n {footerNote}\n </p>\n )}\n </div>\n )\n }\n\n // \u9632\u5FA1\u6027\u7F16\u7A0B:\u5904\u7406 undefined \u6216\u7A7A\u6570\u7EC4\n if (!methods || methods.length === 0) {\n return null\n }\n\n return (\n <div\n className={cn(\n 'chance-methods-container',\n 'flex flex-col overflow-y-auto',\n 'p-[16px]',\n 'desktop:px-[24px] desktop:pt-[24px]',\n 'lg-desktop:px-[32px]',\n 'gap-[16px]', // \u9ED8\u8BA4\u95F4\u8DDD\n 'lg-desktop:gap-[16px]', // lg-desktop: Figma \u8BBE\u8BA1\u7A3F\u95F4\u8DDD\n theme === 'dark' ? 'aiui-dark' : '',\n className\n )}\n >\n {/* \u6807\u9898\u533A\u57DF */}\n <div className=\"chance-methods-header flex flex-col gap-[4px]\">\n <Heading size={2} className={cn('chance-methods-title', 'text-info-primary tracking-[-0.32px]')}>\n {title}\n </Heading>\n\n {subtitle && (\n <p\n className={cn(\n 'chance-methods-subtitle',\n 'text-[14px] font-semibold leading-[1.4]',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n theme === 'dark' ? 'text-[#8A8D92]' : 'text-[#4A4C56]'\n )}\n >\n {subtitle}\n </p>\n )}\n </div>\n\n {/* \u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u5217\u8868 */}\n <div className=\"chance-methods-list flex grow flex-col gap-[16px]\">\n {methods.map(method => (\n <ChanceMethodItem\n key={method.methodKey}\n method={method}\n userData={userData}\n onOpenShareModal={onOpenShareModal}\n chanceBadgeText={chanceBadgeText}\n completedText={completedText}\n usedText={usedText}\n loadingText={loadingText}\n />\n ))}\n </div>\n\n {/* \u5E95\u90E8\u63D0\u793A */}\n {footerNote && (\n <p\n className={cn(\n 'chance-methods-footer',\n 'font-semibold',\n 'text-[14px] leading-[1.4] ',\n 'desktop:pt-[24px] pt-[16px]',\n theme === 'dark' ? 'text-[#75787F]' : 'text-[#767880]'\n )}\n >\n {footerNote}\n </p>\n )}\n </div>\n )\n}\n\n// ============================================================================\n// ChanceInputMode \u5B50\u7EC4\u4EF6 - \u8F93\u5165\u6846\u6A21\u5F0F\n// ============================================================================\n\ninterface ChanceInputModeProps {\n theme?: 'light' | 'dark'\n inputConfig: ChanceInputConfig\n isAgreementChecked?: boolean\n onAgreementCheckedChange?: (checked: boolean) => void\n agreementErrorText?: string\n}\n\nconst ChanceInputMode: React.FC<ChanceInputModeProps> = ({\n theme,\n inputConfig,\n isAgreementChecked: controlledAgreementChecked,\n onAgreementCheckedChange,\n agreementErrorText,\n}) => {\n const [value, setValue] = React.useState(inputConfig.defaultValue || '')\n const [error, setError] = React.useState('')\n const [agreementError, setAgreementError] = React.useState('')\n const [internalAgreementChecked, setInternalAgreementChecked] = React.useState(false)\n\n const hasAgreementNotice = Boolean(inputConfig.agreementNotice)\n const isAgreementChecked = controlledAgreementChecked ?? internalAgreementChecked\n\n // Single source of truth for submit eligibility \u2014 shared by button, Enter key, and handleSubmit\n const canSubmit = !inputConfig.isSubmitting && Boolean(value.trim())\n\n const resolvedValidationPattern =\n inputConfig.validationPattern ?? (inputConfig.inputType === 'email' ? '^[^\\\\s@]+@[^\\\\s@]+\\\\.[^\\\\s@]+$' : undefined)\n\n React.useEffect(() => {\n if (inputConfig.defaultValue && !value) {\n setValue(inputConfig.defaultValue)\n }\n }, [inputConfig.defaultValue])\n\n React.useEffect(() => {\n if (agreementErrorText) {\n setAgreementError(agreementErrorText)\n }\n }, [agreementErrorText])\n\n const handleSubmit = async () => {\n if (!canSubmit) return\n\n if (hasAgreementNotice && !isAgreementChecked) {\n setAgreementError(inputConfig.agreementWarningText || 'Please agree to the terms before continuing')\n return\n }\n\n if (resolvedValidationPattern) {\n const regex = new RegExp(resolvedValidationPattern)\n if (!regex.test(value.trim())) {\n setError(inputConfig.validationErrorText || 'Invalid input')\n return\n }\n }\n setError('')\n setAgreementError('')\n try {\n await inputConfig.onSubmit?.(value.trim())\n } catch (error) {\n // \u9519\u8BEF\u5F39\u7A97\u7531\u7236\u7EC4\u4EF6 (showError / onDrawError) \u5904\u7406\uFF0C\u6B64\u5904\u4EC5\u9632\u6B62 unhandled rejection\n console.error('[ChanceInputMode] onSubmit error:', error)\n }\n }\n\n return (\n <div className=\"chance-input-mode flex grow flex-col gap-[16px]\">\n <input\n type={inputConfig.inputType || 'text'}\n value={value}\n onChange={e => {\n setValue(e.target.value)\n setError('')\n }}\n placeholder={inputConfig.placeholder || 'Enter your order number'}\n disabled={inputConfig.isSubmitting || inputConfig.disabled}\n autoComplete={inputConfig.disableAutofill ? 'new-password' : undefined}\n name={inputConfig.disableAutofill ? 'lottery-input' : undefined}\n readOnly={inputConfig.disabled}\n className={cn(\n 'rounded-btn laptop:h-[54px] laptop:px-[16px] h-[44px] w-full border bg-transparent px-[12px]',\n 'lg-desktop:text-[16px] text-[14px] leading-[1.4]',\n 'outline-none transition-colors focus:ring-0 focus-visible:outline-none focus-visible:ring-0',\n 'border-[#D1D5DB] placeholder:text-[#9CA3AF]',\n error ? 'border-red-500' : '',\n theme === 'dark' ? 'text-white' : 'text-[#1E2024]'\n )}\n onKeyDown={e => {\n if (e.key === 'Enter' && canSubmit) handleSubmit()\n }}\n />\n <Button\n size=\"lg\"\n variant={theme === 'dark' ? 'primary' : 'secondary'}\n onClick={handleSubmit}\n disabled={!canSubmit}\n className=\"w-fit\"\n data-headless-type-name={inputConfig.submitTrackTypeName}\n data-headless-title-desc-button={inputConfig.submitTrackTitleDescButton}\n >\n {inputConfig.isSubmitting ? inputConfig.loadingText || 'Loading...' : inputConfig.submitText || 'Spin and Win'}\n </Button>\n {error && <p className=\"text-[12px] text-red-500\">{error}</p>}\n {agreementError && <p className=\"text-[12px] text-red-500\">{agreementError}</p>}\n\n {hasAgreementNotice && (\n <label className=\"flex items-start gap-[8px] pt-[4px]\">\n <Checkbox\n checked={isAgreementChecked}\n onCheckedChange={checked => {\n const nextChecked = Boolean(checked)\n onAgreementCheckedChange?.(nextChecked)\n setInternalAgreementChecked(nextChecked)\n if (nextChecked) {\n setAgreementError('')\n }\n }}\n className={cn(\n 'mt-[2px] shrink-0',\n theme === 'dark'\n ? 'border-white/60 data-[state=checked]:border-white data-[state=checked]:bg-white data-[state=checked]:text-[#1D1D1F]'\n : 'border-[#1D1D1F]/40 data-[state=checked]:border-[#1D1D1F] data-[state=checked]:bg-[#1D1D1F] data-[state=checked]:text-white'\n )}\n />\n <Text\n html={inputConfig.agreementNotice}\n className={cn(\n 'text-[14px] font-[700] leading-[1.4]',\n '[&_a]:underline [&_a]:underline-offset-2',\n theme === 'dark'\n ? 'text-white/95 [&_a]:text-white [&_a]:hover:text-white/80'\n : 'text-[#1E2024] [&_a]:text-[#1E2024] [&_a]:hover:text-[#1E2024]/80'\n )}\n />\n </label>\n )}\n </div>\n )\n}\n\n// ChanceMethodItem \u5B50\u7EC4\u4EF6 - \u5355\u4E2A\u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u5361\u7247\n// ============================================================================\n\ninterface ChanceMethodItemProps {\n method: ChanceMethod\n userData?: UserData\n onOpenShareModal?: () => void\n chanceBadgeText: string\n completedText: string\n usedText: string\n loadingText: string\n}\n\n/**\n * ChanceMethodItem - \u5355\u4E2A\u83B7\u53D6\u673A\u4F1A\u65B9\u5F0F\u5361\u7247\n *\n * \u5C55\u793A\u65B9\u5F0F\u540D\u79F0\u3001\u63CF\u8FF0\u3001Chance +1 \u5FBD\u7AE0\u548C\u884C\u52A8\u6309\u94AE\u3002\n * \u652F\u6301\u4E09\u79CD\u72B6\u6001\uFF1Apending\uFF08\u672A\u5B8C\u6210\uFF09\u3001completed\uFF08\u5DF2\u5B8C\u6210\uFF09\u3001used\uFF08\u5DF2\u4F7F\u7528\uFF09\n */\nconst ChanceMethodItem: React.FC<ChanceMethodItemProps> = ({\n method,\n userData,\n onOpenShareModal,\n chanceBadgeText,\n completedText,\n usedText,\n loadingText,\n}) => {\n const status = method.status || 'pending'\n const isLoading = method.loading || false\n const isDisabledOrCompleted = method.disabled || status === 'completed' || status === 'used' || isLoading\n\n // \u5904\u7406\u6309\u94AE\u70B9\u51FB\n const handleClick = () => {\n // \u68C0\u67E5\u767B\u5F55\u72B6\u6001\n if (!userData?.isLoggedIn) {\n // \u672A\u767B\u5F55\u65F6\uFF0C\u53EA\u8C03\u7528\u767B\u5F55\u56DE\u8C03\uFF0C\u4E0D\u6253\u5F00\u5206\u4EAB\u5F39\u7A97\n method.onLoginRequired?.()\n return\n }\n\n // \u5DF2\u767B\u5F55\u65F6\uFF0C\u6267\u884C\u6B63\u5E38\u903B\u8F91\n // \u5982\u679C\u914D\u7F6E\u4E86 openShareModal\uFF0C\u5219\u6253\u5F00\u5206\u4EAB\u5F39\u7A97\n if (method.openShareModal && onOpenShareModal) {\n onOpenShareModal()\n }\n // \u6267\u884C\u539F\u6709\u7684 onClick \u56DE\u8C03\n method.onClick()\n }\n\n // \u72B6\u6001\u6587\u672C\u6620\u5C04\n const statusTextMap = {\n pending: isLoading ? loadingText : method?.buttonText || 'Redeem now',\n completed: completedText,\n used: usedText,\n }\n\n return (\n <div\n className={cn(\n 'chance-method-item',\n 'flex flex-col items-start gap-[8px]',\n 'tablet:flex-row tablet:items-center tablet:gap-4',\n 'transition-all',\n {\n 'opacity-60': isDisabledOrCompleted,\n }\n )}\n >\n {/* \u5DE6\u4FA7:\u65B9\u5F0F\u4FE1\u606F */}\n <div\n className={cn(\n 'chance-method-info',\n 'flex flex-1 flex-col gap-[4px]',\n 'min-w-0' // \u786E\u4FDD\u6587\u672C\u53EF\u4EE5\u88AB\u622A\u65AD\n )}\n >\n {/* \u6807\u9898 + Chance +1 \u5FBD\u7AE0 */}\n <div className=\"flex flex-wrap items-center gap-[4px]\">\n <p\n className={cn(\n 'chance-method-title',\n 'text-info-primary',\n 'text-[14px] font-[700] leading-[1.4] ',\n 'lg-desktop:text-[18px] desktop:text-[16px]'\n )}\n >\n {method.title}\n </p>\n\n <span\n className={cn(\n 'chance-badge',\n 'text-[14px] leading-[1.4] ',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n 'font-[700]',\n 'shrink-0',\n {\n 'text-[#ff6b35]': status === 'pending',\n 'text-[#4caf50]': status === 'completed',\n 'text-[#75787F]': status === 'used',\n }\n )}\n >\n {chanceBadgeText}\n </span>\n </div>\n\n {/* \u63CF\u8FF0\u6587\u672C */}\n <p\n className={cn(\n 'chance-method-description',\n 'text-info-primary',\n 'text-[14px] leading-[1.4] ',\n 'lg-desktop:text-[18px] desktop:text-[16px]',\n 'font-[700]'\n )}\n >\n {method.description}\n </p>\n </div>\n\n {/* \u53F3\u4FA7:\u884C\u52A8\u6309\u94AE */}\n <div className=\"chance-method-action shrink-0\">\n <Button\n onClick={handleClick}\n disabled={isDisabledOrCompleted}\n className={cn('chance-button', 'lg-desktop:min-w-[162px] min-w-[132px]', {\n 'bg-[#4caf50]': status === 'completed',\n 'bg-[#75787F]': status === 'used',\n })}\n >\n {statusTextMap[status]}\n </Button>\n </div>\n </div>\n )\n}\n\n// ============================================================================\n// \u9ED8\u8BA4\u5BFC\u51FA\n// ============================================================================\n\nexport default ChanceMethods\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["jsx", "jsxs", "React", "cn", "Button", "Checkbox", "Heading", "Text", "ChanceMethods", "theme", "methods", "title", "subtitle", "footerNote", "className", "userData", "onOpenShareModal", "chanceBadgeText", "completedText", "usedText", "loadingText", "mechanismType", "inputConfig", "isAgreementChecked", "onAgreementCheckedChange", "agreementErrorText", "ChanceInputMode", "method", "ChanceMethodItem", "controlledAgreementChecked", "value", "setValue", "error", "setError", "agreementError", "setAgreementError", "internalAgreementChecked", "setInternalAgreementChecked", "hasAgreementNotice", "canSubmit", "resolvedValidationPattern", "handleSubmit", "e", "checked", "nextChecked", "status", "isLoading", "isDisabledOrCompleted", "handleClick", "statusTextMap", "ChanceMethods_default"]
|
|
7
7
|
}
|
|
@@ -710,6 +710,8 @@ export interface ChanceInputConfig {
|
|
|
710
710
|
onSubmit?: (value: string) => void | Promise<void>;
|
|
711
711
|
/** 是否正在提交 */
|
|
712
712
|
isSubmitting?: boolean;
|
|
713
|
+
/** 提交中的 loading 按钮文案 @default "Loading..." */
|
|
714
|
+
loadingText?: string;
|
|
713
715
|
/** 输入框类型 @default "text" */
|
|
714
716
|
inputType?: 'text' | 'email' | 'number';
|
|
715
717
|
/** 验证正则 (可选) */
|