@cuemath/leap 2.9.9-as3 → 2.9.9-as6

package/dist/features/chapters-v2/comps/node-card/teacher-actions/teacher-actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"teacher-actions.js","sources":["../../../../../../src/features/chapters-v2/comps/node-card/teacher-actions/teacher-actions.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { INodeCardProps } from '../node-card-types';\nimport type { INodeMenuOption } from '../node-menu-options/node-menu-options-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useRef } from 'react';\n\nimport Check2Icon from '../../../../../assets/line-icons/icons/check2';\nimport Eye2Icon from '../../../../../assets/line-icons/icons/eye2';\nimport Home2Icon from '../../../../../assets/line-icons/icons/home2';\nimport MoreVerticalIcon from '../../../../../assets/line-icons/icons/more-vertical';\nimport ArrowTooltip from '../../../../ui/arrow-tooltip/arrow-tooltip';\nimport useContextMenuClickHandler from '../../../../ui/hooks/use-context-menu-click-handler';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Text from '../../../../ui/text/text';\nimport { BLOCK_TYPE } from '../../../constants/block-constants';\nimport { NODE_CARD_STATES, TEACHER_MENU_LABELS } from '../../../constants/node-constants';\nimport { getNodeTypeBasedBgImage } from '../../../utils';\nimport { getNodeCardBasedIcon } from '../../../utils/node-card-utils';\nimport BorderPathAnimation from '../border-path-animation';\nimport * as Styled from '../node-card-styled';\nimport NodeCardTags from '../node-card-tags';\nimport NodeMenuOptions from '../node-menu-options/node-menu-options';\n\nconst renderSettings = { renderer: 'canvas', autoplay: false };\nconst { ASSIGN_AS_HW, REVIEW, VIEW, MARK_AS_DONE } = TEACHER_MENU_LABELS;\n\nconst TeacherActions: FC<Omit<INodeCardProps, 'userType'>> = memo(\n  ({\n    nodeData,\n    imageHue,\n    blockType,\n    isSkipped,\n    onNodeAttemptLocationChange,\n    onNodeMarkAsDone,\n    onNodeView,\n    onNodeReview,\n  }) => {\n    const containerRef = useRef<HTMLDivElement>(null);\n    const { menuVisible, onMenuClick } = useContextMenuClickHandler(containerRef);\n\n    const {\n      accuracy,\n      attempt_location: attemptLocation,\n      node_type: nodeType,\n      card_header: cardHeader,\n      title,\n      state,\n      is_optional: isOptional,\n      sheet_statement: sheetStatement,\n      permissions,\n      user_attempt_id: userAttemptId,\n    } = nodeData;\n\n    const { lottie: nodeCardLottie } = getNodeCardBasedIcon(nodeType);\n    const animationRef = useRef<ILottieAnimationRef | null>(null);\n\n    const {\n      can_change_attempt_location: canChangeAttemptLocation,\n      can_mark_familiar: canMarkFamiliar,\n      can_review: canReview,\n    } = permissions;\n\n    const isGoalBlock = blockType === BLOCK_TYPE.GOAL;\n    const sheetLocked = state === NODE_CARD_STATES.LOCKED;\n    const sheetNotStarted = state === NODE_CARD_STATES.NOT_STARTED;\n    const sheetInProgress = state === NODE_CARD_STATES.IN_PROGRESS;\n    const inClassSheet = attemptLocation === 'INCLASS';\n\n    const showCardAnimation = !isOptional && (sheetInProgress || sheetNotStarted);\n\n    const nodeBgImage = getNodeTypeBasedBgImage(nodeType);\n\n    const handleOnMenuOptionClick = useCallback(\n      (optionId: string) => {\n        switch (optionId) {\n          case 'node-card-view':\n            if (canReview && userAttemptId) {\n              onNodeReview?.(nodeData);\n            } else {\n              onNodeView?.(nodeData);\n            }\n\n            return;\n\n          case 'node-card-assign-as-hw':\n            onNodeAttemptLocationChange?.(nodeData);\n\n            return;\n\n          case 'node-card-mark-as-done':\n            onNodeMarkAsDone?.(nodeData);\n\n            return;\n          default:\n            throw new Error(`No callback function for ${optionId}`);\n        }\n      },\n      [\n        canReview,\n        nodeData,\n        onNodeAttemptLocationChange,\n        onNodeMarkAsDone,\n        onNodeReview,\n        onNodeView,\n        userAttemptId,\n      ],\n    );\n\n    const handleOnMouseEnter = useCallback(() => {\n      if (sheetLocked) return;\n      animationRef.current?.play();\n    }, [sheetLocked]);\n\n    const handleOnMouseLeave = useCallback(() => {\n      animationRef.current?.stop();\n    }, []);\n\n    const menuOptions: INodeMenuOption[] = [\n      {\n        id: 'node-card-view',\n        label: canReview && userAttemptId ? REVIEW : VIEW,\n        icon: Eye2Icon,\n        disabled: false,\n        onClick: handleOnMenuOptionClick,\n      },\n      {\n        id: 'node-card-assign-as-hw',\n        label: ASSIGN_AS_HW,\n        icon: Home2Icon,\n        disabled: !canChangeAttemptLocation || !inClassSheet,\n        onClick: handleOnMenuOptionClick,\n      },\n      {\n        id: 'node-card-mark-as-done',\n        label: MARK_AS_DONE,\n        icon: Check2Icon,\n        disabled: !canMarkFamiliar,\n        onClick: handleOnMenuOptionClick,\n      },\n    ];\n\n    return (\n      <Styled.NodeCardContainer\n        $showOutline={!showCardAnimation}\n        $isSheetLocked={sheetLocked}\n        $background={`${imageHue}_2`}\n        $disabled={Boolean(isSkipped)}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleOnMouseLeave}\n      >\n        <ArrowTooltip\n          renderAs=\"primary\"\n          tooltipItem={sheetStatement}\n          position=\"bottom\"\n          zIndex={5}\n          hidden={!sheetStatement}\n          parentWidth=\"100%\"\n          widthX={11.25}\n        >\n          <Styled.NodeCardInfoWrapper\n            $flexDirection=\"row\"\n            $alignItems=\"center\"\n            $width=\"100%\"\n            $heightX={3.5}\n            $bgImage={nodeBgImage}\n            $gutterX={0.78125}\n            $flexGap={8.5}\n          >\n            <Styled.IconWrapper\n              $width={31}\n              $height={31}\n              $background=\"WHITE_1\"\n              $position=\"relative\"\n              $alignItems=\"center\"\n              $justifyContent=\"center\"\n              $opacity={sheetLocked ? 0.5 : 1}\n            >\n              <LottieAnimation src={nodeCardLottie} ref={animationRef} settings={renderSettings} />\n              {!isOptional && <Styled.StyledImportantIcon />}\n            </Styled.IconWrapper>\n\n            <Text $renderAs=\"ac4-black\" $color=\"BLACK\" $opacity={sheetLocked ? 0.5 : 1}>\n              {cardHeader} {inClassSheet && `• CW`}\n            </Text>\n\n            <FlexView className=\"context-menu\">\n              {isGoalBlock && (\n                <Styled.NodeKebabMenuWrapper ref={containerRef} onClick={onMenuClick}>\n                  <MoreVerticalIcon width={16} height={16} />\n                </Styled.NodeKebabMenuWrapper>\n              )}\n            </FlexView>\n\n            {showCardAnimation && !isSkipped && <BorderPathAnimation />}\n          </Styled.NodeCardInfoWrapper>\n\n          <NodeCardTags nodeType={nodeType} state={state} accuracy={accuracy} />\n\n          {!isGoalBlock && (\n            <Styled.NodeCardContentWrapper\n              $flexDirection=\"row\"\n              $alignItems=\"center\"\n              $background=\"WHITE_1\"\n              $flexGap={8}\n              $heightX={4}\n              $justifyContent=\"space-between\"\n            >\n              <Styled.NodeCardTitle\n                $renderAs=\"ab3\"\n                $color=\"BLACK_1\"\n                $opacity={sheetLocked ? 0.5 : 1}\n              >\n                {title}\n              </Styled.NodeCardTitle>\n\n              <Styled.NodeKebabMenuWrapper ref={containerRef} onClick={onMenuClick}>\n                <MoreVerticalIcon width={16} height={16} />\n              </Styled.NodeKebabMenuWrapper>\n            </Styled.NodeCardContentWrapper>\n          )}\n        </ArrowTooltip>\n\n        <Styled.NodeMenuOptionsWrapper $visible={menuVisible}>\n          <NodeMenuOptions options={menuOptions} />\n        </Styled.NodeMenuOptionsWrapper>\n      </Styled.NodeCardContainer>\n    );\n  },\n);\n\nexport default TeacherActions;\n"],"names":["renderSettings","ASSIGN_AS_HW","REVIEW","VIEW","MARK_AS_DONE","TEACHER_MENU_LABELS","TeacherActions","memo","nodeData","imageHue","blockType","isSkipped","onNodeAttemptLocationChange","onNodeMarkAsDone","onNodeView","onNodeReview","containerRef","useRef","menuVisible","onMenuClick","useContextMenuClickHandler","accuracy","attemptLocation","nodeType","cardHeader","title","state","isOptional","sheetStatement","permissions","userAttemptId","nodeCardLottie","getNodeCardBasedIcon","animationRef","canChangeAttemptLocation","canMarkFamiliar","canReview","isGoalBlock","BLOCK_TYPE","sheetLocked","NODE_CARD_STATES","sheetNotStarted","sheetInProgress","inClassSheet","showCardAnimation","nodeBgImage","getNodeTypeBasedBgImage","handleOnMenuOptionClick","useCallback","optionId","handleOnMouseEnter","_a","handleOnMouseLeave","menuOptions","Eye2Icon","Home2Icon","Check2Icon","jsxs","Styled.NodeCardContainer","ArrowTooltip","Styled.NodeCardInfoWrapper","Styled.IconWrapper","jsx","LottieAnimation","Styled.StyledImportantIcon","Text","FlexView","Styled.NodeKebabMenuWrapper","MoreVerticalIcon","BorderPathAnimation","NodeCardTags","Styled.NodeCardContentWrapper","Styled.NodeCardTitle","Styled.NodeMenuOptionsWrapper","NodeMenuOptions"],"mappings":"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"}
+{"version":3,"file":"teacher-actions.js","sources":["../../../../../../src/features/chapters-v2/comps/node-card/teacher-actions/teacher-actions.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { INodeCardProps } from '../node-card-types';\nimport type { INodeMenuOption } from '../node-menu-options/node-menu-options-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useRef } from 'react';\n\nimport Check2Icon from '../../../../../assets/line-icons/icons/check2';\nimport Eye2Icon from '../../../../../assets/line-icons/icons/eye2';\nimport Home2Icon from '../../../../../assets/line-icons/icons/home2';\nimport MoreVerticalIcon from '../../../../../assets/line-icons/icons/more-vertical';\nimport ArrowTooltip from '../../../../ui/arrow-tooltip/arrow-tooltip';\nimport useContextMenuClickHandler from '../../../../ui/hooks/use-context-menu-click-handler';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Text from '../../../../ui/text/text';\nimport { BLOCK_TYPE } from '../../../constants/block-constants';\nimport { NODE_CARD_STATES, TEACHER_MENU_LABELS } from '../../../constants/node-constants';\nimport { getNodeTypeBasedBgImage } from '../../../utils';\nimport { getNodeCardBasedIcon } from '../../../utils/node-card-utils';\nimport BorderPathAnimation from '../border-path-animation';\nimport * as Styled from '../node-card-styled';\nimport NodeCardTags from '../node-card-tags';\nimport NodeMenuOptions from '../node-menu-options/node-menu-options';\n\nconst renderSettings = { renderer: 'canvas', autoplay: false };\nconst { ASSIGN_AS_HW, REVIEW, VIEW, MARK_AS_DONE } = TEACHER_MENU_LABELS;\n\nconst TeacherActions: FC<Omit<INodeCardProps, 'userType'>> = memo(\n  ({\n    nodeData,\n    imageHue,\n    blockType,\n    isSkipped,\n    onNodeAttemptLocationChange,\n    onNodeMarkAsDone,\n    onNodeView,\n    onNodeReview,\n  }) => {\n    const containerRef = useRef<HTMLDivElement>(null);\n    const { menuVisible, onMenuClick } = useContextMenuClickHandler(containerRef);\n\n    const {\n      accuracy,\n      attempt_location: attemptLocation,\n      node_type: nodeType,\n      card_header: cardHeader,\n      title,\n      state,\n      is_optional: isOptional,\n      sheet_statement: sheetStatement,\n      permissions,\n      user_attempt_id: userAttemptId,\n    } = nodeData;\n\n    const { lottie: nodeCardLottie } = getNodeCardBasedIcon(nodeType);\n    const animationRef = useRef<ILottieAnimationRef | null>(null);\n\n    const {\n      can_change_attempt_location: canChangeAttemptLocation,\n      can_mark_familiar: canMarkFamiliar,\n      can_review: canReview,\n    } = permissions;\n\n    const isGoalBlock = blockType === BLOCK_TYPE.GOAL;\n    const sheetLocked = state === NODE_CARD_STATES.LOCKED;\n    const sheetNotStarted = state === NODE_CARD_STATES.NOT_STARTED;\n    const sheetInProgress = state === NODE_CARD_STATES.IN_PROGRESS;\n    const inClassSheet = attemptLocation === 'INCLASS';\n\n    const showCardAnimation = !isOptional && (sheetInProgress || sheetNotStarted);\n\n    const nodeBgImage = getNodeTypeBasedBgImage(nodeType);\n\n    const handleOnMenuOptionClick = useCallback(\n      (optionId: string) => {\n        switch (optionId) {\n          case 'node-card-view':\n            if (canReview && userAttemptId) {\n              onNodeReview?.(nodeData);\n            } else {\n              onNodeView?.(nodeData);\n            }\n\n            return;\n\n          case 'node-card-assign-as-hw':\n            onNodeAttemptLocationChange?.(nodeData);\n\n            return;\n\n          case 'node-card-mark-as-done':\n            onNodeMarkAsDone?.(nodeData);\n\n            return;\n          default:\n            throw new Error(`No callback function for ${optionId}`);\n        }\n      },\n      [\n        canReview,\n        nodeData,\n        onNodeAttemptLocationChange,\n        onNodeMarkAsDone,\n        onNodeReview,\n        onNodeView,\n        userAttemptId,\n      ],\n    );\n\n    const handleOnMouseEnter = useCallback(() => {\n      if (sheetLocked) return;\n      animationRef.current?.play();\n    }, [sheetLocked]);\n\n    const handleOnMouseLeave = useCallback(() => {\n      animationRef.current?.stop();\n    }, []);\n\n    const menuOptions: INodeMenuOption[] = [\n      {\n        id: 'node-card-view',\n        label: canReview && userAttemptId ? REVIEW : VIEW,\n        icon: Eye2Icon,\n        disabled: false,\n        onClick: handleOnMenuOptionClick,\n      },\n      {\n        id: 'node-card-assign-as-hw',\n        label: ASSIGN_AS_HW,\n        icon: Home2Icon,\n        disabled: !canChangeAttemptLocation || !inClassSheet,\n        onClick: handleOnMenuOptionClick,\n      },\n      {\n        id: 'node-card-mark-as-done',\n        label: MARK_AS_DONE,\n        icon: Check2Icon,\n        disabled: !canMarkFamiliar,\n        onClick: handleOnMenuOptionClick,\n      },\n    ];\n\n    return (\n      <Styled.NodeCardContainer\n        $showOutline={!showCardAnimation}\n        $isSheetLocked={sheetLocked}\n        $background={`${imageHue}_2`}\n        $disabled={Boolean(isSkipped)}\n      >\n        <ArrowTooltip\n          renderAs=\"primary\"\n          tooltipItem={sheetStatement}\n          position=\"bottom\"\n          zIndex={5}\n          hidden={!sheetStatement}\n          parentWidth=\"100%\"\n          widthX={11.25}\n        >\n          <Styled.NodeCardInfoWrapper\n            $flexDirection=\"row\"\n            $alignItems=\"center\"\n            $width=\"100%\"\n            $heightX={3.5}\n            $bgImage={nodeBgImage}\n            $gutterX={0.78125}\n            $flexGap={8.5}\n            onMouseEnter={handleOnMouseEnter}\n            onMouseLeave={handleOnMouseLeave}\n          >\n            <Styled.IconWrapper\n              $width={31}\n              $height={31}\n              $background=\"WHITE_1\"\n              $position=\"relative\"\n              $alignItems=\"center\"\n              $justifyContent=\"center\"\n              $opacity={sheetLocked ? 0.5 : 1}\n            >\n              <LottieAnimation src={nodeCardLottie} ref={animationRef} settings={renderSettings} />\n              {!isOptional && <Styled.StyledImportantIcon />}\n            </Styled.IconWrapper>\n\n            <Text $renderAs=\"ac4-black\" $color=\"BLACK\" $opacity={sheetLocked ? 0.5 : 1}>\n              {cardHeader} {inClassSheet && `• CW`}\n            </Text>\n\n            <FlexView className=\"context-menu\">\n              {isGoalBlock && (\n                <Styled.NodeKebabMenuWrapper ref={containerRef} onClick={onMenuClick}>\n                  <MoreVerticalIcon width={16} height={16} />\n                </Styled.NodeKebabMenuWrapper>\n              )}\n            </FlexView>\n\n            {showCardAnimation && !isSkipped && <BorderPathAnimation />}\n          </Styled.NodeCardInfoWrapper>\n\n          <NodeCardTags nodeType={nodeType} state={state} accuracy={accuracy} />\n\n          {!isGoalBlock && (\n            <Styled.NodeCardContentWrapper\n              $flexDirection=\"row\"\n              $alignItems=\"center\"\n              $background=\"WHITE_1\"\n              $flexGap={8}\n              $heightX={4}\n              $justifyContent=\"space-between\"\n            >\n              <Styled.NodeCardTitle\n                $renderAs=\"ab3\"\n                $color=\"BLACK_1\"\n                $opacity={sheetLocked ? 0.5 : 1}\n              >\n                {title}\n              </Styled.NodeCardTitle>\n\n              <Styled.NodeKebabMenuWrapper ref={containerRef} onClick={onMenuClick}>\n                <MoreVerticalIcon width={16} height={16} />\n              </Styled.NodeKebabMenuWrapper>\n            </Styled.NodeCardContentWrapper>\n          )}\n        </ArrowTooltip>\n\n        <Styled.NodeMenuOptionsWrapper $visible={menuVisible}>\n          <NodeMenuOptions options={menuOptions} />\n        </Styled.NodeMenuOptionsWrapper>\n      </Styled.NodeCardContainer>\n    );\n  },\n);\n\nexport default TeacherActions;\n"],"names":["renderSettings","ASSIGN_AS_HW","REVIEW","VIEW","MARK_AS_DONE","TEACHER_MENU_LABELS","TeacherActions","memo","nodeData","imageHue","blockType","isSkipped","onNodeAttemptLocationChange","onNodeMarkAsDone","onNodeView","onNodeReview","containerRef","useRef","menuVisible","onMenuClick","useContextMenuClickHandler","accuracy","attemptLocation","nodeType","cardHeader","title","state","isOptional","sheetStatement","permissions","userAttemptId","nodeCardLottie","getNodeCardBasedIcon","animationRef","canChangeAttemptLocation","canMarkFamiliar","canReview","isGoalBlock","BLOCK_TYPE","sheetLocked","NODE_CARD_STATES","sheetNotStarted","sheetInProgress","inClassSheet","showCardAnimation","nodeBgImage","getNodeTypeBasedBgImage","handleOnMenuOptionClick","useCallback","optionId","handleOnMouseEnter","_a","handleOnMouseLeave","menuOptions","Eye2Icon","Home2Icon","Check2Icon","jsxs","Styled.NodeCardContainer","ArrowTooltip","Styled.NodeCardInfoWrapper","Styled.IconWrapper","jsx","LottieAnimation","Styled.StyledImportantIcon","Text","FlexView","Styled.NodeKebabMenuWrapper","MoreVerticalIcon","BorderPathAnimation","NodeCardTags","Styled.NodeCardContentWrapper","Styled.NodeCardTitle","Styled.NodeMenuOptionsWrapper","NodeMenuOptions"],"mappings":"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"}

package/dist/features/circle-games/games/tutorial/constants.js

@@ -1,5 +1,5 @@
-const E = 64;
+const t = 64 + (window.ReactNativeTopInset || 0);
 export {
-  E as HEADER_HEIGHT
+  t as HEADER_HEIGHT
 };
 //# sourceMappingURL=constants.js.map

package/dist/features/circle-games/games/tutorial/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../../src/features/circle-games/games/tutorial/constants.ts"],"sourcesContent":["export const HEADER_HEIGHT = 64;\n"],"names":["HEADER_HEIGHT"],"mappings":"AAAO,MAAMA,IAAgB;"}
+{"version":3,"file":"constants.js","sources":["../../../../../src/features/circle-games/games/tutorial/constants.ts"],"sourcesContent":["export const HEADER_HEIGHT = 64 + (window.ReactNativeTopInset || 0);\n"],"names":["HEADER_HEIGHT"],"mappings":"AAAa,MAAAA,IAAgB,MAAM,OAAO,uBAAuB;"}

package/dist/features/circle-games/games/tutorial/tutorial-styled.js

@@ -10,7 +10,7 @@ const n = o.div`
   width: inherit;
 `, d = o.div`
   height: ${t}px;
-  padding-top: 24px;
+  padding-top: ${(window.ReactNativeTopInset || 0) + 24}px;
   width: 100%;
   background: ${({ theme: i }) => i.colors.WHITE_T_03};
   backdrop-filter: blur(40px);
@@ -19,7 +19,7 @@ const n = o.div`
 `, s = o.div`
   position: absolute;
   right: 16px;
-  top: 22px;
+  top: ${(window.ReactNativeTopInset || 0) + 22}px;
   z-index: 1;
   &:hover {
     background: ${({ theme: i }) => i.colors.BLACK_4};
@@ -31,7 +31,7 @@ const n = o.div`
   /* overflow: hidden; */
   flex-grow: 1;
   position: relative;
-`, l = o.div`
+`, p = o.div`
   width: 100%;
   position: absolute;
   top: 0;
@@ -42,7 +42,7 @@ const n = o.div`
     width: 100%;
     height: 100%;
   }
-`, p = o.div`
+`, l = o.div`
   height: 40px;
   width: 100%;
   position: relative;
@@ -65,9 +65,9 @@ export {
   d as GameTutorialHeader,
   n as GameTutorialWrapper,
   s as HeaderIconContainer,
-  l as VideoContainer,
+  p as VideoContainer,
   c as VideoProgress,
   h as VideoProgressContainer,
-  p as VideoProgressWrapper
+  l as VideoProgressWrapper
 };
 //# sourceMappingURL=tutorial-styled.js.map

package/dist/features/circle-games/games/tutorial/tutorial-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"tutorial-styled.js","sources":["../../../../../src/features/circle-games/games/tutorial/tutorial-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport { HEADER_HEIGHT } from './constants';\n\nexport const GameTutorialWrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 250px;\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  position: relative;\n  width: inherit;\n`;\n\nexport const GameTutorialHeader = styled.div`\n  height: ${HEADER_HEIGHT}px;\n  padding-top: 24px;\n  width: 100%;\n  background: ${({ theme }) => theme.colors.WHITE_T_03};\n  backdrop-filter: blur(40px);\n  position: relative;\n  flex-shrink: 0;\n`;\n\nexport const HeaderIconContainer = styled.div`\n  position: absolute;\n  right: 16px;\n  top: 22px;\n  z-index: 1;\n  &:hover {\n    background: ${({ theme }) => theme.colors.BLACK_4};\n    cursor: pointer;\n  }\n`;\n\nexport const GameTutorialContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  /* overflow: hidden; */\n  flex-grow: 1;\n  position: relative;\n`;\n\nexport const VideoContainer = styled.div`\n  width: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  & video {\n    width: 100%;\n    height: 100%;\n  }\n`;\n\nexport const VideoProgressWrapper = styled.div`\n  height: 40px;\n  width: 100%;\n  position: relative;\n  display: flex;\n`;\n\nexport const VideoProgressContainer = styled.div`\n  height: 2px;\n  position: relative;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const VideoProgress = styled.div<{ $width: number }>`\n  height: inherit;\n  background: ${({ theme }) => theme.colors.WHITE};\n  position: absolute;\n  z-index: 2;\n  width: ${({ $width }) => $width || 0}%;\n  transition: width 0.4s linear;\n`;\n"],"names":["GameTutorialWrapper","styled","theme","GameTutorialHeader","HEADER_HEIGHT","HeaderIconContainer","GameTutorialContainer","VideoContainer","VideoProgressWrapper","VideoProgressContainer","VideoProgress","$width"],"mappings":";;AAIO,MAAMA,IAAsBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,gBAK1B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,GAKtCC,IAAqBF,EAAO;AAAA,YAC7BG,CAAa;AAAA;AAAA;AAAA,gBAGT,CAAC,EAAE,OAAAF,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA,GAMzCG,IAAsBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMxB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,GAKxCI,IAAwBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQ/BM,IAAiBN,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAaxBO,IAAuBP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAO9BQ,IAAyBR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOhCS,IAAgBT,EAAO;AAAA;AAAA,gBAEpB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA,WAGtC,CAAC,EAAE,QAAAS,QAAaA,KAAU,CAAC;AAAA;AAAA;"}
+{"version":3,"file":"tutorial-styled.js","sources":["../../../../../src/features/circle-games/games/tutorial/tutorial-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport { HEADER_HEIGHT } from './constants';\n\nexport const GameTutorialWrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 250px;\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  position: relative;\n  width: inherit;\n`;\n\nexport const GameTutorialHeader = styled.div`\n  height: ${HEADER_HEIGHT}px;\n  padding-top: ${(window.ReactNativeTopInset || 0) + 24}px;\n  width: 100%;\n  background: ${({ theme }) => theme.colors.WHITE_T_03};\n  backdrop-filter: blur(40px);\n  position: relative;\n  flex-shrink: 0;\n`;\n\nexport const HeaderIconContainer = styled.div`\n  position: absolute;\n  right: 16px;\n  top: ${(window.ReactNativeTopInset || 0) + 22}px;\n  z-index: 1;\n  &:hover {\n    background: ${({ theme }) => theme.colors.BLACK_4};\n    cursor: pointer;\n  }\n`;\n\nexport const GameTutorialContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  /* overflow: hidden; */\n  flex-grow: 1;\n  position: relative;\n`;\n\nexport const VideoContainer = styled.div`\n  width: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  & video {\n    width: 100%;\n    height: 100%;\n  }\n`;\n\nexport const VideoProgressWrapper = styled.div`\n  height: 40px;\n  width: 100%;\n  position: relative;\n  display: flex;\n`;\n\nexport const VideoProgressContainer = styled.div`\n  height: 2px;\n  position: relative;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const VideoProgress = styled.div<{ $width: number }>`\n  height: inherit;\n  background: ${({ theme }) => theme.colors.WHITE};\n  position: absolute;\n  z-index: 2;\n  width: ${({ $width }) => $width || 0}%;\n  transition: width 0.4s linear;\n`;\n"],"names":["GameTutorialWrapper","styled","theme","GameTutorialHeader","HEADER_HEIGHT","HeaderIconContainer","GameTutorialContainer","VideoContainer","VideoProgressWrapper","VideoProgressContainer","VideoProgress","$width"],"mappings":";;AAIO,MAAMA,IAAsBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,gBAK1B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,GAKtCC,IAAqBF,EAAO;AAAA,YAC7BG,CAAa;AAAA,kBACP,OAAO,uBAAuB,KAAK,EAAE;AAAA;AAAA,gBAEvC,CAAC,EAAE,OAAAF,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA,GAMzCG,IAAsBJ,EAAO;AAAA;AAAA;AAAA,UAGhC,OAAO,uBAAuB,KAAK,EAAE;AAAA;AAAA;AAAA,kBAG7B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,GAKxCI,IAAwBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQ/BM,IAAiBN,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAaxBO,IAAuBP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAO9BQ,IAAyBR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOhCS,IAAgBT,EAAO;AAAA;AAAA,gBAEpB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA,WAGtC,CAAC,EAAE,QAAAS,QAAaA,KAAU,CAAC;AAAA;AAAA;"}

package/dist/features/circle-games/games/web-view/web-view.js

@@ -1,28 +1,30 @@
-import { jsx as P } from "react/jsx-runtime";
-import { forwardRef as V, useRef as G, useMemo as R, useCallback as v, useImperativeHandle as $, useEffect as B } from "react";
+import { jsxs as h, jsx as v } from "react/jsx-runtime";
+import { forwardRef as P, useRef as G, useMemo as _, useCallback as T, useImperativeHandle as x, useEffect as B } from "react";
 import { useUIContext as J } from "../../../ui/context/context.js";
-import { ALLOWED_ORIGIN as C } from "./constants.js";
+import U from "../../../ui/layout/flex-view.js";
+import C from "../../../ui/separator/separator.js";
+import { ALLOWED_ORIGIN as b } from "./constants.js";
 import { ProjectType as s } from "./enums/project-type-enum.js";
 import { WebViewEvent as o } from "./enums/web-view-events-enum.js";
-const Z = V((I, b) => {
+const X = P((L, M) => {
   const {
-    baseUrl: y,
-    projectDetails: T,
-    playerDetails: w,
+    baseUrl: g,
+    projectDetails: y,
+    playerDetails: E,
     onGameLoad: a,
     onGamePlayFinish: c,
     handleInfoMessage: p,
     onBack: f,
-    parentDomain: g,
-    ...L
-  } = I, l = G(null), N = R(() => w, [w]), t = R(() => T, [T]);
+    parentDomain: N,
+    ...V
+  } = L, m = G(null), O = _(() => E, [E]), t = _(() => y, [y]);
   let A = "";
-  const { onEvent: O } = J();
+  const { onEvent: S } = J();
   t.projectType === s.LESSON && (A = t.miniGameIdentifier);
-  const m = v(() => {
-    const { enableCloseButton: i = !0 } = t;
+  const l = T(() => {
+    const { enableCloseButton: r = !0 } = t;
     let e = {
-      enableCloseButton: i
+      enableCloseButton: r
     };
     return t.projectType === s.GAME && (e = {
       ...e,
@@ -37,60 +39,65 @@ const Z = V((I, b) => {
       ...e,
       ...t
     }), e;
-  }, [t]), d = v(() => {
-    var e, r;
-    const i = m();
-    (r = (e = l.current) == null ? void 0 : e.contentWindow) == null || r.postMessage(
+  }, [t]), d = T(() => {
+    var e, i;
+    const r = l();
+    (i = (e = m.current) == null ? void 0 : e.contentWindow) == null || i.postMessage(
       JSON.stringify({
         event: o.GAME_DATA,
-        payload: i
+        payload: r
       }),
-      C
+      b
     );
-  }, [m]), D = v(() => {
-    var e, r;
-    const i = m();
-    (r = (e = l.current) == null ? void 0 : e.contentWindow) == null || r.postMessage(
+  }, [l]), j = T(() => {
+    var e, i;
+    const r = l();
+    (i = (e = m.current) == null ? void 0 : e.contentWindow) == null || i.postMessage(
       JSON.stringify({
         event: o.SET_CONFIG,
         payload: {
-          user: N,
-          projectConfig: i,
-          parentDomain: g
+          user: O,
+          projectConfig: r,
+          parentDomain: N
         }
       }),
-      C
+      b
     );
-  }, [N, m, g]);
-  $(b, () => l.current, []), B(() => {
-    const i = (e) => {
-      var j, _;
-      const r = e.data, S = typeof r == "string" ? JSON.parse(r) : r, { event: n, payload: E = null } = S;
+  }, [O, l, N]);
+  x(M, () => m.current, []), B(() => {
+    const r = (e) => {
+      var R, I;
+      const i = e.data, D = typeof i == "string" ? JSON.parse(i) : i, { event: n, payload: w = null } = D;
       if (n === o.VIBRATE) {
-        const { pattern: u } = E;
-        window.ReactNativeWebView ? window.ReactNativeWebView.postMessage(JSON.stringify(S)) : (_ = (j = window.navigator).vibrate) == null || _.call(j, u);
+        const { pattern: u } = w;
+        window.ReactNativeWebView ? window.ReactNativeWebView.postMessage(JSON.stringify(D)) : (I = (R = window.navigator).vibrate) == null || I.call(R, u);
       }
-      if (n === o.GAME_BACK && (f == null || f()), n === o.HIDE_LOADER && (a == null || a()), n === o.LOAD_DATA_FROM_APP && (d == null || d()), n === o.GET_CONFIG && D(), n === o.UPDATE_STATS && (c == null || c(E)), n === o.SHOW_SNACKBAR && (p == null || p(E)), n === o.TRACK_EVENT) {
-        const { eventName: u, properties: W } = E;
-        O(u, W);
+      if (n === o.GAME_BACK && (f == null || f()), n === o.HIDE_LOADER && (a == null || a()), n === o.LOAD_DATA_FROM_APP && (d == null || d()), n === o.GET_CONFIG && j(), n === o.UPDATE_STATS && (c == null || c(w)), n === o.SHOW_SNACKBAR && (p == null || p(w)), n === o.TRACK_EVENT) {
+        const { eventName: u, properties: $ } = w;
+        S(u, $);
       }
     };
-    return window.addEventListener("message", i), () => {
-      window.removeEventListener("message", i);
+    return window.addEventListener("message", r), () => {
+      window.removeEventListener("message", r);
     };
   }, [
     p,
     f,
     c,
     a,
-    D,
+    j,
     d,
-    O
+    S
   ]);
-  const M = w.isAdmin ? y : `${y}/play-game/${t.projectId}/${t.variant}${A ? `/${A}` : ""}`;
-  return /* @__PURE__ */ P("iframe", { ...L, ref: l, src: `${M}?version=2`, allow: "autoplay" });
+  const W = E.isAdmin ? g : `${g}/play-game/${t.projectId}/${t.variant}${A ? `/${A}` : ""}`;
+  return /* @__PURE__ */ h(U, { $height: "100%", $width: "100%", children: [
+    /* @__PURE__ */ v(C, { height: window.ReactNativeTopInset || 0 }),
+    /* @__PURE__ */ v("iframe", { ...V, ref: m, src: `${W}?version=2`, allow: "autoplay" }),
+    ";",
+    /* @__PURE__ */ v(C, { height: window.ReactNativeBottomInset || 0 })
+  ] });
 });
 export {
-  Z as WebView
+  X as WebView
 };
 //# sourceMappingURL=web-view.js.map

package/dist/features/circle-games/games/web-view/web-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"web-view.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view.tsx"],"sourcesContent":["declare global {\n  interface IReactNativeWebview {\n    postMessage: (data: string) => void;\n  }\n\n  interface Window {\n    ReactNativeWebView?: IReactNativeWebview;\n  }\n}\n\nimport type {\n  IInfoMessage,\n  ILessonWebGameProps,\n  IMessageProps,\n  IMultiplayerWebGameProps,\n  IPlayerStats,\n  IPuzzleWebGameProps,\n  ITableWebGameProps,\n  IVibrationPattern,\n  IWebViewProps,\n} from './web-view-types';\nimport type { ForwardedRef } from 'react';\n\nimport { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\n\nimport { useUIContext } from '../../../ui/context/context';\nimport { ALLOWED_ORIGIN } from './constants';\nimport { ProjectType, WebViewEvent } from './enums';\n\nexport const WebView = forwardRef((props: IWebViewProps, ref: ForwardedRef<HTMLIFrameElement>) => {\n  const {\n    baseUrl,\n    projectDetails,\n    playerDetails,\n    onGameLoad,\n    onGamePlayFinish,\n    handleInfoMessage,\n    onBack,\n    parentDomain,\n    ...rest\n  } = props;\n  const webViewRef = useRef<HTMLIFrameElement>(null);\n  const memoizedPlayerDetails = useMemo(() => playerDetails, [playerDetails]);\n  const memoizedProjectDetails = useMemo(() => projectDetails, [projectDetails]);\n\n  let miniGameIdentifier = '';\n  const { onEvent: trackEvent } = useUIContext();\n\n  if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n    miniGameIdentifier = (memoizedProjectDetails as ILessonWebGameProps).miniGameIdentifier;\n  }\n\n  const getProjectDetails = useCallback(() => {\n    const { enableCloseButton = true } = memoizedProjectDetails;\n\n    let payload = {\n      enableCloseButton,\n    } as IMultiplayerWebGameProps | IPuzzleWebGameProps | ILessonWebGameProps;\n\n    if (memoizedProjectDetails.projectType === ProjectType.GAME) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IMultiplayerWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.PUZZLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IPuzzleWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ILessonWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.TABLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ITableWebGameProps;\n    }\n\n    return payload;\n  }, [memoizedProjectDetails]);\n\n  const sendGamesData = useCallback(() => {\n    const payload = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.GAME_DATA,\n        payload,\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [getProjectDetails]);\n\n  const setConfig = useCallback(() => {\n    const projectConfig = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.SET_CONFIG,\n        payload: {\n          user: memoizedPlayerDetails,\n          projectConfig,\n          parentDomain,\n        },\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [memoizedPlayerDetails, getProjectDetails, parentDomain]);\n\n  useImperativeHandle(ref, () => webViewRef.current as HTMLIFrameElement, []);\n\n  useEffect(() => {\n    const handleMessage = (e: MessageEvent) => {\n      const data: string = e.data;\n      const parsedData = typeof data === 'string' ? JSON.parse(data) : (data as IMessageProps);\n\n      const { event, payload = null } = parsedData;\n\n      if (event === WebViewEvent.VIBRATE) {\n        const { pattern } = payload as IVibrationPattern;\n\n        if (window.ReactNativeWebView) {\n          window.ReactNativeWebView.postMessage(JSON.stringify(parsedData));\n        } else {\n          window.navigator.vibrate?.(pattern);\n        }\n      }\n\n      if (event === WebViewEvent.GAME_BACK) {\n        onBack?.();\n      }\n\n      if (event === WebViewEvent.HIDE_LOADER) {\n        onGameLoad?.();\n      }\n\n      if (event === WebViewEvent.LOAD_DATA_FROM_APP) {\n        sendGamesData?.();\n      }\n\n      if (event === WebViewEvent.GET_CONFIG) {\n        setConfig();\n      }\n\n      if (event === WebViewEvent.UPDATE_STATS) {\n        onGamePlayFinish?.(payload as IPlayerStats);\n      }\n\n      if (event === WebViewEvent.SHOW_SNACKBAR) {\n        handleInfoMessage?.(payload as IInfoMessage);\n      }\n\n      if (event === WebViewEvent.TRACK_EVENT) {\n        const { eventName, properties } = payload;\n\n        trackEvent(eventName, properties);\n      }\n    };\n\n    window.addEventListener('message', handleMessage);\n\n    return () => {\n      window.removeEventListener('message', handleMessage);\n    };\n  }, [\n    handleInfoMessage,\n    onBack,\n    onGamePlayFinish,\n    onGameLoad,\n    setConfig,\n    sendGamesData,\n    trackEvent,\n  ]);\n\n  const url = playerDetails.isAdmin\n    ? baseUrl\n    : `${baseUrl}/play-game/${memoizedProjectDetails.projectId}/${memoizedProjectDetails.variant}${\n        miniGameIdentifier ? `/${miniGameIdentifier}` : ''\n      }`;\n\n  return <iframe {...rest} ref={webViewRef} src={`${url}?version=2`} allow=\"autoplay\" />;\n});\n"],"names":["WebView","forwardRef","props","ref","baseUrl","projectDetails","playerDetails","onGameLoad","onGamePlayFinish","handleInfoMessage","onBack","parentDomain","rest","webViewRef","useRef","memoizedPlayerDetails","useMemo","memoizedProjectDetails","miniGameIdentifier","trackEvent","useUIContext","ProjectType","getProjectDetails","useCallback","enableCloseButton","payload","sendGamesData","_b","_a","WebViewEvent","ALLOWED_ORIGIN","setConfig","projectConfig","useImperativeHandle","useEffect","handleMessage","data","parsedData","event","pattern","eventName","properties","url","jsx"],"mappings":";;;;;;AA6BO,MAAMA,IAAUC,EAAW,CAACC,GAAsBC,MAAyC;AAC1F,QAAA;AAAA,IACJ,SAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,QAAAC;AAAA,IACA,cAAAC;AAAA,IACA,GAAGC;AAAA,EACD,IAAAV,GACEW,IAAaC,EAA0B,IAAI,GAC3CC,IAAwBC,EAAQ,MAAMV,GAAe,CAACA,CAAa,CAAC,GACpEW,IAAyBD,EAAQ,MAAMX,GAAgB,CAACA,CAAc,CAAC;AAE7E,MAAIa,IAAqB;AACzB,QAAM,EAAE,SAASC,EAAW,IAAIC,EAAa;AAEzC,EAAAH,EAAuB,gBAAgBI,EAAY,WACrDH,IAAsBD,EAA+C;AAGjE,QAAAK,IAAoBC,EAAY,MAAM;AACpC,UAAA,EAAE,mBAAAC,IAAoB,GAAS,IAAAP;AAErC,QAAIQ,IAAU;AAAA,MACZ,mBAAAD;AAAA,IAAA;AAGE,WAAAP,EAAuB,gBAAgBI,EAAY,SAC3CI,IAAA;AAAA,MACR,GAAGA;AAAA,MACH,GAAGR;AAAA,IAAA,IAIHA,EAAuB,gBAAgBI,EAAY,WAC3CI,IAAA;AAAA,MACR,GAAGA;AAAA,MACH,GAAGR;AAAA,IAAA,IAIHA,EAAuB,gBAAgBI,EAAY,WAC3CI,IAAA;AAAA,MACR,GAAGA;AAAA,MACH,GAAGR;AAAA,IAAA,IAIHA,EAAuB,gBAAgBI,EAAY,UAC3CI,IAAA;AAAA,MACR,GAAGA;AAAA,MACH,GAAGR;AAAA,IAAA,IAIAQ;AAAA,EAAA,GACN,CAACR,CAAsB,CAAC,GAErBS,IAAgBH,EAAY,MAAM;;AACtC,UAAME,IAAUH;AAEhB,KAAAK,KAAAC,IAAAf,EAAW,YAAX,gBAAAe,EAAoB,kBAApB,QAAAD,EAAmC;AAAA,MACjC,KAAK,UAAU;AAAA,QACb,OAAOE,EAAa;AAAA,QACpB,SAAAJ;AAAA,MAAA,CACD;AAAA,MACDK;AAAA;AAAA,EACF,GACC,CAACR,CAAiB,CAAC,GAEhBS,IAAYR,EAAY,MAAM;;AAClC,UAAMS,IAAgBV;AAEtB,KAAAK,KAAAC,IAAAf,EAAW,YAAX,gBAAAe,EAAoB,kBAApB,QAAAD,EAAmC;AAAA,MACjC,KAAK,UAAU;AAAA,QACb,OAAOE,EAAa;AAAA,QACpB,SAAS;AAAA,UACP,MAAMd;AAAA,UACN,eAAAiB;AAAA,UACA,cAAArB;AAAA,QACF;AAAA,MAAA,CACD;AAAA,MACDmB;AAAA;AAAA,EAED,GAAA,CAACf,GAAuBO,GAAmBX,CAAY,CAAC;AAE3D,EAAAsB,EAAoB9B,GAAK,MAAMU,EAAW,SAA8B,CAAE,CAAA,GAE1EqB,EAAU,MAAM;AACR,UAAAC,IAAgB,CAAC,MAAoB;;AACzC,YAAMC,IAAe,EAAE,MACjBC,IAAa,OAAOD,KAAS,WAAW,KAAK,MAAMA,CAAI,IAAKA,GAE5D,EAAE,OAAAE,GAAO,SAAAb,IAAU,KAAA,IAASY;AAE9B,UAAAC,MAAUT,EAAa,SAAS;AAC5B,cAAA,EAAE,SAAAU,EAAY,IAAAd;AAEpB,QAAI,OAAO,qBACT,OAAO,mBAAmB,YAAY,KAAK,UAAUY,CAAU,CAAC,KAEzDV,KAAAC,IAAA,OAAA,WAAU,YAAV,QAAAD,EAAA,KAAAC,GAAoBW;AAAA,MAE/B;AA0BI,UAxBAD,MAAUT,EAAa,cAChBnB,KAAA,QAAAA,MAGP4B,MAAUT,EAAa,gBACZtB,KAAA,QAAAA,MAGX+B,MAAUT,EAAa,uBACTH,KAAA,QAAAA,MAGdY,MAAUT,EAAa,cACfE,KAGRO,MAAUT,EAAa,iBACzBrB,KAAA,QAAAA,EAAmBiB,KAGjBa,MAAUT,EAAa,kBACzBpB,KAAA,QAAAA,EAAoBgB,KAGlBa,MAAUT,EAAa,aAAa;AAChC,cAAA,EAAE,WAAAW,GAAW,YAAAC,EAAe,IAAAhB;AAElC,QAAAN,EAAWqB,GAAWC,CAAU;AAAA,MAClC;AAAA,IAAA;AAGK,kBAAA,iBAAiB,WAAWN,CAAa,GAEzC,MAAM;AACJ,aAAA,oBAAoB,WAAWA,CAAa;AAAA,IAAA;AAAA,EACrD,GACC;AAAA,IACD1B;AAAA,IACAC;AAAA,IACAF;AAAA,IACAD;AAAA,IACAwB;AAAA,IACAL;AAAA,IACAP;AAAA,EAAA,CACD;AAED,QAAMuB,IAAMpC,EAAc,UACtBF,IACA,GAAGA,CAAO,cAAca,EAAuB,SAAS,IAAIA,EAAuB,OAAO,GACxFC,IAAqB,IAAIA,CAAkB,KAAK,EAClD;AAEG,SAAA,gBAAAyB,EAAC,UAAQ,EAAA,GAAG/B,GAAM,KAAKC,GAAY,KAAK,GAAG6B,CAAG,cAAc,OAAM,WAAW,CAAA;AACtF,CAAC;"}
+{"version":3,"file":"web-view.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view.tsx"],"sourcesContent":["import type {\n  IInfoMessage,\n  ILessonWebGameProps,\n  IMessageProps,\n  IMultiplayerWebGameProps,\n  IPlayerStats,\n  IPuzzleWebGameProps,\n  ITableWebGameProps,\n  IVibrationPattern,\n  IWebViewProps,\n} from './web-view-types';\nimport type { ForwardedRef } from 'react';\n\nimport { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\n\nimport { useUIContext } from '../../../ui/context/context';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport { ALLOWED_ORIGIN } from './constants';\nimport { ProjectType, WebViewEvent } from './enums';\n\nexport const WebView = forwardRef((props: IWebViewProps, ref: ForwardedRef<HTMLIFrameElement>) => {\n  const {\n    baseUrl,\n    projectDetails,\n    playerDetails,\n    onGameLoad,\n    onGamePlayFinish,\n    handleInfoMessage,\n    onBack,\n    parentDomain,\n    ...rest\n  } = props;\n  const webViewRef = useRef<HTMLIFrameElement>(null);\n  const memoizedPlayerDetails = useMemo(() => playerDetails, [playerDetails]);\n  const memoizedProjectDetails = useMemo(() => projectDetails, [projectDetails]);\n\n  let miniGameIdentifier = '';\n  const { onEvent: trackEvent } = useUIContext();\n\n  if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n    miniGameIdentifier = (memoizedProjectDetails as ILessonWebGameProps).miniGameIdentifier;\n  }\n\n  const getProjectDetails = useCallback(() => {\n    const { enableCloseButton = true } = memoizedProjectDetails;\n\n    let payload = {\n      enableCloseButton,\n    } as IMultiplayerWebGameProps | IPuzzleWebGameProps | ILessonWebGameProps;\n\n    if (memoizedProjectDetails.projectType === ProjectType.GAME) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IMultiplayerWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.PUZZLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IPuzzleWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ILessonWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.TABLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ITableWebGameProps;\n    }\n\n    return payload;\n  }, [memoizedProjectDetails]);\n\n  const sendGamesData = useCallback(() => {\n    const payload = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.GAME_DATA,\n        payload,\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [getProjectDetails]);\n\n  const setConfig = useCallback(() => {\n    const projectConfig = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.SET_CONFIG,\n        payload: {\n          user: memoizedPlayerDetails,\n          projectConfig,\n          parentDomain,\n        },\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [memoizedPlayerDetails, getProjectDetails, parentDomain]);\n\n  useImperativeHandle(ref, () => webViewRef.current as HTMLIFrameElement, []);\n\n  useEffect(() => {\n    const handleMessage = (e: MessageEvent) => {\n      const data: string = e.data;\n      const parsedData = typeof data === 'string' ? JSON.parse(data) : (data as IMessageProps);\n\n      const { event, payload = null } = parsedData;\n\n      if (event === WebViewEvent.VIBRATE) {\n        const { pattern } = payload as IVibrationPattern;\n\n        if (window.ReactNativeWebView) {\n          window.ReactNativeWebView.postMessage(JSON.stringify(parsedData));\n        } else {\n          window.navigator.vibrate?.(pattern);\n        }\n      }\n\n      if (event === WebViewEvent.GAME_BACK) {\n        onBack?.();\n      }\n\n      if (event === WebViewEvent.HIDE_LOADER) {\n        onGameLoad?.();\n      }\n\n      if (event === WebViewEvent.LOAD_DATA_FROM_APP) {\n        sendGamesData?.();\n      }\n\n      if (event === WebViewEvent.GET_CONFIG) {\n        setConfig();\n      }\n\n      if (event === WebViewEvent.UPDATE_STATS) {\n        onGamePlayFinish?.(payload as IPlayerStats);\n      }\n\n      if (event === WebViewEvent.SHOW_SNACKBAR) {\n        handleInfoMessage?.(payload as IInfoMessage);\n      }\n\n      if (event === WebViewEvent.TRACK_EVENT) {\n        const { eventName, properties } = payload;\n\n        trackEvent(eventName, properties);\n      }\n    };\n\n    window.addEventListener('message', handleMessage);\n\n    return () => {\n      window.removeEventListener('message', handleMessage);\n    };\n  }, [\n    handleInfoMessage,\n    onBack,\n    onGamePlayFinish,\n    onGameLoad,\n    setConfig,\n    sendGamesData,\n    trackEvent,\n  ]);\n\n  const url = playerDetails.isAdmin\n    ? baseUrl\n    : `${baseUrl}/play-game/${memoizedProjectDetails.projectId}/${memoizedProjectDetails.variant}${\n        miniGameIdentifier ? `/${miniGameIdentifier}` : ''\n      }`;\n\n  return (\n    <FlexView $height=\"100%\" $width=\"100%\">\n      <Separator height={window.ReactNativeTopInset || 0} />\n      <iframe {...rest} ref={webViewRef} src={`${url}?version=2`} allow=\"autoplay\" />;\n      <Separator height={window.ReactNativeBottomInset || 0} />\n    </FlexView>\n  );\n});\n"],"names":["WebView","forwardRef","props","ref","baseUrl","projectDetails","playerDetails","onGameLoad","onGamePlayFinish","handleInfoMessage","onBack","parentDomain","rest","webViewRef","useRef","memoizedPlayerDetails","useMemo","memoizedProjectDetails","miniGameIdentifier","trackEvent","useUIContext","ProjectType","getProjectDetails","useCallback","enableCloseButton","payload","sendGamesData","_b","_a","WebViewEvent","ALLOWED_ORIGIN","setConfig","projectConfig","useImperativeHandle","useEffect","handleMessage","data","parsedData","event","pattern","eventName","properties","url","jsxs","FlexView","jsx","Separator"],"mappings":"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"}

package/dist/features/circle-games/leaderboard/comps/banner/banner.js

@@ -1,19 +1,19 @@
 import { jsxs as n, jsx as r } from "react/jsx-runtime";
-import { memo as d } from "react";
+import { memo as l } from "react";
 import h from "../../../../ui/lottie-animation/lottie-animation.js";
 import p from "../../../../ui/separator/separator.js";
 import o from "../../../../ui/text/text.js";
 import { BannerContainer as f, CircleLottieView as x, BannerTextContainer as T, CountTextWrapper as C } from "./banner-styled.js";
-const $ = { renderer: "canvas" }, H = d(
+const $ = { renderer: "canvas" }, v = l(
   ({
     primaryText: i,
     secondaryText: t,
-    topInset: e = 0,
+    topInset: e = window.ReactNativeTopInset || 0,
     isLoading: a = !1,
     lottiePath: m,
     bgFromTopPosition: c = 0,
     bgFromRightPosition: s = 0,
-    custEle: l
+    custEle: d
   }) => /* @__PURE__ */ n(f, { topInset: e, children: [
     /* @__PURE__ */ r(
       x,
@@ -30,11 +30,11 @@ const $ = { renderer: "canvas" }, H = d(
         /* @__PURE__ */ r(p, { height: 4 }),
         /* @__PURE__ */ r(o, { $renderAs: "ah4", $color: "WHITE", children: a ? "__" : t })
       ] }),
-      l
+      d
     ] })
   ] })
 );
 export {
-  H as Banner
+  v as Banner
 };
 //# sourceMappingURL=banner.js.map

package/dist/features/circle-games/leaderboard/comps/banner/banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"banner.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/banner/banner.tsx"],"sourcesContent":["import type { IBannerProps } from './banner-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './banner-styled';\n\nconst animationSettings = { renderer: 'canvas' };\n\nexport const Banner: FC<IBannerProps> = memo(\n  ({\n    primaryText,\n    secondaryText,\n    topInset = 0,\n    isLoading = false,\n    lottiePath,\n    bgFromTopPosition = 0,\n    bgFromRightPosition = 0,\n    custEle,\n  }) => (\n    <Styled.BannerContainer topInset={topInset}>\n      <Styled.CircleLottieView\n        topInset={topInset}\n        bgFromTopPosition={bgFromTopPosition}\n        bgFromRightPosition={bgFromRightPosition}\n      >\n        <LottieAnimation src={lottiePath} settings={animationSettings} />\n      </Styled.CircleLottieView>\n\n      <Styled.BannerTextContainer>\n        <Styled.CountTextWrapper topInset={topInset}>\n          <Text $renderAs=\"ac4\" $color=\"WHITE\">\n            {primaryText}\n          </Text>\n          <Separator height={4} />\n          <Text $renderAs=\"ah4\" $color=\"WHITE\">\n            {isLoading ? '__' : secondaryText}\n          </Text>\n        </Styled.CountTextWrapper>\n\n        {custEle}\n      </Styled.BannerTextContainer>\n    </Styled.BannerContainer>\n  ),\n);\n"],"names":["animationSettings","Banner","memo","primaryText","secondaryText","topInset","isLoading","lottiePath","bgFromTopPosition","bgFromRightPosition","custEle","jsxs","Styled.BannerContainer","jsx","Styled.CircleLottieView","LottieAnimation","Styled.BannerTextContainer","Styled.CountTextWrapper","Text","Separator"],"mappings":";;;;;;AAUA,MAAMA,IAAoB,EAAE,UAAU,YAEzBC,IAA2BC;AAAA,EACtC,CAAC;AAAA,IACC,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,mBAAAC,IAAoB;AAAA,IACpB,qBAAAC,IAAsB;AAAA,IACtB,SAAAC;AAAA,EAEA,MAAA,gBAAAC,EAACC,GAAA,EAAuB,UAAAP,GACtB,UAAA;AAAA,IAAA,gBAAAQ;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,UAAAT;AAAA,QACA,mBAAAG;AAAA,QACA,qBAAAC;AAAA,QAEA,UAAC,gBAAAI,EAAAE,GAAA,EAAgB,KAAKR,GAAY,UAAUP,GAAmB;AAAA,MAAA;AAAA,IACjE;AAAA,IAEA,gBAAAW,EAACK,GAAA,EACC,UAAA;AAAA,MAAC,gBAAAL,EAAAM,GAAA,EAAwB,UAAAZ,GACvB,UAAA;AAAA,QAAA,gBAAAQ,EAACK,GAAK,EAAA,WAAU,OAAM,QAAO,SAC1B,UACHf,GAAA;AAAA,QACA,gBAAAU,EAACM,GAAU,EAAA,QAAQ,EAAG,CAAA;AAAA,QACtB,gBAAAN,EAACK,KAAK,WAAU,OAAM,QAAO,SAC1B,UAAAZ,IAAY,OAAOF,EACtB,CAAA;AAAA,MAAA,GACF;AAAA,MAECM;AAAA,IAAA,GACH;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"banner.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/banner/banner.tsx"],"sourcesContent":["import type { IBannerProps } from './banner-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './banner-styled';\n\nconst animationSettings = { renderer: 'canvas' };\n\nexport const Banner: FC<IBannerProps> = memo(\n  ({\n    primaryText,\n    secondaryText,\n    topInset = window.ReactNativeTopInset || 0,\n    isLoading = false,\n    lottiePath,\n    bgFromTopPosition = 0,\n    bgFromRightPosition = 0,\n    custEle,\n  }) => (\n    <Styled.BannerContainer topInset={topInset}>\n      <Styled.CircleLottieView\n        topInset={topInset}\n        bgFromTopPosition={bgFromTopPosition}\n        bgFromRightPosition={bgFromRightPosition}\n      >\n        <LottieAnimation src={lottiePath} settings={animationSettings} />\n      </Styled.CircleLottieView>\n\n      <Styled.BannerTextContainer>\n        <Styled.CountTextWrapper topInset={topInset}>\n          <Text $renderAs=\"ac4\" $color=\"WHITE\">\n            {primaryText}\n          </Text>\n          <Separator height={4} />\n          <Text $renderAs=\"ah4\" $color=\"WHITE\">\n            {isLoading ? '__' : secondaryText}\n          </Text>\n        </Styled.CountTextWrapper>\n\n        {custEle}\n      </Styled.BannerTextContainer>\n    </Styled.BannerContainer>\n  ),\n);\n"],"names":["animationSettings","Banner","memo","primaryText","secondaryText","topInset","isLoading","lottiePath","bgFromTopPosition","bgFromRightPosition","custEle","jsxs","Styled.BannerContainer","jsx","Styled.CircleLottieView","LottieAnimation","Styled.BannerTextContainer","Styled.CountTextWrapper","Text","Separator"],"mappings":";;;;;;AAUA,MAAMA,IAAoB,EAAE,UAAU,YAEzBC,IAA2BC;AAAA,EACtC,CAAC;AAAA,IACC,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC,IAAW,OAAO,uBAAuB;AAAA,IACzC,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,mBAAAC,IAAoB;AAAA,IACpB,qBAAAC,IAAsB;AAAA,IACtB,SAAAC;AAAA,EAEA,MAAA,gBAAAC,EAACC,GAAA,EAAuB,UAAAP,GACtB,UAAA;AAAA,IAAA,gBAAAQ;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,UAAAT;AAAA,QACA,mBAAAG;AAAA,QACA,qBAAAC;AAAA,QAEA,UAAC,gBAAAI,EAAAE,GAAA,EAAgB,KAAKR,GAAY,UAAUP,GAAmB;AAAA,MAAA;AAAA,IACjE;AAAA,IAEA,gBAAAW,EAACK,GAAA,EACC,UAAA;AAAA,MAAC,gBAAAL,EAAAM,GAAA,EAAwB,UAAAZ,GACvB,UAAA;AAAA,QAAA,gBAAAQ,EAACK,GAAK,EAAA,WAAU,OAAM,QAAO,SAC1B,UACHf,GAAA;AAAA,QACA,gBAAAU,EAACM,GAAU,EAAA,QAAQ,EAAG,CAAA;AAAA,QACtB,gBAAAN,EAACK,KAAK,WAAU,OAAM,QAAO,SAC1B,UAAAZ,IAAY,OAAOF,EACtB,CAAA;AAAA,MAAA,GACF;AAAA,MAECM;AAAA,IAAA,GACH;AAAA,EAAA,GACF;AAEJ;"}

package/dist/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.js

@@ -7,7 +7,7 @@ const i = o.div`
   left: ${({ align: t = "left" }) => t === "left" ? "20px" : "unset"};
   right: ${({ align: t = "left" }) => t === "right" ? "20px" : "unset"};
   z-index: 10;
-  bottom: 50px;
+  bottom: ${(window.ReactNativeBottomInset || 0) + 50}px;
 `;
 export {
   n as ExtendedIconButton,

package/dist/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-button-styled.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const NavigationActionWrapper = styled.div`\n  position: relative;\n  width: 100%;\n`;\n\nexport const ExtendedIconButton = styled.div<{ align?: 'left' | 'right' }>`\n  position: absolute;\n  left: ${({ align = 'left' }) => (align === 'left' ? '20px' : 'unset')};\n  right: ${({ align = 'left' }) => (align === 'right' ? '20px' : 'unset')};\n  z-index: 10;\n  bottom: 50px;\n`;\n"],"names":["NavigationActionWrapper","styled","ExtendedIconButton","align"],"mappings":";AAEO,MAAMA,IAA0BC,EAAO;AAAA;AAAA;AAAA,GAKjCC,IAAqBD,EAAO;AAAA;AAAA,UAE/B,CAAC,EAAE,OAAAE,IAAQ,OAAA,MAAcA,MAAU,SAAS,SAAS,OAAQ;AAAA,WAC5D,CAAC,EAAE,OAAAA,IAAQ,OAAA,MAAcA,MAAU,UAAU,SAAS,OAAQ;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"navigation-button-styled.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const NavigationActionWrapper = styled.div`\n  position: relative;\n  width: 100%;\n`;\n\nexport const ExtendedIconButton = styled.div<{ align?: 'left' | 'right' }>`\n  position: absolute;\n  left: ${({ align = 'left' }) => (align === 'left' ? '20px' : 'unset')};\n  right: ${({ align = 'left' }) => (align === 'right' ? '20px' : 'unset')};\n  z-index: 10;\n  bottom: ${(window.ReactNativeBottomInset || 0) + 50}px;\n`;\n"],"names":["NavigationActionWrapper","styled","ExtendedIconButton","align"],"mappings":";AAEO,MAAMA,IAA0BC,EAAO;AAAA;AAAA;AAAA,GAKjCC,IAAqBD,EAAO;AAAA;AAAA,UAE/B,CAAC,EAAE,OAAAE,IAAQ,OAAA,MAAcA,MAAU,SAAS,SAAS,OAAQ;AAAA,WAC5D,CAAC,EAAE,OAAAA,IAAQ,OAAA,MAAcA,MAAU,UAAU,SAAS,OAAQ;AAAA;AAAA,aAE5D,OAAO,0BAA0B,KAAK,EAAE;AAAA;"}

package/dist/features/circle-games/leaderboard/leaderboard-styled.js

@@ -25,7 +25,7 @@ const s = t.div`
   width: 100%;
   flex: 1;
   height: 100%;
-  padding-top: ${n}px;
+  padding-top: ${(window.ReactNativeTopInset || 0) + n}px;
   padding-bottom: ${i}px;
 `, m = t.div`
   position: absolute;

package/dist/features/circle-games/leaderboard/leaderboard-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"leaderboard-styled.js","sources":["../../../../src/features/circle-games/leaderboard/leaderboard-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ARC_BUTTON_BOTTOM_OFFSET } from '../../ui/arc-button/constants';\nimport FlexView from '../../ui/layout/flex-view';\nimport { BANNER_HEIGHT } from './comps/banner/constants';\n\nexport const Leaderboard = styled.div`\n  flex-direction: column;\n  overflow: hidden;\n  height: 100vh;\n  max-height: 100%;\n  position: relative;\n`;\n\nexport const LeaderboardContainer = styled.div`\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  height: 100%;\n  position: relative;\n  width: 100%;\n`;\n\nexport const BannerWrapper = styled.div`\n  position: absolute;\n  top: 0;\n  width: 100%;\n  z-index: 10;\n`;\n\nexport const ItemsWrapper = styled.div<{ topInset: number }>`\n  background: transparent;\n  position: absolute;\n  overflow: auto;\n  width: 100%;\n  flex: 1;\n  height: 100%;\n  padding-top: ${BANNER_HEIGHT}px;\n  padding-bottom: ${ARC_BUTTON_BOTTOM_OFFSET}px;\n`;\n\nexport const TournamentBannerCustContainer = styled.div`\n  position: absolute;\n  display: flex;\n  top: 5px;\n  right: -2px;\n  width: 200px;\n  height: 100%;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const ActionButtonWrapper = styled.div`\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n`;\n\nexport const TrophyWrapper = styled.div`\n  display: flex;\n  justify-content: center;\n  width: 150%;\n  height: 150%;\n`;\n\nexport const Banner = styled.div`\n  background: ${({ theme }) => theme.colors.YELLOW_6};\n  min-height: 32px;\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const InfoContainer = styled(FlexView)`\n  padding: 16px;\n`;\n"],"names":["Leaderboard","styled","LeaderboardContainer","theme","BannerWrapper","ItemsWrapper","BANNER_HEIGHT","ARC_BUTTON_BOTTOM_OFFSET","TournamentBannerCustContainer","ActionButtonWrapper","TrophyWrapper","Banner","FlexView"],"mappings":";;;;AAMO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQrBC,IAAuBD,EAAO;AAAA,gBAC3B,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA,GAMtCC,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBI,IAAeJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAOlBK,CAAa;AAAA,oBACVC,CAAwB;AAAA,GAG/BC,IAAgCP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWvCQ,IAAsBR,EAAO;AAAA;AAAA;AAAA;AAAA,GAM7BS,IAAgBT,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBU,IAASV,EAAO;AAAA,gBACb,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvBF,EAAOW,CAAQ;AAAA;AAAA;"}
+{"version":3,"file":"leaderboard-styled.js","sources":["../../../../src/features/circle-games/leaderboard/leaderboard-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ARC_BUTTON_BOTTOM_OFFSET } from '../../ui/arc-button/constants';\nimport FlexView from '../../ui/layout/flex-view';\nimport { BANNER_HEIGHT } from './comps/banner/constants';\n\nexport const Leaderboard = styled.div`\n  flex-direction: column;\n  overflow: hidden;\n  height: 100vh;\n  max-height: 100%;\n  position: relative;\n`;\n\nexport const LeaderboardContainer = styled.div`\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  height: 100%;\n  position: relative;\n  width: 100%;\n`;\n\nexport const BannerWrapper = styled.div`\n  position: absolute;\n  top: 0;\n  width: 100%;\n  z-index: 10;\n`;\n\nexport const ItemsWrapper = styled.div`\n  background: transparent;\n  position: absolute;\n  overflow: auto;\n  width: 100%;\n  flex: 1;\n  height: 100%;\n  padding-top: ${(window.ReactNativeTopInset || 0) + BANNER_HEIGHT}px;\n  padding-bottom: ${ARC_BUTTON_BOTTOM_OFFSET}px;\n`;\n\nexport const TournamentBannerCustContainer = styled.div`\n  position: absolute;\n  display: flex;\n  top: 5px;\n  right: -2px;\n  width: 200px;\n  height: 100%;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const ActionButtonWrapper = styled.div`\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n`;\n\nexport const TrophyWrapper = styled.div`\n  display: flex;\n  justify-content: center;\n  width: 150%;\n  height: 150%;\n`;\n\nexport const Banner = styled.div`\n  background: ${({ theme }) => theme.colors.YELLOW_6};\n  min-height: 32px;\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const InfoContainer = styled(FlexView)`\n  padding: 16px;\n`;\n"],"names":["Leaderboard","styled","LeaderboardContainer","theme","BannerWrapper","ItemsWrapper","BANNER_HEIGHT","ARC_BUTTON_BOTTOM_OFFSET","TournamentBannerCustContainer","ActionButtonWrapper","TrophyWrapper","Banner","FlexView"],"mappings":";;;;AAMO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQrBC,IAAuBD,EAAO;AAAA,gBAC3B,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA,GAMtCC,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBI,IAAeJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAOjB,OAAO,uBAAuB,KAAKK,CAAa;AAAA,oBAC9CC,CAAwB;AAAA,GAG/BC,IAAgCP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWvCQ,IAAsBR,EAAO;AAAA;AAAA;AAAA;AAAA,GAM7BS,IAAgBT,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBU,IAASV,EAAO;AAAA,gBACb,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvBF,EAAOW,CAAQ;AAAA;AAAA;"}

package/dist/features/circle-games/leaderboard/leaderboard.js

@@ -1,5 +1,5 @@
-import { jsx as e, jsxs as p } from "react/jsx-runtime";
-import { useState as a, useEffect as K } from "react";
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { useState as p, useEffect as K } from "react";
 import { ILLUSTRATIONS as w } from "../../../assets/illustrations/illustrations.js";
 import { LOTTIE as d } from "../../../assets/lottie/lottie.js";
 import { CircularLoader as U } from "../../ui/loader/circular-loader/circular-loader.js";
@@ -39,12 +39,12 @@ const L = {
   streakInfo: l
 }) => {
   var y, A, R, S, B, C, x, P;
-  const [i, I] = a(
+  const [i, I] = p(
     o.findIndex((t) => u === t.type)
-  ), [n, k] = a(((y = m == null ? void 0 : m[u]) == null ? void 0 : y.leaderboardPlayers) || []), [h, N] = a({
+  ), [n, k] = p(((y = m == null ? void 0 : m[u]) == null ? void 0 : y.leaderboardPlayers) || []), [h, N] = p({
     current: 0,
     end: 0
-  }), [O, f] = V(0), [c, Y] = a(!1), F = (A = n == null ? void 0 : n[0]) == null ? void 0 : A.points, $ = ((R = n == null ? void 0 : n[0]) == null ? void 0 : R.streakDays) || 0, { playButtonSound: _ } = q(), j = () => {
+  }), [O, f] = V(0), [c, Y] = p(!1), F = (A = n == null ? void 0 : n[0]) == null ? void 0 : A.points, $ = ((R = n == null ? void 0 : n[0]) == null ? void 0 : R.streakDays) || 0, { playButtonSound: _ } = q(), j = () => {
     _(), I((t) => t - 1 < 0 ? o.length - 1 : t - 1);
   }, v = () => {
     _(), I((t) => t + 1 === o.length ? 0 : t + 1);
@@ -61,8 +61,8 @@ const L = {
         end: s.endTimestamp
       }), s.currentTimestamp > s.endTimestamp && (g.splice(10), Y(!0))), k([...g]);
     }
-  }, [i, m]), /* @__PURE__ */ e(X, { children: /* @__PURE__ */ p(Z, { children: [
-    /* @__PURE__ */ p(D, { children: [
+  }, [i, m]), /* @__PURE__ */ e(X, { children: /* @__PURE__ */ a(Z, { children: [
+    /* @__PURE__ */ a(D, { children: [
       ((S = o[i]) == null ? void 0 : S.type) === r.BI_WEEKLY && /* @__PURE__ */ e(
         E,
         {
@@ -70,7 +70,7 @@ const L = {
           bgFromTopPosition: -120,
           bgFromRightPosition: -110,
           primaryText: c ? /* @__PURE__ */ e("span", { children: "New Tournament" }) : /* @__PURE__ */ e("span", { children: "Tournament" }),
-          secondaryText: c ? /* @__PURE__ */ e("span", { children: "Starts Soon" }) : /* @__PURE__ */ p("span", { children: [
+          secondaryText: c ? /* @__PURE__ */ e("span", { children: "Starts Soon" }) : /* @__PURE__ */ a("span", { children: [
             " ",
             /* @__PURE__ */ e(
               Q,
@@ -110,7 +110,7 @@ const L = {
       )
     ] }),
     T && /* @__PURE__ */ e(U, {}),
-    !T && n && /* @__PURE__ */ p(te, { topInset: 0, children: [
+    !T && n && /* @__PURE__ */ a(te, { children: [
       ((x = o[i]) == null ? void 0 : x.type) === r.ALL_TIME_STREAK && /* @__PURE__ */ e(
         J,
         {

package/dist/features/circle-games/leaderboard/leaderboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"leaderboard.js","sources":["../../../../src/features/circle-games/leaderboard/leaderboard.tsx"],"sourcesContent":["import type {\n  ILeaderboardPlayerWithPoints,\n  ILeaderboardPlayerWithStreak,\n} from './dal/use-get-leaderboard-dal/use-get-leaderboard-dal-types';\nimport type { ILeaderboardProps } from './leaderboard-types';\n\nimport { useEffect, useState } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport { CircularLoader } from '../../ui/loader/circular-loader/circular-loader';\nimport Text from '../../ui/text/text';\nimport { useCircleSounds } from '../hooks/use-circle-sounds/use-circle-sounds';\nimport { Banner } from './comps/banner/banner';\nimport { LeaderboardItemWithObserver } from './comps/leaderboard-item/leaderboard-item';\nimport { NavigationButton } from './comps/navigation-button/navigation-button';\nimport { StreakReductionInfoBar } from './comps/streak-reduction-infobar/streak-reduction-infobar';\nimport { Timer } from './comps/timer/timer';\nimport { ELeaderboardType } from './enums/leaderboard-type-enum';\nimport { useTimer } from './hooks/use-timer/use-timer';\nimport * as Styled from './leaderboard-styled';\n\nconst BANNER_LOTTIES: Record<ELeaderboardType, string> = {\n  [ELeaderboardType.ALL_TIME_STREAK]: LOTTIE.ELITE_CIRCLE,\n  [ELeaderboardType.ALL_TIME]: LOTTIE.ELITE_CIRCLE,\n  [ELeaderboardType.BI_WEEKLY]: LOTTIE.TOURNAMENT_RIPPLE,\n};\n\nconst leaderboards = [\n  {\n    name: 'TOURNAMENT',\n    type: ELeaderboardType.BI_WEEKLY,\n  },\n  {\n    name: 'STREAK STARS',\n    type: ELeaderboardType.ALL_TIME_STREAK,\n  },\n  {\n    name: 'ALL TIME',\n    type: ELeaderboardType.ALL_TIME,\n  },\n];\n\nexport const Leaderboard = ({\n  leaderboardData,\n  type = ELeaderboardType.BI_WEEKLY,\n  userId,\n  onClose,\n  isLoading,\n  streakInfo,\n}: ILeaderboardProps) => {\n  const [currentLeaderBoardIndex, setCurrentLeaderboardIndex] = useState(\n    leaderboards.findIndex(leaderboard => type === leaderboard.type),\n  );\n\n  const [currLeaderboardData, setCurrLeaderboardData] = useState<\n    (ILeaderboardPlayerWithPoints | ILeaderboardPlayerWithStreak)[] | []\n  >(leaderboardData?.[type]?.leaderboardPlayers || []);\n\n  const [currLeaderboardTimeStamps, setCurrLeaderboardTimeStamps] = useState<{\n    current: number;\n    end: number;\n  }>({\n    current: 0,\n    end: 0,\n  });\n\n  const [time, setTimer] = useTimer(0);\n  const [isTournamentEnded, setIsTournamentEnded] = useState(false);\n  const maxPoints = (currLeaderboardData?.[0] as ILeaderboardPlayerWithPoints)?.points;\n  const maxStreakDays = (currLeaderboardData?.[0] as ILeaderboardPlayerWithStreak)?.streakDays || 0;\n  const { playButtonSound } = useCircleSounds();\n\n  const handlePrevious = () => {\n    playButtonSound();\n    setCurrentLeaderboardIndex(prev => {\n      if (prev - 1 < 0) {\n        return leaderboards.length - 1;\n      }\n\n      return prev - 1;\n    });\n  };\n\n  const handleNext = () => {\n    playButtonSound();\n    setCurrentLeaderboardIndex(prev => {\n      if (prev + 1 === leaderboards.length) {\n        return 0;\n      }\n\n      return prev + 1;\n    });\n  };\n\n  useEffect(() => {\n    setTimer(0);\n  }, [setTimer]);\n\n  useEffect(() => {\n    const currType = leaderboards[currentLeaderBoardIndex]?.type;\n    const currLeaderboard = currType && leaderboardData?.[currType];\n\n    if (currLeaderboard) {\n      const leaderboardList = currLeaderboard.leaderboardPlayers || [];\n\n      if (currType === ELeaderboardType.BI_WEEKLY) {\n        setCurrLeaderboardTimeStamps({\n          current: currLeaderboard.currentTimestamp,\n          end: currLeaderboard.endTimestamp,\n        });\n\n        if (currLeaderboard.currentTimestamp > currLeaderboard.endTimestamp) {\n          leaderboardList.splice(10);\n          setIsTournamentEnded(true);\n        }\n      }\n\n      setCurrLeaderboardData([...leaderboardList]);\n    }\n  }, [currentLeaderBoardIndex, leaderboardData]);\n\n  return (\n    <Styled.Leaderboard>\n      <Styled.LeaderboardContainer>\n        <Styled.BannerWrapper>\n          {/* tournament banner */}\n          {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.BI_WEEKLY && (\n            <Banner\n              isLoading={isLoading || currLeaderboardData.length === 0}\n              bgFromTopPosition={-120}\n              bgFromRightPosition={-110}\n              primaryText={\n                isTournamentEnded ? <span>New Tournament</span> : <span>Tournament</span>\n              }\n              secondaryText={\n                isTournamentEnded ? (\n                  <span>Starts Soon</span>\n                ) : (\n                  <span>\n                    {' '}\n                    <Timer\n                      fromTimestamp={(time as number) + currLeaderboardTimeStamps.current}\n                      endTimestamp={currLeaderboardTimeStamps.end}\n                    />{' '}\n                    {'left'}\n                  </span>\n                )\n              }\n              lottiePath={BANNER_LOTTIES[ELeaderboardType.BI_WEEKLY]}\n              custEle={\n                <Styled.TournamentBannerCustContainer>\n                  <Styled.TrophyWrapper>\n                    <img src={ILLUSTRATIONS.TROPHY_CIRCLE} />\n                  </Styled.TrophyWrapper>\n                </Styled.TournamentBannerCustContainer>\n              }\n            />\n          )}\n\n          {/* top streak banner */}\n          {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.ALL_TIME_STREAK && (\n            <Banner\n              isLoading={isLoading}\n              bgFromTopPosition={-140}\n              bgFromRightPosition={-90}\n              primaryText={<span>Streak Stars</span>}\n              secondaryText={<span>Top 50</span>}\n              lottiePath={BANNER_LOTTIES[ELeaderboardType.ALL_TIME_STREAK]}\n            />\n          )}\n\n          {/* elite circle banner */}\n          {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.ALL_TIME && (\n            <Banner\n              isLoading={isLoading}\n              bgFromTopPosition={-140}\n              bgFromRightPosition={-90}\n              primaryText={<span>Elite Circle</span>}\n              secondaryText={<span>Top 50</span>}\n              lottiePath={BANNER_LOTTIES[ELeaderboardType.ALL_TIME]}\n            />\n          )}\n        </Styled.BannerWrapper>\n\n        {isLoading && <CircularLoader />}\n\n        {!isLoading && currLeaderboardData && (\n          <Styled.ItemsWrapper topInset={0}>\n            {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.ALL_TIME_STREAK && (\n              <StreakReductionInfoBar\n                startTimestampToday={streakInfo.startTimestampToday}\n                streakReduction={streakInfo.streakReduction}\n              />\n            )}\n            {isTournamentEnded &&\n              leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.BI_WEEKLY && (\n                <Styled.Banner>\n                  <Text $renderAs=\"ab3\" $color=\"WHITE\">\n                    Congratulating winners of the last tournament!\n                  </Text>\n                </Styled.Banner>\n              )}\n            {currLeaderboardData.map(player => {\n              return (\n                <LeaderboardItemWithObserver\n                  key={player.rank}\n                  player={player}\n                  rank={player.rank}\n                  maxStreakDays={maxStreakDays}\n                  maxPoints={maxPoints}\n                  leaderboardType={leaderboards[currentLeaderBoardIndex]?.type}\n                  isActive={player.userId === userId}\n                />\n              );\n            })}\n          </Styled.ItemsWrapper>\n        )}\n\n        <Styled.ActionButtonWrapper>\n          <NavigationButton\n            labels={Object.values(ELeaderboardType)}\n            onLeftClick={handlePrevious}\n            onRightClick={handleNext}\n            currIndex={currentLeaderBoardIndex}\n            onClose={onClose}\n            disableSwipe={isLoading || currLeaderboardData.length === 0}\n          />\n        </Styled.ActionButtonWrapper>\n      </Styled.LeaderboardContainer>\n    </Styled.Leaderboard>\n  );\n};\n"],"names":["BANNER_LOTTIES","ELeaderboardType","LOTTIE","leaderboards","Leaderboard","leaderboardData","type","userId","onClose","isLoading","streakInfo","currentLeaderBoardIndex","setCurrentLeaderboardIndex","useState","leaderboard","currLeaderboardData","setCurrLeaderboardData","_a","currLeaderboardTimeStamps","setCurrLeaderboardTimeStamps","time","setTimer","useTimer","isTournamentEnded","setIsTournamentEnded","maxPoints","_b","maxStreakDays","_c","playButtonSound","useCircleSounds","handlePrevious","prev","handleNext","useEffect","currType","currLeaderboard","leaderboardList","Styled.Leaderboard","jsxs","Styled.LeaderboardContainer","Styled.BannerWrapper","_d","jsx","Banner","Timer","Styled.TournamentBannerCustContainer","Styled.TrophyWrapper","ILLUSTRATIONS","_e","_f","CircularLoader","Styled.ItemsWrapper","_g","StreakReductionInfoBar","_h","Styled.Banner","Text","player","LeaderboardItemWithObserver","Styled.ActionButtonWrapper","NavigationButton"],"mappings":"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"}
+{"version":3,"file":"leaderboard.js","sources":["../../../../src/features/circle-games/leaderboard/leaderboard.tsx"],"sourcesContent":["import type {\n  ILeaderboardPlayerWithPoints,\n  ILeaderboardPlayerWithStreak,\n} from './dal/use-get-leaderboard-dal/use-get-leaderboard-dal-types';\nimport type { ILeaderboardProps } from './leaderboard-types';\n\nimport { useEffect, useState } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport { CircularLoader } from '../../ui/loader/circular-loader/circular-loader';\nimport Text from '../../ui/text/text';\nimport { useCircleSounds } from '../hooks/use-circle-sounds/use-circle-sounds';\nimport { Banner } from './comps/banner/banner';\nimport { LeaderboardItemWithObserver } from './comps/leaderboard-item/leaderboard-item';\nimport { NavigationButton } from './comps/navigation-button/navigation-button';\nimport { StreakReductionInfoBar } from './comps/streak-reduction-infobar/streak-reduction-infobar';\nimport { Timer } from './comps/timer/timer';\nimport { ELeaderboardType } from './enums/leaderboard-type-enum';\nimport { useTimer } from './hooks/use-timer/use-timer';\nimport * as Styled from './leaderboard-styled';\n\nconst BANNER_LOTTIES: Record<ELeaderboardType, string> = {\n  [ELeaderboardType.ALL_TIME_STREAK]: LOTTIE.ELITE_CIRCLE,\n  [ELeaderboardType.ALL_TIME]: LOTTIE.ELITE_CIRCLE,\n  [ELeaderboardType.BI_WEEKLY]: LOTTIE.TOURNAMENT_RIPPLE,\n};\n\nconst leaderboards = [\n  {\n    name: 'TOURNAMENT',\n    type: ELeaderboardType.BI_WEEKLY,\n  },\n  {\n    name: 'STREAK STARS',\n    type: ELeaderboardType.ALL_TIME_STREAK,\n  },\n  {\n    name: 'ALL TIME',\n    type: ELeaderboardType.ALL_TIME,\n  },\n];\n\nexport const Leaderboard = ({\n  leaderboardData,\n  type = ELeaderboardType.BI_WEEKLY,\n  userId,\n  onClose,\n  isLoading,\n  streakInfo,\n}: ILeaderboardProps) => {\n  const [currentLeaderBoardIndex, setCurrentLeaderboardIndex] = useState(\n    leaderboards.findIndex(leaderboard => type === leaderboard.type),\n  );\n\n  const [currLeaderboardData, setCurrLeaderboardData] = useState<\n    (ILeaderboardPlayerWithPoints | ILeaderboardPlayerWithStreak)[] | []\n  >(leaderboardData?.[type]?.leaderboardPlayers || []);\n\n  const [currLeaderboardTimeStamps, setCurrLeaderboardTimeStamps] = useState<{\n    current: number;\n    end: number;\n  }>({\n    current: 0,\n    end: 0,\n  });\n\n  const [time, setTimer] = useTimer(0);\n  const [isTournamentEnded, setIsTournamentEnded] = useState(false);\n  const maxPoints = (currLeaderboardData?.[0] as ILeaderboardPlayerWithPoints)?.points;\n  const maxStreakDays = (currLeaderboardData?.[0] as ILeaderboardPlayerWithStreak)?.streakDays || 0;\n  const { playButtonSound } = useCircleSounds();\n\n  const handlePrevious = () => {\n    playButtonSound();\n    setCurrentLeaderboardIndex(prev => {\n      if (prev - 1 < 0) {\n        return leaderboards.length - 1;\n      }\n\n      return prev - 1;\n    });\n  };\n\n  const handleNext = () => {\n    playButtonSound();\n    setCurrentLeaderboardIndex(prev => {\n      if (prev + 1 === leaderboards.length) {\n        return 0;\n      }\n\n      return prev + 1;\n    });\n  };\n\n  useEffect(() => {\n    setTimer(0);\n  }, [setTimer]);\n\n  useEffect(() => {\n    const currType = leaderboards[currentLeaderBoardIndex]?.type;\n    const currLeaderboard = currType && leaderboardData?.[currType];\n\n    if (currLeaderboard) {\n      const leaderboardList = currLeaderboard.leaderboardPlayers || [];\n\n      if (currType === ELeaderboardType.BI_WEEKLY) {\n        setCurrLeaderboardTimeStamps({\n          current: currLeaderboard.currentTimestamp,\n          end: currLeaderboard.endTimestamp,\n        });\n\n        if (currLeaderboard.currentTimestamp > currLeaderboard.endTimestamp) {\n          leaderboardList.splice(10);\n          setIsTournamentEnded(true);\n        }\n      }\n\n      setCurrLeaderboardData([...leaderboardList]);\n    }\n  }, [currentLeaderBoardIndex, leaderboardData]);\n\n  return (\n    <Styled.Leaderboard>\n      <Styled.LeaderboardContainer>\n        <Styled.BannerWrapper>\n          {/* tournament banner */}\n          {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.BI_WEEKLY && (\n            <Banner\n              isLoading={isLoading || currLeaderboardData.length === 0}\n              bgFromTopPosition={-120}\n              bgFromRightPosition={-110}\n              primaryText={\n                isTournamentEnded ? <span>New Tournament</span> : <span>Tournament</span>\n              }\n              secondaryText={\n                isTournamentEnded ? (\n                  <span>Starts Soon</span>\n                ) : (\n                  <span>\n                    {' '}\n                    <Timer\n                      fromTimestamp={(time as number) + currLeaderboardTimeStamps.current}\n                      endTimestamp={currLeaderboardTimeStamps.end}\n                    />{' '}\n                    {'left'}\n                  </span>\n                )\n              }\n              lottiePath={BANNER_LOTTIES[ELeaderboardType.BI_WEEKLY]}\n              custEle={\n                <Styled.TournamentBannerCustContainer>\n                  <Styled.TrophyWrapper>\n                    <img src={ILLUSTRATIONS.TROPHY_CIRCLE} />\n                  </Styled.TrophyWrapper>\n                </Styled.TournamentBannerCustContainer>\n              }\n            />\n          )}\n\n          {/* top streak banner */}\n          {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.ALL_TIME_STREAK && (\n            <Banner\n              isLoading={isLoading}\n              bgFromTopPosition={-140}\n              bgFromRightPosition={-90}\n              primaryText={<span>Streak Stars</span>}\n              secondaryText={<span>Top 50</span>}\n              lottiePath={BANNER_LOTTIES[ELeaderboardType.ALL_TIME_STREAK]}\n            />\n          )}\n\n          {/* elite circle banner */}\n          {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.ALL_TIME && (\n            <Banner\n              isLoading={isLoading}\n              bgFromTopPosition={-140}\n              bgFromRightPosition={-90}\n              primaryText={<span>Elite Circle</span>}\n              secondaryText={<span>Top 50</span>}\n              lottiePath={BANNER_LOTTIES[ELeaderboardType.ALL_TIME]}\n            />\n          )}\n        </Styled.BannerWrapper>\n\n        {isLoading && <CircularLoader />}\n\n        {!isLoading && currLeaderboardData && (\n          <Styled.ItemsWrapper>\n            {leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.ALL_TIME_STREAK && (\n              <StreakReductionInfoBar\n                startTimestampToday={streakInfo.startTimestampToday}\n                streakReduction={streakInfo.streakReduction}\n              />\n            )}\n            {isTournamentEnded &&\n              leaderboards[currentLeaderBoardIndex]?.type === ELeaderboardType.BI_WEEKLY && (\n                <Styled.Banner>\n                  <Text $renderAs=\"ab3\" $color=\"WHITE\">\n                    Congratulating winners of the last tournament!\n                  </Text>\n                </Styled.Banner>\n              )}\n            {currLeaderboardData.map(player => {\n              return (\n                <LeaderboardItemWithObserver\n                  key={player.rank}\n                  player={player}\n                  rank={player.rank}\n                  maxStreakDays={maxStreakDays}\n                  maxPoints={maxPoints}\n                  leaderboardType={leaderboards[currentLeaderBoardIndex]?.type}\n                  isActive={player.userId === userId}\n                />\n              );\n            })}\n          </Styled.ItemsWrapper>\n        )}\n\n        <Styled.ActionButtonWrapper>\n          <NavigationButton\n            labels={Object.values(ELeaderboardType)}\n            onLeftClick={handlePrevious}\n            onRightClick={handleNext}\n            currIndex={currentLeaderBoardIndex}\n            onClose={onClose}\n            disableSwipe={isLoading || currLeaderboardData.length === 0}\n          />\n        </Styled.ActionButtonWrapper>\n      </Styled.LeaderboardContainer>\n    </Styled.Leaderboard>\n  );\n};\n"],"names":["BANNER_LOTTIES","ELeaderboardType","LOTTIE","leaderboards","Leaderboard","leaderboardData","type","userId","onClose","isLoading","streakInfo","currentLeaderBoardIndex","setCurrentLeaderboardIndex","useState","leaderboard","currLeaderboardData","setCurrLeaderboardData","_a","currLeaderboardTimeStamps","setCurrLeaderboardTimeStamps","time","setTimer","useTimer","isTournamentEnded","setIsTournamentEnded","maxPoints","_b","maxStreakDays","_c","playButtonSound","useCircleSounds","handlePrevious","prev","handleNext","useEffect","currType","currLeaderboard","leaderboardList","Styled.Leaderboard","jsxs","Styled.LeaderboardContainer","Styled.BannerWrapper","_d","jsx","Banner","Timer","Styled.TournamentBannerCustContainer","Styled.TrophyWrapper","ILLUSTRATIONS","_e","_f","CircularLoader","Styled.ItemsWrapper","_g","StreakReductionInfoBar","_h","Styled.Banner","Text","player","LeaderboardItemWithObserver","Styled.ActionButtonWrapper","NavigationButton"],"mappings":"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"}

package/dist/features/circle-games/sign-up/comp/circular-steps/circular-steps-styled.js

@@ -59,11 +59,11 @@ const c = i.div`
   align-items: center;
   justify-content: center;
   color: ${({ theme: t }) => t.colors.WHITE};
-`, u = i.div`
+`, x = i.div`
   position: absolute;
   transform: translateY(-55px);
   z-index: 3;
-`, x = i.div`
+`, u = i.div`
   position: absolute;
   width: 100%;
   height: 100%;
@@ -77,10 +77,10 @@ const c = i.div`
   align-items: center;
   left: 0;
   right: 0;
-  bottom: 0;
-`, f = i.button`
+  bottom: ${window.ReactNativeBottomInset || 0}px;
+`, v = i.button`
   position: absolute;
-  top: 20px;
+  top: ${(window.ReactNativeTopInset || 0) + 20}px;
   left: 16px;
   outline: none;
   border: none;
@@ -90,14 +90,14 @@ const c = i.div`
 `;
 export {
   d as BackgroundImage,
-  x as CircularProgress,
+  u as CircularProgress,
   h as CircularProgressContainer,
   l as CircularStepsContainer,
   p as CircularStepsWrapper,
   c as CustEleContainer,
   g as CustomDataContainer,
-  u as Label,
+  x as Label,
   a as ScreenWrapper,
-  f as TransparentIconButton
+  v as TransparentIconButton
 };
 //# sourceMappingURL=circular-steps-styled.js.map