@cuemath/leap 3.2.23-as1 → 3.2.23-m

package/dist/features/wins-dashboard/belts-elements-stickers/progress-bar-horizontal.js

@@ -1,35 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import s from "styled-components";
-const a = s.div`
-  position: relative;
-  overflow: hidden;
-  background: ${({ $backgroundColor: r, theme: o }) => o.colors[r] || r};
-  width: 100%;
-  height: ${({ $height: r }) => `${r}px`};
-  border-radius: ${({ $height: r, $corners: o }) => o ? `${r / 2}px` : 0};
-`, $ = s.div`
-  position: absolute;
-  background: ${({ $backgroundColor: r, theme: o }) => o.colors[r] || r};
-  transition: width 300ms ease-in-out;
-  width: ${({ $progress: r }) => `${r}%`};
-  height: 100%;
-  border-radius: ${({ $borderRadius: r }) => r || 0}px;
-`, c = ({
-  borderRadius: r = 0,
-  height: o = 8,
-  progress: t,
-  corners: e = !0,
-  backgroundColor: d = "GREY_1",
-  progressColor: n = "GREY_4"
-}) => /* @__PURE__ */ i(a, { $height: o, $corners: e, $backgroundColor: d, children: /* @__PURE__ */ i(
-  $,
-  {
-    $progress: t,
-    $backgroundColor: n,
-    $borderRadius: r
-  }
-) });
-export {
-  c as default
-};
-//# sourceMappingURL=progress-bar-horizontal.js.map

package/dist/features/wins-dashboard/belts-elements-stickers/progress-bar-horizontal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"progress-bar-horizontal.js","sources":["../../../../src/features/wins-dashboard/belts-elements-stickers/progress-bar-horizontal.tsx"],"sourcesContent":["import type { TColorNames } from '../../ui/types';\n\nimport React from 'react';\nimport styled from 'styled-components';\n\nconst Background = styled.div<{\n  $backgroundColor: TColorNames | string;\n  $height: number;\n  $corners: boolean;\n}>`\n  position: relative;\n  overflow: hidden;\n  background: ${({ $backgroundColor, theme }) =>\n    theme.colors[$backgroundColor as TColorNames] || $backgroundColor};\n  width: 100%;\n  height: ${({ $height }) => `${$height}px`};\n  border-radius: ${({ $height, $corners }) => ($corners ? `${$height / 2}px` : 0)};\n`;\n\nconst Progress = styled.div<{\n  $backgroundColor: TColorNames | string;\n  $progress: number;\n  $borderRadius: number;\n}>`\n  position: absolute;\n  background: ${({ $backgroundColor, theme }) =>\n    theme.colors[$backgroundColor as TColorNames] || $backgroundColor};\n  transition: width 300ms ease-in-out;\n  width: ${({ $progress }) => `${$progress}%`};\n  height: 100%;\n  border-radius: ${({ $borderRadius }) => $borderRadius || 0}px;\n`;\n\ninterface ProgressBarHorizontalProps {\n  borderRadius?: number;\n  progress: number;\n  height?: number;\n  backgroundColor?: TColorNames | string;\n  progressColor?: TColorNames | string;\n  corners?: boolean;\n}\n\nconst ProgressBarHorizontal: React.FC<ProgressBarHorizontalProps> = ({\n  borderRadius = 0,\n  height = 8,\n  progress,\n  corners = true,\n  backgroundColor = 'GREY_1',\n  progressColor = 'GREY_4',\n}) => {\n  return (\n    <Background $height={height} $corners={corners} $backgroundColor={backgroundColor}>\n      <Progress\n        $progress={progress}\n        $backgroundColor={progressColor}\n        $borderRadius={borderRadius}\n      />\n    </Background>\n  );\n};\n\nexport default ProgressBarHorizontal;\n"],"names":["Background","styled","$backgroundColor","theme","$height","$corners","Progress","$progress","$borderRadius","ProgressBarHorizontal","borderRadius","height","progress","corners","backgroundColor","progressColor","jsx"],"mappings":";;AAKA,MAAMA,IAAaC,EAAO;AAAA;AAAA;AAAA,gBAOV,CAAC,EAAE,kBAAAC,GAAkB,OAAAC,QACjCA,EAAM,OAAOD,CAA+B,KAAKA,CAAgB;AAAA;AAAA,YAEzD,CAAC,EAAE,SAAAE,EAAc,MAAA,GAAGA,CAAO,IAAI;AAAA,mBACxB,CAAC,EAAE,SAAAA,GAAS,UAAAC,EAAS,MAAOA,IAAW,GAAGD,IAAU,CAAC,OAAO,CAAE;AAAA,GAG3EE,IAAWL,EAAO;AAAA;AAAA,gBAMR,CAAC,EAAE,kBAAAC,GAAkB,OAAAC,QACjCA,EAAM,OAAOD,CAA+B,KAAKA,CAAgB;AAAA;AAAA,WAE1D,CAAC,EAAE,WAAAK,EAAgB,MAAA,GAAGA,CAAS,GAAG;AAAA;AAAA,mBAE1B,CAAC,EAAE,eAAAC,QAAoBA,KAAiB,CAAC;AAAA,GAYtDC,IAA8D,CAAC;AAAA,EACnE,cAAAC,IAAe;AAAA,EACf,QAAAC,IAAS;AAAA,EACT,UAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,iBAAAC,IAAkB;AAAA,EAClB,eAAAC,IAAgB;AAClB,wBAEKf,GAAW,EAAA,SAASW,GAAQ,UAAUE,GAAS,kBAAkBC,GAChE,UAAA,gBAAAE;AAAA,EAACV;AAAA,EAAA;AAAA,IACC,WAAWM;AAAA,IACX,kBAAkBG;AAAA,IAClB,eAAeL;AAAA,EAAA;AAEnB,EAAA,CAAA;"}

package/dist/features/wins-dashboard/belts-elements-stickers/reward-elements.js

@@ -1,82 +0,0 @@
-import { jsxs as I, jsx as r } from "react/jsx-runtime";
-import l, { css as m } from "styled-components";
-import f from "../../ui/layout/flex-view.js";
-import $ from "../../ui/separator/separator.js";
-import S from "../../ui/text/text.js";
-import { SCREEN_SIZES as a, INSTRUCTION_REWARDS as N, MATH_REWARDS as R, STICKERS as w } from "../constants.js";
-import A from "./elements.js";
-const E = {
-  STICKER: "STICKERS",
-  CODING: "CODING",
-  CHIP: "CHIPS",
-  ELEMENT: "ELEMENTS"
-}, g = l(f)`
-  background-color: ${({ theme: t }) => t.colors.WHITE};
-`, L = l(f)`
-  max-width: 280px;
-  width: 100%;
-  ${({ $currentScreenWidth: t }) => t < a.LAPTOP && m`
-      max-width: 764px;
-      width: 100%;
-    `}
-`, P = l.div`
-  width: 33%;
-  padding-bottom: 16px;
-  ${({ $currentScreenWidth: t }) => t < a.LAPTOP && m`
-      width: 15%;
-      height: 33%;
-    `}
-`, O = l.div`
-  padding-left: ${({ $isSticker: t }) => t ? "13px" : "19px"};
-  color: ${({ theme: t }) => t.colors.BLACK};
-  font-size: 20px;
-  font-weight: 800;
-  ${({ $currentScreenWidth: t }) => t < a.LAPTOP && m`
-      padding-left: 0;
-    `}
-`, u = (t, o) => {
-  let e = E.STICKER;
-  return t || (e = o ? E.CHIP : E.ELEMENT), e;
-}, T = (t, o, e, n, s = {}, c) => /* @__PURE__ */ r(P, { $currentScreenWidth: c, children: /* @__PURE__ */ r(
-  A,
-  {
-    isAchieved: t in o,
-    count: o[t],
-    elementType: t,
-    isCoddingType: e,
-    isSticker: n,
-    lotties: s,
-    currentScreenWidth: c
-  }
-) }, t), v = ({
-  elements: t,
-  isSticker: o = !1,
-  lotties: e = {},
-  currentScreenWidth: n,
-  programStream: s
-}) => {
-  const c = s === E.CODING ? [...N] : [...R], d = s === E.CODING, h = w, p = {};
-  return t && t.forEach((i) => {
-    const { name: x, count: C } = i;
-    p[x] = C;
-  }), /* @__PURE__ */ I(g, { children: [
-    /* @__PURE__ */ r(O, { $currentScreenWidth: n, $isSticker: o, children: /* @__PURE__ */ r(S, { $renderAs: "h5", $color: "BLACK", children: u(o, d) }) }),
-    /* @__PURE__ */ r($, { height: 18 }),
-    /* @__PURE__ */ r(L, { $flexWrap: !0, $flexDirection: "row", $currentScreenWidth: n, children: o ? h.map(
-      (i) => T(
-        i,
-        p,
-        d,
-        o,
-        e,
-        n
-      )
-    ) : c.map(
-      (i) => T(i, p, d, !1, {}, n)
-    ) })
-  ] });
-};
-export {
-  v as default
-};
-//# sourceMappingURL=reward-elements.js.map

package/dist/features/wins-dashboard/belts-elements-stickers/reward-elements.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"reward-elements.js","sources":["../../../../src/features/wins-dashboard/belts-elements-stickers/reward-elements.tsx"],"sourcesContent":["import React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\nimport { INSTRUCTION_REWARDS, MATH_REWARDS, SCREEN_SIZES, STICKERS } from '../constants';\nimport Element from './elements';\n\nconst ELEMENT_TEXT = {\n  STICKER: 'STICKERS',\n  CODING: 'CODING',\n  CHIP: 'CHIPS',\n  ELEMENT: 'ELEMENTS',\n};\n\nconst InfoWrapper = styled(FlexView)`\n  background-color: ${({ theme }) => theme.colors.WHITE};\n`;\n\ninterface ElementContainerProps {\n  $currentScreenWidth: number;\n}\n\nconst ElementContainer = styled(FlexView)<ElementContainerProps>`\n  max-width: 280px;\n  width: 100%;\n  ${({ $currentScreenWidth }) =>\n    $currentScreenWidth < SCREEN_SIZES.LAPTOP &&\n    css`\n      max-width: 764px;\n      width: 100%;\n    `}\n`;\n\ninterface ElementWrapperProps {\n  $currentScreenWidth: number;\n}\n\nconst ElementWrapper = styled.div<ElementWrapperProps>`\n  width: 33%;\n  padding-bottom: 16px;\n  ${({ $currentScreenWidth }) =>\n    $currentScreenWidth < SCREEN_SIZES.LAPTOP &&\n    css`\n      width: 15%;\n      height: 33%;\n    `}\n`;\n\ninterface ElementTextProps {\n  $isSticker: boolean;\n  $currentScreenWidth: number;\n}\n\nconst ElementText = styled.div<ElementTextProps>`\n  padding-left: ${({ $isSticker }) => ($isSticker ? '13px' : '19px')};\n  color: ${({ theme }) => theme.colors.BLACK};\n  font-size: 20px;\n  font-weight: 800;\n  ${({ $currentScreenWidth }) =>\n    $currentScreenWidth < SCREEN_SIZES.LAPTOP &&\n    css`\n      padding-left: 0;\n    `}\n`;\n\nconst getElementText = (isSticker: boolean, isCoddingType: boolean): string => {\n  let name = ELEMENT_TEXT.STICKER;\n\n  if (!isSticker) {\n    name = isCoddingType ? ELEMENT_TEXT.CHIP : ELEMENT_TEXT.ELEMENT;\n  }\n\n  return name;\n};\n\ninterface ElementData {\n  name: string;\n  count: number;\n}\n\ninterface LottieProps {\n  height: number;\n  width: number;\n  lottieSrc: string;\n}\n\nconst getElements = (\n  element: string,\n  elementsCount: Record<string, number>,\n  isCoddingType: boolean,\n  isSticker: boolean,\n  lotties: Record<string, LottieProps> = {},\n  currentScreenWidth: number,\n) => {\n  return (\n    <ElementWrapper $currentScreenWidth={currentScreenWidth} key={element}>\n      <Element\n        isAchieved={element in elementsCount}\n        count={elementsCount[element]}\n        elementType={element}\n        isCoddingType={isCoddingType}\n        isSticker={isSticker}\n        lotties={lotties}\n        currentScreenWidth={currentScreenWidth}\n      />\n    </ElementWrapper>\n  );\n};\n\ninterface RewardElementsProps {\n  elements?: ElementData[];\n  isSticker?: boolean;\n  lotties?: Record<string, LottieProps>;\n  currentScreenWidth: number;\n  programStream?: string;\n}\n\nconst RewardElements: React.FC<RewardElementsProps> = ({\n  elements,\n  isSticker = false,\n  lotties = {},\n  currentScreenWidth,\n  programStream,\n}) => {\n  const totalElements =\n    programStream === ELEMENT_TEXT.CODING ? [...INSTRUCTION_REWARDS] : [...MATH_REWARDS];\n  const isCoddingType = programStream === ELEMENT_TEXT.CODING;\n  const totalStickers = STICKERS;\n  const elementsCount: Record<string, number> = {};\n\n  if (elements) {\n    elements.forEach(element => {\n      const { name, count } = element;\n\n      elementsCount[name] = count;\n    });\n  }\n\n  return (\n    <InfoWrapper>\n      <ElementText $currentScreenWidth={currentScreenWidth} $isSticker={isSticker}>\n        <Text $renderAs=\"h5\" $color=\"BLACK\">\n          {getElementText(isSticker, isCoddingType)}\n        </Text>\n      </ElementText>\n      <Separator height={18} />\n      <ElementContainer $flexWrap $flexDirection=\"row\" $currentScreenWidth={currentScreenWidth}>\n        {!isSticker\n          ? totalElements.map(element =>\n              getElements(element, elementsCount, isCoddingType, false, {}, currentScreenWidth),\n            )\n          : totalStickers.map(sticker =>\n              getElements(\n                sticker,\n                elementsCount,\n                isCoddingType,\n                isSticker,\n                lotties,\n                currentScreenWidth,\n              ),\n            )}\n      </ElementContainer>\n    </InfoWrapper>\n  );\n};\n\nexport default RewardElements;\n"],"names":["ELEMENT_TEXT","InfoWrapper","styled","FlexView","theme","ElementContainer","$currentScreenWidth","SCREEN_SIZES","css","ElementWrapper","ElementText","$isSticker","getElementText","isSticker","isCoddingType","name","getElements","element","elementsCount","lotties","currentScreenWidth","jsx","Element","RewardElements","elements","programStream","totalElements","INSTRUCTION_REWARDS","MATH_REWARDS","totalStickers","STICKERS","count","Text","Separator","sticker"],"mappings":";;;;;;;AASA,MAAMA,IAAe;AAAA,EACnB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,SAAS;AACX,GAEMC,IAAcC,EAAOC,CAAQ;AAAA,sBACb,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA,GAOjDC,IAAmBH,EAAOC,CAAQ;AAAA;AAAA;AAAA,IAGpC,CAAC,EAAE,qBAAAG,EACH,MAAAA,IAAsBC,EAAa,UACnCC;AAAA;AAAA;AAAA,KAGC;AAAA,GAOCC,IAAiBP,EAAO;AAAA;AAAA;AAAA,IAG1B,CAAC,EAAE,qBAAAI,EACH,MAAAA,IAAsBC,EAAa,UACnCC;AAAA;AAAA;AAAA,KAGC;AAAA,GAQCE,IAAcR,EAAO;AAAA,kBACT,CAAC,EAAE,YAAAS,EAAA,MAAkBA,IAAa,SAAS,MAAO;AAAA,WACzD,CAAC,EAAE,OAAAP,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA,IAGxC,CAAC,EAAE,qBAAAE,EACH,MAAAA,IAAsBC,EAAa,UACnCC;AAAA;AAAA,KAEC;AAAA,GAGCI,IAAiB,CAACC,GAAoBC,MAAmC;AAC7E,MAAIC,IAAOf,EAAa;AAExB,SAAKa,MACIE,IAAAD,IAAgBd,EAAa,OAAOA,EAAa,UAGnDe;AACT,GAaMC,IAAc,CAClBC,GACAC,GACAJ,GACAD,GACAM,IAAuC,CAAC,GACxCC,MAGE,gBAAAC,EAACZ,GAAe,EAAA,qBAAqBW,GACnC,UAAA,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,YAAYL,KAAWC;AAAA,IACvB,OAAOA,EAAcD,CAAO;AAAA,IAC5B,aAAaA;AAAA,IACb,eAAAH;AAAA,IACA,WAAAD;AAAA,IACA,SAAAM;AAAA,IACA,oBAAAC;AAAA,EAAA;AAAA,KAR0DH,CAU9D,GAYEM,IAAgD,CAAC;AAAA,EACrD,UAAAC;AAAA,EACA,WAAAX,IAAY;AAAA,EACZ,SAAAM,IAAU,CAAC;AAAA,EACX,oBAAAC;AAAA,EACA,eAAAK;AACF,MAAM;AACE,QAAAC,IACJD,MAAkBzB,EAAa,SAAS,CAAC,GAAG2B,CAAmB,IAAI,CAAC,GAAGC,CAAY,GAC/Ed,IAAgBW,MAAkBzB,EAAa,QAC/C6B,IAAgBC,GAChBZ,IAAwC,CAAA;AAE9C,SAAIM,KACFA,EAAS,QAAQ,CAAWP,MAAA;AACpB,UAAA,EAAE,MAAAF,GAAM,OAAAgB,EAAU,IAAAd;AAExB,IAAAC,EAAcH,CAAI,IAAIgB;AAAA,EAAA,CACvB,qBAIA9B,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAoB,EAACX,GAAY,EAAA,qBAAqBU,GAAoB,YAAYP,GAChE,UAAC,gBAAAQ,EAAAW,GAAA,EAAK,WAAU,MAAK,QAAO,SACzB,UAAApB,EAAeC,GAAWC,CAAa,EAC1C,CAAA,GACF;AAAA,IACA,gBAAAO,EAACY,GAAU,EAAA,QAAQ,GAAI,CAAA;AAAA,IACvB,gBAAAZ,EAAChB,GAAiB,EAAA,WAAS,IAAC,gBAAe,OAAM,qBAAqBe,GACnE,UAACP,IAIEgB,EAAc;AAAA,MAAI,CAChBK,MAAAlB;AAAA,QACEkB;AAAA,QACAhB;AAAA,QACAJ;AAAA,QACAD;AAAA,QACAM;AAAA,QACAC;AAAA,MACF;AAAA,IAAA,IAXFM,EAAc;AAAA,MAAI,CAAAT,MAChBD,EAAYC,GAASC,GAAeJ,GAAe,IAAO,IAAIM,CAAkB;AAAA,OAYxF;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/dist/features/wins-dashboard/constants.js

@@ -1,161 +0,0 @@
-import { ILLUSTRATIONS as T } from "../../assets/illustrations/illustrations.js";
-import { IMAGES as E } from "../../assets/images/images.js";
-import R from "../../assets/line-icons/icons/wins-common-icon.js";
-import o from "../../assets/line-icons/icons/wins-epic-icon.js";
-import C from "../../assets/line-icons/icons/wins-legendary-icon.js";
-import D from "../../assets/line-icons/icons/wins-mystery-icon.js";
-import n from "../../assets/line-icons/icons/wins-mythic-icon.js";
-import c from "../../assets/line-icons/icons/wins-rare-icon.js";
-import { LOTTIE as t } from "../../assets/lottie/lottie.js";
-import { getTheme as s } from "../ui/theme/get-theme.js";
-const m = {
-  TABLET: 864,
-  LAPTOP: 1024,
-  LAPTOPL: 1280
-}, { colors: O } = s(), a = {
-  ASHTA: "#FF7E3B",
-  CHATVA: "#DA5107",
-  COSA: "#0A47C2",
-  DODA: "#850F85",
-  DVI: "#0A47C2",
-  EKA: "#3DD771",
-  HEXO: "#3DD771",
-  OCTO: "#FF7E3B",
-  TETRA: "#FFBA07",
-  ZODASA: "#1EB5F0",
-  CONGRATS: O.GREY_2,
-  COOL: O.GREY_2,
-  KUDOS: O.GREY_2,
-  GREAT: O.GREY_2,
-  WOW: O.GREY_2,
-  AWESOME: O.GREY_2
-}, A = {
-  COMMON: "COMMON",
-  RARE: "RARE",
-  EPIC: "EPIC",
-  LEGENDARY: "LEGENDARY",
-  MYTHIC: "MYTHIC",
-  MYSTERY: "MYSTERY"
-}, H = {
-  ACKNOWLEDGED: "ACKNOWLEDGED",
-  ASSIGNED: "ASSIGNED",
-  UNASSIGNED: "UNASSIGNED"
-}, h = {
-  [A.COMMON]: "#1EB5F0",
-  [A.RARE]: "#3DD771",
-  [A.EPIC]: "#ED6CEF",
-  [A.LEGENDARY]: "#FF7E3B",
-  [A.MYTHIC]: "#FFBA07",
-  [A.MYSTERY]: O.WHITE
-}, u = {
-  [A.COMMON]: R,
-  [A.RARE]: c,
-  [A.EPIC]: o,
-  [A.LEGENDARY]: C,
-  [A.MYTHIC]: n,
-  [A.MYSTERY]: D
-}, P = {
-  [A.COMMON]: T.COMMON,
-  [A.RARE]: T.RARE,
-  [A.EPIC]: T.EPIC,
-  [A.LEGENDARY]: T.LEGENDARY,
-  [A.MYTHIC]: T.MYTHIC,
-  [A.MYSTERY]: T.MYSTERY
-}, S = {
-  black: E.BLACK_BELT,
-  blue: E.BLUE_BELT,
-  brown: E.BROWN_BELT,
-  green: E.GREEN_BELT,
-  orange: E.ORANGE_BELT,
-  purple: E.PURPLE_BELT,
-  red: E.RED_BELT,
-  white: E.WHITE_BELT,
-  yellow: E.YELLOW_BELT
-}, l = (r) => {
-  const e = r == null ? void 0 : r.toLowerCase();
-  return e && e in S ? S[e] : E.MASTERED_BADGE;
-}, K = ["TETRA", "COSA", "DODA", "HEXO", "OCTO"], U = ["EKA", "DVI", "CHATVA", "ASHTA", "ZODASA"], F = ["CONGRATS", "COOL", "KUDOS", "GREAT", "WOW", "AWESOME"], f = (r) => {
-  switch (r) {
-    case "COSA":
-      return E.COSA;
-    case "OCTO":
-      return E.OCTO;
-    case "DODA":
-      return E.DODA;
-    case "HEXO":
-      return E.HEXO;
-    case "TETRA":
-      return E.TETRA;
-    case "EKA":
-      return E.EKA;
-    case "DVI":
-      return E.DVI;
-    case "CHATVA":
-      return E.CHATVA;
-    case "ASHTA":
-      return E.ASHTA;
-    case "ZODASA":
-      return E.ZODASA;
-    case "CONGRATS":
-      return E.CONGRATS;
-    case "COOL":
-      return E.COOL;
-    case "KUDOS":
-      return E.KUDOS;
-    case "GREAT":
-      return E.GREAT;
-    case "WOW":
-      return E.WOW;
-    case "AWESOME":
-      return E.AWESOME;
-    default:
-      return E.TETRA;
-  }
-}, g = {
-  CONGRATS: {
-    height: 50,
-    width: 50,
-    lottieSrc: t.TROPHY
-  },
-  COOL: {
-    height: 50,
-    width: 50,
-    lottieSrc: t.COOL
-  },
-  KUDOS: {
-    height: 50,
-    width: 50,
-    lottieSrc: t.CLAPPING_HANDS
-  },
-  GREAT: {
-    height: 63,
-    width: 50,
-    lottieSrc: t.LIKE_BUTTON
-  },
-  WOW: {
-    height: 55,
-    width: 55,
-    lottieSrc: t.STAR_STRIKE_EMOJI
-  },
-  AWESOME: {
-    height: 50,
-    width: 50,
-    lottieSrc: t.AWESOME
-  }
-};
-export {
-  h as BADGE_TYPE_BACKGROUND,
-  P as BADGE_TYPE_BADGE_ICON,
-  u as BADGE_TYPE_TAB_ICON,
-  U as INSTRUCTION_REWARDS,
-  K as MATH_REWARDS,
-  m as SCREEN_SIZES,
-  F as STICKERS,
-  H as STUDENT_BADGE_STATUS,
-  A as STUDENT_BADGE_TYPE,
-  g as StickerMap,
-  a as elementColors,
-  l as getBeltIcon,
-  f as getRewardElement
-};
-//# sourceMappingURL=constants.js.map

package/dist/features/wins-dashboard/constants.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"constants.js","sources":["../../../src/features/wins-dashboard/constants.ts"],"sourcesContent":["import { ILLUSTRATIONS } from '../../assets/illustrations/illustrations';\nimport { IMAGES } from '../../assets/images/images';\nimport WinsCommonIcon from '../../assets/line-icons/icons/wins-common-icon';\nimport WinsEpicIcon from '../../assets/line-icons/icons/wins-epic-icon';\nimport WinsLegendaryIcon from '../../assets/line-icons/icons/wins-legendary-icon';\nimport WinsMysteryIcon from '../../assets/line-icons/icons/wins-mystery-icon';\nimport WinsMythicIcon from '../../assets/line-icons/icons/wins-mythic-icon';\nimport WinsRareIcon from '../../assets/line-icons/icons/wins-rare-icon';\nimport { LOTTIE } from '../../assets/lottie/lottie';\nimport { getTheme } from '../ui/theme/get-theme';\n\nexport const SCREEN_SIZES = {\n  TABLET: 864,\n  LAPTOP: 1024,\n  LAPTOPL: 1280,\n};\n\nexport const DEVICES = {\n  TABLET: `(max-width: ${SCREEN_SIZES.TABLET}px)`,\n  LAPTOP: `(max-width: ${SCREEN_SIZES.LAPTOP}px)`,\n  LAPTOPL: `(max-width: ${SCREEN_SIZES.LAPTOPL}px)`,\n};\n\nconst { colors } = getTheme();\n\nexport const elementColors = {\n  ASHTA: '#FF7E3B',\n  CHATVA: '#DA5107',\n  COSA: '#0A47C2',\n  DODA: '#850F85',\n  DVI: '#0A47C2',\n  EKA: '#3DD771',\n  HEXO: '#3DD771',\n  OCTO: '#FF7E3B',\n  TETRA: '#FFBA07',\n  ZODASA: '#1EB5F0',\n  CONGRATS: colors.GREY_2,\n  COOL: colors.GREY_2,\n  KUDOS: colors.GREY_2,\n  GREAT: colors.GREY_2,\n  WOW: colors.GREY_2,\n  AWESOME: colors.GREY_2,\n};\n\nexport const STUDENT_BADGE_TYPE = {\n  COMMON: 'COMMON',\n  RARE: 'RARE',\n  EPIC: 'EPIC',\n  LEGENDARY: 'LEGENDARY',\n  MYTHIC: 'MYTHIC',\n  MYSTERY: 'MYSTERY',\n};\n\nexport const STUDENT_BADGE_STATUS = {\n  ACKNOWLEDGED: 'ACKNOWLEDGED',\n  ASSIGNED: 'ASSIGNED',\n  UNASSIGNED: 'UNASSIGNED',\n};\n\nexport const BADGE_TYPE_BACKGROUND = {\n  [STUDENT_BADGE_TYPE.COMMON]: '#1EB5F0',\n  [STUDENT_BADGE_TYPE.RARE]: '#3DD771',\n  [STUDENT_BADGE_TYPE.EPIC]: '#ED6CEF',\n  [STUDENT_BADGE_TYPE.LEGENDARY]: '#FF7E3B',\n  [STUDENT_BADGE_TYPE.MYTHIC]: '#FFBA07',\n  [STUDENT_BADGE_TYPE.MYSTERY]: colors.WHITE,\n};\n\nexport const BADGE_TYPE_TAB_ICON: Record<\n  string,\n  React.FC<{ color?: string; selected?: boolean }>\n> = {\n  [STUDENT_BADGE_TYPE.COMMON]: WinsCommonIcon,\n  [STUDENT_BADGE_TYPE.RARE]: WinsRareIcon,\n  [STUDENT_BADGE_TYPE.EPIC]: WinsEpicIcon,\n  [STUDENT_BADGE_TYPE.LEGENDARY]: WinsLegendaryIcon,\n  [STUDENT_BADGE_TYPE.MYTHIC]: WinsMythicIcon,\n  [STUDENT_BADGE_TYPE.MYSTERY]: WinsMysteryIcon,\n};\n\nexport const BADGE_TYPE_BADGE_ICON = {\n  [STUDENT_BADGE_TYPE.COMMON]: ILLUSTRATIONS.COMMON,\n  [STUDENT_BADGE_TYPE.RARE]: ILLUSTRATIONS.RARE,\n  [STUDENT_BADGE_TYPE.EPIC]: ILLUSTRATIONS.EPIC,\n  [STUDENT_BADGE_TYPE.LEGENDARY]: ILLUSTRATIONS.LEGENDARY,\n  [STUDENT_BADGE_TYPE.MYTHIC]: ILLUSTRATIONS.MYTHIC,\n  [STUDENT_BADGE_TYPE.MYSTERY]: ILLUSTRATIONS.MYSTERY,\n};\n\n// Audio URLs for badge sounds (commented out for now until MP3 files are available)\n// export const BADGE_TYPE_BADGE_SOUND = {\n//   [STUDENT_BADGE_TYPE.COMMON]: '/static/sounds/common-badge.mp3',\n//   [STUDENT_BADGE_TYPE.RARE]: '/static/sounds/rare-badge.mp3',\n//   [STUDENT_BADGE_TYPE.EPIC]: '/static/sounds/epic-badge.mp3',\n//   [STUDENT_BADGE_TYPE.LEGENDARY]: '/static/sounds/legendary-badge.mp3',\n//   [STUDENT_BADGE_TYPE.MYTHIC]: '/static/sounds/mythic-badge.mp3',\n//   [STUDENT_BADGE_TYPE.MYSTERY]: '/static/sounds/mystery-badge.mp3',\n// };\n\nconst BELT_COLORS = [\n  'black',\n  'blue',\n  'brown',\n  'green',\n  'orange',\n  'purple',\n  'red',\n  'white',\n  'yellow',\n] as const;\n\ntype BeltColor = (typeof BELT_COLORS)[number];\n\nconst COLOR_TO_BELT_MAP: Record<BeltColor, string> = {\n  black: IMAGES.BLACK_BELT,\n  blue: IMAGES.BLUE_BELT,\n  brown: IMAGES.BROWN_BELT,\n  green: IMAGES.GREEN_BELT,\n  orange: IMAGES.ORANGE_BELT,\n  purple: IMAGES.PURPLE_BELT,\n  red: IMAGES.RED_BELT,\n  white: IMAGES.WHITE_BELT,\n  yellow: IMAGES.YELLOW_BELT,\n};\n\nexport const getBeltIcon = (type: string) => {\n  const key = type?.toLowerCase() as BeltColor;\n\n  if (key && key in COLOR_TO_BELT_MAP) return COLOR_TO_BELT_MAP[key];\n\n  return IMAGES.MASTERED_BADGE;\n};\n\nexport const MATH_REWARDS = ['TETRA', 'COSA', 'DODA', 'HEXO', 'OCTO'];\n\nexport const INSTRUCTION_REWARDS = ['EKA', 'DVI', 'CHATVA', 'ASHTA', 'ZODASA'];\n\nexport const STICKERS = ['CONGRATS', 'COOL', 'KUDOS', 'GREAT', 'WOW', 'AWESOME'];\n\nexport const getRewardElement = (rewardType: string): string => {\n  switch (rewardType) {\n    case 'COSA':\n      return IMAGES.COSA;\n    case 'OCTO':\n      return IMAGES.OCTO;\n    case 'DODA':\n      return IMAGES.DODA;\n    case 'HEXO':\n      return IMAGES.HEXO;\n    case 'TETRA':\n      return IMAGES.TETRA;\n    case 'EKA':\n      return IMAGES.EKA;\n    case 'DVI':\n      return IMAGES.DVI;\n    case 'CHATVA':\n      return IMAGES.CHATVA;\n    case 'ASHTA':\n      return IMAGES.ASHTA;\n    case 'ZODASA':\n      return IMAGES.ZODASA;\n    case 'CONGRATS':\n      return IMAGES.CONGRATS;\n    case 'COOL':\n      return IMAGES.COOL;\n    case 'KUDOS':\n      return IMAGES.KUDOS;\n    case 'GREAT':\n      return IMAGES.GREAT;\n    case 'WOW':\n      return IMAGES.WOW;\n    case 'AWESOME':\n      return IMAGES.AWESOME;\n    default:\n      return IMAGES.TETRA;\n  }\n};\n\nexport const StickerMap = {\n  CONGRATS: {\n    height: 50,\n    width: 50,\n    lottieSrc: LOTTIE.TROPHY,\n  },\n  COOL: {\n    height: 50,\n    width: 50,\n    lottieSrc: LOTTIE.COOL,\n  },\n  KUDOS: {\n    height: 50,\n    width: 50,\n    lottieSrc: LOTTIE.CLAPPING_HANDS,\n  },\n  GREAT: {\n    height: 63,\n    width: 50,\n    lottieSrc: LOTTIE.LIKE_BUTTON,\n  },\n  WOW: {\n    height: 55,\n    width: 55,\n    lottieSrc: LOTTIE.STAR_STRIKE_EMOJI,\n  },\n  AWESOME: {\n    height: 50,\n    width: 50,\n    lottieSrc: LOTTIE.AWESOME,\n  },\n};\n\nexport const TYPES = {\n  SENT_BADGES: 'SENT_BADGES',\n  PENDING_BADGES: 'PENDING_BADGES',\n};\n\nexport const ACTION = {\n  ACKNOWLEDGE: 'ACKNOWLEDGE',\n};\n"],"names":["SCREEN_SIZES","colors","getTheme","elementColors","STUDENT_BADGE_TYPE","STUDENT_BADGE_STATUS","BADGE_TYPE_BACKGROUND","BADGE_TYPE_TAB_ICON","WinsCommonIcon","WinsRareIcon","WinsEpicIcon","WinsLegendaryIcon","WinsMythicIcon","WinsMysteryIcon","BADGE_TYPE_BADGE_ICON","ILLUSTRATIONS","COLOR_TO_BELT_MAP","IMAGES","getBeltIcon","type","key","MATH_REWARDS","INSTRUCTION_REWARDS","STICKERS","getRewardElement","rewardType","StickerMap","LOTTIE"],"mappings":"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"}

package/dist/features/wins-dashboard/header/wins-header.js

@@ -1,95 +0,0 @@
-import { jsxs as r, jsx as e, Fragment as k } from "react/jsx-runtime";
-import { useCallback as u } from "react";
-import h, { css as C } from "styled-components";
-import W from "../../../assets/line-icons/icons/back2.js";
-import y from "../../../assets/line-icons/icons/cue-coin.js";
-import H from "../../ui/buttons/clickable/clickable.js";
-import T from "../../ui/inputs/select-input/select-input.js";
-import n from "../../ui/layout/flex-view.js";
-import f from "../../ui/separator/separator.js";
-import m from "../../ui/text/text.js";
-const j = h(n)`
-  background: ${({ theme: i }) => i.colors.WHITE};
-  border-bottom: 1px solid ${({ theme: i }) => i.colors.GREY_2};
-  height: 64px;
-  left: ${({ widthOffset: i }) => i}px;
-  padding-left: 32px;
-  padding-right: 20px;
-  position: fixed;
-  right: 0;
-  top: ${({ topOffset: i }) => i}px;
-  width: calc(100% - ${({ widthOffset: i }) => i}px);
-  ${({ showLeftBorder: i }) => i && C`
-      position: sticky;
-      left: 0;
-      top: 0;
-      width: 100%;
-      border-left: 1px solid ${({ theme: t }) => t.colors.GREY_2};
-    `}
-  z-index: ${({
-  theme: {
-    zIndex: { HEADER: i }
-  }
-}) => i};
-`, v = h(n)`
-  flex: 1;
-`, p = ({ variant: i, coin: t }) => /* @__PURE__ */ r(k, { children: [
-  /* @__PURE__ */ e(y, { variant: i, width: 32, height: 32 }),
-  /* @__PURE__ */ e(f, { width: 8 }),
-  /* @__PURE__ */ e(m, { $renderAs: "h5", children: t })
-] }), A = ({
-  currentSelectedProgram: i,
-  goldCoins: t = 0,
-  onBackClick: x,
-  onProgramChange: l,
-  programOptions: d = [],
-  silverCoins: c = 0,
-  showLeftBorder: $ = !1,
-  topOffset: w = 0,
-  widthOffset: b = 0
-}) => {
-  const g = u(
-    (o) => {
-      const a = d.find((I) => I.id === o);
-      l && a && l(a);
-    },
-    [l, d]
-  ), s = d.map((o) => ({
-    id: o.id,
-    label: o.name
-    // Use 'name' from API data for display
-  }));
-  return /* @__PURE__ */ r(
-    j,
-    {
-      $flexDirection: "row",
-      topOffset: w,
-      widthOffset: b,
-      showLeftBorder: $,
-      children: [
-        /* @__PURE__ */ r(n, { $flexDirection: "row", $alignItems: "center", $flexGapX: 0.5, children: [
-          /* @__PURE__ */ e(H, { label: "Back", onClick: x, children: /* @__PURE__ */ e(W, { width: 24, height: 24 }) }),
-          /* @__PURE__ */ e(m, { $renderAs: "h6", children: "Wins" })
-        ] }),
-        s.length > 1 && /* @__PURE__ */ e(v, { $justifyContent: "center", $alignItems: "center", children: /* @__PURE__ */ e(
-          T,
-          {
-            options: s,
-            value: (i == null ? void 0 : i.id) || "",
-            onChange: g,
-            renderAs: "primary"
-          }
-        ) }),
-        /* @__PURE__ */ r(n, { $flexDirection: "row", $alignItems: "center", children: [
-          t > 0 && /* @__PURE__ */ e(p, { variant: "gold", coin: t }),
-          /* @__PURE__ */ e(f, { width: 8 }),
-          c > 0 && /* @__PURE__ */ e(p, { variant: "silver", coin: c })
-        ] })
-      ]
-    }
-  );
-}, X = A;
-export {
-  X as default
-};
-//# sourceMappingURL=wins-header.js.map

package/dist/features/wins-dashboard/header/wins-header.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"wins-header.js","sources":["../../../../src/features/wins-dashboard/header/wins-header.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Back2Icon from '../../../assets/line-icons/icons/back2';\nimport CueCoinIcon from '../../../assets/line-icons/icons/cue-coin';\nimport Clickable from '../../ui/buttons/clickable/clickable';\nimport SelectInput from '../../ui/inputs/select-input/select-input';\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\n\ninterface HeaderProps {\n  topOffset: number;\n  widthOffset: number;\n  showLeftBorder: boolean;\n}\n\nconst Header = styled(FlexView)<HeaderProps>`\n  background: ${({ theme }) => theme.colors.WHITE};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.GREY_2};\n  height: 64px;\n  left: ${({ widthOffset }) => widthOffset}px;\n  padding-left: 32px;\n  padding-right: 20px;\n  position: fixed;\n  right: 0;\n  top: ${({ topOffset }) => topOffset}px;\n  width: calc(100% - ${({ widthOffset }) => widthOffset}px);\n  ${({ showLeftBorder }) =>\n    showLeftBorder &&\n    css`\n      position: sticky;\n      left: 0;\n      top: 0;\n      width: 100%;\n      border-left: 1px solid ${({ theme }) => theme.colors.GREY_2};\n    `}\n  z-index: ${({\n    theme: {\n      zIndex: { HEADER },\n    },\n  }) => HEADER};\n`;\n\nconst ProgramSwitcherWrapper = styled(FlexView)`\n  flex: 1;\n`;\n\ninterface CoinViewProps {\n  variant: 'gold' | 'silver';\n  coin: number;\n}\n\nconst CoinView: React.FC<CoinViewProps> = ({ variant, coin }) => {\n  return (\n    <>\n      <CueCoinIcon variant={variant} width={32} height={32} />\n      <Separator width={8} />\n      <Text $renderAs=\"h5\">{coin}</Text>\n    </>\n  );\n};\n\ninterface IProgramOption {\n  badges_enabled: boolean;\n  board: string;\n  board_id: string;\n  code: string;\n  cue_program_type: string;\n  description: string;\n  grade: string;\n  grades: string[];\n  id: string;\n  is_active: boolean;\n  is_current: boolean;\n  is_current_stream_program: boolean;\n  is_demo: boolean;\n  is_live: boolean;\n  name: string;\n  program_type: string;\n  rewards_enabled: boolean;\n  stream: string;\n  sub_stream: string | null;\n  [key: string]: unknown;\n}\n\ninterface WinsTabHeaderProps {\n  currentSelectedProgram?: IProgramOption;\n  goldCoins?: number;\n  onBackClick?: () => void;\n  onProgramChange?: (p: IProgramOption) => void;\n  programOptions?: IProgramOption[];\n  silverCoins?: number;\n  showLeftBorder?: boolean;\n  topOffset?: number;\n  widthOffset?: number;\n}\n\nconst WinsTabHeader: React.FC<WinsTabHeaderProps> = ({\n  currentSelectedProgram,\n  goldCoins = 0,\n  onBackClick,\n  onProgramChange,\n  programOptions = [],\n  silverCoins = 0,\n  showLeftBorder = false,\n  topOffset = 0,\n  widthOffset = 0,\n}) => {\n  const handleProgramChange = useCallback(\n    (selectedId: string) => {\n      // Find the original program option from programOptions\n      const originalOption = programOptions.find(op => op.id === selectedId);\n\n      if (onProgramChange && originalOption) {\n        onProgramChange(originalOption);\n      }\n    },\n    [onProgramChange, programOptions],\n  );\n\n  // Transform program options to SelectInput format\n  const selectOptions = programOptions.map(option => ({\n    id: option.id,\n    label: option.name, // Use 'name' from API data for display\n  }));\n\n  return (\n    <Header\n      $flexDirection=\"row\"\n      topOffset={topOffset}\n      widthOffset={widthOffset}\n      showLeftBorder={showLeftBorder}\n    >\n      <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGapX={0.5}>\n        <Clickable label=\"Back\" onClick={onBackClick}>\n          <Back2Icon width={24} height={24} />\n        </Clickable>\n        <Text $renderAs=\"h6\">Wins</Text>\n      </FlexView>\n      {selectOptions.length > 1 && (\n        <ProgramSwitcherWrapper $justifyContent=\"center\" $alignItems=\"center\">\n          <SelectInput\n            options={selectOptions}\n            value={currentSelectedProgram?.id || ''}\n            onChange={handleProgramChange}\n            renderAs=\"primary\"\n          />\n        </ProgramSwitcherWrapper>\n      )}\n      <FlexView $flexDirection=\"row\" $alignItems=\"center\">\n        {goldCoins > 0 && <CoinView variant=\"gold\" coin={goldCoins} />}\n        <Separator width={8} />\n        {silverCoins > 0 && <CoinView variant=\"silver\" coin={silverCoins} />}\n      </FlexView>\n    </Header>\n  );\n};\n\nexport default WinsTabHeader;\n"],"names":["Header","styled","FlexView","theme","widthOffset","topOffset","showLeftBorder","css","HEADER","ProgramSwitcherWrapper","CoinView","variant","coin","jsxs","Fragment","jsx","CueCoinIcon","Separator","Text","WinsTabHeader","currentSelectedProgram","goldCoins","onBackClick","onProgramChange","programOptions","silverCoins","handleProgramChange","useCallback","selectedId","originalOption","op","selectOptions","option","Clickable","Back2Icon","SelectInput","WinsTabHeader$1"],"mappings":"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"}

package/dist/features/wins-dashboard/student-badges/animated-tabbar.js

@@ -1,65 +0,0 @@
-import { jsxs as f, jsx as n } from "react/jsx-runtime";
-import i, { css as u } from "styled-components";
-import e from "../../ui/layout/flex-view.js";
-import C from "../../ui/text/text.js";
-const b = 725, g = i(e)`
-  flex: 1;
-  position: relative;
-`, I = i(e)`
-  position: relative;
-  align-items: center;
-  justify-content: center;
-  padding-top: 16px;
-  padding-bottom: 12px;
-  flex: 1;
-  cursor: pointer;
-`, w = i.div`
-  width: ${({ $width: t }) => t}px;
-  height: 2px;
-  position: absolute;
-  bottom: 0;
-  background: BLACK;
-  transition: transform 300ms linear;
-  transform: translateX(${({ $left: t }) => t}px);
-`, B = i(e)`
-  ${({ $hideTabText: t }) => t && u`
-      display: none;
-    `}
-`, E = ({
-  onTabClick: t,
-  selectedTabId: d,
-  tabs: r,
-  currentScreenWidth: x
-}) => {
-  const l = r.findIndex((o) => o.id === d), { ref: c } = r[l] || {}, { clientWidth: s = 0 } = (c == null ? void 0 : c.current) || {}, m = s, $ = l * s + (s - m) / 2;
-  return /* @__PURE__ */ f(g, { $background: "WHITE", children: [
-    /* @__PURE__ */ n(e, { $flexDirection: "row", $width: "100%", children: r.map((o) => {
-      const { id: a, title: h, Icon: T } = o, p = a === d;
-      return /* @__PURE__ */ n(
-        I,
-        {
-          $justifyContent: "center",
-          onClick: () => t(a),
-          ref: o.ref,
-          children: /* @__PURE__ */ f(e, { $flexDirection: "row", $justifyContent: "center", $alignItems: "center", children: [
-            /* @__PURE__ */ n(T, { selected: p }),
-            /* @__PURE__ */ n(
-              B,
-              {
-                $gutter: 4,
-                $hideTabText: x <= b,
-                children: /* @__PURE__ */ n(C, { $renderAs: "eyebrow2", $color: p ? "BLACK" : "BLACK_75", children: h })
-              }
-            )
-          ] })
-        },
-        a
-      );
-    }) }),
-    /* @__PURE__ */ n(w, { $left: $, $width: m })
-  ] });
-};
-export {
-  E as default
-};
-//# sourceMappingURL=animated-tabbar.js.map

package/dist/features/wins-dashboard/student-badges/animated-tabbar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"animated-tabbar.js","sources":["../../../../src/features/wins-dashboard/student-badges/animated-tabbar.tsx"],"sourcesContent":["import React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport Text from '../../ui/text/text';\n\nconst MIN_SCREEN_WIDTH_FOR_TAB_TEXT = 725;\n\nexport interface TabItem {\n  id: string;\n  ref: React.RefObject<HTMLDivElement | null>;\n  Icon: React.FC<{ selected: boolean }>;\n  title: string;\n}\n\ninterface IndicatorProps {\n  $width: number;\n  $left: number;\n}\n\nconst TabBarContainer = styled(FlexView)`\n  flex: 1;\n  position: relative;\n`;\n\nconst TabBarColumn = styled(FlexView)`\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  padding-top: 16px;\n  padding-bottom: 12px;\n  flex: 1;\n  cursor: pointer;\n`;\n\nconst Indicator = styled.div<IndicatorProps>`\n  width: ${({ $width }) => $width}px;\n  height: 2px;\n  position: absolute;\n  bottom: 0;\n  background: BLACK;\n  transition: transform 300ms linear;\n  transform: translateX(${({ $left }) => $left}px);\n`;\n\nconst TabTitleContainer = styled(FlexView)<{ $hideTabText: boolean }>`\n  ${({ $hideTabText }) =>\n    $hideTabText &&\n    css`\n      display: none;\n    `}\n`;\n\ninterface AnimatedTabBarProps {\n  onTabClick: (tabId: string) => void;\n  selectedTabId: string;\n  tabs: TabItem[];\n  currentScreenWidth: number;\n}\n\nconst AnimatedTabBar = ({\n  onTabClick,\n  selectedTabId,\n  tabs,\n  currentScreenWidth,\n}: AnimatedTabBarProps) => {\n  const selectedTabItemIndex = tabs.findIndex((tab: TabItem) => tab.id === selectedTabId);\n  const { ref } = tabs[selectedTabItemIndex] || {};\n  const { clientWidth = 0 } = ref?.current || {};\n  const indicatorWidth = clientWidth;\n\n  const indicatorTranslateX =\n    selectedTabItemIndex * clientWidth + (clientWidth - indicatorWidth) / 2;\n\n  return (\n    <TabBarContainer $background=\"WHITE\">\n      <FlexView $flexDirection=\"row\" $width={'100%'}>\n        {tabs.map((tab: TabItem) => {\n          const { id, title, Icon } = tab;\n          const selected = id === selectedTabId;\n\n          return (\n            <TabBarColumn\n              $justifyContent=\"center\"\n              key={id}\n              onClick={() => onTabClick(id)}\n              ref={tab.ref}\n            >\n              <FlexView $flexDirection=\"row\" $justifyContent=\"center\" $alignItems=\"center\">\n                <Icon selected={selected} />\n                <TabTitleContainer\n                  $gutter={4}\n                  $hideTabText={currentScreenWidth <= MIN_SCREEN_WIDTH_FOR_TAB_TEXT}\n                >\n                  <Text $renderAs=\"eyebrow2\" $color={selected ? 'BLACK' : 'BLACK_75'}>\n                    {title}\n                  </Text>\n                </TabTitleContainer>\n              </FlexView>\n            </TabBarColumn>\n          );\n        })}\n      </FlexView>\n      <Indicator $left={indicatorTranslateX} $width={indicatorWidth} />\n    </TabBarContainer>\n  );\n};\n\nexport default AnimatedTabBar;\n"],"names":["MIN_SCREEN_WIDTH_FOR_TAB_TEXT","TabBarContainer","styled","FlexView","TabBarColumn","Indicator","$width","$left","TabTitleContainer","$hideTabText","css","AnimatedTabBar","onTabClick","selectedTabId","tabs","currentScreenWidth","selectedTabItemIndex","tab","ref","clientWidth","indicatorWidth","indicatorTranslateX","jsxs","jsx","id","title","Icon","selected","Text"],"mappings":";;;;AAMA,MAAMA,IAAgC,KAchCC,IAAkBC,EAAOC,CAAQ;AAAA;AAAA;AAAA,GAKjCC,IAAeF,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAU9BE,IAAYH,EAAO;AAAA,WACd,CAAC,EAAE,QAAAI,EAAO,MAAMA,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAMP,CAAC,EAAE,OAAAC,EAAM,MAAMA,CAAK;AAAA,GAGxCC,IAAoBN,EAAOC,CAAQ;AAAA,IACrC,CAAC,EAAE,cAAAM,QACHA,KACAC;AAAA;AAAA,KAEC;AAAA,GAUCC,IAAiB,CAAC;AAAA,EACtB,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,MAAAC;AAAA,EACA,oBAAAC;AACF,MAA2B;AACzB,QAAMC,IAAuBF,EAAK,UAAU,CAACG,MAAiBA,EAAI,OAAOJ,CAAa,GAChF,EAAE,KAAAK,EAAI,IAAIJ,EAAKE,CAAoB,KAAK,CAAA,GACxC,EAAE,aAAAG,IAAc,EAAA,KAAMD,KAAA,gBAAAA,EAAK,YAAW,CAAA,GACtCE,IAAiBD,GAEjBE,IACJL,IAAuBG,KAAeA,IAAcC,KAAkB;AAGtE,SAAA,gBAAAE,EAACrB,GAAgB,EAAA,aAAY,SAC3B,UAAA;AAAA,IAAC,gBAAAsB,EAAApB,GAAA,EAAS,gBAAe,OAAM,QAAQ,QACpC,UAAKW,EAAA,IAAI,CAACG,MAAiB;AAC1B,YAAM,EAAE,IAAAO,GAAI,OAAAC,GAAO,MAAAC,EAAA,IAAST,GACtBU,IAAWH,MAAOX;AAGtB,aAAA,gBAAAU;AAAA,QAACnB;AAAA,QAAA;AAAA,UACC,iBAAgB;AAAA,UAEhB,SAAS,MAAMQ,EAAWY,CAAE;AAAA,UAC5B,KAAKP,EAAI;AAAA,UAET,4BAACd,GAAS,EAAA,gBAAe,OAAM,iBAAgB,UAAS,aAAY,UAClE,UAAA;AAAA,YAAA,gBAAAoB,EAACG,KAAK,UAAAC,GAAoB;AAAA,YAC1B,gBAAAJ;AAAA,cAACf;AAAA,cAAA;AAAA,gBACC,SAAS;AAAA,gBACT,cAAcO,KAAsBf;AAAA,gBAEpC,UAAA,gBAAAuB,EAACK,KAAK,WAAU,YAAW,QAAQD,IAAW,UAAU,YACrD,UACHF,EAAA,CAAA;AAAA,cAAA;AAAA,YACF;AAAA,UAAA,GACF;AAAA,QAAA;AAAA,QAdKD;AAAA,MAAA;AAAA,IAiBV,CAAA,GACH;AAAA,IACC,gBAAAD,EAAAlB,GAAA,EAAU,OAAOgB,GAAqB,QAAQD,GAAgB;AAAA,EACjE,EAAA,CAAA;AAEJ;"}

package/dist/features/wins-dashboard/student-badges/hooks/use-student-badge-hook.js

@@ -1,107 +0,0 @@
-import Y from "lottie-web";
-import { useRef as _, useState as s, useEffect as v, useCallback as g } from "react";
-import { useUIContext as X } from "../../../ui/context/context.js";
-import { getTheme as Z } from "../../../ui/theme/get-theme.js";
-import { STUDENT_BADGE_TYPE as B, STUDENT_BADGE_STATUS as $, BADGE_TYPE_BADGE_ICON as L } from "../../constants.js";
-const { colors: M } = Z();
-function se(m) {
-  const {
-    animation_url: i,
-    category: a,
-    current_count: S,
-    description: C,
-    image_url: c,
-    id: e,
-    invalidateRewardsHome: D,
-    name: U,
-    openModal: f,
-    state: k,
-    total_count: T
-  } = m || {}, { onEvent: d } = X(), A = _(null), u = _(null), [o, y] = s(null), [G, O] = s(!1), [P, h] = s(!1), t = k !== $.UNASSIGNED, [H, E] = s(t), p = S && T ? S / T * 100 : 0, J = a !== B.MYSTERY && !t && p > 0, l = _(null), [b, x] = s();
-  v(() => {
-    if (u.current)
-      return l.current = new window.IntersectionObserver(
-        ([n]) => {
-          x(n);
-        },
-        {
-          threshold: 0.5
-        }
-      ), l.current.observe(u.current), () => {
-        l.current && l.current.disconnect();
-      };
-  }, [u]);
-  const j = (b == null ? void 0 : b.isIntersecting) ?? !1, V = t ? c || L[a] : L[a], I = a === B.MYSTERY && !t, W = a === B.MYSTERY ? M.GREY_1 : M.WHITE, { badgeName: q, badgeDescription: z } = I ? { badgeName: "????", badgeDescription: "----------------" } : { badgeName: U || "", badgeDescription: C || "" }, r = t && o, N = !G && t && j && !o && i, w = t && c, R = g(() => {
-    if (!o || !e) return null;
-    const n = document.getElementById(e);
-    return n ? Y.loadAnimation({
-      name: e,
-      container: n,
-      renderer: "svg",
-      loop: !0,
-      autoplay: !0,
-      animationData: JSON.parse(o)
-    }) : null;
-  }, [e, o]);
-  v(() => {
-    w && (A.current = new Image(), A.current.src = c, E(!1)), N && fetch(i).then((n) => n.json()).then((n) => {
-      y(JSON.stringify(n)), E(!1);
-    }).catch((n) => {
-      O(!0), E(!1), d("student_badge_animation_load_failed", {
-        studentBadgeId: e,
-        animationUrl: i,
-        error: n.message
-      });
-    });
-  }, [i, N, w, c, e, d]);
-  const F = g(() => {
-    !r || !f || (f("student-badges", {
-      badges: [
-        {
-          ...m,
-          animationData: o ? JSON.parse(o) : null
-        }
-      ],
-      invalidateRewardsHome: D
-    }), d("student_badge_clicked", {
-      studentBadgeId: e,
-      category: a,
-      badgeEarned: t
-    }));
-  }, [
-    r,
-    f,
-    m,
-    o,
-    D,
-    d,
-    e,
-    a,
-    t
-  ]), K = g(() => {
-    r && (R(), h(!0));
-  }, [R, r]), Q = g(() => {
-    r && (h(!1), Y.destroy(e));
-  }, [r, e]);
-  return {
-    badgeBackgroundColor: W,
-    badgeDescription: z,
-    badgeEarned: t,
-    badgeImage: V,
-    badgeName: q,
-    badgeProgress: p,
-    mouseEntered: P,
-    notEarnedMysterBadge: I,
-    onBadgeClick: F,
-    onBadgeMouseEnter: K,
-    onBadgeMouseLeave: Q,
-    showLoader: H,
-    showProgress: J,
-    studentBadgeId: e,
-    studentBadgeRef: u
-  };
-}
-export {
-  se as default
-};
-//# sourceMappingURL=use-student-badge-hook.js.map

package/dist/features/wins-dashboard/student-badges/hooks/use-student-badge-hook.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-student-badge-hook.js","sources":["../../../../../src/features/wins-dashboard/student-badges/hooks/use-student-badge-hook.ts"],"sourcesContent":["import lottie from 'lottie-web';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useUIContext } from '../../../ui/context/context';\nimport { getTheme } from '../../../ui/theme/get-theme';\nimport { BADGE_TYPE_BADGE_ICON, STUDENT_BADGE_STATUS, STUDENT_BADGE_TYPE } from '../../constants';\n\nconst { colors } = getTheme();\n\ninterface StudentBadgeModalData {\n  badges: Array<{\n    animation_url?: string;\n    animationData?: object;\n    category: string;\n    current_count?: number;\n    description?: string;\n    id: string;\n    image_url?: string;\n    name?: string;\n    state?: string;\n    total_count?: number;\n  }>;\n  invalidateRewardsHome?: () => void;\n}\n\ninterface UseStudentBadgeHookProps {\n  animation_url?: string;\n  category: string;\n  current_count?: number;\n  description?: string;\n  image_url?: string;\n  id: string;\n  invalidateRewardsHome?: () => void;\n  is_recent?: boolean;\n  name?: string;\n  openModal?: (modalType: string, data: StudentBadgeModalData) => void;\n  state?: string;\n  total_count?: number;\n}\n\nexport default function useStudentBadgeHook(props: UseStudentBadgeHookProps) {\n  const {\n    animation_url: animationUrl,\n    category,\n    current_count: currentCount,\n    description,\n    image_url: imageUrl,\n    id: studentBadgeId,\n    invalidateRewardsHome,\n    name,\n    openModal,\n    state,\n    total_count: totalCount,\n  } = props || {};\n\n  const { onEvent: trackEvent } = useUIContext();\n  const imageRef = useRef<HTMLImageElement | null>(null);\n  const studentBadgeRef = useRef<HTMLDivElement | null>(null);\n  const [lottieAnimationData, setLottieAnimationData] = useState<string | null>(null);\n  const [lottieLoadingError, setLottieLoadingError] = useState(false);\n  const [mouseEntered, setMouseEntered] = useState(false);\n\n  const badgeEarned = state !== STUDENT_BADGE_STATUS.UNASSIGNED;\n  const [showLoader, setShowLoader] = useState(badgeEarned);\n  const badgeProgress = currentCount && totalCount ? (currentCount / totalCount) * 100 : 0;\n  const showProgress = category !== STUDENT_BADGE_TYPE.MYSTERY && !badgeEarned && badgeProgress > 0;\n  const observerRef = useRef<IntersectionObserver | null>(null);\n  const [studentBadgeEntry, setStudentBadgeEntry] = useState<\n    IntersectionObserverEntry | undefined\n  >();\n\n  useEffect(() => {\n    if (!studentBadgeRef.current) return;\n\n    observerRef.current = new window.IntersectionObserver(\n      ([entry]) => {\n        setStudentBadgeEntry(entry);\n      },\n      {\n        threshold: 0.5,\n      },\n    );\n\n    observerRef.current.observe(studentBadgeRef.current);\n\n    return () => {\n      if (observerRef.current) {\n        observerRef.current.disconnect();\n      }\n    };\n  }, [studentBadgeRef]);\n\n  const studentBadgeVisible = studentBadgeEntry?.isIntersecting ?? false;\n\n  const badgeImage = badgeEarned\n    ? imageUrl || BADGE_TYPE_BADGE_ICON[category as keyof typeof BADGE_TYPE_BADGE_ICON]\n    : BADGE_TYPE_BADGE_ICON[category as keyof typeof BADGE_TYPE_BADGE_ICON];\n\n  const notEarnedMysterBadge = category === STUDENT_BADGE_TYPE.MYSTERY && !badgeEarned;\n  const badgeBackgroundColor =\n    category === STUDENT_BADGE_TYPE.MYSTERY ? colors.GREY_1 : colors.WHITE;\n\n  const { badgeName, badgeDescription } = notEarnedMysterBadge\n    ? { badgeName: '????', badgeDescription: '----------------' }\n    : { badgeName: name || '', badgeDescription: description || '' };\n\n  const showAnimation = badgeEarned && lottieAnimationData;\n  const loadAnimationData =\n    !lottieLoadingError &&\n    badgeEarned &&\n    studentBadgeVisible &&\n    !lottieAnimationData &&\n    animationUrl;\n  const loadBadgeImage = badgeEarned && imageUrl;\n\n  const loadBadgeAnimation = useCallback(() => {\n    if (!lottieAnimationData || !studentBadgeId) return null;\n\n    const container = document.getElementById(studentBadgeId);\n\n    if (!container) return null;\n\n    const anim = lottie.loadAnimation({\n      name: studentBadgeId,\n      container,\n      renderer: 'svg',\n      loop: true,\n      autoplay: true,\n      animationData: JSON.parse(lottieAnimationData),\n    });\n\n    return anim;\n  }, [studentBadgeId, lottieAnimationData]);\n\n  useEffect(() => {\n    if (loadBadgeImage) {\n      imageRef.current = new Image();\n      imageRef.current.src = imageUrl;\n      setShowLoader(false);\n    }\n\n    if (loadAnimationData) {\n      fetch(animationUrl)\n        .then(response => response.json())\n        .then(data => {\n          setLottieAnimationData(JSON.stringify(data));\n          setShowLoader(false);\n        })\n        .catch(error => {\n          setLottieLoadingError(true);\n          setShowLoader(false);\n          trackEvent('student_badge_animation_load_failed', {\n            studentBadgeId,\n            animationUrl,\n            error: error.message,\n          });\n        });\n    }\n  }, [animationUrl, loadAnimationData, loadBadgeImage, imageUrl, studentBadgeId, trackEvent]);\n\n  const onBadgeClick = useCallback(() => {\n    if (!showAnimation || !openModal) {\n      return;\n    }\n\n    openModal('student-badges', {\n      badges: [\n        {\n          ...props,\n          animationData: lottieAnimationData ? JSON.parse(lottieAnimationData) : null,\n        },\n      ],\n      invalidateRewardsHome,\n    });\n\n    trackEvent('student_badge_clicked', {\n      studentBadgeId,\n      category,\n      badgeEarned,\n    });\n  }, [\n    showAnimation,\n    openModal,\n    props,\n    lottieAnimationData,\n    invalidateRewardsHome,\n    trackEvent,\n    studentBadgeId,\n    category,\n    badgeEarned,\n  ]);\n\n  const onBadgeMouseEnter = useCallback(() => {\n    if (!showAnimation) {\n      return;\n    }\n\n    loadBadgeAnimation();\n    setMouseEntered(true);\n  }, [loadBadgeAnimation, showAnimation]);\n\n  const onBadgeMouseLeave = useCallback(() => {\n    if (!showAnimation) {\n      return;\n    }\n\n    setMouseEntered(false);\n    lottie.destroy(studentBadgeId);\n  }, [showAnimation, studentBadgeId]);\n\n  return {\n    badgeBackgroundColor,\n    badgeDescription,\n    badgeEarned,\n    badgeImage,\n    badgeName,\n    badgeProgress,\n    mouseEntered,\n    notEarnedMysterBadge,\n    onBadgeClick,\n    onBadgeMouseEnter,\n    onBadgeMouseLeave,\n    showLoader,\n    showProgress,\n    studentBadgeId,\n    studentBadgeRef,\n  };\n}\n"],"names":["colors","getTheme","useStudentBadgeHook","props","animationUrl","category","currentCount","description","imageUrl","studentBadgeId","invalidateRewardsHome","name","openModal","state","totalCount","trackEvent","useUIContext","imageRef","useRef","studentBadgeRef","lottieAnimationData","setLottieAnimationData","useState","lottieLoadingError","setLottieLoadingError","mouseEntered","setMouseEntered","badgeEarned","STUDENT_BADGE_STATUS","showLoader","setShowLoader","badgeProgress","showProgress","STUDENT_BADGE_TYPE","observerRef","studentBadgeEntry","setStudentBadgeEntry","useEffect","entry","studentBadgeVisible","badgeImage","BADGE_TYPE_BADGE_ICON","notEarnedMysterBadge","badgeBackgroundColor","badgeName","badgeDescription","showAnimation","loadAnimationData","loadBadgeImage","loadBadgeAnimation","useCallback","container","lottie","response","data","error","onBadgeClick","onBadgeMouseEnter","onBadgeMouseLeave"],"mappings":"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"}