@cuemath/leap 3.2.23-as1 → 3.2.23-m

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

@@ -1,135 +0,0 @@
-import { useRef as a, useMemo as R, useState as y, useEffect as j, useCallback as O } from "react";
-import { css as l } from "styled-components";
-import { STUDENT_BADGE_TYPE as e, BADGE_TYPE_TAB_ICON as W } from "../../constants.js";
-const b = 64, w = 48, A = b + w, m = {
-  TABLET: 768,
-  LAPTOP: 1024,
-  LAPTOPL: 1440
-}, $ = (n) => {
-  if (n > m.LAPTOPL)
-    return {
-      badgeWidth: 140,
-      badgeCategoryGap: 40,
-      badgeCategoryWidth: 1040,
-      maxBadgeNameLines: 1,
-      containerStyle: l`
-        grid-template-columns: repeat(auto-fit, 140px);
-        grid-column-gap: 40px;
-        margin-top: 32px;
-      `
-    };
-  if (n > m.LAPTOP) {
-    const u = (n - 440) / 6;
-    return {
-      badgeWidth: u,
-      badgeCategoryGap: 40,
-      badgeCategoryWidth: n - 2 * 120,
-      maxBadgeNameLines: 1,
-      containerStyle: l`
-        grid-template-columns: repeat(auto-fit, ${u}px);
-        grid-column-gap: 40px;
-        margin-top: 32px;
-      `
-    };
-  }
-  if (n > m.TABLET)
-    return {
-      badgeWidth: 104,
-      badgeCategoryGap: 24,
-      badgeCategoryWidth: 784,
-      maxBadgeNameLines: 2,
-      containerStyle: l`
-        grid-column-gap: 32px;
-        grid-template-columns: repeat(auto-fit, 104px);
-        margin-top: 24px;
-      `
-    };
-  const g = 40, p = (n - (2 * g + 5 * 26)) / 6;
-  return {
-    badgeWidth: p,
-    badgeCategoryGap: 24,
-    badgeCategoryWidth: n - 2 * g,
-    maxBadgeNameLines: 2,
-    containerStyle: l`
-      grid-column-gap: 26px;
-      grid-template-columns: repeat(auto-fit, ${p}px);
-      margin-top: 24px;
-    `
-  };
-};
-function q({
-  currentScreenWidth: n,
-  handleScrollTo: g,
-  scrollPosition: d,
-  userBadges: p
-}) {
-  const B = a(null), C = a(null), u = a(null), x = a(null), L = a(null), G = a(null), M = a(null), N = a(null), P = a(null), S = a(null), _ = a(null), H = a(null), I = R(
-    () => ({
-      [e.COMMON]: B,
-      [e.RARE]: C,
-      [e.EPIC]: u,
-      [e.LEGENDARY]: x,
-      [e.MYTHIC]: L,
-      [e.MYSTERY]: G
-    }),
-    []
-  ), c = R(
-    () => ({
-      [e.COMMON]: M,
-      [e.RARE]: N,
-      [e.EPIC]: P,
-      [e.LEGENDARY]: S,
-      [e.MYTHIC]: _,
-      [e.MYSTERY]: H
-    }),
-    []
-  ), [f, E] = y(!1), [T, Y] = y(
-    e.COMMON
-  );
-  j(() => {
-    const t = Object.keys(c).reverse().find((o) => {
-      var i;
-      const s = c[o], r = (i = s == null ? void 0 : s.current) == null ? void 0 : i.offsetTop;
-      return typeof r != "number" ? !1 : d >= r - (o === e.COMMON ? b : A);
-    });
-    t && t !== T && Y(t), t && !f && E(!0), !t && f && E(!1);
-  }, [c, T, d, f]);
-  const h = O(
-    (t) => {
-      var r;
-      const o = c[t], s = (r = o == null ? void 0 : o.current) == null ? void 0 : r.offsetTop;
-      if (typeof s == "number") {
-        const i = s - (t === e.COMMON ? b : A);
-        g(i);
-      }
-    },
-    [c, g]
-  ), D = O(() => {
-    g(0);
-  }, [g]), k = () => {
-    const t = [];
-    return Object.keys(p).forEach((o) => {
-      const s = W[o], r = I[o];
-      s && r && t.push({
-        id: o,
-        title: o,
-        Icon: s,
-        ref: r
-      });
-    }), t;
-  };
-  return {
-    badgeCategoryRefs: c,
-    categoryConfig: $(n),
-    currentSelectedBadgeType: T,
-    onTabClick: h,
-    scrollToTop: D,
-    showTabBar: f,
-    tabs: k(),
-    totalBadgeCategories: Object.keys(p).length
-  };
-}
-export {
-  q as default
-};
-//# sourceMappingURL=use-student-badge-list-hook.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"use-student-badge-list-hook.js","sources":["../../../../../src/features/wins-dashboard/student-badges/hooks/use-student-badge-list-hook.ts"],"sourcesContent":["import type { FC } from 'react';\nimport type React from 'react';\nimport type { RuleSet } from 'styled-components';\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { css } from 'styled-components';\n\nimport { BADGE_TYPE_TAB_ICON, STUDENT_BADGE_TYPE } from '../../constants';\n\nconst HEADER_HEIGHT = 64;\nconst TAB_BAR_HEIGHT = 48;\nconst TOTAL_TAB_BAR_HEIGHT = HEADER_HEIGHT + TAB_BAR_HEIGHT;\n\n// Screen sizes constants\nconst SCREEN_SIZES = {\n  TABLET: 768,\n  LAPTOP: 1024,\n  LAPTOPL: 1440,\n};\n\ninterface CategoryConfig {\n  badgeWidth: number;\n  badgeCategoryGap: number;\n  badgeCategoryWidth: number;\n  maxBadgeNameLines: number;\n  containerStyle: RuleSet<object>;\n}\n\nconst getBadgeContainerConfig = (containerWidth: number): CategoryConfig => {\n  if (containerWidth > SCREEN_SIZES.LAPTOPL) {\n    return {\n      badgeWidth: 140,\n      badgeCategoryGap: 40,\n      badgeCategoryWidth: 1040,\n      maxBadgeNameLines: 1,\n      containerStyle: css`\n        grid-template-columns: repeat(auto-fit, 140px);\n        grid-column-gap: 40px;\n        margin-top: 32px;\n      `,\n    };\n  }\n\n  if (containerWidth > SCREEN_SIZES.LAPTOP) {\n    const gutter = 120;\n    const badgeGap = 40;\n    const badgeWidth = (containerWidth - (2 * gutter + 5 * badgeGap)) / 6;\n\n    return {\n      badgeWidth,\n      badgeCategoryGap: 40,\n      badgeCategoryWidth: containerWidth - 2 * gutter,\n      maxBadgeNameLines: 1,\n      containerStyle: css`\n        grid-template-columns: repeat(auto-fit, ${badgeWidth}px);\n        grid-column-gap: 40px;\n        margin-top: 32px;\n      `,\n    };\n  }\n\n  if (containerWidth > SCREEN_SIZES.TABLET) {\n    return {\n      badgeWidth: 104,\n      badgeCategoryGap: 24,\n      badgeCategoryWidth: 784,\n      maxBadgeNameLines: 2,\n      containerStyle: css`\n        grid-column-gap: 32px;\n        grid-template-columns: repeat(auto-fit, 104px);\n        margin-top: 24px;\n      `,\n    };\n  }\n\n  const gutter = 40;\n  const badgeGap = 26;\n  const badgeWidth = (containerWidth - (2 * gutter + 5 * badgeGap)) / 6;\n\n  return {\n    badgeWidth,\n    badgeCategoryGap: 24,\n    badgeCategoryWidth: containerWidth - 2 * gutter,\n    maxBadgeNameLines: 2,\n    containerStyle: css`\n      grid-column-gap: 26px;\n      grid-template-columns: repeat(auto-fit, ${badgeWidth}px);\n      margin-top: 24px;\n    `,\n  };\n};\n\nexport default function useStudentBadgeListHook({\n  currentScreenWidth,\n  handleScrollTo,\n  scrollPosition,\n  userBadges,\n}: {\n  currentScreenWidth: number;\n  handleScrollTo: (position: number) => void;\n  scrollPosition: number;\n  userBadges: Record<string, unknown[]>;\n}) {\n  // Create refs for all possible badge categories\n  const commonTabRef = useRef<HTMLDivElement | null>(null);\n  const rareTabRef = useRef<HTMLDivElement | null>(null);\n  const epicTabRef = useRef<HTMLDivElement | null>(null);\n  const legendaryTabRef = useRef<HTMLDivElement | null>(null);\n  const mythicTabRef = useRef<HTMLDivElement | null>(null);\n  const mysteryTabRef = useRef<HTMLDivElement | null>(null);\n\n  const commonBadgeRef = useRef<HTMLDivElement | null>(null);\n  const rareBadgeRef = useRef<HTMLDivElement | null>(null);\n  const epicBadgeRef = useRef<HTMLDivElement | null>(null);\n  const legendaryBadgeRef = useRef<HTMLDivElement | null>(null);\n  const mythicBadgeRef = useRef<HTMLDivElement | null>(null);\n  const mysteryBadgeRef = useRef<HTMLDivElement | null>(null);\n\n  const tabBarRefs: Record<string, React.RefObject<HTMLDivElement | null>> = useMemo(\n    () => ({\n      [STUDENT_BADGE_TYPE.COMMON]: commonTabRef,\n      [STUDENT_BADGE_TYPE.RARE]: rareTabRef,\n      [STUDENT_BADGE_TYPE.EPIC]: epicTabRef,\n      [STUDENT_BADGE_TYPE.LEGENDARY]: legendaryTabRef,\n      [STUDENT_BADGE_TYPE.MYTHIC]: mythicTabRef,\n      [STUDENT_BADGE_TYPE.MYSTERY]: mysteryTabRef,\n    }),\n    [],\n  );\n\n  const badgeCategoryRefs: Record<string, React.RefObject<HTMLDivElement | null>> = useMemo(\n    () => ({\n      [STUDENT_BADGE_TYPE.COMMON]: commonBadgeRef,\n      [STUDENT_BADGE_TYPE.RARE]: rareBadgeRef,\n      [STUDENT_BADGE_TYPE.EPIC]: epicBadgeRef,\n      [STUDENT_BADGE_TYPE.LEGENDARY]: legendaryBadgeRef,\n      [STUDENT_BADGE_TYPE.MYTHIC]: mythicBadgeRef,\n      [STUDENT_BADGE_TYPE.MYSTERY]: mysteryBadgeRef,\n    }),\n    [],\n  );\n\n  const [showTabBar, setShowTabBar] = useState(false);\n  const [currentSelectedBadgeType, setCurrentSelectedBadgeType] = useState(\n    STUDENT_BADGE_TYPE.COMMON,\n  );\n\n  useEffect(() => {\n    const categoryReached = Object.keys(badgeCategoryRefs)\n      .reverse()\n      .find(category => {\n        const categoryRef = badgeCategoryRefs[category];\n        const categoryTopOffset = categoryRef?.current?.offsetTop;\n\n        if (typeof categoryTopOffset !== 'number') return false;\n\n        return (\n          scrollPosition >=\n          categoryTopOffset -\n            (category === STUDENT_BADGE_TYPE.COMMON ? HEADER_HEIGHT : TOTAL_TAB_BAR_HEIGHT)\n        );\n      });\n\n    if (categoryReached && categoryReached !== currentSelectedBadgeType) {\n      setCurrentSelectedBadgeType(categoryReached);\n    }\n\n    if (categoryReached && !showTabBar) {\n      setShowTabBar(true);\n    }\n\n    if (!categoryReached && showTabBar) {\n      setShowTabBar(false);\n    }\n  }, [badgeCategoryRefs, currentSelectedBadgeType, scrollPosition, showTabBar]);\n\n  const onTabClick = useCallback(\n    (category: string) => {\n      const categoryRef = badgeCategoryRefs[category];\n      const categoryTopOffset = categoryRef?.current?.offsetTop;\n\n      if (typeof categoryTopOffset === 'number') {\n        const scrollTopPosition =\n          categoryTopOffset -\n          (category === STUDENT_BADGE_TYPE.COMMON ? HEADER_HEIGHT : TOTAL_TAB_BAR_HEIGHT);\n\n        handleScrollTo(scrollTopPosition);\n      }\n    },\n    [badgeCategoryRefs, handleScrollTo],\n  );\n\n  const scrollToTop = useCallback(() => {\n    const scrollTopPosition = 0;\n\n    handleScrollTo(scrollTopPosition);\n  }, [handleScrollTo]);\n\n  const getTabBarData = (): Array<{\n    id: string;\n    title: string;\n    Icon: FC<{ color?: string; selected?: boolean }>;\n    ref: React.RefObject<HTMLDivElement | null>;\n  }> => {\n    const tabBarData: Array<{\n      id: string;\n      title: string;\n      Icon: FC<{ color?: string; selected?: boolean }>;\n      ref: React.RefObject<HTMLDivElement | null>;\n    }> = [];\n\n    Object.keys(userBadges).forEach(category => {\n      const Icon = BADGE_TYPE_TAB_ICON[category];\n      const ref = tabBarRefs[category];\n\n      if (Icon && ref) {\n        tabBarData.push({\n          id: category,\n          title: category,\n          Icon,\n          ref,\n        });\n      }\n    });\n\n    return tabBarData;\n  };\n\n  return {\n    badgeCategoryRefs,\n    categoryConfig: getBadgeContainerConfig(currentScreenWidth),\n    currentSelectedBadgeType,\n    onTabClick,\n    scrollToTop,\n    showTabBar,\n    tabs: getTabBarData(),\n    totalBadgeCategories: Object.keys(userBadges).length,\n  };\n}\n"],"names":["HEADER_HEIGHT","TAB_BAR_HEIGHT","TOTAL_TAB_BAR_HEIGHT","SCREEN_SIZES","getBadgeContainerConfig","containerWidth","css","badgeWidth","gutter","useStudentBadgeListHook","currentScreenWidth","handleScrollTo","scrollPosition","userBadges","commonTabRef","useRef","rareTabRef","epicTabRef","legendaryTabRef","mythicTabRef","mysteryTabRef","commonBadgeRef","rareBadgeRef","epicBadgeRef","legendaryBadgeRef","mythicBadgeRef","mysteryBadgeRef","tabBarRefs","useMemo","STUDENT_BADGE_TYPE","badgeCategoryRefs","showTabBar","setShowTabBar","useState","currentSelectedBadgeType","setCurrentSelectedBadgeType","useEffect","categoryReached","category","categoryRef","categoryTopOffset","_a","onTabClick","useCallback","scrollTopPosition","scrollToTop","getTabBarData","tabBarData","Icon","BADGE_TYPE_TAB_ICON","ref"],"mappings":"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"}

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

@@ -1,161 +0,0 @@
-import { jsxs as s, jsx as o, Fragment as C } from "react/jsx-runtime";
-import t, { css as _, keyframes as I } from "styled-components";
-import i from "../../ui/layout/flex-view.js";
-import L from "../../ui/separator/separator.js";
-import u from "../../ui/text/text.js";
-import { getTheme as T } from "../../ui/theme/get-theme.js";
-import M from "./hooks/use-student-badge-hook.js";
-const { colors: n } = T(), d = 20, S = (e) => I`
-  0% {
-    background-position: -${e}px 0;
-  }
-  80%, 100% {
-    background-position: ${e}px 0;
-  }
-`, W = t.div`
-  display: flex;
-  width: ${({ $badgeWidth: e }) => e}px;
-  height: ${({ $badgeWidth: e }) => e}px;
-  background: linear-gradient(
-    92.42deg,
-    ${n.GREY_1}40 1.94%,
-    ${n.GREY_1} 48.8%,
-    ${n.GREY_1}40 97.88%
-  );
-  background-size: 200% 100%;
-  animation-name: ${({ $badgeWidth: e }) => S(e)};
-  animation-duration: 2s;
-  animation-iteration-count: infinite;
-  background-repeat: no-repeat;
-  background-color: ${n.WHITE};
-  opacity: 0.5;
-`, G = t(i)`
-  position: absolute;
-  top: 0;
-  right: 0;
-  background: ${n.ORANGE_3};
-  border-radius: 0px 8px;
-  padding: 2px 8px;
-  z-index: 1;
-`, N = t(i)`
-  cursor: ${(e) => e.$isEarned ? "pointer" : "default"};
-`, P = t(i)`
-  position: relative;
-  border-radius: 8px;
-  overflow: hidden;
-`, z = t(i)`
-  position: relative;
-  border-radius: 8px;
-  overflow: hidden;
-  background: ${({ $backgroundColor: e }) => e};
-  opacity: ${({ $badgeEarned: e }) => e ? 1 : 0.5};
-
-  ${({ $notEarnedMysterBadge: e }) => e && _`
-      mix-blend-mode: luminosity;
-    `}
-`, H = t.img`
-  opacity: ${(e) => e.$mouseEntered ? 0 : 1};
-`, O = t(i)`
-  position: absolute;
-  bottom: 0;
-`, Y = t(i)`
-  position: relative;
-  overflow: hidden;
-`, j = t(i)`
-  position: absolute;
-  left: 0;
-  top: 0;
-  height: 100%;
-  transition: width 300ms ease-in-out;
-`, p = t(u)`
-  display: -webkit-box;
-  -webkit-line-clamp: ${({ $numberOfLines: e }) => e};
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-`, D = t(i)`
-  height: ${({ $badgeSize: e }) => e + d}px;
-  left: ${-d / 2}px;
-  opacity: ${({ $mouseEntered: e }) => e ? 1 : 0};
-  position: absolute;
-  top: ${-d / 2}px;
-  width: ${({ $badgeSize: e }) => e + d}px;
-`, J = (e) => {
-  const { is_recent: h, badgeWidth: r, maxBadgeNameLines: g = 1, image_url: m } = e, {
-    badgeBackgroundColor: $,
-    badgeDescription: b,
-    badgeEarned: a,
-    badgeImage: x,
-    badgeName: f,
-    badgeProgress: E,
-    mouseEntered: c,
-    notEarnedMysterBadge: k,
-    onBadgeClick: w,
-    onBadgeMouseEnter: B,
-    onBadgeMouseLeave: y,
-    showLoader: v,
-    showProgress: R,
-    studentBadgeId: l,
-    studentBadgeRef: A
-  } = M(e);
-  return /* @__PURE__ */ s(
-    N,
-    {
-      onClick: w,
-      ref: A,
-      $width: r,
-      $isEarned: a,
-      children: [
-        /* @__PURE__ */ o(P, { children: v ? /* @__PURE__ */ o(W, { $badgeWidth: r }) : /* @__PURE__ */ s(C, { children: [
-          /* @__PURE__ */ s(
-            z,
-            {
-              $backgroundColor: $,
-              $badgeEarned: a,
-              $notEarnedMysterBadge: k,
-              onMouseEnter: B,
-              onMouseLeave: y,
-              children: [
-                h && /* @__PURE__ */ o(G, { children: /* @__PURE__ */ o(u, { $renderAs: "cta2", children: "NEW" }) }),
-                a ? /* @__PURE__ */ o(
-                  H,
-                  {
-                    $mouseEntered: c,
-                    src: m,
-                    alt: "badge-placeholder",
-                    width: r,
-                    height: r
-                  }
-                ) : /* @__PURE__ */ o(
-                  "img",
-                  {
-                    src: x,
-                    alt: "badge-placeholder",
-                    width: r,
-                    height: r
-                  }
-                ),
-                /* @__PURE__ */ o(
-                  D,
-                  {
-                    id: l,
-                    $mouseEntered: c,
-                    $badgeSize: r
-                  }
-                )
-              ]
-            }
-          ),
-          R && /* @__PURE__ */ o(O, { $width: r, children: /* @__PURE__ */ o(Y, { $height: 4, $borderRadius: 2, $width: "100%", $background: "WHITE", children: /* @__PURE__ */ o(j, { $width: `${E}%`, $borderRadius: 2, $background: "BLACK" }) }) })
-        ] }) }),
-        /* @__PURE__ */ o(L, { height: 8 }),
-        /* @__PURE__ */ o(p, { $renderAs: "cta2", $numberOfLines: g, children: f }),
-        /* @__PURE__ */ o(p, { $renderAs: "body3", $numberOfLines: g + 1, children: b })
-      ]
-    },
-    l
-  );
-};
-export {
-  J as default
-};
-//# sourceMappingURL=student-badge.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"student-badge.js","sources":["../../../../src/features/wins-dashboard/student-badges/student-badge.tsx"],"sourcesContent":["import React from 'react';\nimport styled, { css, keyframes } from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\nimport { getTheme } from '../../ui/theme/get-theme';\nimport useStudentBadgeHook from './hooks/use-student-badge-hook';\n\nconst { colors } = getTheme();\n\nconst EXTRA_BADGE_SIZE = 20;\n\nconst shimmer = (badgeWidth: number) => keyframes`\n  0% {\n    background-position: -${badgeWidth}px 0;\n  }\n  80%, 100% {\n    background-position: ${badgeWidth}px 0;\n  }\n`;\n\nconst BadgePlaceholder = styled.div<{ $badgeWidth: number }>`\n  display: flex;\n  width: ${({ $badgeWidth }) => $badgeWidth}px;\n  height: ${({ $badgeWidth }) => $badgeWidth}px;\n  background: linear-gradient(\n    92.42deg,\n    ${colors.GREY_1}40 1.94%,\n    ${colors.GREY_1} 48.8%,\n    ${colors.GREY_1}40 97.88%\n  );\n  background-size: 200% 100%;\n  animation-name: ${({ $badgeWidth }) => shimmer($badgeWidth)};\n  animation-duration: 2s;\n  animation-iteration-count: infinite;\n  background-repeat: no-repeat;\n  background-color: ${colors.WHITE};\n  opacity: 0.5;\n`;\n\nconst NewTag = styled(FlexView)`\n  position: absolute;\n  top: 0;\n  right: 0;\n  background: ${colors.ORANGE_3};\n  border-radius: 0px 8px;\n  padding: 2px 8px;\n  z-index: 1;\n`;\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\nexport interface StudentBadgeProps {\n  animation_url?: string;\n  category: string;\n  current_count?: number;\n  description?: string;\n  id: string;\n  image_url?: 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  badgeWidth: number;\n  maxBadgeNameLines: number;\n}\n\nconst Wrapper = styled(FlexView)<{ $isEarned: boolean }>`\n  cursor: ${props => (props.$isEarned ? 'pointer' : 'default')};\n`;\nconst StudentBadgeWrapper = styled(FlexView)`\n  position: relative;\n  border-radius: 8px;\n  overflow: hidden;\n`;\n\nconst BadgeImageContainer = styled(FlexView)<{\n  $backgroundColor: string;\n  $badgeEarned: boolean;\n  $notEarnedMysterBadge: boolean;\n}>`\n  position: relative;\n  border-radius: 8px;\n  overflow: hidden;\n  background: ${({ $backgroundColor }) => $backgroundColor};\n  opacity: ${({ $badgeEarned }) => ($badgeEarned ? 1 : 0.5)};\n\n  ${({ $notEarnedMysterBadge }) =>\n    $notEarnedMysterBadge &&\n    css`\n      mix-blend-mode: luminosity;\n    `}\n`;\n\nconst BadgeImage = styled.img<{ $mouseEntered?: boolean }>`\n  opacity: ${props => (props.$mouseEntered ? 0 : 1)};\n`;\n\nconst ProgressContainer = styled(FlexView)`\n  position: absolute;\n  bottom: 0;\n`;\n\nconst Background = styled(FlexView)`\n  position: relative;\n  overflow: hidden;\n`;\n\nconst Progress = styled(FlexView)`\n  position: absolute;\n  left: 0;\n  top: 0;\n  height: 100%;\n  transition: width 300ms ease-in-out;\n`;\n\nconst BadgeText = styled(Text)<{ $numberOfLines: number }>`\n  display: -webkit-box;\n  -webkit-line-clamp: ${({ $numberOfLines }) => $numberOfLines};\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n`;\n\nconst AnimationContainer = styled(FlexView)<{ $badgeSize: number; $mouseEntered: boolean }>`\n  height: ${({ $badgeSize }) => $badgeSize + EXTRA_BADGE_SIZE}px;\n  left: ${-EXTRA_BADGE_SIZE / 2}px;\n  opacity: ${({ $mouseEntered }) => ($mouseEntered ? 1 : 0)};\n  position: absolute;\n  top: ${-EXTRA_BADGE_SIZE / 2}px;\n  width: ${({ $badgeSize }) => $badgeSize + EXTRA_BADGE_SIZE}px;\n`;\n\nconst StudentBadge: React.FC<StudentBadgeProps> = props => {\n  const { is_recent: isRecent, badgeWidth, maxBadgeNameLines = 1, image_url: imageUrl } = props;\n\n  const {\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  } = useStudentBadgeHook(props);\n\n  return (\n    <Wrapper\n      onClick={onBadgeClick}\n      ref={studentBadgeRef}\n      $width={badgeWidth}\n      $isEarned={badgeEarned}\n      key={studentBadgeId}\n    >\n      <StudentBadgeWrapper>\n        {showLoader ? (\n          <BadgePlaceholder $badgeWidth={badgeWidth} />\n        ) : (\n          <>\n            <BadgeImageContainer\n              $backgroundColor={badgeBackgroundColor}\n              $badgeEarned={badgeEarned}\n              $notEarnedMysterBadge={notEarnedMysterBadge}\n              onMouseEnter={onBadgeMouseEnter}\n              onMouseLeave={onBadgeMouseLeave}\n            >\n              {isRecent && (\n                <NewTag>\n                  <Text $renderAs=\"cta2\">NEW</Text>\n                </NewTag>\n              )}\n              {badgeEarned ? (\n                <BadgeImage\n                  $mouseEntered={mouseEntered}\n                  src={imageUrl}\n                  alt=\"badge-placeholder\"\n                  width={badgeWidth}\n                  height={badgeWidth}\n                />\n              ) : (\n                <img\n                  src={badgeImage}\n                  alt=\"badge-placeholder\"\n                  width={badgeWidth}\n                  height={badgeWidth}\n                />\n              )}\n              <AnimationContainer\n                id={studentBadgeId}\n                $mouseEntered={mouseEntered}\n                $badgeSize={badgeWidth}\n              />\n            </BadgeImageContainer>\n            {showProgress && (\n              <ProgressContainer $width={badgeWidth}>\n                <Background $height={4} $borderRadius={2} $width={'100%'} $background=\"WHITE\">\n                  <Progress $width={`${badgeProgress}%`} $borderRadius={2} $background=\"BLACK\" />\n                </Background>\n              </ProgressContainer>\n            )}\n          </>\n        )}\n      </StudentBadgeWrapper>\n      <Separator height={8} />\n      <BadgeText $renderAs=\"cta2\" $numberOfLines={maxBadgeNameLines}>\n        {badgeName}\n      </BadgeText>\n      <BadgeText $renderAs=\"body3\" $numberOfLines={maxBadgeNameLines + 1}>\n        {badgeDescription}\n      </BadgeText>\n    </Wrapper>\n  );\n};\n\nexport default StudentBadge;\n"],"names":["colors","getTheme","EXTRA_BADGE_SIZE","shimmer","badgeWidth","keyframes","BadgePlaceholder","styled","$badgeWidth","NewTag","FlexView","Wrapper","props","StudentBadgeWrapper","BadgeImageContainer","$backgroundColor","$badgeEarned","$notEarnedMysterBadge","css","BadgeImage","ProgressContainer","Background","Progress","BadgeText","Text","$numberOfLines","AnimationContainer","$badgeSize","$mouseEntered","StudentBadge","isRecent","maxBadgeNameLines","imageUrl","badgeBackgroundColor","badgeDescription","badgeEarned","badgeImage","badgeName","badgeProgress","mouseEntered","notEarnedMysterBadge","onBadgeClick","onBadgeMouseEnter","onBadgeMouseLeave","showLoader","showProgress","studentBadgeId","studentBadgeRef","useStudentBadgeHook","jsxs","jsx","Fragment","Separator"],"mappings":"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"}

package/dist/features/wins-dashboard/student-badges/student-badges-lists.js

@@ -1,136 +0,0 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import i, { css as G } from "styled-components";
-import S from "../../../assets/line-icons/icons/up.js";
-import o from "../../ui/layout/flex-view.js";
-import $ from "../../ui/text/text.js";
-import { BADGE_TYPE_BACKGROUND as F, BADGE_TYPE_TAB_ICON as _ } from "../constants.js";
-import j from "./animated-tabbar.js";
-import L from "./hooks/use-student-badge-list-hook.js";
-import O from "./student-badge.js";
-const g = 64, { innerHeight: R } = window, N = i(o)`
-  width: 100%;
-  background-color: ${({ $backgroundColor: t }) => t};
-  padding: ${({ $badgeCategoryGap: t }) => t}px 0;
-  align-items: center;
-  ${({ $isLastCategory: t }) => t && G`
-      min-height: ${R - g}px;
-    `}
-`, Y = i(o)`
-  position: fixed;
-  top: ${({ $topOffset: t }) => t}px;
-  width: ${({ $width: t }) => t}px;
-  z-index: 1;
-  transition: transform 200ms linear;
-  transform: translateY(${({ $visible: t }) => t ? g : 0}px);
-`, v = i(o)`
-  position: fixed;
-  top: ${window.innerHeight - 100}px;
-  right: 40px;
-  width: 48px;
-  height: 48px;
-  border: 1px solid black;
-  background: ${({ theme: t }) => t.colors.WHITE};
-  border-radius: 24px;
-  cursor: pointer;
-  opacity: ${({ $showTabBar: t }) => t ? 1 : 0};
-  transition: all 100ms linear;
-`, U = i.div`
-  display: grid;
-  grid-row-gap: 16px;
-  ${({ $containerStyle: t }) => t};
-`, W = ({
-  invalidateRewardsHome: t,
-  openModal: m,
-  topOffset: h = 0,
-  userBadges: n,
-  currentScreenWidth: a,
-  handleScrollTo: f,
-  scrollPosition: x
-}) => {
-  const {
-    badgeCategoryRefs: w,
-    categoryConfig: u,
-    currentSelectedBadgeType: y,
-    onTabClick: B,
-    scrollToTop: C,
-    showTabBar: c,
-    tabs: T,
-    totalBadgeCategories: b
-  } = L({
-    currentScreenWidth: a,
-    handleScrollTo: f,
-    scrollPosition: x,
-    userBadges: n
-  }), { badgeCategoryGap: I, badgeCategoryWidth: d, containerStyle: E, badgeWidth: k, maxBadgeNameLines: A } = u;
-  return /* @__PURE__ */ s(o, { $alignItems: "center", children: [
-    /* @__PURE__ */ e(
-      Y,
-      {
-        $flexDirection: "row",
-        $background: "WHITE",
-        $visible: c,
-        $justifyContent: "center",
-        $width: a,
-        $topOffset: h,
-        children: /* @__PURE__ */ e(o, { $width: d, children: /* @__PURE__ */ e(
-          j,
-          {
-            tabs: T,
-            selectedTabId: y,
-            onTabClick: B,
-            currentScreenWidth: a
-          }
-        ) })
-      }
-    ),
-    /* @__PURE__ */ e(o, { $flexDirection: "row", $gap: 16, $width: d, children: /* @__PURE__ */ e($, { $renderAs: "h5", children: "BADGES" }) }),
-    Object.keys(n).map((r, H) => {
-      const l = _[r];
-      return /* @__PURE__ */ e(
-        N,
-        {
-          $backgroundColor: F[r] || "#FFFFFF",
-          $badgeCategoryGap: I,
-          $isLastCategory: H === b - 1,
-          ref: w[r],
-          children: /* @__PURE__ */ s(o, { $width: d, children: [
-            /* @__PURE__ */ s(o, { $flexDirection: "row", $flexGap: 8, $alignItems: "center", children: [
-              typeof l == "function" ? /* @__PURE__ */ e(l, {}) : null,
-              /* @__PURE__ */ e($, { $renderAs: "eyebrow1", children: r })
-            ] }),
-            /* @__PURE__ */ e(U, { $containerStyle: E, children: (n[r] || []).map((p) => {
-              const { id: D } = p || {};
-              return /* @__PURE__ */ e(
-                O,
-                {
-                  ...p,
-                  category: r,
-                  openModal: m,
-                  badgeWidth: k,
-                  maxBadgeNameLines: A,
-                  invalidateRewardsHome: t
-                },
-                D
-              );
-            }) })
-          ] })
-        },
-        r
-      );
-    }),
-    /* @__PURE__ */ e(
-      v,
-      {
-        $justifyContent: "center",
-        $alignItems: "center",
-        $showTabBar: c,
-        onClick: C,
-        children: /* @__PURE__ */ e(S, {})
-      }
-    )
-  ] });
-}, Z = W;
-export {
-  Z as default
-};
-//# sourceMappingURL=student-badges-lists.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"student-badges-lists.js","sources":["../../../../src/features/wins-dashboard/student-badges/student-badges-lists.tsx"],"sourcesContent":["import type { Badge } from './mock/badges-list-mock';\nimport type { RuleSet } from 'styled-components';\n\nimport styled, { css } from 'styled-components';\n\nimport UpIcon from '../../../assets/line-icons/icons/up';\nimport FlexView from '../../ui/layout/flex-view';\nimport Text from '../../ui/text/text';\nimport { BADGE_TYPE_BACKGROUND, BADGE_TYPE_TAB_ICON } from '../constants';\nimport AnimatedTabBar from './animated-tabbar';\nimport useStudentBadgeListHook from './hooks/use-student-badge-list-hook';\nimport StudentBadge from './student-badge';\n\nconst HEADER_HEIGHT = 64;\nconst { innerHeight: windowHeight } = window;\n\nconst StudentBadgesContainer = styled(FlexView)<{\n  $backgroundColor: string;\n  $badgeCategoryGap: number;\n  $isLastCategory: boolean;\n}>`\n  width: 100%;\n  background-color: ${({ $backgroundColor }) => $backgroundColor};\n  padding: ${({ $badgeCategoryGap }) => $badgeCategoryGap}px 0;\n  align-items: center;\n  ${({ $isLastCategory }) =>\n    $isLastCategory &&\n    css`\n      min-height: ${windowHeight - HEADER_HEIGHT}px;\n    `}\n`;\n\nconst TabBarContainer = styled(FlexView)<{\n  $topOffset: number;\n  $width: number;\n  $visible: boolean;\n}>`\n  position: fixed;\n  top: ${({ $topOffset }) => $topOffset}px;\n  width: ${({ $width }) => $width}px;\n  z-index: 1;\n  transition: transform 200ms linear;\n  transform: translateY(${({ $visible }) => ($visible ? HEADER_HEIGHT : 0)}px);\n`;\n\nconst ScrollTopButton = styled(FlexView)<{ $showTabBar: boolean }>`\n  position: fixed;\n  top: ${window.innerHeight - 100}px;\n  right: 40px;\n  width: 48px;\n  height: 48px;\n  border: 1px solid black;\n  background: ${({ theme }) => theme.colors.WHITE};\n  border-radius: 24px;\n  cursor: pointer;\n  opacity: ${({ $showTabBar }) => ($showTabBar ? 1 : 0)};\n  transition: all 100ms linear;\n`;\n\nconst CustomRow = styled.div<{ $containerStyle: RuleSet<object> }>`\n  display: grid;\n  grid-row-gap: 16px;\n  ${({ $containerStyle }) => $containerStyle};\n`;\n\ninterface StudentBadgeListProps {\n  invalidateRewardsHome: () => void;\n  openModal: (modal: string, props?: unknown) => void;\n  topOffset?: number;\n  userBadges: Record<string, Badge[]>;\n  currentScreenWidth: number;\n  handleScrollTo: (position: number) => void;\n  scrollPosition: number;\n}\n\nconst StudentBadgeList = ({\n  invalidateRewardsHome,\n  openModal,\n  topOffset = 0,\n  userBadges,\n  currentScreenWidth,\n  handleScrollTo,\n  scrollPosition,\n}: StudentBadgeListProps) => {\n  const {\n    badgeCategoryRefs,\n    categoryConfig,\n    currentSelectedBadgeType,\n    onTabClick,\n    scrollToTop,\n    showTabBar,\n    tabs,\n    totalBadgeCategories,\n  } = useStudentBadgeListHook({\n    currentScreenWidth,\n    handleScrollTo,\n    scrollPosition,\n    userBadges,\n  });\n\n  const { badgeCategoryGap, badgeCategoryWidth, containerStyle, badgeWidth, maxBadgeNameLines } =\n    categoryConfig;\n\n  return (\n    <FlexView $alignItems=\"center\">\n      <TabBarContainer\n        $flexDirection=\"row\"\n        $background=\"WHITE\"\n        $visible={showTabBar}\n        $justifyContent=\"center\"\n        $width={currentScreenWidth}\n        $topOffset={topOffset}\n      >\n        <FlexView $width={badgeCategoryWidth}>\n          <AnimatedTabBar\n            tabs={tabs}\n            selectedTabId={currentSelectedBadgeType}\n            onTabClick={onTabClick}\n            currentScreenWidth={currentScreenWidth}\n          />\n        </FlexView>\n      </TabBarContainer>\n      <FlexView $flexDirection=\"row\" $gap={16} $width={badgeCategoryWidth}>\n        <Text $renderAs=\"h5\">BADGES</Text>\n      </FlexView>\n      {Object.keys(userBadges).map((badge, index) => {\n        const BadgeCategoryIcon = BADGE_TYPE_TAB_ICON[badge];\n\n        return (\n          <StudentBadgesContainer\n            key={badge}\n            $backgroundColor={BADGE_TYPE_BACKGROUND[badge] || '#FFFFFF'}\n            $badgeCategoryGap={badgeCategoryGap}\n            $isLastCategory={index === totalBadgeCategories - 1}\n            ref={badgeCategoryRefs[badge]}\n          >\n            <FlexView $width={badgeCategoryWidth}>\n              <FlexView $flexDirection=\"row\" $flexGap={8} $alignItems=\"center\">\n                {typeof BadgeCategoryIcon === 'function' ? <BadgeCategoryIcon /> : null}\n                <Text $renderAs=\"eyebrow1\">{badge}</Text>\n              </FlexView>\n              <CustomRow $containerStyle={containerStyle}>\n                {(userBadges[badge] || []).map(badgeProps => {\n                  const { id: studentBadgeId } = badgeProps || {};\n\n                  return (\n                    <StudentBadge\n                      key={studentBadgeId}\n                      {...badgeProps}\n                      category={badge}\n                      openModal={openModal}\n                      badgeWidth={badgeWidth}\n                      maxBadgeNameLines={maxBadgeNameLines}\n                      invalidateRewardsHome={invalidateRewardsHome}\n                    />\n                  );\n                })}\n              </CustomRow>\n            </FlexView>\n          </StudentBadgesContainer>\n        );\n      })}\n      <ScrollTopButton\n        $justifyContent=\"center\"\n        $alignItems=\"center\"\n        $showTabBar={showTabBar}\n        onClick={scrollToTop}\n      >\n        <UpIcon />\n      </ScrollTopButton>\n    </FlexView>\n  );\n};\n\nexport default StudentBadgeList;\n"],"names":["HEADER_HEIGHT","windowHeight","StudentBadgesContainer","styled","FlexView","$backgroundColor","$badgeCategoryGap","$isLastCategory","css","TabBarContainer","$topOffset","$width","$visible","ScrollTopButton","theme","$showTabBar","CustomRow","$containerStyle","StudentBadgeList","invalidateRewardsHome","openModal","topOffset","userBadges","currentScreenWidth","handleScrollTo","scrollPosition","badgeCategoryRefs","categoryConfig","currentSelectedBadgeType","onTabClick","scrollToTop","showTabBar","tabs","totalBadgeCategories","useStudentBadgeListHook","badgeCategoryGap","badgeCategoryWidth","containerStyle","badgeWidth","maxBadgeNameLines","jsxs","jsx","AnimatedTabBar","Text","badge","index","BadgeCategoryIcon","BADGE_TYPE_TAB_ICON","BADGE_TYPE_BACKGROUND","badgeProps","studentBadgeId","StudentBadge","UpIcon","StudentBadgeList$1"],"mappings":"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"}