@cuemath/leap 3.5.26 → 3.5.27

package/dist/features/ui/timers/countdown-text-timer/countdown-text-timer.js

@@ -0,0 +1,18 @@
+import { jsx as i } from "react/jsx-runtime";
+import n from "../../text/text.js";
+import r from "../hooks/use-time-remaining.js";
+const T = ({
+  timeRemaining: t,
+  onTimerComplete: e,
+  ...o
+}) => {
+  const { formattedTime: m } = r({
+    initialTimeRemaining: t,
+    onTimerComplete: e
+  });
+  return /* @__PURE__ */ i(n, { ...o, children: m });
+}, f = T;
+export {
+  f as default
+};
+//# sourceMappingURL=countdown-text-timer.js.map

package/dist/features/ui/timers/countdown-text-timer/countdown-text-timer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"countdown-text-timer.js","sources":["../../../../../src/features/ui/timers/countdown-text-timer/countdown-text-timer.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nimport Text, { type TextProps } from '../../text/text';\nimport useTimeRemaining from '../hooks/use-time-remaining';\n\ninterface ICountdownTextTimer extends TextProps {\n  timeRemaining: number;\n  onTimerComplete?: () => void;\n}\n\nconst CountdownTextTimer: FC<ICountdownTextTimer> = ({\n  timeRemaining: initialTimeRemaining,\n  onTimerComplete,\n  ...textProps\n}) => {\n  const { formattedTime } = useTimeRemaining({\n    initialTimeRemaining,\n    onTimerComplete,\n  });\n\n  return <Text {...textProps}>{formattedTime}</Text>;\n};\n\nexport default CountdownTextTimer;\n"],"names":["CountdownTextTimer","initialTimeRemaining","onTimerComplete","textProps","formattedTime","useTimeRemaining","jsx","Text","CountdownTextTimer$1"],"mappings":";;;AAUA,MAAMA,IAA8C,CAAC;AAAA,EACnD,eAAeC;AAAA,EACf,iBAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACE,QAAA,EAAE,eAAAC,EAAc,IAAIC,EAAiB;AAAA,IACzC,sBAAAJ;AAAA,IACA,iBAAAC;AAAA,EAAA,CACD;AAED,SAAQ,gBAAAI,EAAAC,GAAA,EAAM,GAAGJ,GAAY,UAAcC,EAAA,CAAA;AAC7C,GAEAI,IAAeR;"}

package/dist/features/ui/timers/countdown-timer/countdown-timer.js

@@ -1,74 +1,67 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
-import { useState as g, useEffect as f } from "react";
-import l from "styled-components";
-import { ILLUSTRATIONS as R } from "../../../../assets/illustrations/illustrations.js";
-import { formatTimeInHHMMSS as $ } from "../../../utils/utils.js";
-import d from "../../layout/flex-view.js";
-import h from "../../loader/reverse-circular-bar/reverse-circular-bar.js";
-import I from "../../text/text.js";
-const w = l.div`
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import n from "styled-components";
+import { ILLUSTRATIONS as c } from "../../../../assets/illustrations/illustrations.js";
+import m from "../../layout/flex-view.js";
+import p from "../../loader/reverse-circular-bar/reverse-circular-bar.js";
+import f from "../../text/text.js";
+import g from "../hooks/use-time-remaining.js";
+const R = n.div`
   position: absolute;
   left: 50%;
   top: 54%;
   transform: translate(-50%, -50%);
-`, S = l(d)`
+`, $ = n(m)`
   position: relative;
-`, x = ({
-  hideDigits: o,
-  onTimerComplete: t,
-  timeRemaining: i,
-  duration: p,
-  theme: n
+`, h = ({
+  hideDigits: r,
+  onTimerComplete: a,
+  timeRemaining: s,
+  duration: l,
+  theme: t
 }) => {
-  const [e, u] = g(i);
-  f(() => {
-    const m = setInterval(() => {
-      u((s) => s <= 1 ? (clearInterval(m), 0) : s - 1);
-    }, 1e3);
-    return () => clearInterval(m);
-  }, []), f(() => {
-    !e && t && t();
-  }, [t, e]);
-  const a = $(e);
-  return /* @__PURE__ */ c(
-    d,
+  const { timeRemaining: d, formattedTime: i } = g({
+    initialTimeRemaining: s,
+    onTimerComplete: a
+  });
+  return /* @__PURE__ */ o(
+    m,
     {
       $gap: 4,
-      $gutter: o ? 4 : 8,
-      $background: n,
+      $gutter: r ? 4 : 8,
+      $background: t,
       $flexDirection: "row",
       $alignItems: "center",
       $borderRadius: 18,
       $width: "fit-content",
       $flexGap: 4,
       children: [
-        /* @__PURE__ */ c(S, { children: [
-          /* @__PURE__ */ r("img", { src: R.CROSSHAIR_CIRCLE, width: 28, height: 28 }),
-          /* @__PURE__ */ r(w, { children: /* @__PURE__ */ r(
-            h,
+        /* @__PURE__ */ o($, { children: [
+          /* @__PURE__ */ e("img", { src: c.CROSSHAIR_CIRCLE, width: 28, height: 28 }),
+          /* @__PURE__ */ e(R, { children: /* @__PURE__ */ e(
+            p,
             {
-              timeRemaining: i,
-              duration: p,
-              color: n === "GREEN_1" ? "GREEN_5" : "ORANGE_5",
+              timeRemaining: d,
+              duration: l,
+              color: t === "GREEN_1" ? "GREEN_5" : "ORANGE_5",
               width: 14,
               height: 14
             }
           ) })
         ] }),
-        !o && /* @__PURE__ */ r(
-          I,
+        !r && /* @__PURE__ */ e(
+          f,
           {
-            $width: a.length > 5 ? 66 : 46,
+            $width: i.length > 5 ? 66 : 46,
             $alignSelf: "center",
             $renderAs: "eyebrow1",
-            children: a
+            children: i
           }
         )
       ]
     }
   );
-}, T = x;
+}, S = h;
 export {
-  T as default
+  S as default
 };
 //# sourceMappingURL=countdown-timer.js.map

package/dist/features/ui/timers/countdown-timer/countdown-timer.js.map

@@ -1 +1 @@
-{"version":3,"file":"countdown-timer.js","sources":["../../../../../src/features/ui/timers/countdown-timer/countdown-timer.tsx"],"sourcesContent":["import { useEffect, useState, type FC } from 'react';\nimport styled from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport { formatTimeInHHMMSS } from '../../../utils/utils';\nimport FlexView from '../../layout/flex-view';\nimport CircularProgressiveBar from '../../loader/reverse-circular-bar/reverse-circular-bar';\nimport Text from '../../text/text';\n\ninterface ICountdownTimer {\n  hideDigits: boolean;\n  onTimerComplete?: () => void;\n  timeRemaining: number;\n  duration: number;\n  theme: 'GREEN_1' | 'ORANGE_1';\n}\n\nconst LoaderWrapper = styled.div`\n  position: absolute;\n  left: 50%;\n  top: 54%;\n  transform: translate(-50%, -50%);\n`;\n\nconst ImageWrapper = styled(FlexView)`\n  position: relative;\n`;\n\nconst CountdownTimer: FC<ICountdownTimer> = ({\n  hideDigits,\n  onTimerComplete,\n  timeRemaining: initialTimeRemaining,\n  duration,\n  theme,\n}) => {\n  const [timeRemaining, setTimeRemaining] = useState<number>(initialTimeRemaining);\n\n  useEffect(() => {\n    const timerId = setInterval(() => {\n      setTimeRemaining(prevTime => {\n        if (prevTime <= 1) {\n          clearInterval(timerId);\n\n          return 0;\n        }\n\n        return prevTime - 1;\n      });\n    }, 1000);\n\n    return () => clearInterval(timerId);\n  }, []);\n\n  useEffect(() => {\n    if (!timeRemaining && onTimerComplete) {\n      onTimerComplete();\n    }\n  }, [onTimerComplete, timeRemaining]);\n\n  const formattedTime = formatTimeInHHMMSS(timeRemaining);\n\n  return (\n    <FlexView\n      $gap={4}\n      $gutter={hideDigits ? 4 : 8}\n      $background={theme}\n      $flexDirection=\"row\"\n      $alignItems=\"center\"\n      $borderRadius={18}\n      $width=\"fit-content\"\n      $flexGap={4}\n    >\n      <ImageWrapper>\n        <img src={ILLUSTRATIONS.CROSSHAIR_CIRCLE} width={28} height={28} />\n        <LoaderWrapper>\n          <CircularProgressiveBar\n            timeRemaining={initialTimeRemaining}\n            duration={duration}\n            color={theme === 'GREEN_1' ? 'GREEN_5' : 'ORANGE_5'}\n            width={14}\n            height={14}\n          />\n        </LoaderWrapper>\n      </ImageWrapper>\n\n      {!hideDigits && (\n        <Text\n          $width={formattedTime.length > 5 ? 66 : 46} // while hour is missing\n          $alignSelf=\"center\"\n          $renderAs=\"eyebrow1\"\n        >\n          {formattedTime}\n        </Text>\n      )}\n    </FlexView>\n  );\n};\n\nexport default CountdownTimer;\n"],"names":["LoaderWrapper","styled","ImageWrapper","FlexView","CountdownTimer","hideDigits","onTimerComplete","initialTimeRemaining","duration","theme","timeRemaining","setTimeRemaining","useState","useEffect","timerId","prevTime","formattedTime","formatTimeInHHMMSS","jsxs","jsx","ILLUSTRATIONS","CircularProgressiveBar","Text","CountdownTimer$1"],"mappings":";;;;;;;;AAiBA,MAAMA,IAAgBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBC,IAAeD,EAAOE,CAAQ;AAAA;AAAA,GAI9BC,IAAsC,CAAC;AAAA,EAC3C,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,eAAeC;AAAA,EACf,UAAAC;AAAA,EACA,OAAAC;AACF,MAAM;AACJ,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAiBL,CAAoB;AAE/E,EAAAM,EAAU,MAAM;AACR,UAAAC,IAAU,YAAY,MAAM;AAChC,MAAAH,EAAiB,CAAYI,MACvBA,KAAY,KACd,cAAcD,CAAO,GAEd,KAGFC,IAAW,CACnB;AAAA,OACA,GAAI;AAEA,WAAA,MAAM,cAAcD,CAAO;AAAA,EACpC,GAAG,CAAE,CAAA,GAELD,EAAU,MAAM;AACV,IAAA,CAACH,KAAiBJ,KACJA;EAClB,GACC,CAACA,GAAiBI,CAAa,CAAC;AAE7B,QAAAM,IAAgBC,EAAmBP,CAAa;AAGpD,SAAA,gBAAAQ;AAAA,IAACf;AAAA,IAAA;AAAA,MACC,MAAM;AAAA,MACN,SAASE,IAAa,IAAI;AAAA,MAC1B,aAAaI;AAAA,MACb,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,eAAe;AAAA,MACf,QAAO;AAAA,MACP,UAAU;AAAA,MAEV,UAAA;AAAA,QAAA,gBAAAS,EAAChB,GACC,EAAA,UAAA;AAAA,UAAA,gBAAAiB,EAAC,SAAI,KAAKC,EAAc,kBAAkB,OAAO,IAAI,QAAQ,IAAI;AAAA,4BAChEpB,GACC,EAAA,UAAA,gBAAAmB;AAAA,YAACE;AAAAA,YAAA;AAAA,cACC,eAAed;AAAA,cACf,UAAAC;AAAA,cACA,OAAOC,MAAU,YAAY,YAAY;AAAA,cACzC,OAAO;AAAA,cACP,QAAQ;AAAA,YAAA;AAAA,UAAA,GAEZ;AAAA,QAAA,GACF;AAAA,QAEC,CAACJ,KACA,gBAAAc;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,QAAQN,EAAc,SAAS,IAAI,KAAK;AAAA,YACxC,YAAW;AAAA,YACX,WAAU;AAAA,YAET,UAAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,GAEAO,IAAenB;"}
+{"version":3,"file":"countdown-timer.js","sources":["../../../../../src/features/ui/timers/countdown-timer/countdown-timer.tsx"],"sourcesContent":["import { type FC } from 'react';\nimport styled from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport FlexView from '../../layout/flex-view';\nimport CircularProgressiveBar from '../../loader/reverse-circular-bar/reverse-circular-bar';\nimport Text from '../../text/text';\nimport useTimeRemaining from '../hooks/use-time-remaining';\n\ninterface ICountdownTimer {\n  hideDigits: boolean;\n  onTimerComplete?: () => void;\n  timeRemaining: number;\n  duration: number;\n  theme: 'GREEN_1' | 'ORANGE_1';\n}\n\nconst LoaderWrapper = styled.div`\n  position: absolute;\n  left: 50%;\n  top: 54%;\n  transform: translate(-50%, -50%);\n`;\n\nconst ImageWrapper = styled(FlexView)`\n  position: relative;\n`;\n\nconst CountdownTimer: FC<ICountdownTimer> = ({\n  hideDigits,\n  onTimerComplete,\n  timeRemaining: initialTimeRemaining,\n  duration,\n  theme,\n}) => {\n  const { timeRemaining, formattedTime } = useTimeRemaining({\n    initialTimeRemaining,\n    onTimerComplete,\n  });\n\n  return (\n    <FlexView\n      $gap={4}\n      $gutter={hideDigits ? 4 : 8}\n      $background={theme}\n      $flexDirection=\"row\"\n      $alignItems=\"center\"\n      $borderRadius={18}\n      $width=\"fit-content\"\n      $flexGap={4}\n    >\n      <ImageWrapper>\n        <img src={ILLUSTRATIONS.CROSSHAIR_CIRCLE} width={28} height={28} />\n        <LoaderWrapper>\n          <CircularProgressiveBar\n            timeRemaining={timeRemaining}\n            duration={duration}\n            color={theme === 'GREEN_1' ? 'GREEN_5' : 'ORANGE_5'}\n            width={14}\n            height={14}\n          />\n        </LoaderWrapper>\n      </ImageWrapper>\n\n      {!hideDigits && (\n        <Text\n          $width={formattedTime.length > 5 ? 66 : 46} // while hour is missing\n          $alignSelf=\"center\"\n          $renderAs=\"eyebrow1\"\n        >\n          {formattedTime}\n        </Text>\n      )}\n    </FlexView>\n  );\n};\n\nexport default CountdownTimer;\n"],"names":["LoaderWrapper","styled","ImageWrapper","FlexView","CountdownTimer","hideDigits","onTimerComplete","initialTimeRemaining","duration","theme","timeRemaining","formattedTime","useTimeRemaining","jsxs","jsx","ILLUSTRATIONS","CircularProgressiveBar","Text","CountdownTimer$1"],"mappings":";;;;;;;AAiBA,MAAMA,IAAgBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBC,IAAeD,EAAOE,CAAQ;AAAA;AAAA,GAI9BC,IAAsC,CAAC;AAAA,EAC3C,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,eAAeC;AAAA,EACf,UAAAC;AAAA,EACA,OAAAC;AACF,MAAM;AACJ,QAAM,EAAE,eAAAC,GAAe,eAAAC,EAAc,IAAIC,EAAiB;AAAA,IACxD,sBAAAL;AAAA,IACA,iBAAAD;AAAA,EAAA,CACD;AAGC,SAAA,gBAAAO;AAAA,IAACV;AAAA,IAAA;AAAA,MACC,MAAM;AAAA,MACN,SAASE,IAAa,IAAI;AAAA,MAC1B,aAAaI;AAAA,MACb,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,eAAe;AAAA,MACf,QAAO;AAAA,MACP,UAAU;AAAA,MAEV,UAAA;AAAA,QAAA,gBAAAI,EAACX,GACC,EAAA,UAAA;AAAA,UAAA,gBAAAY,EAAC,SAAI,KAAKC,EAAc,kBAAkB,OAAO,IAAI,QAAQ,IAAI;AAAA,4BAChEf,GACC,EAAA,UAAA,gBAAAc;AAAA,YAACE;AAAAA,YAAA;AAAA,cACC,eAAAN;AAAA,cACA,UAAAF;AAAA,cACA,OAAOC,MAAU,YAAY,YAAY;AAAA,cACzC,OAAO;AAAA,cACP,QAAQ;AAAA,YAAA;AAAA,UAAA,GAEZ;AAAA,QAAA,GACF;AAAA,QAEC,CAACJ,KACA,gBAAAS;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,QAAQN,EAAc,SAAS,IAAI,KAAK;AAAA,YACxC,YAAW;AAAA,YACX,WAAU;AAAA,YAET,UAAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,GAEAO,IAAed;"}

package/dist/features/ui/timers/hooks/use-time-remaining.js

@@ -0,0 +1,22 @@
+import { useState as f, useEffect as i } from "react";
+import { formatTimeInHHMMSS as u } from "../../../utils/utils.js";
+const c = ({ initialTimeRemaining: a, onTimerComplete: t }) => {
+  const [e, m] = f(a);
+  i(() => {
+    const n = setInterval(() => {
+      m((r) => r <= 1 ? (clearInterval(n), 0) : r - 1);
+    }, 1e3);
+    return () => clearInterval(n);
+  }, []), i(() => {
+    !e && t && t();
+  }, [t, e]);
+  const s = u(e);
+  return {
+    timeRemaining: e,
+    formattedTime: s
+  };
+}, g = c;
+export {
+  g as default
+};
+//# sourceMappingURL=use-time-remaining.js.map

package/dist/features/ui/timers/hooks/use-time-remaining.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-time-remaining.js","sources":["../../../../../src/features/ui/timers/hooks/use-time-remaining.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { formatTimeInHHMMSS } from '../../../utils/utils';\n\ninterface IUseTimeRemaining {\n  (params: { initialTimeRemaining: number; onTimerComplete?: () => void }): {\n    timeRemaining: number;\n    formattedTime: string;\n  };\n}\n\nconst useTimeRemaining: IUseTimeRemaining = ({ initialTimeRemaining, onTimerComplete }) => {\n  const [timeRemaining, setTimeRemaining] = useState<number>(initialTimeRemaining);\n\n  useEffect(() => {\n    const timerId = setInterval(() => {\n      setTimeRemaining(prevTime => {\n        if (prevTime <= 1) {\n          clearInterval(timerId);\n\n          return 0;\n        }\n\n        return prevTime - 1;\n      });\n    }, 1000);\n\n    return () => clearInterval(timerId);\n  }, []);\n\n  useEffect(() => {\n    if (!timeRemaining && onTimerComplete) {\n      onTimerComplete();\n    }\n  }, [onTimerComplete, timeRemaining]);\n\n  const formattedTime = formatTimeInHHMMSS(timeRemaining);\n\n  return {\n    timeRemaining,\n    formattedTime,\n  };\n};\n\nexport default useTimeRemaining;\n"],"names":["useTimeRemaining","initialTimeRemaining","onTimerComplete","timeRemaining","setTimeRemaining","useState","useEffect","timerId","prevTime","formattedTime","formatTimeInHHMMSS","useTimeRemaining$1"],"mappings":";;AAWA,MAAMA,IAAsC,CAAC,EAAE,sBAAAC,GAAsB,iBAAAC,QAAsB;AACzF,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAiBJ,CAAoB;AAE/E,EAAAK,EAAU,MAAM;AACR,UAAAC,IAAU,YAAY,MAAM;AAChC,MAAAH,EAAiB,CAAYI,MACvBA,KAAY,KACd,cAAcD,CAAO,GAEd,KAGFC,IAAW,CACnB;AAAA,OACA,GAAI;AAEA,WAAA,MAAM,cAAcD,CAAO;AAAA,EACpC,GAAG,CAAE,CAAA,GAELD,EAAU,MAAM;AACV,IAAA,CAACH,KAAiBD,KACJA;EAClB,GACC,CAACA,GAAiBC,CAAa,CAAC;AAE7B,QAAAM,IAAgBC,EAAmBP,CAAa;AAE/C,SAAA;AAAA,IACL,eAAAA;AAAA,IACA,eAAAM;AAAA,EAAA;AAEJ,GAEAE,IAAeX;"}

package/dist/index.d.ts

@@ -1,40 +1,40 @@
-import type { ButtonHTMLAttributes } from 'react';
-import type { Channel } from '@cuemath/cue-message-broker';
+import { ButtonHTMLAttributes } from 'react';
+import { Channel } from '@cuemath/cue-message-broker';
 import { ChannelStatus } from '@cuemath/cue-message-broker';
 import { ComponentProps } from 'react';
 import { ComponentType } from 'react';
-import type { Config } from '@lottiefiles/dotlottie-web';
+import { Config } from '@lottiefiles/dotlottie-web';
 import { Context } from 'react';
-import type { Data } from '@lottiefiles/dotlottie-web';
-import type { DefaultTheme } from 'styled-components';
+import { Data } from '@lottiefiles/dotlottie-web';
+import { DefaultTheme } from 'styled-components';
 import { DetailedHTMLProps } from 'react';
-import type { Dispatch } from 'react';
-import type { EventListener as EventListener_2 } from '@lottiefiles/dotlottie-web';
-import type { EventType } from '@lottiefiles/dotlottie-web';
+import { Dispatch } from 'react';
+import { EventListener as EventListener_2 } from '@lottiefiles/dotlottie-web';
+import { EventType } from '@lottiefiles/dotlottie-web';
 import { FC } from 'react';
-import type { FormEvent } from 'react';
+import { FormEvent } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { HTMLAttributes } from 'react';
-import type { HTMLProps } from 'react';
+import { HTMLProps } from 'react';
 import { IChannelMessage } from '@cuemath/cue-message-broker';
-import type { IframeHTMLAttributes } from 'react';
-import type { ImgHTMLAttributes } from 'react';
-import type { InputHTMLAttributes } from 'react';
+import { IframeHTMLAttributes } from 'react';
+import { ImgHTMLAttributes } from 'react';
+import { InputHTMLAttributes } from 'react';
 import { IProvidedProps } from 'google-maps-react';
 import { IStyledComponent } from 'styled-components';
 import { JSX } from 'react/jsx-runtime';
 import { MemoExoticComponent } from 'react';
-import type { MutableRefObject } from 'react';
+import { MutableRefObject } from 'react';
 import { NamedExoticComponent } from 'react';
 import { Omit as Omit_2 } from 'google-maps-react';
-import type { PLUGIN_NAME } from '@cuemath/analytics-v2/dist/constants';
+import { PLUGIN_NAME } from '@cuemath/analytics-v2/dist/constants';
 import { PropsWithChildren } from 'react';
 import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 import { RefAttributes } from 'react';
 import { RefObject } from 'react';
 import { ResourceModel } from '@cuemath/rest-api';
-import type { SetStateAction } from 'react';
+import { SetStateAction } from 'react';
 import { Substitute } from 'styled-components/dist/types';
 import { SVGProps } from 'react';
 import { VideoHTMLAttributes } from 'react';
@@ -87,7 +87,7 @@ declare type AnimationSegment = [number, number];
 export declare const AppLoader: FC<IAppLoaderProps>;
 
 export declare const ArcButton: NamedExoticComponent<IArcButtonProps & {
-    children?: ReactNode | undefined;
+children?: ReactNode | undefined;
 } & RefAttributes<HTMLDivElement>>;
 
 export declare const ArrowTooltip: NamedExoticComponent<IArrowTooltipProps>;
@@ -399,6 +399,8 @@ export declare const ContextMenu: FC<IContextMenuProps>;
 
 export declare const CopyIcon: FC<SVGProps<SVGSVGElement>>;
 
+export declare const CountdownTextTimer: FC<ICountdownTextTimer>;
+
 export declare const CountdownTimer: FC<ICountdownTimer>;
 
 export declare const COUNTRY_CODE_MAP: {
@@ -448,7 +450,7 @@ declare interface CueCoinIconProps extends SVGProps<SVGSVGElement> {
     variant?: 'gold' | 'silver';
 }
 
-export declare const CuemathAppFeatures: NamedExoticComponent<{}>;
+export declare const CuemathAppFeatures: NamedExoticComponent<    {}>;
 
 export declare const CuemathLogo: FC<SVGProps<SVGSVGElement>>;
 
@@ -705,7 +707,7 @@ declare enum GENDER {
     OTHER = "OTHER"
 }
 
-export declare const getActiveSATSheet: (sheets: TLPARSheetData[]) => TLPARSheetData;
+export declare const getActiveSATSheet: (sheets: TLPARSheetData[]) => TLPARSheetData | undefined;
 
 declare const getArrowTooltipConfig: IGetArrowTooltipConfig;
 
@@ -1472,6 +1474,11 @@ declare interface IContextMenuProps {
     onMenuVisibilityChange?: (visible: boolean) => void;
 }
 
+declare interface ICountdownTextTimer extends TextProps {
+    timeRemaining: number;
+    onTimerComplete?: () => void;
+}
+
 declare interface ICountdownTimer {
     hideDigits: boolean;
     onTimerComplete?: () => void;
@@ -4512,6 +4519,16 @@ declare interface IUseTeacherStickersJourneyProps {
     tooltipConfig: TArrowTooltipConfigProps;
 }
 
+declare interface IUseTimeRemaining {
+    (params: {
+        initialTimeRemaining: number;
+        onTimerComplete?: () => void;
+    }): {
+        timeRemaining: number;
+        formattedTime: string;
+    };
+}
+
 declare interface IUseTrialSessionMessageBroker {
     (options: {
         teacherClassroomId?: string;
@@ -5337,7 +5354,7 @@ export declare const OTPInput: NamedExoticComponent<IOTPInputProps>;
 export declare type OutcomeStage = keyof typeof STAGES;
 
 export declare const OverlayLoader: MemoExoticComponent<({ isLoading }: {
-    isLoading?: boolean | undefined;
+isLoading?: boolean | undefined;
 }) => JSX.Element | null>;
 
 export declare const ParentDashboard: NamedExoticComponent<IParentDashboardProps>;
@@ -5673,7 +5690,7 @@ export declare const SheetIcon: FC<SVGProps<SVGSVGElement>>;
 export declare const SheetList: FC<ISheetsListProps>;
 
 export declare const SheetLocked: MemoExoticComponent<({ onHomeClick }: {
-    onHomeClick: () => void;
+onHomeClick: () => void;
 }) => JSX.Element>;
 
 export declare const SignUp: ({ circleOnLeapPremiumDays, circleUsername, countryCode, grade: defaultGrade, state, circleOnLeapPremiumEnabled, studentId, isSignUpProcessing, onCreateUser, onUpdateUser, onSignupStepsComplete, isPLAStudent, }: ISignUpProps) => JSX.Element;
@@ -7206,8 +7223,8 @@ export declare const useGetMilestoneResources: (initialId?: string, initialQuery
 
 export declare const useGetPastMilestoneCount: (initialId?: string, initialQuery?: void | undefined) => {
     get: (id: string, query: void, meta: TQuery_2) => Promise<void>;
-    resource: ResourceModel<{
-        user_milestones_count: number;
+    resource: ResourceModel<    {
+    user_milestones_count: number;
     }> | undefined;
     data: {
         user_milestones_count: number;
@@ -7365,6 +7382,8 @@ export declare const useTeacherPuzzleAssignedJourney: () => {
     startJourney: () => void;
 };
 
+export declare const useTimeRemaining: IUseTimeRemaining;
+
 export declare const useTrackingContext: (commonAnalyticsProps: Record<string, unknown>, overrides?: Record<string, unknown>) => {
     onClick: TTrackCTA;
     onResponse: TTrackInput;