@cuemath/leap 3.5.30-gg4 → 3.5.30-j1

package/dist/features/ui/swipable-carousel/swipable-carousel.js

@@ -0,0 +1,132 @@
+import { jsx as i, jsxs as z } from "react/jsx-runtime";
+import { memo as W, forwardRef as x, useState as F, useCallback as l, useImperativeHandle as K, useEffect as L } from "react";
+import O from "../swipeable-component/swipeable-component.js";
+import D from "../buttons/icon-button/icon-button.js";
+import { Carousel as X, CarouselWrapper as g, CarouselItemContainer as k, NavigationConatainer as N, Dot as q } from "./swipable-carousel-styled.js";
+import w from "../../../assets/line-icons/icons/chevron-left.js";
+import B from "../../../assets/line-icons/icons/chevron-right.js";
+import y from "../layout/flex-view.js";
+import J from "../separator/separator.js";
+const Q = {
+  dotColor: "BLACK_1",
+  inactiveDotColor: "WHITE_1",
+  activeIndicatorSize: "8px",
+  inactiveIndicatorSize: "8px",
+  spacing: "8px"
+}, U = {
+  buttonVariant: "secondary",
+  buttonSize: "xsmall",
+  spacing: 8,
+  hideOnMobile: !0
+}, Y = ({
+  items: o,
+  children: h,
+  defaultIndex: b = 0,
+  transitionDuration: j = 300,
+  onSwipeLeft: s,
+  onSwipeRight: u,
+  onIndexChange: e,
+  showDots: C = !1,
+  dotsConfig: G,
+  showNavigationButtons: v = !1,
+  navigationConfig: I,
+  onDotClick: f
+}, P) => {
+  const V = Math.max(0, Math.min(b, o.length - 1)), [r, m] = F(V), $ = r > 0, d = r < o.length - 1, p = { ...Q, ...G }, c = { ...U, ...I }, a = l(
+    (t) => {
+      t < 0 || t >= o.length || t === r || (m(t), e == null || e(t));
+    },
+    [r, o.length, e]
+  ), A = l(() => {
+    if (!d) return;
+    const t = r + 1;
+    m(t), e == null || e(t), s == null || s();
+  }, [d, r, s, e]), M = l(() => {
+    if (!$) return;
+    const t = r - 1;
+    m(t), e == null || e(t), u == null || u();
+  }, [$, r, u, e]), _ = l(
+    (t) => {
+      a(t), f == null || f(t);
+    },
+    [a, f]
+  ), E = l(() => {
+    a(r - 1);
+  }, [a, r]), H = l(() => {
+    a(r + 1);
+  }, [a, r]);
+  K(P, () => ({
+    currentIndex: r,
+    goToIndex: a
+  })), L(() => {
+    m(b);
+  }, [b]);
+  const S = () => !C || o.length <= 1 ? null : /* @__PURE__ */ i(y, { $flexDirection: "row", $alignItems: "center", $justifyContent: "center", $flexGap: 8, children: o.map((t, n) => /* @__PURE__ */ i(
+    q,
+    {
+      onClick: () => _(n),
+      $isCurrent: n === r,
+      $dotColor: p.dotColor,
+      $inactiveDotColor: p.inactiveDotColor,
+      $activeIndicatorSize: p.activeIndicatorSize,
+      $inactiveIndicatorSize: p.inactiveIndicatorSize
+    },
+    n
+  )) }), T = () => !v || o.length <= 1 ? null : /* @__PURE__ */ z(N, { $bottom: "-48px", children: [
+    /* @__PURE__ */ i(J, { heightX: 1 }),
+    /* @__PURE__ */ z(
+      y,
+      {
+        $flexDirection: "row",
+        $alignItems: "center",
+        $justifyContent: "center",
+        $flex: 1,
+        $flexGap: c.spacing || 8,
+        children: [
+          /* @__PURE__ */ i(
+            D,
+            {
+              Icon: w,
+              renderAs: c.buttonVariant,
+              analyticsLabel: "Previous",
+              size: c.buttonSize,
+              onClick: E,
+              disabled: !$,
+              "aria-label": "Previous item"
+            }
+          ),
+          S(),
+          /* @__PURE__ */ i(
+            D,
+            {
+              Icon: B,
+              renderAs: c.buttonVariant,
+              analyticsLabel: "Next",
+              size: c.buttonSize,
+              onClick: H,
+              disabled: !d,
+              "aria-label": "Next item"
+            }
+          )
+        ]
+      }
+    )
+  ] });
+  return /* @__PURE__ */ i(O, { onSwipeLeft: A, onSwipeRight: M, children: /* @__PURE__ */ z(X, { children: [
+    /* @__PURE__ */ i(
+      g,
+      {
+        $translate: r * 100,
+        $translateDuration: j,
+        children: o.map((t, n) => /* @__PURE__ */ i(k, { children: t }, n))
+      }
+    ),
+    h,
+    C && !v && /* @__PURE__ */ i(N, { $bottom: "-18px", children: S() }),
+    v && T()
+  ] }) });
+}, ct = W(x(Y));
+export {
+  ct as default
+};
+//# sourceMappingURL=swipable-carousel.js.map

package/dist/features/ui/swipable-carousel/swipable-carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"swipable-carousel.js","sources":["../../../../src/features/ui/swipable-carousel/swipable-carousel.tsx"],"sourcesContent":["import {\n  type ForwardRefRenderFunction,\n  memo,\n  useCallback,\n  useEffect,\n  useState,\n  forwardRef,\n  useImperativeHandle,\n} from 'react';\n\nimport SwipeableComponent from '../swipeable-component/swipeable-component';\nimport IconButton from '../buttons/icon-button/icon-button';\nimport * as Styled from './swipable-carousel-styled';\nimport type { ISwipableCarouselRefs, ISwipableCarousel } from './swipable-carousel-types';\nimport ChevronLeft from '../../../assets/line-icons/icons/chevron-left';\nimport ChevronRight from '../../../assets/line-icons/icons/chevron-right';\nimport FlexView from '../layout/flex-view';\nimport Separator from '../separator/separator';\n\n// Default dot configuration\nconst defaultDotConfig = {\n  dotColor: 'BLACK_1' as const,\n  inactiveDotColor: 'WHITE_1' as const,\n  activeIndicatorSize: '8px',\n  inactiveIndicatorSize: '8px',\n  spacing: '8px',\n};\n\n// Default navigation configuration\nconst defaultNavigationConfig = {\n  buttonVariant: 'secondary' as const,\n  buttonSize: 'xsmall' as const,\n  spacing: 8,\n  hideOnMobile: true,\n};\n\nconst SwipableCarousel: ForwardRefRenderFunction<ISwipableCarouselRefs, ISwipableCarousel> = (\n  {\n    items,\n    children,\n    defaultIndex = 0,\n    transitionDuration = 300,\n    onSwipeLeft,\n    onSwipeRight,\n    onIndexChange,\n    showDots = false,\n    dotsConfig,\n    showNavigationButtons = false,\n    navigationConfig,\n    onDotClick,\n  },\n  ref,\n) => {\n  const validDefaultIndex = Math.max(0, Math.min(defaultIndex, items.length - 1));\n  const [currIndex, setCurrIndex] = useState(validDefaultIndex);\n  const canGoPrevious = currIndex > 0;\n  const canGoNext = currIndex < items.length - 1;\n  const finalDotConfig = { ...defaultDotConfig, ...dotsConfig };\n  const finalNavigationConfig = { ...defaultNavigationConfig, ...navigationConfig };\n\n  const goToIndex = useCallback(\n    (index: number) => {\n      if (index < 0 || index >= items.length || index === currIndex) return;\n      setCurrIndex(index);\n      onIndexChange?.(index);\n    },\n    [currIndex, items.length, onIndexChange],\n  );\n\n  const handleSwipeLeft = useCallback(() => {\n    if (!canGoNext) return;\n\n    const newIndex = currIndex + 1;\n\n    setCurrIndex(newIndex);\n    onIndexChange?.(newIndex);\n    onSwipeLeft?.();\n  }, [canGoNext, currIndex, onSwipeLeft, onIndexChange]);\n\n  const handleSwipeRight = useCallback(() => {\n    if (!canGoPrevious) return;\n\n    const newIndex = currIndex - 1;\n\n    setCurrIndex(newIndex);\n    onIndexChange?.(newIndex);\n    onSwipeRight?.();\n  }, [canGoPrevious, currIndex, onSwipeRight, onIndexChange]);\n\n  const handleDotClick = useCallback(\n    (index: number) => {\n      goToIndex(index);\n      onDotClick?.(index);\n    },\n    [goToIndex, onDotClick],\n  );\n\n  const handlePrevious = useCallback(() => {\n    goToIndex(currIndex - 1);\n  }, [goToIndex, currIndex]);\n\n  const handleNext = useCallback(() => {\n    goToIndex(currIndex + 1);\n  }, [goToIndex, currIndex]);\n\n  useImperativeHandle(ref, () => ({\n    currentIndex: currIndex,\n    goToIndex,\n  }));\n\n  useEffect(() => {\n    setCurrIndex(defaultIndex);\n  }, [defaultIndex]);\n\n  const renderDots = () => {\n    if (!showDots || items.length <= 1) return null;\n\n    return (\n      <FlexView $flexDirection=\"row\" $alignItems=\"center\" $justifyContent=\"center\" $flexGap={8}>\n        {items.map((_, index) => (\n          <Styled.Dot\n            key={index}\n            onClick={() => handleDotClick(index)}\n            $isCurrent={index === currIndex}\n            $dotColor={finalDotConfig.dotColor}\n            $inactiveDotColor={finalDotConfig.inactiveDotColor}\n            $activeIndicatorSize={finalDotConfig.activeIndicatorSize}\n            $inactiveIndicatorSize={finalDotConfig.inactiveIndicatorSize}\n          />\n        ))}\n      </FlexView>\n    );\n  };\n\n  const renderNavigation = () => {\n    if (!showNavigationButtons || items.length <= 1) return null;\n\n    return (\n      <Styled.NavigationConatainer $bottom=\"-48px\">\n        <Separator heightX={1} />\n        <FlexView\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $flex={1}\n          $flexGap={finalNavigationConfig.spacing || 8}\n        >\n          <IconButton\n            Icon={ChevronLeft}\n            renderAs={finalNavigationConfig.buttonVariant}\n            analyticsLabel=\"Previous\"\n            size={finalNavigationConfig.buttonSize}\n            onClick={handlePrevious}\n            disabled={!canGoPrevious}\n            aria-label=\"Previous item\"\n          />\n          {renderDots()}\n          <IconButton\n            Icon={ChevronRight}\n            renderAs={finalNavigationConfig.buttonVariant}\n            analyticsLabel=\"Next\"\n            size={finalNavigationConfig.buttonSize}\n            onClick={handleNext}\n            disabled={!canGoNext}\n            aria-label=\"Next item\"\n          />\n        </FlexView>\n      </Styled.NavigationConatainer>\n    );\n  };\n\n  return (\n    <SwipeableComponent onSwipeLeft={handleSwipeLeft} onSwipeRight={handleSwipeRight}>\n      <Styled.Carousel>\n        <Styled.CarouselWrapper\n          $translate={currIndex * 100}\n          $translateDuration={transitionDuration}\n        >\n          {items.map((item, index) => (\n            <Styled.CarouselItemContainer key={index}>{item}</Styled.CarouselItemContainer>\n          ))}\n        </Styled.CarouselWrapper>\n        {children}\n        {showDots && !showNavigationButtons && (\n          <Styled.NavigationConatainer $bottom=\"-18px\">{renderDots()}</Styled.NavigationConatainer>\n        )}\n        {showNavigationButtons && renderNavigation()}\n      </Styled.Carousel>\n    </SwipeableComponent>\n  );\n};\n\nexport default memo(forwardRef(SwipableCarousel));\n"],"names":["defaultDotConfig","defaultNavigationConfig","SwipableCarousel","items","children","defaultIndex","transitionDuration","onSwipeLeft","onSwipeRight","onIndexChange","showDots","dotsConfig","showNavigationButtons","navigationConfig","onDotClick","ref","validDefaultIndex","currIndex","setCurrIndex","useState","canGoPrevious","canGoNext","finalDotConfig","finalNavigationConfig","goToIndex","useCallback","index","handleSwipeLeft","newIndex","handleSwipeRight","handleDotClick","handlePrevious","handleNext","useImperativeHandle","useEffect","renderDots","jsx","FlexView","_","Styled.Dot","renderNavigation","jsxs","Styled.NavigationConatainer","Separator","IconButton","ChevronLeft","ChevronRight","SwipeableComponent","Styled.Carousel","Styled.CarouselWrapper","item","Styled.CarouselItemContainer","SwipableCarousel$1","memo","forwardRef"],"mappings":"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"}

package/dist/features/ui/swipeable-component/swipeable-component-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"swipeable-component-styled.js","sources":["../../../../src/features/ui/swipeable-component/swipeable-component-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const SwipeableWrapper = styled.div`\n  display: flex;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n`;\n"],"names":["SwipeableWrapper","styled"],"mappings":";AAEO,MAAMA,IAAmBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/ui/swipeable-component/swipeable-component.js

@@ -0,0 +1,27 @@
+import { jsx as C } from "react/jsx-runtime";
+import { memo as T, useRef as l, useCallback as e } from "react";
+import { SwipeableWrapper as X } from "./swipeable-component-styled.js";
+const m = T(
+  ({ onSwipeLeft: t, onSwipeRight: a, minSwipeDistance: o = 50, children: d }) => {
+    const s = l(0), n = l(0), u = e(() => {
+      const r = s.current - n.current;
+      Math.abs(r) < o || (r > 0 ? t == null || t() : a == null || a());
+    }, [o, t, a]), b = e((r) => {
+      var c;
+      s.current = ((c = r.changedTouches[0]) == null ? void 0 : c.clientX) || 0;
+    }, []), h = e(
+      (r) => {
+        var c;
+        n.current = ((c = r.changedTouches[0]) == null ? void 0 : c.clientX) || 0, u();
+      },
+      [u]
+    );
+    return /* @__PURE__ */ C(X, { onTouchStart: b, onTouchEnd: h, children: d });
+  }
+);
+m.displayName = "SwipeableComponent";
+const E = m;
+export {
+  E as default
+};
+//# sourceMappingURL=swipeable-component.js.map

package/dist/features/ui/swipeable-component/swipeable-component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"swipeable-component.js","sources":["../../../../src/features/ui/swipeable-component/swipeable-component.tsx"],"sourcesContent":["import { useRef, useCallback, memo } from 'react';\n\nimport * as Styled from './swipeable-component-styled';\nimport { type ISwipeableComponentProps } from './swipeable-component-types';\n\nconst SwipeableComponent: React.FC<ISwipeableComponentProps> = memo(\n  ({ onSwipeLeft, onSwipeRight, minSwipeDistance = 50, children }) => {\n    const touchStartX = useRef(0);\n    const touchEndX = useRef(0);\n\n    const handleSwipe = useCallback(() => {\n      const distance = touchStartX.current - touchEndX.current;\n\n      if (Math.abs(distance) < minSwipeDistance) return;\n\n      if (distance > 0) {\n        onSwipeLeft?.();\n      } else {\n        onSwipeRight?.();\n      }\n    }, [minSwipeDistance, onSwipeLeft, onSwipeRight]);\n\n    const onTouchStart = useCallback((e: React.TouchEvent) => {\n      touchStartX.current = e.changedTouches[0]?.clientX || 0;\n    }, []);\n\n    const onTouchEnd = useCallback(\n      (e: React.TouchEvent) => {\n        touchEndX.current = e.changedTouches[0]?.clientX || 0;\n        handleSwipe();\n      },\n      [handleSwipe],\n    );\n\n    return (\n      <Styled.SwipeableWrapper onTouchStart={onTouchStart} onTouchEnd={onTouchEnd}>\n        {children}\n      </Styled.SwipeableWrapper>\n    );\n  },\n);\n\nSwipeableComponent.displayName = 'SwipeableComponent';\n\nexport default SwipeableComponent;\n"],"names":["SwipeableComponent","memo","onSwipeLeft","onSwipeRight","minSwipeDistance","children","touchStartX","useRef","touchEndX","handleSwipe","useCallback","distance","onTouchStart","e","_a","onTouchEnd","Styled.SwipeableWrapper","SwipeableCard"],"mappings":";;;AAKA,MAAMA,IAAyDC;AAAA,EAC7D,CAAC,EAAE,aAAAC,GAAa,cAAAC,GAAc,kBAAAC,IAAmB,IAAI,UAAAC,QAAe;AAC5D,UAAAC,IAAcC,EAAO,CAAC,GACtBC,IAAYD,EAAO,CAAC,GAEpBE,IAAcC,EAAY,MAAM;AAC9B,YAAAC,IAAWL,EAAY,UAAUE,EAAU;AAEjD,MAAI,KAAK,IAAIG,CAAQ,IAAIP,MAErBO,IAAW,IACCT,KAAA,QAAAA,MAECC,KAAA,QAAAA;AAAA,IAEhB,GAAA,CAACC,GAAkBF,GAAaC,CAAY,CAAC,GAE1CS,IAAeF,EAAY,CAACG,MAAwB;;AACxD,MAAAP,EAAY,YAAUQ,IAAAD,EAAE,eAAe,CAAC,MAAlB,gBAAAC,EAAqB,YAAW;AAAA,IACxD,GAAG,CAAE,CAAA,GAECC,IAAaL;AAAA,MACjB,CAACG,MAAwB;;AACvB,QAAAL,EAAU,YAAUM,IAAAD,EAAE,eAAe,CAAC,MAAlB,gBAAAC,EAAqB,YAAW,GACxCL;MACd;AAAA,MACA,CAACA,CAAW;AAAA,IAAA;AAGd,6BACGO,GAAA,EAAwB,cAAAJ,GAA4B,YAAAG,GAClD,UAAAV,EACH,CAAA;AAAA,EAEJ;AACF;AAEAL,EAAmB,cAAc;AAEjC,MAAAiB,IAAejB;"}

package/dist/features/worksheet/user-pointer-pin/hooks/use-user-location.js

@@ -1,32 +1,31 @@
-import { useState as m, useMemo as a, useCallback as c } from "react";
-import { useAVMessage as I } from "@cuemath/av";
-import { useWorksheetStore as T } from "../../worksheet/hooks/use-worksheet-store.js";
-const f = () => {
-  var r;
-  const { activeQuestionIndex: t, questions: s, userType: i } = T((e) => ({
-    activeQuestionIndex: e.activeQuestionIndex,
-    questions: e.questions,
-    userType: e.userType
-  })), [n, u] = m(), o = a(
-    () => s.findIndex((e) => e.response_id === n),
-    [n, s]
-  ), p = c((e, d) => {
-    u(d.id);
+import { useState as u, useMemo as a, useCallback as I } from "react";
+import { useAVMessage as c } from "@cuemath/av";
+const N = ({
+  questions: o,
+  activeQuestionIndex: r,
+  userType: p
+}) => {
+  var n;
+  const [t, i] = u(), e = a(
+    () => o.findIndex((s) => s.response_id === t),
+    [t, o]
+  ), d = I((s, m) => {
+    i(m.id);
   }, []);
-  return I({
+  return c({
     type: "STUDENT_MOUSE_POINTER_POSITION_CHANGED",
-    onMessage: p
-  }), i !== "TEACHER" || o === -1 || t === o ? {
+    onMessage: d
+  }), p !== "TEACHER" || e === -1 || r === e ? {
     peerLocation: void 0,
     peerQuestionIndex: void 0,
     peerItemNumber: void 0
   } : {
-    peerLocation: o > t ? "down" : "up",
-    peerQuestionIndex: o,
-    peerItemNumber: (r = s[o]) == null ? void 0 : r.item_number
+    peerLocation: e > r ? "down" : "up",
+    peerQuestionIndex: e,
+    peerItemNumber: (n = o[e]) == null ? void 0 : n.item_number
   };
 };
 export {
-  f as default
+  N as default
 };
 //# sourceMappingURL=use-user-location.js.map

package/dist/features/worksheet/user-pointer-pin/hooks/use-user-location.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-user-location.js","sources":["../../../../../src/features/worksheet/user-pointer-pin/hooks/use-user-location.ts"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\n\nimport { useAVMessage } from '@cuemath/av';\n\nimport { useWorksheetStore } from '../../worksheet/hooks/use-worksheet-store';\n\ntype TPointerLocation = 'up' | 'down' | undefined;\n\ninterface IUseRemoteUserLocation {\n  peerLocation: TPointerLocation;\n  peerQuestionIndex: number | undefined;\n  peerItemNumber: number | undefined;\n}\n\nconst useRemoteUserLocation = (): IUseRemoteUserLocation => {\n  const { activeQuestionIndex, questions, userType } = useWorksheetStore(store => ({\n    activeQuestionIndex: store.activeQuestionIndex,\n    questions: store.questions,\n    userType: store.userType,\n  }));\n  const [peerResponseId, setPeerResponseId] = useState<string | undefined>();\n  const peerQuestionIndex = useMemo(\n    () => questions.findIndex(qs => qs.response_id === peerResponseId),\n    [peerResponseId, questions],\n  );\n  const onPointerReceive = useCallback((_: string, data: Record<string, unknown>) => {\n    setPeerResponseId(data.id as string);\n  }, []);\n\n  useAVMessage<Record<string, unknown>>({\n    type: 'STUDENT_MOUSE_POINTER_POSITION_CHANGED',\n    onMessage: onPointerReceive,\n  });\n\n  if (\n    userType !== 'TEACHER' ||\n    peerQuestionIndex === -1 ||\n    activeQuestionIndex === peerQuestionIndex\n  ) {\n    return {\n      peerLocation: undefined,\n      peerQuestionIndex: undefined,\n      peerItemNumber: undefined,\n    };\n  }\n\n  return {\n    peerLocation: peerQuestionIndex > activeQuestionIndex ? 'down' : 'up',\n    peerQuestionIndex,\n    peerItemNumber: questions[peerQuestionIndex]?.item_number,\n  };\n};\n\nexport default useRemoteUserLocation;\n"],"names":["useRemoteUserLocation","activeQuestionIndex","questions","userType","useWorksheetStore","store","peerResponseId","setPeerResponseId","useState","peerQuestionIndex","useMemo","qs","onPointerReceive","useCallback","_","data","useAVMessage","_a"],"mappings":";;;AAcA,MAAMA,IAAwB,MAA8B;;AAC1D,QAAM,EAAE,qBAAAC,GAAqB,WAAAC,GAAW,UAAAC,EAAS,IAAIC,EAAkB,CAAUC,OAAA;AAAA,IAC/E,qBAAqBA,EAAM;AAAA,IAC3B,WAAWA,EAAM;AAAA,IACjB,UAAUA,EAAM;AAAA,EAChB,EAAA,GACI,CAACC,GAAgBC,CAAiB,IAAIC,EAA6B,GACnEC,IAAoBC;AAAA,IACxB,MAAMR,EAAU,UAAU,CAAMS,MAAAA,EAAG,gBAAgBL,CAAc;AAAA,IACjE,CAACA,GAAgBJ,CAAS;AAAA,EAAA,GAEtBU,IAAmBC,EAAY,CAACC,GAAWC,MAAkC;AACjF,IAAAR,EAAkBQ,EAAK,EAAY;AAAA,EACrC,GAAG,CAAE,CAAA;AAOL,SALsCC,EAAA;AAAA,IACpC,MAAM;AAAA,IACN,WAAWJ;AAAA,EAAA,CACZ,GAGCT,MAAa,aACbM,MAAsB,MACtBR,MAAwBQ,IAEjB;AAAA,IACL,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,EAAA,IAIb;AAAA,IACL,cAAcA,IAAoBR,IAAsB,SAAS;AAAA,IACjE,mBAAAQ;AAAA,IACA,iBAAgBQ,IAAAf,EAAUO,CAAiB,MAA3B,gBAAAQ,EAA8B;AAAA,EAAA;AAElD;"}
+{"version":3,"file":"use-user-location.js","sources":["../../../../../src/features/worksheet/user-pointer-pin/hooks/use-user-location.ts"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\n\nimport { useAVMessage } from '@cuemath/av';\n\nimport type { TUserTypes } from '../../../ui/types';\nimport type { IWorksheetQuestion } from '../../worksheet/worksheet-types';\n\ninterface IUseRemoteUserLocationProps {\n  questions: IWorksheetQuestion[];\n  activeQuestionIndex: number;\n  userType?: TUserTypes;\n}\n\ntype TpointerLocation = 'up' | 'down' | undefined;\n\ninterface IUseRemoteUserLocation {\n  peerLocation: TpointerLocation;\n  peerQuestionIndex: number | undefined;\n  peerItemNumber: number | undefined;\n}\n\nconst useRemoteUserLocation = ({\n  questions,\n  activeQuestionIndex,\n  userType,\n}: IUseRemoteUserLocationProps): IUseRemoteUserLocation => {\n  const [peerResponseId, setPeerResponseId] = useState<string | undefined>();\n  const peerQuestionIndex = useMemo(\n    () => questions.findIndex(qs => qs.response_id === peerResponseId),\n    [peerResponseId, questions],\n  );\n  const onPointerReceive = useCallback((_: string, data: Record<string, unknown>) => {\n    setPeerResponseId(data.id as string);\n  }, []);\n\n  useAVMessage<Record<string, unknown>>({\n    type: 'STUDENT_MOUSE_POINTER_POSITION_CHANGED',\n    onMessage: onPointerReceive,\n  });\n\n  if (\n    userType !== 'TEACHER' ||\n    peerQuestionIndex === -1 ||\n    activeQuestionIndex === peerQuestionIndex\n  ) {\n    return {\n      peerLocation: undefined,\n      peerQuestionIndex: undefined,\n      peerItemNumber: undefined,\n    };\n  }\n\n  return {\n    peerLocation: peerQuestionIndex > activeQuestionIndex ? 'down' : 'up',\n    peerQuestionIndex,\n    peerItemNumber: questions[peerQuestionIndex]?.item_number,\n  };\n};\n\nexport default useRemoteUserLocation;\n"],"names":["useRemoteUserLocation","questions","activeQuestionIndex","userType","peerResponseId","setPeerResponseId","useState","peerQuestionIndex","useMemo","qs","onPointerReceive","useCallback","_","data","useAVMessage","_a"],"mappings":";;AAqBA,MAAMA,IAAwB,CAAC;AAAA,EAC7B,WAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,UAAAC;AACF,MAA2D;;AACzD,QAAM,CAACC,GAAgBC,CAAiB,IAAIC,EAA6B,GACnEC,IAAoBC;AAAA,IACxB,MAAMP,EAAU,UAAU,CAAMQ,MAAAA,EAAG,gBAAgBL,CAAc;AAAA,IACjE,CAACA,GAAgBH,CAAS;AAAA,EAAA,GAEtBS,IAAmBC,EAAY,CAACC,GAAWC,MAAkC;AACjF,IAAAR,EAAkBQ,EAAK,EAAY;AAAA,EACrC,GAAG,CAAE,CAAA;AAOL,SALsCC,EAAA;AAAA,IACpC,MAAM;AAAA,IACN,WAAWJ;AAAA,EAAA,CACZ,GAGCP,MAAa,aACbI,MAAsB,MACtBL,MAAwBK,IAEjB;AAAA,IACL,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,EAAA,IAIb;AAAA,IACL,cAAcA,IAAoBL,IAAsB,SAAS;AAAA,IACjE,mBAAAK;AAAA,IACA,iBAAgBQ,IAAAd,EAAUM,CAAiB,MAA3B,gBAAAQ,EAA8B;AAAA,EAAA;AAElD;"}

package/dist/features/worksheet/user-pointer-pin/user-pin.js

@@ -1,57 +1,55 @@
 import { jsx as s } from "react/jsx-runtime";
-import { memo as h, useCallback as x } from "react";
-import l from "styled-components";
-import { ILLUSTRATIONS as a } from "../../../assets/illustrations/illustrations.js";
-import I from "../../ui/buttons/clickable/clickable.js";
-import U from "../../ui/layout/flex-view.js";
-import { useWorksheetStore as y } from "../worksheet/hooks/use-worksheet-store.js";
-import { scrollToQuestion as S } from "../worksheet/worksheet-helpers.js";
-import T from "./hooks/use-user-location.js";
-const c = 32, f = 36, b = l.img`
+import { memo as U, useCallback as S } from "react";
+import a from "styled-components";
+import { ILLUSTRATIONS as f } from "../../../assets/illustrations/illustrations.js";
+import _ from "../../ui/buttons/clickable/clickable.js";
+import C from "../../ui/layout/flex-view.js";
+import { scrollToQuestion as E } from "../worksheet/worksheet-helpers.js";
+import R from "./hooks/use-user-location.js";
+const c = 32, u = 36, T = a.img`
   position: absolute;
-  transform: ${({ $pointer: e }) => e === "down" ? `translate(-${c / 2}px, -${f}px)` : `translate(-${c / 2}px, 0)`};
-`, _ = l(U)(
-  ({ $pointer: e, $topOffset: n, $bottomOffset: o }) => `
+  transform: ${({ $pointer: t }) => t === "down" ? `translate(-${c / 2}px, -${u}px)` : `translate(-${c / 2}px, 0)`};
+`, b = a(C)(
+  ({ $pointer: t, $topOffset: r, $bottomOffset: i }) => `
   position: sticky;
-  top: ${e === "down" ? `calc(100% - ${o}px)` : `calc(${n + 48 + 8}px)`};
+  top: ${t === "down" ? `calc(100% - ${i}px)` : `calc(${r + 48 + 8}px)`};
   z-index: 1;
 `
-), q = h(function() {
-  const { topOffset: n, questions: o, userType: m, actionbarHeight: u } = y((t) => ({
-    topOffset: t.layout.topOffset,
-    questions: t.questions,
-    userType: t.userType,
-    actionbarHeight: t.actionbarHeight
-  })), { peerLocation: r, peerQuestionIndex: i } = T(), d = x(() => {
-    var t, p;
-    if (i === void 0)
+), H = U(function(r) {
+  const { activeQuestionIndex: i, questions: o, bottomOffset: d, topOffset: $, userType: l } = r, { peerLocation: e, peerQuestionIndex: n } = R({
+    questions: o,
+    activeQuestionIndex: i,
+    userType: l
+  }), x = S(() => {
+    var p, m;
+    if (n === void 0)
       return null;
-    if ((t = o[i]) != null && t.response_id) {
-      const $ = (p = o[i]) == null ? void 0 : p.response_id;
-      S($);
+    if ((p = o[n]) != null && p.response_id) {
+      const I = (m = o[n]) == null ? void 0 : m.response_id;
+      E(I);
     }
-  }, [i, o]);
-  return !r || m !== "TEACHER" ? null : /* @__PURE__ */ s(
-    _,
+  }, [n, o]);
+  return !e || l !== "TEACHER" ? null : /* @__PURE__ */ s(
+    b,
     {
       $alignItems: "center",
       $justifyContent: "center",
-      $pointer: r,
-      $bottomOffset: u,
-      $topOffset: n,
-      children: /* @__PURE__ */ s(I, { label: "User Location Pointer", onClick: d, children: /* @__PURE__ */ s(
-        b,
+      $pointer: e,
+      $bottomOffset: d,
+      $topOffset: $,
+      children: /* @__PURE__ */ s(_, { label: "User Location Pointer", onClick: x, children: /* @__PURE__ */ s(
+        T,
         {
-          $pointer: r,
+          $pointer: e,
           width: c,
-          height: f,
-          src: r === "up" ? a.USER_UP : a.USER_DOWN
+          height: u,
+          src: e === "up" ? f.USER_UP : f.USER_DOWN
         }
       ) })
     }
   );
 });
 export {
-  q as default
+  H as default
 };
 //# sourceMappingURL=user-pin.js.map

package/dist/features/worksheet/user-pointer-pin/user-pin.js.map

@@ -1 +1 @@
-{"version":3,"file":"user-pin.js","sources":["../../../../src/features/worksheet/user-pointer-pin/user-pin.tsx"],"sourcesContent":["import { memo, useCallback, type FC } from 'react';\nimport styled from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Clickable from '../../ui/buttons/clickable/clickable';\nimport FlexView from '../../ui/layout/flex-view';\nimport { useWorksheetStore } from '../worksheet/hooks/use-worksheet-store';\nimport { scrollToQuestion } from '../worksheet/worksheet-helpers';\nimport useRemoteUserLocation from './hooks/use-user-location';\n\nconst USER_PIN_WIDTH = 32;\nconst USER_PIN_HEIGHT = 36;\n\nconst StyledImage = styled.img<{ $pointer: 'up' | 'down' | undefined }>`\n  position: absolute;\n  transform: ${({ $pointer }) =>\n    $pointer === 'down'\n      ? `translate(-${USER_PIN_WIDTH / 2}px, -${USER_PIN_HEIGHT}px)`\n      : `translate(-${USER_PIN_WIDTH / 2}px, 0)`};\n`;\n\nconst StickyContainer = styled(FlexView)<{\n  $pointer: 'up' | 'down' | undefined;\n  $topOffset: number;\n  $bottomOffset: number;\n}>(\n  ({ $pointer, $topOffset, $bottomOffset }) => `\n  position: sticky;\n  top: ${\n    $pointer === 'down' ? `calc(100% - ${$bottomOffset}px)` : `calc(${$topOffset + 48 + 8}px)`\n  };\n  z-index: 1;\n`,\n);\n\nconst UserPointer: FC = memo(function UserPointer() {\n  const { topOffset, questions, userType, actionbarHeight } = useWorksheetStore(store => ({\n    topOffset: store.layout.topOffset,\n    questions: store.questions,\n    userType: store.userType,\n    actionbarHeight: store.actionbarHeight,\n  }));\n  const { peerLocation, peerQuestionIndex } = useRemoteUserLocation();\n\n  const handleClick = useCallback(() => {\n    if (peerQuestionIndex === undefined) {\n      return null;\n    }\n\n    if (questions[peerQuestionIndex]?.response_id) {\n      const qrId = questions[peerQuestionIndex]?.response_id as string;\n\n      scrollToQuestion(qrId);\n    }\n  }, [peerQuestionIndex, questions]);\n\n  if (!peerLocation || userType !== 'TEACHER') {\n    return null;\n  }\n\n  return (\n    <StickyContainer\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $pointer={peerLocation}\n      $bottomOffset={actionbarHeight}\n      $topOffset={topOffset}\n    >\n      <Clickable label=\"User Location Pointer\" onClick={handleClick}>\n        <StyledImage\n          $pointer={peerLocation}\n          width={USER_PIN_WIDTH}\n          height={USER_PIN_HEIGHT}\n          src={peerLocation === 'up' ? ILLUSTRATIONS.USER_UP : ILLUSTRATIONS.USER_DOWN}\n        />\n      </Clickable>\n    </StickyContainer>\n  );\n});\n\nexport default UserPointer;\n"],"names":["USER_PIN_WIDTH","USER_PIN_HEIGHT","StyledImage","styled","$pointer","StickyContainer","FlexView","$topOffset","$bottomOffset","UserPointer","memo","topOffset","questions","userType","actionbarHeight","useWorksheetStore","store","peerLocation","peerQuestionIndex","useRemoteUserLocation","handleClick","useCallback","_a","qrId","_b","scrollToQuestion","jsx","Clickable","ILLUSTRATIONS"],"mappings":";;;;;;;;;AAUA,MAAMA,IAAiB,IACjBC,IAAkB,IAElBC,IAAcC,EAAO;AAAA;AAAA,eAEZ,CAAC,EAAE,UAAAC,QACdA,MAAa,SACT,cAAcJ,IAAiB,CAAC,QAAQC,CAAe,QACvD,cAAcD,IAAiB,CAAC,QAAQ;AAAA,GAG1CK,IAAkBF,EAAOG,CAAQ;AAAA,EAKrC,CAAC,EAAE,UAAAF,GAAU,YAAAG,GAAY,eAAAC,EAAoB,MAAA;AAAA;AAAA,SAG3CJ,MAAa,SAAS,eAAeI,CAAa,QAAQ,QAAQD,IAAa,KAAK,CAAC,KACvF;AAAA;AAAA;AAGF,GAEME,IAAkBC,EAAK,WAAuB;AAClD,QAAM,EAAE,WAAAC,GAAW,WAAAC,GAAW,UAAAC,GAAU,iBAAAC,MAAoBC,EAAkB,CAAUC,OAAA;AAAA,IACtF,WAAWA,EAAM,OAAO;AAAA,IACxB,WAAWA,EAAM;AAAA,IACjB,UAAUA,EAAM;AAAA,IAChB,iBAAiBA,EAAM;AAAA,EACvB,EAAA,GACI,EAAE,cAAAC,GAAc,mBAAAC,EAAkB,IAAIC,EAAsB,GAE5DC,IAAcC,EAAY,MAAM;;AACpC,QAAIH,MAAsB;AACjB,aAAA;AAGL,SAAAI,IAAAV,EAAUM,CAAiB,MAA3B,QAAAI,EAA8B,aAAa;AACvC,YAAAC,KAAOC,IAAAZ,EAAUM,CAAiB,MAA3B,gBAAAM,EAA8B;AAE3C,MAAAC,EAAiBF,CAAI;AAAA,IACvB;AAAA,EAAA,GACC,CAACL,GAAmBN,CAAS,CAAC;AAE7B,SAAA,CAACK,KAAgBJ,MAAa,YACzB,OAIP,gBAAAa;AAAA,IAACrB;AAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,UAAUY;AAAA,MACV,eAAeH;AAAA,MACf,YAAYH;AAAA,MAEZ,UAAC,gBAAAe,EAAAC,GAAA,EAAU,OAAM,yBAAwB,SAASP,GAChD,UAAA,gBAAAM;AAAA,QAACxB;AAAA,QAAA;AAAA,UACC,UAAUe;AAAA,UACV,OAAOjB;AAAA,UACP,QAAQC;AAAA,UACR,KAAKgB,MAAiB,OAAOW,EAAc,UAAUA,EAAc;AAAA,QAAA;AAAA,MAAA,GAEvE;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"user-pin.js","sources":["../../../../src/features/worksheet/user-pointer-pin/user-pin.tsx"],"sourcesContent":["import { memo, useCallback, type FC } from 'react';\nimport styled from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Clickable from '../../ui/buttons/clickable/clickable';\nimport FlexView from '../../ui/layout/flex-view';\nimport type { TUserTypes } from '../../ui/types';\nimport { scrollToQuestion } from '../worksheet/worksheet-helpers';\nimport type { IWorksheetQuestion } from '../worksheet/worksheet-types';\nimport useRemoteUserLocation from './hooks/use-user-location';\n\nconst USER_PIN_WIDTH = 32;\nconst USER_PIN_HEIGHT = 36;\n\nconst StyledImage = styled.img<{ $pointer: 'up' | 'down' | undefined }>`\n  position: absolute;\n  transform: ${({ $pointer }) =>\n    $pointer === 'down'\n      ? `translate(-${USER_PIN_WIDTH / 2}px, -${USER_PIN_HEIGHT}px)`\n      : `translate(-${USER_PIN_WIDTH / 2}px, 0)`};\n`;\n\nconst StickyContainer = styled(FlexView)<{\n  $pointer: 'up' | 'down' | undefined;\n  $topOffset: number;\n  $bottomOffset: number;\n}>(\n  ({ $pointer, $topOffset, $bottomOffset }) => `\n  position: sticky;\n  top: ${\n    $pointer === 'down' ? `calc(100% - ${$bottomOffset}px)` : `calc(${$topOffset + 48 + 8}px)`\n  };\n  z-index: 1;\n`,\n);\n\ninterface IUserPointerProps {\n  activeQuestionIndex: number;\n  onClick: (questionId: string) => void;\n  questions: IWorksheetQuestion[];\n  bottomOffset: number;\n  topOffset: number;\n  userType: TUserTypes;\n}\n\nconst UserPointer: FC<IUserPointerProps> = memo(function UserPointer(props) {\n  const { activeQuestionIndex, questions, bottomOffset, topOffset, userType } = props;\n  const { peerLocation, peerQuestionIndex } = useRemoteUserLocation({\n    questions,\n    activeQuestionIndex,\n    userType,\n  });\n\n  const handleClick = useCallback(() => {\n    if (peerQuestionIndex === undefined) {\n      return null;\n    }\n\n    if (questions[peerQuestionIndex]?.response_id) {\n      const qrId = questions[peerQuestionIndex]?.response_id as string;\n\n      scrollToQuestion(qrId);\n    }\n  }, [peerQuestionIndex, questions]);\n\n  if (!peerLocation || userType !== 'TEACHER') {\n    return null;\n  }\n\n  return (\n    <StickyContainer\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $pointer={peerLocation}\n      $bottomOffset={bottomOffset}\n      $topOffset={topOffset}\n    >\n      <Clickable label=\"User Location Pointer\" onClick={handleClick}>\n        <StyledImage\n          $pointer={peerLocation}\n          width={USER_PIN_WIDTH}\n          height={USER_PIN_HEIGHT}\n          src={peerLocation === 'up' ? ILLUSTRATIONS.USER_UP : ILLUSTRATIONS.USER_DOWN}\n        />\n      </Clickable>\n    </StickyContainer>\n  );\n});\n\nexport default UserPointer;\n"],"names":["USER_PIN_WIDTH","USER_PIN_HEIGHT","StyledImage","styled","$pointer","StickyContainer","FlexView","$topOffset","$bottomOffset","UserPointer","memo","props","activeQuestionIndex","questions","bottomOffset","topOffset","userType","peerLocation","peerQuestionIndex","useRemoteUserLocation","handleClick","useCallback","_a","qrId","_b","scrollToQuestion","jsx","Clickable","ILLUSTRATIONS"],"mappings":";;;;;;;;AAWA,MAAMA,IAAiB,IACjBC,IAAkB,IAElBC,IAAcC,EAAO;AAAA;AAAA,eAEZ,CAAC,EAAE,UAAAC,QACdA,MAAa,SACT,cAAcJ,IAAiB,CAAC,QAAQC,CAAe,QACvD,cAAcD,IAAiB,CAAC,QAAQ;AAAA,GAG1CK,IAAkBF,EAAOG,CAAQ;AAAA,EAKrC,CAAC,EAAE,UAAAF,GAAU,YAAAG,GAAY,eAAAC,EAAoB,MAAA;AAAA;AAAA,SAG3CJ,MAAa,SAAS,eAAeI,CAAa,QAAQ,QAAQD,IAAa,KAAK,CAAC,KACvF;AAAA;AAAA;AAGF,GAWME,IAAqCC,EAAK,SAAqBC,GAAO;AAC1E,QAAM,EAAE,qBAAAC,GAAqB,WAAAC,GAAW,cAAAC,GAAc,WAAAC,GAAW,UAAAC,EAAa,IAAAL,GACxE,EAAE,cAAAM,GAAc,mBAAAC,EAAkB,IAAIC,EAAsB;AAAA,IAChE,WAAAN;AAAA,IACA,qBAAAD;AAAA,IACA,UAAAI;AAAA,EAAA,CACD,GAEKI,IAAcC,EAAY,MAAM;;AACpC,QAAIH,MAAsB;AACjB,aAAA;AAGL,SAAAI,IAAAT,EAAUK,CAAiB,MAA3B,QAAAI,EAA8B,aAAa;AACvC,YAAAC,KAAOC,IAAAX,EAAUK,CAAiB,MAA3B,gBAAAM,EAA8B;AAE3C,MAAAC,EAAiBF,CAAI;AAAA,IACvB;AAAA,EAAA,GACC,CAACL,GAAmBL,CAAS,CAAC;AAE7B,SAAA,CAACI,KAAgBD,MAAa,YACzB,OAIP,gBAAAU;AAAA,IAACrB;AAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,UAAUY;AAAA,MACV,eAAeH;AAAA,MACf,YAAYC;AAAA,MAEZ,UAAC,gBAAAW,EAAAC,GAAA,EAAU,OAAM,yBAAwB,SAASP,GAChD,UAAA,gBAAAM;AAAA,QAACxB;AAAA,QAAA;AAAA,UACC,UAAUe;AAAA,UACV,OAAOjB;AAAA,UACP,QAAQC;AAAA,UACR,KAAKgB,MAAiB,OAAOW,EAAc,UAAUA,EAAc;AAAA,QAAA;AAAA,MAAA,GAEvE;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}