npm - @cuemath/leap - Versions diffs - 3.2.12-akm-2 → 3.2.14-as1 - Mend

@cuemath/leap 3.2.12-akm-2 → 3.2.14-as1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (98) hide show

package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tables-card.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/tables-card/tables-card.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type {\n ITableInfo,\n TTableMode,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { ITableCardRef, ITablesCardProps } from './tables-card-types';\n\nimport React, {\n forwardRef,\n memo,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport Back2Icon from '../../../../../assets/line-icons/icons/back2';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport { CardContainer } from '../card-container/card-container';\nimport { GAME_LAUNCHER_SIZE, GAME_LAUNCHER_SIZE_LARGE } from '../card-container/constants';\nimport {\n INFINITE_MODE_TEXT,\n NORMAL_TABLE_MODES,\n TABLE_MODE_LABEL_COLOR,\n TABLE_REVEAL_ANIMATION,\n} from './constants';\nimport InfiniteButtonCard from './infinite-button/infinite-mode-launcher-button';\nimport { SplEventsText } from './spl-events-text/spl-events-text';\nimport TableMode from './table-mode/table-mode';\nimport TableSegmentStar from './table-segment-star/table-segment-star';\nimport * as Styled from './tables-card-styled';\n\nconst modeRevealAnimationSettings = {\n loop: false,\n renderer: 'svg',\n};\n\nconst TablesCardComponent = forwardRef<ITableCardRef, ITablesCardProps>(\n (\n {\n data,\n label,\n onPress,\n openModesOfTable,\n defaultTable,\n onGoBackFromTableLevel,\n onPressTableSegment,\n },\n ref,\n ) => {\n const { onEvent: trackEvent } = useUIContext();\n const { playButtonSound } = useCircleSounds();\n const [fadeIn, setFadeIn] = useState(true);\n const [highlightedTable, setHighlightedTable] = useState<number \| null>(\n openModesOfTable?.tableNumber ?? null,\n );\n const [highlightedLevel, setHighlightedLevel] = useState<number \| null>(null);\n const [highlightedInfiniteModeText, setHighlightedInfiniteModeText] = useState<boolean>(false);\n const [labelColor, setLabelColor] = useState<TColorNames>('WHITE_T_60');\n const [revealTableModes, setRevealTableModes] = useState<ITableInfo>({\n stars:\n data.tableList.find(table => table.tableNumber === openModesOfTable?.tableNumber)?.stars ??\n [],\n tableNumber: openModesOfTable?.tableNumber ?? 0,\n });\n const infiniteButtonRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const [showLabel, setShowLabel] = useState(true);\n const [isLabelAnimated, setIsLabelAnimated] = useState(false);\n const [animatedColor, setAniimatedColor] = useState<TColorNames>('WHITE_T_60');\n\n const labelRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const cardRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n\n const [rewardStar, setRewardStar] = useState(openModesOfTable?.rewardStar ?? []);\n const [showSplEventsText, setShowSplEventsText] = useState(false);\n const revealAnimationRef = useRef<ILottieAnimationRef \| null>(null);\n const disappearAnimationTimer = useRef<ReturnType<typeof setTimeout>>(\n undefined,\n ) as React.RefObject<ReturnType<typeof setTimeout> \| undefined>;\n\n const handleTableSegmentClick = useCallback(\n (table: ITableInfo) => {\n if (onPressTableSegment) {\n onPressTableSegment(table);\n\n return;\n }\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(table.tableNumber);\n setRevealTableModes({ ...table });\n setRewardStar([]);\n trackEvent(GAME_LAUNCHER_ANALYTICS_EVENTS.TABLE_SELECTED, {\n meta: {\n table_of: table.tableNumber,\n },\n });\n },\n [onPressTableSegment, playButtonSound, trackEvent],\n );\n\n const handleTableSegmentMouseOver = useCallback(\n (table: ITableInfo) => {\n setLabelColor(isLabelAnimated ? animatedColor : 'WHITE_T_60');\n setHighlightedTable(table.tableNumber);\n },\n [animatedColor, isLabelAnimated],\n );\n\n const handleInfiniteModeSegmentMouseOver = useCallback(() => {\n setHighlightedInfiniteModeText(true);\n }, []);\n\n const handleTableSegmentMouseLeave = useCallback(() => {\n setLabelColor('WHITE_T_60');\n !revealTableModes.tableNumber && setHighlightedTable(null);\n setHighlightedInfiniteModeText(false);\n }, [revealTableModes.tableNumber]);\n\n const goBack = useCallback(() => {\n onGoBackFromTableLevel?.();\n playButtonSound();\n setFadeIn(false);\n setHighlightedTable(null);\n const time = (TABLE_REVEAL_ANIMATION.DISAPPEAR[1] - TABLE_REVEAL_ANIMATION.DISAPPEAR[0]) / 30;\n\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.DISAPPEAR, true);\n disappearAnimationTimer.current = setTimeout(() => {\n setRevealTableModes({ stars: [], tableNumber: 0 });\n }, time * 1000);\n }, [onGoBackFromTableLevel, playButtonSound]);\n\n const showTableModes = useCallback(() => {\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.REVEAL, true);\n }, []);\n\n const handleModeMouseOver = useCallback((type: TTableMode) => {\n const level: Partial<Record<TTableMode, number>> = {\n sequence: 1,\n random: 2,\n advance: 3,\n };\n\n setLabelColor(TABLE_MODE_LABEL_COLOR[type] ?? 'WHITE_T_60');\n setHighlightedLevel(level[type] ?? 0);\n }, []);\n\n const handleModeMouseLeave = useCallback(() => {\n setHighlightedLevel(null);\n setLabelColor('WHITE_T_60');\n }, []);\n\n const revealTableModesMemo = useMemo(() => revealTableModes, [revealTableModes]);\n\n const tableModes = useMemo(() => {\n return [\n {\n top: 20,\n left: 10.5,\n type: 'sequence' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('sequence'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '-43%',\n semicircleHoverColor: '#B259004D',\n },\n {\n top: 20,\n left: 65.5,\n type: 'random' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('random'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '65%',\n semicircleHoverColor: '#0055CC4D',\n },\n {\n top: 66,\n left: 38,\n type: 'advance' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('advance'),\n semicirclePosiiionTop: '74%',\n semicirclePosiiionLeft: '11%',\n semicircleHoverColor: '#A9099C4D',\n },\n ];\n }, [revealTableModesMemo.tableNumber, revealTableModesMemo.stars]);\n\n // Calculate completed normal modes and special events status\n const { completedModes, isSpecialEventsActive } = useMemo<{\n completedModes: TTableMode[];\n isSpecialEventsActive: boolean;\n }>(() => {\n const calculatedcompletedModes = NORMAL_TABLE_MODES.filter(star =>\n data.tableList.every(table => table.stars.includes(star)),\n );\n\n const isAllRewardStarsInCompletedModes =\n rewardStar.length > 0 &&\n calculatedcompletedModes.length > 0 &&\n rewardStar.every(star =>\n calculatedcompletedModes.includes(star as Exclude<TTableMode, 'infinite'>),\n );\n\n return {\n completedModes: calculatedcompletedModes,\n isSpecialEventsActive: isAllRewardStarsInCompletedModes,\n };\n }, [data.tableList, rewardStar]);\n\n const handleInfiniteModeClick = useCallback(() => {\n onPress({\n mode: 'infinite',\n infiniteModeHighScore: data.infiniteModeHighScore,\n });\n }, [onPress, data.infiniteModeHighScore]);\n\n const handleNormalModeClick = useCallback(\n (mode: TTableMode, isStarRewarded: boolean) => {\n onPress({\n mode,\n tableNumber: revealTableModes.tableNumber,\n isStarRewarded,\n });\n },\n [onPress, revealTableModes.tableNumber],\n );\n\n const getHighlightedText = useCallback(() => {\n if (highlightedLevel) {\n return `${highlightedTable}× LEVEL${highlightedLevel}`;\n }\n\n if (highlightedInfiniteModeText) {\n return INFINITE_MODE_TEXT;\n }\n\n return highlightedTable ? `${highlightedTable}× Table` : label;\n }, [highlightedLevel, highlightedTable, highlightedInfiniteModeText, label]);\n\n const startLabelAnimation = useCallback((color: TColorNames) => {\n setLabelColor(color);\n setAniimatedColor(color);\n setIsLabelAnimated(true);\n }, []);\n\n const stopLabelAnimation = useCallback(() => setIsLabelAnimated(false), []);\n const setLabelVisiblity = useCallback((visible: boolean) => setShowLabel(visible), []);\n\n useImperativeHandle(ref, () => ({\n labelRef: labelRef,\n segmentedCardWrapperRef: cardRef,\n infiniteButtonRef: infiniteButtonRef,\n startLabelAnimation,\n stopLabelAnimation,\n setLabelVisiblity,\n handleTableSegmentClick,\n goBackFromTableLevel: goBack,\n }));\n\n useEffect(() => {\n return () => {\n disappearAnimationTimer.current && clearTimeout(disappearAnimationTimer.current);\n };\n }, []);\n\n // Used in trial journey, to open table levels by default if given in props\n useEffect(() => {\n if (defaultTable) {\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(defaultTable.tableNumber);\n setRevealTableModes({ ...defaultTable });\n }\n }, [defaultTable, playButtonSound]);\n\n useEffect(() => {\n if (revealTableModes.tableNumber === 0 && isSpecialEventsActive && !showSplEventsText) {\n setShowSplEventsText(true);\n }\n\n if (revealTableModes.tableNumber > 0) {\n setShowSplEventsText(false);\n }\n }, [revealTableModes.tableNumber, isSpecialEventsActive, showSplEventsText]);\n\n return (\n <>\n <CardContainer\n labelRef={labelRef}\n ref={cardRef}\n strokeColor=\"WHITE\"\n label={getHighlightedText()}\n labelColor={labelColor}\n isAnimated={isLabelAnimated}\n showLabel={showLabel}\n >\n <Styled.CardWrapper>\n {/* table selection /}\n <Styled.TableSegmentsWrapper>\n {/ infinite button /}\n <InfiniteButtonCard\n onClick={handleInfiniteModeClick}\n buttonRef={infiniteButtonRef}\n onMouseLeave={handleTableSegmentMouseLeave}\n onMouseOver={handleInfiniteModeSegmentMouseOver}\n />\n {/ card shadow /}\n <Styled.TableSegmentCardShadowContainer />\n {/ table segments /}\n {data.tableList.map((table, index) => {\n const segmentAngle = 360 / data.tableList.length;\n const startAngle = -(90 + 360 / (2 data.tableList.length));\n const currentAngle = startAngle + segmentAngle * (index + 1);\n\n return (\n <Styled.TableSegment\n key={table.tableNumber ?? index}\n $angle={currentAngle}\n $totalSegments={data.tableList.length}\n $zIndex={index + 1}\n onClick={() => handleTableSegmentClick(table)}\n onMouseOver={() => handleTableSegmentMouseOver(table)}\n onMouseLeave={handleTableSegmentMouseLeave}\n >\n <FlexView $flexDirection=\"row\" $justifyContent=\"center\" $alignItems=\"center\">\n {NORMAL_TABLE_MODES.map(star => (\n <TableSegmentStar\n key={star}\n isStarAchieved={table.stars.includes(star as TTableMode)}\n rewardStar={\n !fadeIn &&\n !isSpecialEventsActive &&\n openModesOfTable?.tableNumber === table.tableNumber\n ? rewardStar.includes(star as TTableMode)\n : undefined\n }\n />\n ))}\n\n <Separator width={GAME_LAUNCHER_SIZE * 0.055} />\n\n <Styled.TableNumber $angle={-currentAngle}>\n <Text\n $renderAs={\n GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE\n ? 'ac3-black'\n : 'ac4-black'\n }\n $color={highlightedTable === table.tableNumber ? 'BLACK_1' : 'WHITE'}\n >\n {table.tableNumber}\n </Text>\n </Styled.TableNumber>\n </FlexView>\n </Styled.TableSegment>\n );\n })}\n (\n {revealTableModes.tableNumber === 0 && isSpecialEventsActive && (\n <>\n {NORMAL_TABLE_MODES.map((starType, index) => {\n if (!completedModes.includes(starType)) return null;\n\n return (\n <Styled.AllStarAbsoluteView key={starType} $level={index + 1}>\n <LottieAnimation\n src={LOTTIE.LEVEL_1_ALLSTAR}\n settings={modeRevealAnimationSettings}\n animateOnIntersect\n />\n </Styled.AllStarAbsoluteView>\n );\n })}\n </>\n )}\n )\n </Styled.TableSegmentsWrapper>\n {/* table modes /}\n {revealTableModes.tableNumber > 0 && (\n <Styled.TableModeContainer>\n <Styled.TableModeWrapper>\n {/ tables modes with back button /}\n <Styled.AnimatedView $animation={fadeIn ? 'fade-in' : 'fade-out'}>\n {tableModes.map((tableMode, index) => (\n <React.Fragment key={tableMode.type ?? index}>\n <Styled.ModeOverlay\n $top={tableMode.semicirclePosiiionTop}\n $left={tableMode.semicirclePosiiionLeft}\n $hoverColor={tableMode.semicircleHoverColor}\n onClick={() =>\n fadeIn\n ? handleNormalModeClick(tableMode.type, tableMode.isStarAchieved)\n : undefined\n }\n onMouseOver={() =>\n fadeIn ? handleModeMouseOver(tableMode.type as TTableMode) : undefined\n }\n onMouseLeave={fadeIn ? handleModeMouseLeave : undefined}\n />\n <Styled.AbsoluteView\n $top={tableMode.top}\n $left={tableMode.left}\n $isPointerEventsNone={true}\n >\n <TableMode\n tableNumber={tableMode.tableNumber}\n isStarAchieved={\n tableMode.isStarAchieved \|\| rewardStar.includes(tableMode.type)\n }\n type={tableMode.type as TTableMode}\n rewardStar={rewardStar.includes(tableMode.type as TTableMode)}\n />\n </Styled.AbsoluteView>\n </React.Fragment>\n ))}\n {/ back button /}\n <Styled.AbsoluteView $top={50} $left={50} $alignCenter={true}>\n <Styled.IconWrapper>\n <Back2Icon\n onClick={goBack}\n height={GAME_LAUNCHER_SIZE 0.1}\n width={GAME_LAUNCHER_SIZE * 0.1}\n />\n </Styled.IconWrapper>\n </Styled.AbsoluteView>\n </Styled.AnimatedView>\n\n {/* overlay lottie for modes */}\n <LottieAnimation\n src={LOTTIE.TABLE_MODE_REVEAL}\n ref={revealAnimationRef}\n settings={modeRevealAnimationSettings}\n onRender={showTableModes}\n animateOnIntersect\n />\n </Styled.TableModeWrapper>\n </Styled.TableModeContainer>\n )}\n </Styled.CardWrapper>\n </CardContainer>\n {showSplEventsText && <SplEventsText completedModes={completedModes} />}\n </>\n );\n },\n);\n\nexport const TablesCard = memo(TablesCardComponent);\n"],"names":["modeRevealAnimationSettings","TablesCardComponent","forwardRef","data","label","onPress","openModesOfTable","defaultTable","onGoBackFromTableLevel","onPressTableSegment","ref","trackEvent","useUIContext","playButtonSound","useCircleSounds","fadeIn","setFadeIn","useState","highlightedTable","setHighlightedTable","highlightedLevel","setHighlightedLevel","highlightedInfiniteModeText","setHighlightedInfiniteModeText","labelColor","setLabelColor","revealTableModes","setRevealTableModes","_a","table","infiniteButtonRef","useRef","showLabel","setShowLabel","isLabelAnimated","setIsLabelAnimated","animatedColor","setAniimatedColor","labelRef","cardRef","rewardStar","setRewardStar","showSplEventsText","setShowSplEventsText","revealAnimationRef","disappearAnimationTimer","handleTableSegmentClick","useCallback","GAME_LAUNCHER_ANALYTICS_EVENTS","handleTableSegmentMouseOver","handleInfiniteModeSegmentMouseOver","handleTableSegmentMouseLeave","goBack","time","TABLE_REVEAL_ANIMATION","showTableModes","handleModeMouseOver","type","level","TABLE_MODE_LABEL_COLOR","handleModeMouseLeave","revealTableModesMemo","useMemo","tableModes","completedModes","isSpecialEventsActive","calculatedcompletedModes","NORMAL_TABLE_MODES","star","isAllRewardStarsInCompletedModes","handleInfiniteModeClick","handleNormalModeClick","mode","isStarRewarded","getHighlightedText","INFINITE_MODE_TEXT","startLabelAnimation","color","stopLabelAnimation","setLabelVisiblity","visible","useImperativeHandle","useEffect","jsxs","Fragment","jsx","CardContainer","Styled.CardWrapper","Styled.TableSegmentsWrapper","InfiniteButtonCard","Styled.TableSegmentCardShadowContainer","index","segmentAngle","currentAngle","Styled.TableSegment","FlexView","TableSegmentStar","Separator","GAME_LAUNCHER_SIZE","Styled.TableNumber","Text","GAME_LAUNCHER_SIZE_LARGE","starType","Styled.AllStarAbsoluteView","LottieAnimation","LOTTIE","Styled.TableModeContainer","Styled.TableModeWrapper","Styled.AnimatedView","tableMode","React","Styled.ModeOverlay","Styled.AbsoluteView","TableMode","Styled.IconWrapper","Back2Icon","SplEventsText","TablesCard","memo"],"mappings":"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"}
1	+ {"version":3,"file":"tables-card.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/tables-card/tables-card.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type {\n ITableInfo,\n TTableMode,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { ITableCardRef, ITablesCardProps } from './tables-card-types';\n\nimport React, {\n forwardRef,\n memo,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport Back2Icon from '../../../../../assets/line-icons/icons/back2';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport { CardContainer } from '../card-container/card-container';\nimport { GAME_LAUNCHER_SIZE, GAME_LAUNCHER_SIZE_LARGE } from '../card-container/constants';\nimport {\n INFINITE_MODE_TEXT,\n NORMAL_TABLE_MODES,\n TABLE_MODE_LABEL_COLOR,\n TABLE_REVEAL_ANIMATION,\n} from './constants';\nimport InfiniteButtonCard from './infinite-button/infinite-mode-launcher-button';\nimport { SplEventsText } from './spl-events-text/spl-events-text';\nimport TableMode from './table-mode/table-mode';\nimport TableSegmentStar from './table-segment-star/table-segment-star';\nimport * as Styled from './tables-card-styled';\n\nconst modeRevealAnimationSettings = {\n loop: false,\n renderer: 'svg',\n};\n\nconst TablesCardComponent = forwardRef<ITableCardRef, ITablesCardProps>(\n (\n {\n data,\n label,\n onPress,\n openModesOfTable,\n defaultTable,\n onGoBackFromTableLevel,\n onPressTableSegment,\n },\n ref,\n ) => {\n const { onEvent: trackEvent } = useUIContext();\n const { playButtonSound } = useCircleSounds();\n const [fadeIn, setFadeIn] = useState(true);\n const [highlightedTable, setHighlightedTable] = useState<number \| null>(\n openModesOfTable?.tableNumber ?? null,\n );\n const [highlightedLevel, setHighlightedLevel] = useState<number \| null>(null);\n const [highlightedInfiniteModeText, setHighlightedInfiniteModeText] = useState<boolean>(false);\n const [labelColor, setLabelColor] = useState<TColorNames>('WHITE_T_60');\n const [revealTableModes, setRevealTableModes] = useState<ITableInfo>({\n stars:\n data.tableList.find(table => table.tableNumber === openModesOfTable?.tableNumber)?.stars ??\n [],\n tableNumber: openModesOfTable?.tableNumber ?? 0,\n });\n const infiniteButtonRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const [showLabel, setShowLabel] = useState(true);\n const [isLabelAnimated, setIsLabelAnimated] = useState(false);\n const [animatedColor, setAniimatedColor] = useState<TColorNames>('WHITE_T_60');\n\n const labelRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const cardRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n\n const [rewardStar, setRewardStar] = useState(openModesOfTable?.rewardStar ?? []);\n const [showSplEventsText, setShowSplEventsText] = useState(false);\n const revealAnimationRef = useRef<ILottieAnimationRef \| null>(null);\n const disappearAnimationTimer = useRef<ReturnType<typeof setTimeout>>(\n undefined,\n ) as React.RefObject<ReturnType<typeof setTimeout> \| undefined>;\n\n const handleTableSegmentClick = useCallback(\n (table: ITableInfo) => {\n if (onPressTableSegment) {\n onPressTableSegment(table);\n\n return;\n }\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(table.tableNumber);\n setRevealTableModes({ ...table });\n setRewardStar([]);\n trackEvent(GAME_LAUNCHER_ANALYTICS_EVENTS.TABLE_SELECTED, {\n meta: {\n table_of: table.tableNumber,\n },\n });\n },\n [onPressTableSegment, playButtonSound, trackEvent],\n );\n\n const handleTableSegmentMouseOver = useCallback(\n (table: ITableInfo) => {\n setLabelColor(isLabelAnimated ? animatedColor : 'WHITE_T_60');\n setHighlightedTable(table.tableNumber);\n },\n [animatedColor, isLabelAnimated],\n );\n\n const handleInfiniteModeSegmentMouseOver = useCallback(() => {\n setHighlightedInfiniteModeText(true);\n }, []);\n\n const handleTableSegmentMouseLeave = useCallback(() => {\n setLabelColor('WHITE_T_60');\n !revealTableModes.tableNumber && setHighlightedTable(null);\n setHighlightedInfiniteModeText(false);\n }, [revealTableModes.tableNumber]);\n\n const goBack = useCallback(() => {\n onGoBackFromTableLevel?.();\n playButtonSound();\n setFadeIn(false);\n setHighlightedTable(null);\n const time = (TABLE_REVEAL_ANIMATION.DISAPPEAR[1] - TABLE_REVEAL_ANIMATION.DISAPPEAR[0]) / 30;\n\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.DISAPPEAR, true);\n disappearAnimationTimer.current = setTimeout(() => {\n setRevealTableModes({ stars: [], tableNumber: 0 });\n }, time * 1000);\n }, [onGoBackFromTableLevel, playButtonSound]);\n\n const showTableModes = useCallback(() => {\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.REVEAL, true);\n }, []);\n\n const handleModeMouseOver = useCallback((type: TTableMode) => {\n const level: Partial<Record<TTableMode, number>> = {\n sequence: 1,\n random: 2,\n advance: 3,\n };\n\n setLabelColor(TABLE_MODE_LABEL_COLOR[type] ?? 'WHITE_T_60');\n setHighlightedLevel(level[type] ?? 0);\n }, []);\n\n const handleModeMouseLeave = useCallback(() => {\n setHighlightedLevel(null);\n setLabelColor('WHITE_T_60');\n }, []);\n\n const revealTableModesMemo = useMemo(() => revealTableModes, [revealTableModes]);\n\n const tableModes = useMemo(() => {\n return [\n {\n top: 20,\n left: 10.5,\n type: 'sequence' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('sequence'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '-43%',\n semicircleHoverColor: '#B259004D',\n },\n {\n top: 20,\n left: 65.5,\n type: 'random' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('random'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '65%',\n semicircleHoverColor: '#0055CC4D',\n },\n {\n top: 66,\n left: 38,\n type: 'advance' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('advance'),\n semicirclePosiiionTop: '74%',\n semicirclePosiiionLeft: '11%',\n semicircleHoverColor: '#A9099C4D',\n },\n ];\n }, [revealTableModesMemo.tableNumber, revealTableModesMemo.stars]);\n\n // Calculate completed normal modes and special events status\n const { completedModes, isSpecialEventsActive } = useMemo<{\n completedModes: TTableMode[];\n isSpecialEventsActive: boolean;\n }>(() => {\n const calculatedcompletedModes = NORMAL_TABLE_MODES.filter(star =>\n data.tableList.every(table => table.stars.includes(star)),\n );\n\n const isAllRewardStarsInCompletedModes =\n rewardStar.length > 0 &&\n calculatedcompletedModes.length > 0 &&\n rewardStar.every(star =>\n calculatedcompletedModes.includes(star as Exclude<TTableMode, 'infinite'>),\n );\n\n return {\n completedModes: calculatedcompletedModes,\n isSpecialEventsActive: isAllRewardStarsInCompletedModes,\n };\n }, [data.tableList, rewardStar]);\n\n const handleInfiniteModeClick = useCallback(() => {\n onPress({\n mode: 'infinite',\n infiniteModeHighScore: data.infiniteModeHighScore,\n });\n }, [onPress, data.infiniteModeHighScore]);\n\n const handleNormalModeClick = useCallback(\n (mode: TTableMode, isStarRewarded: boolean) => {\n onPress({\n mode,\n tableNumber: revealTableModes.tableNumber,\n isStarRewarded,\n });\n },\n [onPress, revealTableModes.tableNumber],\n );\n\n const getHighlightedText = useCallback(() => {\n if (highlightedLevel) {\n return `${highlightedTable}× LEVEL${highlightedLevel}`;\n }\n\n if (highlightedInfiniteModeText) {\n return INFINITE_MODE_TEXT;\n }\n\n return highlightedTable ? `${highlightedTable}× Table` : label;\n }, [highlightedLevel, highlightedTable, highlightedInfiniteModeText, label]);\n\n const startLabelAnimation = useCallback((color: TColorNames) => {\n setLabelColor(color);\n setAniimatedColor(color);\n setIsLabelAnimated(true);\n }, []);\n\n const stopLabelAnimation = useCallback(() => setIsLabelAnimated(false), []);\n const setLabelVisiblity = useCallback((visible: boolean) => setShowLabel(visible), []);\n\n useImperativeHandle(ref, () => ({\n labelRef: labelRef,\n segmentedCardWrapperRef: cardRef,\n infiniteButtonRef: infiniteButtonRef,\n startLabelAnimation,\n stopLabelAnimation,\n setLabelVisiblity,\n handleTableSegmentClick,\n goBackFromTableLevel: goBack,\n }));\n\n useEffect(() => {\n return () => {\n disappearAnimationTimer.current && clearTimeout(disappearAnimationTimer.current);\n };\n }, []);\n\n // Used in trial journey, to open table levels by default if given in props\n useEffect(() => {\n if (defaultTable) {\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(defaultTable.tableNumber);\n setRevealTableModes({ ...defaultTable });\n }\n }, [defaultTable, playButtonSound]);\n\n useEffect(() => {\n if (revealTableModes.tableNumber === 0 && isSpecialEventsActive && !showSplEventsText) {\n setShowSplEventsText(true);\n }\n\n if (revealTableModes.tableNumber > 0) {\n setShowSplEventsText(false);\n }\n }, [revealTableModes.tableNumber, isSpecialEventsActive, showSplEventsText]);\n\n return (\n <>\n <CardContainer\n labelRef={labelRef}\n ref={cardRef}\n strokeColor=\"WHITE\"\n label={getHighlightedText()}\n labelColor={labelColor}\n isAnimated={isLabelAnimated}\n showLabel={showLabel}\n >\n <Styled.CardWrapper>\n {/* table selection /}\n <Styled.TableSegmentsWrapper>\n {/ infinite button /}\n <InfiniteButtonCard\n onClick={handleInfiniteModeClick}\n buttonRef={infiniteButtonRef}\n onMouseLeave={handleTableSegmentMouseLeave}\n onMouseOver={handleInfiniteModeSegmentMouseOver}\n />\n {/ card shadow /}\n <Styled.TableSegmentCardShadowContainer />\n {/ table segments /}\n {data.tableList.map((table, index) => {\n const segmentAngle = 360 / data.tableList.length;\n const startAngle = -(90 + 360 / (2 data.tableList.length));\n const currentAngle = startAngle + segmentAngle * (index + 1);\n\n return (\n <>\n <Styled.TableSegment\n key={index}\n $angle={currentAngle}\n $totalSegments={data.tableList.length}\n $zIndex={index + 1}\n onClick={() => handleTableSegmentClick(table)}\n onMouseOver={() => handleTableSegmentMouseOver(table)}\n onMouseLeave={handleTableSegmentMouseLeave}\n >\n <FlexView $flexDirection=\"row\" $justifyContent=\"center\" $alignItems=\"center\">\n {NORMAL_TABLE_MODES.map(star => (\n <TableSegmentStar\n key={star}\n isStarAchieved={\n table.stars.includes(star as TTableMode) \|\|\n rewardStar.includes(star as TTableMode)\n }\n rewardStar={\n !fadeIn &&\n !isSpecialEventsActive &&\n openModesOfTable?.tableNumber === table.tableNumber\n ? rewardStar.includes(star as TTableMode)\n : undefined\n }\n />\n ))}\n\n <Separator width={GAME_LAUNCHER_SIZE * 0.055} />\n\n <Styled.TableNumber $angle={-currentAngle}>\n <Text\n $renderAs={\n GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE\n ? 'ac3-black'\n : 'ac4-black'\n }\n $color={highlightedTable === table.tableNumber ? 'BLACK_1' : 'WHITE'}\n >\n {table.tableNumber}\n </Text>\n </Styled.TableNumber>\n </FlexView>\n </Styled.TableSegment>\n </>\n );\n })}\n (\n {revealTableModes.tableNumber === 0 && isSpecialEventsActive && (\n <>\n {NORMAL_TABLE_MODES.map((starType, index) => {\n if (!completedModes.includes(starType)) return null;\n\n return (\n <Styled.AllStarAbsoluteView key={starType} level={index + 1}>\n <LottieAnimation\n src={LOTTIE.LEVEL_1_ALLSTAR}\n settings={modeRevealAnimationSettings}\n animateOnIntersect\n />\n </Styled.AllStarAbsoluteView>\n );\n })}\n </>\n )}\n )\n </Styled.TableSegmentsWrapper>\n {/* table modes /}\n {revealTableModes.tableNumber > 0 && (\n <Styled.TableModeContainer>\n <Styled.TableModeWrapper>\n {/ tables modes with back button /}\n <Styled.AnimatedView animation={fadeIn ? 'fade-in' : 'fade-out'}>\n {tableModes.map((tableMode, index) => (\n <React.Fragment key={index}>\n <Styled.ModeOverlay\n $top={tableMode.semicirclePosiiionTop}\n $left={tableMode.semicirclePosiiionLeft}\n $hoverColor={tableMode.semicircleHoverColor}\n onClick={() =>\n fadeIn\n ? handleNormalModeClick(tableMode.type, tableMode.isStarAchieved)\n : undefined\n }\n onMouseOver={() =>\n fadeIn ? handleModeMouseOver(tableMode.type as TTableMode) : undefined\n }\n onMouseLeave={fadeIn ? handleModeMouseLeave : undefined}\n />\n <Styled.AbsoluteView\n $top={tableMode.top}\n $left={tableMode.left}\n $isPointerEventsNone={true}\n >\n <TableMode\n tableNumber={tableMode.tableNumber}\n isStarAchieved={\n tableMode.isStarAchieved \|\| rewardStar.includes(tableMode.type)\n }\n type={tableMode.type as TTableMode}\n rewardStar={rewardStar.includes(tableMode.type as TTableMode)}\n />\n </Styled.AbsoluteView>\n </React.Fragment>\n ))}\n {/ back button /}\n <Styled.AbsoluteView $top={50} $left={50} $alignCenter={true}>\n <Styled.IconWrapper>\n <Back2Icon\n onClick={goBack}\n height={GAME_LAUNCHER_SIZE 0.1}\n width={GAME_LAUNCHER_SIZE * 0.1}\n />\n </Styled.IconWrapper>\n </Styled.AbsoluteView>\n </Styled.AnimatedView>\n\n {/* overlay lottie for modes */}\n <LottieAnimation\n src={LOTTIE.TABLE_MODE_REVEAL}\n ref={revealAnimationRef}\n settings={modeRevealAnimationSettings}\n onRender={showTableModes}\n animateOnIntersect\n />\n </Styled.TableModeWrapper>\n </Styled.TableModeContainer>\n )}\n </Styled.CardWrapper>\n </CardContainer>\n {showSplEventsText && <SplEventsText completedModes={completedModes} />}\n </>\n );\n },\n);\n\nexport const TablesCard = memo(TablesCardComponent);\n"],"names":["modeRevealAnimationSettings","TablesCardComponent","forwardRef","data","label","onPress","openModesOfTable","defaultTable","onGoBackFromTableLevel","onPressTableSegment","ref","trackEvent","useUIContext","playButtonSound","useCircleSounds","fadeIn","setFadeIn","useState","highlightedTable","setHighlightedTable","highlightedLevel","setHighlightedLevel","highlightedInfiniteModeText","setHighlightedInfiniteModeText","labelColor","setLabelColor","revealTableModes","setRevealTableModes","_a","table","infiniteButtonRef","useRef","showLabel","setShowLabel","isLabelAnimated","setIsLabelAnimated","animatedColor","setAniimatedColor","labelRef","cardRef","rewardStar","setRewardStar","showSplEventsText","setShowSplEventsText","revealAnimationRef","disappearAnimationTimer","handleTableSegmentClick","useCallback","GAME_LAUNCHER_ANALYTICS_EVENTS","handleTableSegmentMouseOver","handleInfiniteModeSegmentMouseOver","handleTableSegmentMouseLeave","goBack","time","TABLE_REVEAL_ANIMATION","showTableModes","handleModeMouseOver","type","level","TABLE_MODE_LABEL_COLOR","handleModeMouseLeave","revealTableModesMemo","useMemo","tableModes","completedModes","isSpecialEventsActive","calculatedcompletedModes","NORMAL_TABLE_MODES","star","isAllRewardStarsInCompletedModes","handleInfiniteModeClick","handleNormalModeClick","mode","isStarRewarded","getHighlightedText","INFINITE_MODE_TEXT","startLabelAnimation","color","stopLabelAnimation","setLabelVisiblity","visible","useImperativeHandle","useEffect","jsxs","Fragment","jsx","CardContainer","Styled.CardWrapper","Styled.TableSegmentsWrapper","InfiniteButtonCard","Styled.TableSegmentCardShadowContainer","index","segmentAngle","currentAngle","Styled.TableSegment","FlexView","TableSegmentStar","Separator","GAME_LAUNCHER_SIZE","Styled.TableNumber","Text","GAME_LAUNCHER_SIZE_LARGE","starType","Styled.AllStarAbsoluteView","LottieAnimation","LOTTIE","Styled.TableModeContainer","Styled.TableModeWrapper","Styled.AnimatedView","tableMode","React","Styled.ModeOverlay","Styled.AbsoluteView","TableMode","Styled.IconWrapper","Back2Icon","SplEventsText","TablesCard","memo"],"mappings":"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"}

package/dist/features/puzzles/app/puzzle-app-styled.js ADDED Viewed

@@ -0,0 +1,81 @@
+import o from "styled-components";
+import n from "../../../assets/line-icons/icons/hint-fill.js";
+import l from "../../ui/layout/flex-view.js";
+import r from "../../ui/text/text.js";
+import { getPuzzleCardPattern as p } from "../utils/puzzle-pattern.js";
+const d = o(l)(({ theme: t, $visible: i }) => {
+  const { gutter: e } = t.layout;
+  return i ? `
+    overflow: scroll;
+    padding-top: ${e * 1.5}px;
+    padding-bottom: ${e * 2}px;
+  ` : "";
+}), g = o(l)`
+  position: relative;
+  margin: 0 auto;
+  box-shadow: inset 0px 0px 0px 4px ${({ theme: t, $imageHue: i }) => t.colors[`${i}_4`]};
+  max-width: 343px;
+  width: 100%;
+  min-height: max-content;
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-image: ${({ $imageHue: t }) => `url(${p(t)})`};
+    background-size: cover;
+    opacity: 0.2;
+  }
+`, x = o(n)`
+  color: ${({ theme: t }) => t.colors.BLACK_1};
+  & .hint-fill-icon-path {
+    fill: ${({ theme: t }) => t.colors.WHITE_1};
+  }
+`, u = o(r)`
+  & span {
+    font-weight: 700;
+    margin-right: 4px;
+  }
+`, h = o.div`
+  color: ${({ theme: t }) => t.colors.BLACK};
+  font-size: 14px;
+  line-height: 1.2;
+  font-family: 'Athletics';
+  font-weight: 400;
+  font-style: normal;
+  em {
+    font-style: italic;
+  }
+  ul,
+  ol {
+    list-style-type: initial;
+    padding-left: 32px;
+  }
+  ol {
+    list-style-type: decimal;
+  }
+  p {
+    margin: 0;
+  }
+  li {
+    margin: 4px 0;
+  }
+`;
+export {
+  d as PuzzleAppWrapper,
+  g as PuzzleContainer,
+  h as PuzzleQuestionWrapper,
+  u as StyledFeedbackText,
+  x as StyledHintFillIcon
+};
+//# sourceMappingURL=puzzle-app-styled.js.map

package/dist/features/puzzles/app/puzzle-app-styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"puzzle-app-styled.js","sources":["../../../../src/features/puzzles/app/puzzle-app-styled.tsx"],"sourcesContent":["import type { THueNames } from '../../ui/types';\n\nimport styled from 'styled-components';\n\nimport HintFillIcon from '../../../assets/line-icons/icons/hint-fill';\nimport FlexView from '../../ui/layout/flex-view';\nimport Text from '../../ui/text/text';\nimport { getPuzzleCardPattern } from '../utils/puzzle-pattern';\n\nconst PuzzleAppWrapper = styled(FlexView)<{ $visible: boolean }>(({ theme, $visible }) => {\n const { gutter } = theme.layout;\n\n if (!$visible) {\n return ``;\n }\n\n return `\n overflow: scroll;\n padding-top: ${gutter * 1.5}px;\n padding-bottom: ${gutter * 2}px;\n `;\n});\n\nconst PuzzleContainer = styled(FlexView)<{ $imageHue: THueNames; $backgroundOpacity?: number }>`\n position: relative;\n margin: 0 auto;\n box-shadow: inset 0px 0px 0px 4px ${({ theme, $imageHue }) => theme.colors[`${$imageHue}_4`]};\n max-width: 343px;\n width: 100%;\n min-height: max-content;\n\n &::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-image: ${({ $imageHue }) => `url(${getPuzzleCardPattern($imageHue)})`};\n background-size: cover;\n opacity: 0.2;\n }\n`;\n\nconst StyledHintFillIcon = styled(HintFillIcon)`\n color: ${({ theme }) => theme.colors.BLACK_1};\n\n & .hint-fill-icon-path {\n fill: ${({ theme }) => theme.colors.WHITE_1};\n }\n`;\n\nconst StyledFeedbackText = styled(Text)`\n & span {\n font-weight: 700;\n margin-right: 4px;\n }\n`;\n\nconst PuzzleQuestionWrapper = styled.div`\n color: ${({ theme }) => theme.colors.BLACK};\n font-size: 14px;\n line-height: 1.2;\n font-family: 'Athletics';\n\n font-weight: 400;\n font-style: normal;\n\n em {\n font-style: italic;\n }\n\n ul,\n ol {\n list-style-type: initial;\n padding-left: 32px;\n }\n\n ol {\n list-style-type: decimal;\n }\n\n p {\n margin: 0;\n }\n\n li {\n margin: 4px 0;\n }\n`;\n\nexport {\n PuzzleAppWrapper,\n PuzzleContainer,\n StyledFeedbackText,\n StyledHintFillIcon,\n PuzzleQuestionWrapper,\n};\n"],"names":["PuzzleAppWrapper","styled","FlexView","theme","$visible","gutter","PuzzleContainer","$imageHue","getPuzzleCardPattern","StyledHintFillIcon","HintFillIcon","StyledFeedbackText","Text","PuzzleQuestionWrapper"],"mappings":";;;;;AASM,MAAAA,IAAmBC,EAAOC,CAAQ,EAAyB,CAAC,EAAE,OAAAC,GAAO,UAAAC,QAAe;AAClF,QAAA,EAAE,QAAAC,EAAO,IAAIF,EAAM;AAEzB,SAAKC,IAIE;AAAA;AAAA,mBAEUC,IAAS,GAAG;AAAA,sBACTA,IAAS,CAAC;AAAA,MANrB;AAQX,CAAC,GAEKC,IAAkBL,EAAOC,CAAQ;AAAA;AAAA;AAAA,sCAGD,CAAC,EAAE,OAAAC,GAAO,WAAAI,QAAgBJ,EAAM,OAAO,GAAGI,CAAS,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAYtE,CAAC,EAAE,WAAAA,EAAU,MAAM,OAAOC,EAAqBD,CAAS,CAAC,GAAG;AAAA;AAAA;AAAA;AAAA,GAM9EE,IAAqBR,EAAOS,CAAY;AAAA,WACnC,CAAC,EAAE,OAAAP,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,YAGlC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA,GAIzCQ,IAAqBV,EAAOW,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA,GAOhCC,IAAwBZ,EAAO;AAAA,WAC1B,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/puzzles/app/puzzle-app-view.js ADDED Viewed

@@ -0,0 +1,120 @@
+import { jsxs as y, jsx as a } from "react/jsx-runtime";
+import { memo as A, useRef as S, useCallback as _, useEffect as l, useMemo as $ } from "react";
+import H from "../../ui/image/image.js";
+import M from "../../ui/layout/flex-view.js";
+import x from "../../ui/separator/separator.js";
+import d from "../../worksheet/constants/events.js";
+import N from "../../worksheet/worksheet/hooks/use-learnosity.js";
+import Q from "../../worksheet/worksheet/hooks/use-worksheet-data-helper.js";
+import { getQuestionsFromItems as V } from "../../worksheet/worksheet/worksheet-helpers.js";
+import { PuzzleQuestionWrapper as P, PuzzleContainer as R } from "./puzzle-app-styled.js";
+const F = (u) => {
+  if (!u) return null;
+  const t = u.match(/<img[^>]+src="([^">]+)"/);
+  return t ? t[1] : null;
+}, L = ({
+  worksheetData: u,
+  loggerRef: t,
+  onWorksheetErrored: n,
+  imageHue: I,
+  onLoaded: p
+}) => {
+  const { signed_request: g, questions_signed_request: w } = u, z = S(null), {
+    loadingState: i,
+    data: o,
+    error: f
+  } = Q({
+    attemptId: void 0,
+    signedRequest: g,
+    loggerRef: t
+  }), E = _(
+    (s) => {
+      n({
+        code: s.code,
+        message: s.detail
+      });
+    },
+    [n]
+  ), { learnosity: r } = N(w, E, t);
+  l(() => {
+    i === "error" && n({
+      message: f ?? "Error loading worksheet"
+    });
+  }, [i, n, f]), l(() => {
+    r && t.current(d.WORKSHEET_V3_LEARNOSITY_INITIALIZED);
+  }, [r, t]), l(() => {
+    r && i === "success" && p && (t.current(d.WORKSHEET_V3_READY), p());
+  }, [r, i, t, p]);
+  const m = $(() => i === "success" && (o != null && o.learnosityItems) ? (t.current(d.WORKSHEET_V3_READY), V(o.learnosityItems, {
+    sectioned: !1,
+    adaptive: !1
+  }).map((e) => ({
+    response_id: e.response_id,
+    type: e.type,
+    stimulus: e.stimulus,
+    template: e.template,
+    stimulus_review: e.stimulus_review,
+    options: e.options,
+    metadata: e.metadata,
+    validation: e.validation
+    // Add other properties as needed
+  }))) : [], [i, o, t]);
+  l(() => {
+    if (r && m.length > 0) {
+      const c = requestAnimationFrame(() => {
+        try {
+          r.renderMath("mathjax");
+        } catch (e) {
+          n({
+            message: `MathJax rendering failed: ${e instanceof Error ? e.message : "Unknown error"}`
+          });
+        }
+      });
+      return () => {
+        cancelAnimationFrame(c);
+      };
+    }
+  }, [r, n, m]);
+  const T = _((s) => {
+    const { stimulus: c = "", template: e = "", response_id: v } = s, h = F(c);
+    return /* @__PURE__ */ y(
+      M,
+      {
+        $background: "TRANSPARENT",
+        $alignItems: "center",
+        className: "puzzle-app-view-question-card",
+        children: [
+          h && /* @__PURE__ */ a(
+            H,
+            {
+              src: h,
+              alt: "Puzzle illustration",
+              width: 183,
+              height: 183,
+              withLoader: !0
+            }
+          ),
+          /* @__PURE__ */ a(x, { heightX: 1 }),
+          e && /* @__PURE__ */ a(P, { children: /* @__PURE__ */ a("div", { dangerouslySetInnerHTML: { __html: e } }) })
+        ]
+      },
+      v
+    );
+  }, []);
+  return m.length ? /* @__PURE__ */ a(
+    R,
+    {
+      ref: z,
+      $gapX: 1,
+      $gutterX: 1,
+      $imageHue: I,
+      $background: "WHITE_1",
+      className: "puzzle-app-view-container",
+      children: m.map((s) => /* @__PURE__ */ a("div", { children: T(s) }, `question-${s.response_id}`))
+    }
+  ) : null;
+}, U = A(L);
+export {
+  U as default
+};
+//# sourceMappingURL=puzzle-app-view.js.map

package/dist/features/puzzles/app/puzzle-app-view.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"puzzle-app-view.js","sources":["../../../../src/features/puzzles/app/puzzle-app-view.tsx"],"sourcesContent":["import type {\n ILearnosityError,\n ILearnosityQuestion,\n} from '../../worksheet/worksheet/worksheet-types';\nimport type { IPuzzleAppViewProps } from './puzzle-app-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport Image from '../../ui/image/image';\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport EVENTS from '../../worksheet/constants/events';\nimport useLearnosity from '../../worksheet/worksheet/hooks/use-learnosity';\nimport useWorksheetDataHelper from '../../worksheet/worksheet/hooks/use-worksheet-data-helper';\nimport { getQuestionsFromItems } from '../../worksheet/worksheet/worksheet-helpers';\nimport * as Styled from './puzzle-app-styled';\n\nconst extractImageFromHTML = (htmlString: string) => {\n if (!htmlString) return null;\n\n const imgMatch = htmlString.match(/<img[^>]+src=\"([^\">]+)\"/);\n\n return imgMatch ? imgMatch[1] : null;\n};\n\nconst PuzzleAppView: FC<IPuzzleAppViewProps> = ({\n worksheetData,\n loggerRef,\n onWorksheetErrored,\n imageHue,\n onLoaded,\n}) => {\n const { signed_request: itemsSignedRequest, questions_signed_request: questionSignedRequest } =\n worksheetData;\n\n // Ref for the container to trigger MathJax rendering\n const containerRef = useRef<HTMLDivElement>(null);\n\n // Get Learnosity items using the signed_request (not questions_signed_request)\n const {\n loadingState,\n data: learnosityData,\n error: worksheetError,\n } = useWorksheetDataHelper({\n attemptId: undefined,\n signedRequest: itemsSignedRequest,\n loggerRef,\n });\n\n const onLearnosityErrored = useCallback(\n (err: ILearnosityError) => {\n onWorksheetErrored({\n code: err.code,\n message: err.detail,\n });\n },\n [onWorksheetErrored],\n );\n\n // Initialize Learnosity using questions_signed_request (needed for interactive questions)\n const { learnosity } = useLearnosity(questionSignedRequest, onLearnosityErrored, loggerRef);\n\n useEffect(() => {\n if (loadingState === 'error') {\n onWorksheetErrored({\n message: worksheetError ?? 'Error loading worksheet',\n });\n }\n }, [loadingState, onWorksheetErrored, worksheetError]);\n\n // Log when learnosity is ready for future interactive features\n useEffect(() => {\n if (learnosity) {\n loggerRef.current(EVENTS.WORKSHEET_V3_LEARNOSITY_INITIALIZED);\n }\n }, [learnosity, loggerRef]);\n\n useEffect(() => {\n if (learnosity && loadingState === 'success' && onLoaded) {\n loggerRef.current(EVENTS.WORKSHEET_V3_READY);\n onLoaded();\n }\n }, [learnosity, loadingState, loggerRef, onLoaded]);\n\n // Memoize questions processing to prevent re-render loops\n const questions = useMemo(() => {\n // Extract questions from Learnosity items when data is loaded successfully\n if (loadingState === 'success' && learnosityData?.learnosityItems) {\n loggerRef.current(EVENTS.WORKSHEET_V3_READY);\n\n // Convert learnosityItems to questions using the worksheet helper\n const worksheetQuestions = getQuestionsFromItems(learnosityData.learnosityItems, {\n sectioned: false,\n adaptive: false,\n });\n\n // Extract just the Learnosity questions from worksheet questions\n const learnosityQuestions: ILearnosityQuestion[] = worksheetQuestions.map(q => ({\n response_id: q.response_id,\n type: q.type,\n stimulus: q.stimulus,\n template: q.template,\n stimulus_review: q.stimulus_review,\n options: q.options,\n metadata: q.metadata,\n validation: q.validation,\n // Add other properties as needed\n }));\n\n return learnosityQuestions;\n }\n\n return [];\n }, [loadingState, learnosityData, loggerRef]);\n\n // Force MathJax rendering after questions are loaded and rendered\n // Similar to how useLearnosityAppend does it\n useEffect(() => {\n if (learnosity && questions.length > 0) {\n // Use requestAnimationFrame to ensure DOM is updated before rendering math\n const renderMath = () => {\n try {\n learnosity.renderMath('mathjax');\n } catch (error) {\n onWorksheetErrored({\n message: `MathJax rendering failed: ${\n error instanceof Error ? error.message : 'Unknown error'\n }`,\n });\n }\n };\n\n const animationId = requestAnimationFrame(renderMath);\n\n return () => {\n cancelAnimationFrame(animationId);\n };\n }\n }, [learnosity, onWorksheetErrored, questions]);\n\n const renderQuestionContent = useCallback((question: ILearnosityQuestion) => {\n const { stimulus = '', template = '', response_id: responseId } = question;\n const imageUrl = extractImageFromHTML(stimulus);\n\n return (\n <FlexView\n $background=\"TRANSPARENT\"\n key={responseId}\n $alignItems=\"center\"\n className=\"puzzle-app-view-question-card\"\n >\n {/* Main Image or Interactive Content */}\n {imageUrl && (\n <Image\n src={imageUrl}\n alt=\"Puzzle illustration\"\n width={183}\n height={183}\n withLoader={true}\n />\n )}\n\n <Separator heightX={1} />\n\n {/* Question HTML Content */}\n {template && (\n <Styled.PuzzleQuestionWrapper>\n <div dangerouslySetInnerHTML={{ __html: template }} />\n </Styled.PuzzleQuestionWrapper>\n )}\n </FlexView>\n );\n }, []);\n\n if (!questions.length) return null;\n\n return (\n <Styled.PuzzleContainer\n ref={containerRef}\n $gapX={1}\n $gutterX={1}\n $imageHue={imageHue}\n $background=\"WHITE_1\"\n className=\"puzzle-app-view-container\"\n >\n {questions.map(question => (\n <div key={`question-${question.response_id}`}>{renderQuestionContent(question)}</div>\n ))}\n </Styled.PuzzleContainer>\n );\n};\n\nexport default memo(PuzzleAppView);\n"],"names":["extractImageFromHTML","htmlString","imgMatch","PuzzleAppView","worksheetData","loggerRef","onWorksheetErrored","imageHue","onLoaded","itemsSignedRequest","questionSignedRequest","containerRef","useRef","loadingState","learnosityData","worksheetError","useWorksheetDataHelper","onLearnosityErrored","useCallback","err","learnosity","useLearnosity","useEffect","EVENTS","questions","useMemo","getQuestionsFromItems","q","animationId","error","renderQuestionContent","question","stimulus","template","responseId","imageUrl","jsxs","FlexView","jsx","Image","Separator","Styled.PuzzleQuestionWrapper","Styled.PuzzleContainer","PuzzleAppView$1","memo"],"mappings":"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"}

package/dist/features/puzzles/app/puzzle-app.js ADDED Viewed

@@ -0,0 +1,82 @@
+import { jsx as e, jsxs as s, Fragment as z } from "react/jsx-runtime";
+import { memo as S, useState as p, useRef as v, useCallback as a, useEffect as x } from "react";
+import { ErrorBoundary as T } from "react-error-boundary";
+import f from "../../ui/error/error.js";
+import g from "../../ui/layout/flex-view.js";
+import W from "../../ui/loader/app-loader/app-loader.js";
+import u from "../../ui/text/text.js";
+import _ from "../../worksheet/learnosity-preloader/learnosity-preloader.js";
+import { usePreviewWorksheetGet as U } from "../../worksheet/worksheet-preview/api/get-preview-worksheet.js";
+import { LEARNOSITY_QUESTIONS_API as y, LEARNOSITY_QUESTIONS_API_FALLBACK as C } from "../../worksheet/worksheet/stories/worksheet-story-container.js";
+import { PuzzleAppWrapper as F, StyledFeedbackText as N, StyledHintFillIcon as O } from "./puzzle-app-styled.js";
+import B from "./puzzle-app-view.js";
+const D = (r) => {
+  console.log("Worksheet Logger:", r);
+}, G = () => {
+  const r = new URLSearchParams(window.location.search), t = r.get("itemRef") || "", k = r.get("title") || "", l = r.get("imageHue") || "BLUE", c = r.get("feedbackComments") || void 0, A = r.get("tip") || void 0, [$, m] = p(), [o, b] = p(!1), { isProcessing: E, get: d, data: h, error: L } = U(), w = v(() => null), R = A || "Celebrate persistence more than correct answers - it's a life skill worth building.", n = a(() => {
+    d("test", {
+      action: "review",
+      node_type: "PUZZLE_CARD",
+      items: [t]
+    });
+  }, [d, t]);
+  x(() => {
+    n();
+  }, [n]);
+  const P = a((i) => {
+    m(i.message);
+  }, []), I = a(() => {
+    b(!0);
+  }, []);
+  return t ? $ || L ? /* @__PURE__ */ e(f, { height: "100vh", onTryAgain: n }) : E ? /* @__PURE__ */ e(W, { height: "100vh" }) : /* @__PURE__ */ e(
+    T,
+    {
+      fallback: /* @__PURE__ */ e(f, { height: "100vh" }),
+      onError: (i) => m(i.message),
+      children: /* @__PURE__ */ e(
+        _,
+        {
+          apiURL: y,
+          fallbackAPIURL: C,
+          logger: D,
+          children: /* @__PURE__ */ s(
+            F,
+            {
+              className: "puzzle-app-container",
+              $background: `${l}_2`,
+              $alignItems: "center",
+              $flexGapX: 1,
+              $gutterX: 1,
+              $visible: o,
+              $height: "100vh",
+              children: [
+                o && /* @__PURE__ */ e(u, { $renderAs: "ab1-bold", children: k }),
+                h && /* @__PURE__ */ e(
+                  B,
+                  {
+                    onWorksheetErrored: P,
+                    worksheetData: h,
+                    loggerRef: w,
+                    imageHue: l,
+                    onLoaded: I
+                  }
+                ),
+                o && /* @__PURE__ */ e(z, { children: c ? /* @__PURE__ */ s(N, { $renderAs: "ab2", children: [
+                  /* @__PURE__ */ e("span", { children: "Tutor Remark:" }),
+                  c
+                ] }) : /* @__PURE__ */ s(g, { $flexDirection: "row", $alignItems: "center", $flexGap: 8, children: [
+                  /* @__PURE__ */ e(g, { $width: 24, $height: 24, children: /* @__PURE__ */ e(O, {}) }),
+                  /* @__PURE__ */ e(u, { $renderAs: "ab2", children: R })
+                ] }) })
+              ]
+            }
+          )
+        }
+      )
+    }
+  ) : null;
+}, re = S(G);
+export {
+  re as default
+};
+//# sourceMappingURL=puzzle-app.js.map

package/dist/features/puzzles/app/puzzle-app.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"puzzle-app.js","sources":["../../../../src/features/puzzles/app/puzzle-app.tsx"],"sourcesContent":["import type { THueNames } from '../../ui/types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect, useRef, useState } from 'react';\nimport { ErrorBoundary } from 'react-error-boundary';\n\nimport Error from '../../ui/error/error';\nimport FlexView from '../../ui/layout/flex-view';\nimport AppLoader from '../../ui/loader/app-loader/app-loader';\nimport Text from '../../ui/text/text';\nimport LearnosityPreloader from '../../worksheet/learnosity-preloader/learnosity-preloader';\nimport { usePreviewWorksheetGet } from '../../worksheet/worksheet-preview/api/get-preview-worksheet';\nimport {\n LEARNOSITY_QUESTIONS_API,\n LEARNOSITY_QUESTIONS_API_FALLBACK,\n} from '../../worksheet/worksheet/stories/worksheet-story-container';\nimport * as Styled from './puzzle-app-styled';\nimport PuzzleAppView from './puzzle-app-view';\n\nconst logger = (eventName: string) => {\n // eslint-disable-next-line no-console\n console.log('Worksheet Logger:', eventName);\n};\n\nconst PuzzleApp: FC = () => {\n // Extract props from URL search parameters\n const urlParams = new URLSearchParams(window.location.search);\n const itemRef = urlParams.get('itemRef') || '';\n const title = urlParams.get('title') || '';\n const imageHue = (urlParams.get('imageHue') || 'BLUE') as THueNames;\n const feedbackComments = urlParams.get('feedbackComments') || undefined;\n const tip = urlParams.get('tip') || undefined;\n\n const [error, setError] = useState<string>();\n const [worksheetRendered, setWorksheetRendered] = useState<boolean>(false);\n\n const { isProcessing, get, data: worksheetData, error: fetchError } = usePreviewWorksheetGet();\n const loggerRef = useRef(() => null);\n\n const tipInfo =\n tip || `Celebrate persistence more than correct answers - it's a life skill worth building.`;\n\n const fetchWorksheet = useCallback(() => {\n get('test', {\n action: 'review',\n node_type: 'PUZZLE_CARD',\n items: [itemRef],\n });\n }, [get, itemRef]);\n\n useEffect(() => {\n fetchWorksheet();\n }, [fetchWorksheet]);\n\n const handleWorksheetErrored = useCallback((err: { code?: number; message: string }) => {\n setError(err.message);\n }, []);\n\n const handleWorksheetLoaded = useCallback(() => {\n setWorksheetRendered(true);\n }, []);\n\n if (!itemRef) return null;\n\n if (error || fetchError) {\n return <Error height=\"100vh\" onTryAgain={fetchWorksheet} />;\n }\n\n if (isProcessing) {\n return <AppLoader height=\"100vh\" />;\n }\n\n return (\n <ErrorBoundary\n fallback={<Error height=\"100vh\" />}\n onError={errorInfo => setError(errorInfo.message)}\n >\n <LearnosityPreloader\n apiURL={LEARNOSITY_QUESTIONS_API}\n fallbackAPIURL={LEARNOSITY_QUESTIONS_API_FALLBACK}\n logger={logger}\n >\n <Styled.PuzzleAppWrapper\n className=\"puzzle-app-container\"\n $background={`${imageHue}_2`}\n $alignItems=\"center\"\n $flexGapX={1}\n $gutterX={1}\n $visible={worksheetRendered}\n $height=\"100vh\"\n >\n {worksheetRendered && <Text $renderAs=\"ab1-bold\">{title}</Text>}\n\n {worksheetData && (\n <PuzzleAppView\n onWorksheetErrored={handleWorksheetErrored}\n worksheetData={worksheetData}\n loggerRef={loggerRef}\n imageHue={imageHue}\n onLoaded={handleWorksheetLoaded}\n />\n )}\n\n {worksheetRendered && (\n <>\n {feedbackComments ? (\n <Styled.StyledFeedbackText $renderAs=\"ab2\">\n <span>Tutor Remark:</span>\n {feedbackComments}\n </Styled.StyledFeedbackText>\n ) : (\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGap={8}>\n <FlexView $width={24} $height={24}>\n <Styled.StyledHintFillIcon />\n </FlexView>\n <Text $renderAs=\"ab2\">{tipInfo}</Text>\n </FlexView>\n )}\n </>\n )}\n </Styled.PuzzleAppWrapper>\n </LearnosityPreloader>\n </ErrorBoundary>\n );\n};\n\nexport default memo(PuzzleApp);\n"],"names":["logger","eventName","PuzzleApp","urlParams","itemRef","title","imageHue","feedbackComments","tip","error","setError","useState","worksheetRendered","setWorksheetRendered","isProcessing","get","worksheetData","fetchError","usePreviewWorksheetGet","loggerRef","useRef","tipInfo","fetchWorksheet","useCallback","useEffect","handleWorksheetErrored","err","handleWorksheetLoaded","jsx","Error","AppLoader","ErrorBoundary","errorInfo","LearnosityPreloader","LEARNOSITY_QUESTIONS_API","LEARNOSITY_QUESTIONS_API_FALLBACK","jsxs","Styled.PuzzleAppWrapper","Text","PuzzleAppView","Styled.StyledFeedbackText","FlexView","Styled.StyledHintFillIcon","puzzleApp","memo"],"mappings":"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"}

package/dist/features/ui/inputs/checkbox-input/checkbox-input.js CHANGED Viewed

@@ -1,29 +1,29 @@
 import { jsxs as b, jsx as t } from "react/jsx-runtime";
-import { useCallback as g } from "react";
-import { useTheme as v } from "styled-components";
-import I from "../../text/text.js";
-import { CheckboxOptionWrapper as W, CheckboxInputWrapper as z, CheckboxInput as A, CheckIcon as O, IndeterminateIcon as T, CheckboxLabelWrapper as y } from "./checkbox-input-styled.js";
-const L = (h) => {
+import { useCallback as I } from "react";
+import { useTheme as g } from "styled-components";
+import v from "../../text/text.js";
+import { CheckboxOptionWrapper as W, CheckboxInputWrapper as z, CheckboxInput as A, CheckIcon as T, IndeterminateIcon as y, CheckboxLabelWrapper as L } from "./checkbox-input-styled.js";
+const O = (h) => {
   const {
     size: r,
     label: i,
-    value: a,
+    value: o,
     checked: e,
     disabled: n,
-    renderAs: o,
+    renderAs: a,
     labelWidthX: p,
-    indeterminate: k,
-    visibleOnCheck: u,
-    alignTopWithLabel: C = !1,
+    indeterminate: u,
+    visibleOnCheck: k,
+    alignTopWithLabel: $ = !1,
     onChange: l
   } = h, {
-    layout: { gutter: $ },
+    layout: { gutter: C },
     checkbox: c
-  } = v(), { textVariant: m } = c.sizes[r ?? "regular"], { textColorName: x } = c.variants[o ?? "black"], s = u ? e : !0, f = !e && k, d = g(() => {
+  } = g(), { textVariant: m } = c.sizes[r ?? "regular"], { textColorName: x } = c.variants[a ?? "black"], s = k ? e : !0, f = !e && u, d = I(() => {
     if (n) return null;
-    l(a, !e);
-  }, [e, n, l, a]);
-  return /* @__PURE__ */ b(W, { $alignTop: C, $disabled: n, children: [
+    l(o, !e);
+  }, [e, n, l, o]);
+  return /* @__PURE__ */ b(W, { $alignTop: $, $disabled: n, children: [
     /* @__PURE__ */ b(z, { onClick: d, $disabled: n, children: [
       /* @__PURE__ */ t(
         A,
@@ -32,15 +32,15 @@ const L = (h) => {
           checked: e,
           disabled: !!n,
           onChange: () => null,
-          $renderAs: o,
+          $renderAs: a,
           $size: r
         }
       ),
-      e && /* @__PURE__ */ t(O, { $renderAs: o, $size: r }),
-      f && /* @__PURE__ */ t(T, { $disabled: n, $size: $ * 1.125 })
+      e && /* @__PURE__ */ t(T, { $renderAs: a, $size: r }),
+      f && /* @__PURE__ */ t(y, { $disabled: n, $size: C * 1.125 })
     ] }),
     /* @__PURE__ */ t(
-      y,
+      L,
       {
         $labelWidthX: p,
         $visible: s,
@@ -48,7 +48,7 @@ const L = (h) => {
         $disabled: n,
         $checked: e,
         children: typeof i == "string" ? /* @__PURE__ */ t(
-          I,
+          v,
           {
             $renderAs: m[e ? "active" : "inactive"],
             $color: x[e ? "active" : "inactive"],
@@ -58,7 +58,7 @@ const L = (h) => {
       }
     )
   ] });
-}, q = L;
+}, q = O;
 export {
   q as default
 };

package/dist/features/ui/inputs/checkbox-input/checkbox-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"checkbox-input.js","sources":["../../../../../src/features/ui/inputs/checkbox-input/checkbox-input.tsx"],"sourcesContent":["import type { ICheckboxOptionProps } from './checkbox-input-types';\n\nimport { useCallback } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport Text from '../../text/text';\nimport * as Styled from './checkbox-input-styled';\n\nconst CheckboxInput = <IDType extends string \| number>(props: ICheckboxOptionProps<IDType>) => {\n const {\n size,\n label,\n value,\n checked,\n disabled,\n renderAs,\n labelWidthX,\n indeterminate,\n visibleOnCheck,\n alignTopWithLabel = false,\n onChange,\n } = props;\n\n const {\n layout: { gutter },\n checkbox,\n } = useTheme();\n\n const { textVariant } = checkbox.sizes[size ?? 'regular'];\n const { textColorName } = checkbox.variants[renderAs ?? 'black'];\n\n const renderLabel = visibleOnCheck ? checked : true;\n const renderIndeterminateState = !checked && indeterminate;\n\n const handleOnChange = useCallback(() => {\n if (disabled) return null;\n\n onChange(value, !checked);\n }, [checked, disabled, onChange, value]);\n\n return (\n <Styled.CheckboxOptionWrapper $alignTop={alignTopWithLabel} $disabled={disabled}>\n <Styled.CheckboxInputWrapper onClick={handleOnChange} $disabled={disabled}>\n <Styled.CheckboxInput\n type=\"checkbox\"\n checked={checked}\n disabled={!!disabled}\n onChange={() => null}\n $renderAs={renderAs}\n $size={size}\n />\n {checked && <Styled.CheckIcon $renderAs={renderAs} $size={size} />}\n\n {renderIndeterminateState && (\n <Styled.IndeterminateIcon $disabled={disabled} $size={gutter * 1.125} />\n )}\n </Styled.CheckboxInputWrapper>\n\n <Styled.CheckboxLabelWrapper\n $labelWidthX={labelWidthX}\n $visible={renderLabel}\n onClick={renderLabel ? handleOnChange : () => null}\n $disabled={disabled}\n $checked={checked}\n >\n {typeof label === 'string' ? (\n <Text\n $renderAs={textVariant[checked ? 'active' : 'inactive']}\n $color={textColorName[checked ? 'active' : 'inactive']}\n >\n {label}\n </Text>\n ) : (\n label\n )}\n </Styled.CheckboxLabelWrapper>\n </Styled.CheckboxOptionWrapper>\n );\n};\n\nexport default CheckboxInput;\n"],"names":["CheckboxInput","props","size","label","value","checked","disabled","renderAs","labelWidthX","indeterminate","visibleOnCheck","alignTopWithLabel","onChange","gutter","checkbox","useTheme","textVariant","textColorName","renderLabel","renderIndeterminateState","handleOnChange","useCallback","Styled.CheckboxOptionWrapper","jsxs","Styled.CheckboxInputWrapper","jsx","Styled.CheckboxInput","Styled.CheckIcon","Styled.IndeterminateIcon","Styled.CheckboxLabelWrapper","Text","~~CheckboxOption~~"],"mappings":";;;;;AAQA,MAAMA,IAAgB,CAAiCC,MAAwC;AACvF,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,mBAAAC,IAAoB;AAAA,IACpB,UAAAC;AAAA,EACE,IAAAX,GAEE;AAAA,IACJ,QAAQ,EAAE,QAAAY,EAAO;AAAA,IACjB,UAAAC;AAAA,MACEC,EAAS,GAEP,EAAE,aAAAC,EAAY,IAAIF,EAAS,MAAMZ,KAAQ,SAAS,GAClD,EAAE,eAAAe,EAAc,IAAIH,EAAS,SAASP,KAAY,OAAO,GAEzDW,IAAcR,IAAiBL,IAAU,IACzCc,IAA2B,CAACd,KAAWI,GAEvCW,IAAiBC,EAAY,MAAM;AACvC,QAAIf,EAAiB,QAAA;AAEZ,IAAAM,EAAAR,GAAO,CAACC,CAAO;AAAA,KACvB,CAACA,GAASC,GAAUM,GAAUR,CAAK,CAAC;AAEvC,2BACGkB,GAAA,EAA6B,WAAWX,GAAmB,WAAWL,GACrE,UAAA;AAAA,IAAA,gBAAAiB,EAACC,GAAA,EAA4B,SAASJ,GAAgB,WAAWd,GAC/D,UAAA;AAAA,MAAA,gBAAAmB;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAArB;AAAA,UACA,UAAU,CAAC,CAACC;AAAA,UACZ,UAAU,MAAM;AAAA,UAChB,WAAWC;AAAA,UACX,OAAOL;AAAA,QAAA;AAAA,MACT;AAAA,MACCG,uBAAYsB,GAAA,EAAiB,WAAWpB,GAAU,OAAOL,GAAM;AAAA,MAE/DiB,uBACES,GAAA,EAAyB,WAAWtB,GAAU,OAAOO,IAAS,OAAO;AAAA,IAAA,GAE1E;AAAA,IAEA,gBAAAY;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,cAAcrB;AAAA,QACd,UAAUU;AAAA,QACV,SAASA,IAAcE,IAAiB,MAAM;AAAA,QAC9C,WAAWd;AAAA,QACX,UAAUD;AAAA,QAET,UAAA,OAAOF,KAAU,WAChB,gBAAAsB;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,WAAWd,EAAYX,IAAU,WAAW,UAAU;AAAA,YACtD,QAAQY,EAAcZ,IAAU,WAAW,UAAU;AAAA,YAEpD,UAAAF;AAAA,UAAA;AAAA,QAAA,IAGHA;AAAA,MAAA;AAAA,IAEJ;AAAA,EACF,EAAA,CAAA;AAEJ,GAEA4B,IAAe/B;"}
1	+ {"version":3,"file":"checkbox-input.js","sources":["../../../../../src/features/ui/inputs/checkbox-input/checkbox-input.tsx"],"sourcesContent":["import type { ICheckboxOptionProps } from './checkbox-input-types';\n\nimport { useCallback } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport Text from '../../text/text';\nimport * as Styled from './checkbox-input-styled';\n\nconst CheckboxInput = <IDType extends string \| number>(props: ICheckboxOptionProps<IDType>) => {\n const {\n size,\n label,\n value,\n checked,\n disabled,\n renderAs,\n labelWidthX,\n indeterminate,\n visibleOnCheck,\n alignTopWithLabel = false,\n onChange,\n } = props;\n\n const {\n layout: { gutter },\n checkbox,\n } = useTheme();\n\n const { textVariant } = checkbox.sizes[size ?? 'regular'];\n const { textColorName } = checkbox.variants[renderAs ?? 'black'];\n\n const renderLabel = visibleOnCheck ? checked : true;\n const renderIndeterminateState = !checked && indeterminate;\n\n const handleOnChange = useCallback(() => {\n if (disabled) return null;\n\n onChange(value, !checked);\n }, [checked, disabled, onChange, value]);\n\n return (\n <Styled.CheckboxOptionWrapper $alignTop={alignTopWithLabel} $disabled={disabled}>\n <Styled.CheckboxInputWrapper onClick={handleOnChange} $disabled={disabled}>\n <Styled.CheckboxInput\n type=\"checkbox\"\n checked={checked}\n disabled={!!disabled}\n onChange={() => null}\n $renderAs={renderAs}\n $size={size}\n />\n {checked && <Styled.CheckIcon $renderAs={renderAs} $size={size} />}\n\n {renderIndeterminateState && (\n <Styled.IndeterminateIcon $disabled={disabled} $size={gutter * 1.125} />\n )}\n </Styled.CheckboxInputWrapper>\n\n <Styled.CheckboxLabelWrapper\n $labelWidthX={labelWidthX}\n $visible={renderLabel}\n onClick={renderLabel ? handleOnChange : () => null}\n $disabled={disabled}\n $checked={checked}\n >\n {typeof label === 'string' ? (\n <Text\n $renderAs={textVariant[checked ? 'active' : 'inactive']}\n $color={textColorName[checked ? 'active' : 'inactive']}\n >\n {label}\n </Text>\n ) : (\n label\n )}\n </Styled.CheckboxLabelWrapper>\n </Styled.CheckboxOptionWrapper>\n );\n};\n\nexport default CheckboxInput;\n"],"names":["CheckboxInput","props","size","label","value","checked","disabled","renderAs","labelWidthX","indeterminate","visibleOnCheck","alignTopWithLabel","onChange","gutter","checkbox","useTheme","textVariant","textColorName","renderLabel","renderIndeterminateState","handleOnChange","useCallback","Styled.CheckboxOptionWrapper","jsxs","Styled.CheckboxInputWrapper","jsx","Styled.CheckboxInput","Styled.CheckIcon","Styled.IndeterminateIcon","Styled.CheckboxLabelWrapper","Text","CheckboxInput$1"],"mappings":";;;;;AAQA,MAAMA,IAAgB,CAAiCC,MAAwC;AACvF,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,mBAAAC,IAAoB;AAAA,IACpB,UAAAC;AAAA,EACE,IAAAX,GAEE;AAAA,IACJ,QAAQ,EAAE,QAAAY,EAAO;AAAA,IACjB,UAAAC;AAAA,MACEC,EAAS,GAEP,EAAE,aAAAC,EAAY,IAAIF,EAAS,MAAMZ,KAAQ,SAAS,GAClD,EAAE,eAAAe,EAAc,IAAIH,EAAS,SAASP,KAAY,OAAO,GAEzDW,IAAcR,IAAiBL,IAAU,IACzCc,IAA2B,CAACd,KAAWI,GAEvCW,IAAiBC,EAAY,MAAM;AACvC,QAAIf,EAAiB,QAAA;AAEZ,IAAAM,EAAAR,GAAO,CAACC,CAAO;AAAA,KACvB,CAACA,GAASC,GAAUM,GAAUR,CAAK,CAAC;AAEvC,2BACGkB,GAAA,EAA6B,WAAWX,GAAmB,WAAWL,GACrE,UAAA;AAAA,IAAA,gBAAAiB,EAACC,GAAA,EAA4B,SAASJ,GAAgB,WAAWd,GAC/D,UAAA;AAAA,MAAA,gBAAAmB;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAArB;AAAA,UACA,UAAU,CAAC,CAACC;AAAA,UACZ,UAAU,MAAM;AAAA,UAChB,WAAWC;AAAA,UACX,OAAOL;AAAA,QAAA;AAAA,MACT;AAAA,MACCG,uBAAYsB,GAAA,EAAiB,WAAWpB,GAAU,OAAOL,GAAM;AAAA,MAE/DiB,uBACES,GAAA,EAAyB,WAAWtB,GAAU,OAAOO,IAAS,OAAO;AAAA,IAAA,GAE1E;AAAA,IAEA,gBAAAY;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,cAAcrB;AAAA,QACd,UAAUU;AAAA,QACV,SAASA,IAAcE,IAAiB,MAAM;AAAA,QAC9C,WAAWd;AAAA,QACX,UAAUD;AAAA,QAET,UAAA,OAAOF,KAAU,WAChB,gBAAAsB;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,WAAWd,EAAYX,IAAU,WAAW,UAAU;AAAA,YACtD,QAAQY,EAAcZ,IAAU,WAAW,UAAU;AAAA,YAEpD,UAAAF;AAAA,UAAA;AAAA,QAAA,IAGHA;AAAA,MAAA;AAAA,IAEJ;AAAA,EACF,EAAA,CAAA;AAEJ,GAEA4B,IAAe/B;"}

package/dist/features/ui/inputs/checkbox-input-list/checkbox-input-list.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { jsx as r } from "react/jsx-runtime";
 import { useMemo as g, useCallback as I } from "react";
 import L from "../../arrow-tooltip/arrow-tooltip.js";
-import O from "../checkbox-input/checkbox-input.js";
-import { CheckboxInputListWrapper as v, CheckboxOptionWrapper as A } from "./checkbox-input-list-styled.js";
+import v from "../checkbox-input/checkbox-input.js";
+import { CheckboxInputListWrapper as A, CheckboxOptionWrapper as O } from "./checkbox-input-list-styled.js";
 const $ = (h) => {
   const {
     size: a,
@@ -24,9 +24,9 @@ const $ = (h) => {
     },
     [e, i, c, o]
   );
-  return /* @__PURE__ */ r(v, { children: d.map((t) => {
+  return /* @__PURE__ */ r(A, { children: d.map((t) => {
     const { id: n, label: l } = t, p = o.includes(n), m = c && !p, k = (s == null ? void 0 : s.includes(n)) || m;
-    return /* @__PURE__ */ r(A, { $numColumns: C ?? 1, children: /* @__PURE__ */ r(
+    return /* @__PURE__ */ r(O, { $numColumns: C ?? 1, children: /* @__PURE__ */ r(
       L,
       {
         renderAs: "primary",
@@ -35,7 +35,7 @@ const $ = (h) => {
         hidden: !m,
         zIndex: 2,
         children: /* @__PURE__ */ r(
-          O,
+          v,
           {
             value: n,
             size: a,