@cuemath/leap 3.3.7 → 3.3.8-m

package/dist/features/ui/modals/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","sources":["../../../../src/features/ui/modals/modal.tsx"],"sourcesContent":["import type { IModalProps } from './modal-types';\nimport type { FC } from 'react';\n\nimport { captureException } from '@sentry/browser';\nimport { memo, Suspense, useCallback } from 'react';\nimport { ErrorBoundary } from 'react-error-boundary';\nimport { useTheme } from 'styled-components';\n\nimport CrossIcon from '../../../assets/line-icons/icons/cross';\nimport Error from '../../ui/error/error';\nimport Clickable from '../buttons/clickable/clickable';\nimport FlexView from '../layout/flex-view';\nimport AppLoader from '../loader/app-loader/app-loader';\nimport { EDeviceType } from '../theme/constants';\nimport * as Styled from './modal-styled';\n\n/**\n * Modal component that renders modal content with close button\n * Handles animation state for entry and exit transitions\n */\nconst Modal: FC<IModalProps> = memo(({ modal, isClosing = false, onClose }) => {\n  const { device } = useTheme();\n  const isMobile = device <= EDeviceType.MOBILE;\n  const { renderAs, element, modalWidth, isDismissable, renderOnMobileAs } = modal;\n\n  const sentryCaptureException = useCallback((error: Error) => {\n    captureException(error);\n  }, []);\n\n  const handleStopPropagation = useCallback((e: React.MouseEvent) => {\n    e.stopPropagation();\n  }, []);\n\n  if (renderAs === 'bottom-sheet' || (isMobile && renderOnMobileAs === 'bottom-sheet')) {\n    return (\n      <Styled.ModalContainer $isClosing={isClosing} onClick={isDismissable ? onClose : () => null}>\n        <Styled.BottomSheetModal $isClosing={isClosing} onClick={handleStopPropagation}>\n          <ErrorBoundary\n            fallback={\n              <FlexView $gap={24}>\n                <Error height=\"100%\" />\n              </FlexView>\n            }\n            onError={sentryCaptureException}\n          >\n            <Suspense fallback={<AppLoader height=\"50vh\" />}>{element}</Suspense>\n          </ErrorBoundary>\n        </Styled.BottomSheetModal>\n      </Styled.ModalContainer>\n    );\n  }\n\n  if (renderAs === 'spotlight') {\n    return (\n      <Styled.ModalContainer $isClosing={isClosing}>\n        <ErrorBoundary\n          fallback={\n            <Styled.ModalLoaderWrapper>\n              <Error height=\"100vh\" />\n            </Styled.ModalLoaderWrapper>\n          }\n          onError={sentryCaptureException}\n        >\n          <Suspense\n            fallback={\n              <Styled.ModalLoaderWrapper>\n                <AppLoader height=\"100vh\" />\n              </Styled.ModalLoaderWrapper>\n            }\n          >\n            <Styled.SpotlightModal $isClosing={isClosing} />\n            {element}\n          </Suspense>\n        </ErrorBoundary>\n      </Styled.ModalContainer>\n    );\n  }\n\n  return (\n    <Styled.ModalContainer $isClosing={isClosing}>\n      <Styled.BaseModal $isClosing={isClosing} $width={modalWidth}>\n        {isDismissable !== false && (\n          <Styled.CloseButtonContainer $modalWidth={modalWidth}>\n            <Clickable label=\"Close\" onClick={onClose}>\n              <CrossIcon width={40} height={40} />\n            </Clickable>\n          </Styled.CloseButtonContainer>\n        )}\n        <Styled.BaseModalContent $modalWidth={modalWidth}>\n          <ErrorBoundary\n            fallback={<Error height=\"50vh\" size=\"compact\" />}\n            onError={sentryCaptureException}\n          >\n            <Suspense fallback={<AppLoader height=\"50vh\" />}>{element}</Suspense>\n          </ErrorBoundary>\n        </Styled.BaseModalContent>\n      </Styled.BaseModal>\n    </Styled.ModalContainer>\n  );\n});\n\nexport default Modal;\n"],"names":["Modal","memo","modal","isClosing","onClose","device","useTheme","isMobile","EDeviceType","renderAs","element","modalWidth","isDismissable","renderOnMobileAs","sentryCaptureException","useCallback","error","captureException","handleStopPropagation","e","Styled.ModalContainer","Styled.BottomSheetModal","jsx","ErrorBoundary","FlexView","Error","Suspense","AppLoader","Styled.ModalLoaderWrapper","jsxs","Styled.SpotlightModal","Styled.BaseModal","Styled.CloseButtonContainer","Clickable","CrossIcon","Styled.BaseModalContent"],"mappings":";;;;;;;;;;;;AAoBM,MAAAA,IAAyBC,EAAK,CAAC,EAAE,OAAAC,GAAO,WAAAC,IAAY,IAAO,SAAAC,QAAc;AACvE,QAAA,EAAE,QAAAC,MAAWC,KACbC,IAAWF,KAAUG,EAAY,QACjC,EAAE,UAAAC,GAAU,SAAAC,GAAS,YAAAC,GAAY,eAAAC,GAAe,kBAAAC,EAAqB,IAAAX,GAErEY,IAAyBC,EAAY,CAACC,MAAiB;AAC3D,IAAAC,EAAiBD,CAAK;AAAA,EACxB,GAAG,CAAE,CAAA,GAECE,IAAwBH,EAAY,CAACI,MAAwB;AACjE,IAAAA,EAAE,gBAAgB;AAAA,EACpB,GAAG,CAAE,CAAA;AAEL,SAAIV,MAAa,kBAAmBF,KAAYM,MAAqB,mCAEhEO,GAAA,EAAsB,YAAYjB,GAAW,SAASS,IAAgBR,IAAU,MAAM,MACrF,4BAACiB,GAAA,EAAwB,YAAYlB,GAAW,SAASe,GACvD,UAAA,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,4BACGC,GAAS,EAAA,MAAM,IACd,UAAC,gBAAAF,EAAAG,GAAA,EAAM,QAAO,OAAA,CAAO,EACvB,CAAA;AAAA,MAEF,SAASX;AAAA,MAET,UAAA,gBAAAQ,EAACI,KAAS,UAAU,gBAAAJ,EAACK,KAAU,QAAO,OAAO,CAAA,GAAK,UAAQjB,EAAA,CAAA;AAAA,IAAA;AAAA,EAAA,EAE9D,CAAA,EACF,CAAA,IAIAD,MAAa,cAEZ,gBAAAa,EAAAF,GAAA,EAAsB,YAAYjB,GACjC,UAAA,gBAAAmB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,4BACGK,GAAA,EACC,UAAC,gBAAAN,EAAAG,GAAA,EAAM,QAAO,QAAQ,CAAA,GACxB;AAAA,MAEF,SAASX;AAAA,MAET,UAAA,gBAAAe;AAAA,QAACH;AAAA,QAAA;AAAA,UACC,4BACGE,GAAA,EACC,UAAC,gBAAAN,EAAAK,GAAA,EAAU,QAAO,QAAQ,CAAA,GAC5B;AAAA,UAGF,UAAA;AAAA,YAAA,gBAAAL,EAACQ,GAAA,EAAsB,YAAY3B,EAAW,CAAA;AAAA,YAC7CO;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA,IAKD,gBAAAY,EAAAF,GAAA,EAAsB,YAAYjB,GACjC,UAAC,gBAAA0B,EAAAE,GAAA,EAAiB,YAAY5B,GAAW,QAAQQ,GAC9C,UAAA;AAAA,IAAkBC,MAAA,wBAChBoB,GAAA,EAA4B,aAAarB,GACxC,4BAACsB,GAAU,EAAA,OAAM,SAAQ,SAAS7B,GAChC,4BAAC8B,GAAU,EAAA,OAAO,IAAI,QAAQ,IAAI,GACpC,EACF,CAAA;AAAA,IAED,gBAAAZ,EAAAa,GAAA,EAAwB,aAAaxB,GACpC,UAAA,gBAAAW;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAW,gBAAAD,EAAAG,GAAA,EAAM,QAAO,QAAO,MAAK,WAAU;AAAA,QAC9C,SAASX;AAAA,QAET,UAAA,gBAAAQ,EAACI,KAAS,UAAU,gBAAAJ,EAACK,KAAU,QAAO,OAAO,CAAA,GAAK,UAAQjB,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA,GAE9D;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"modal.js","sources":["../../../../src/features/ui/modals/modal.tsx"],"sourcesContent":["import type { IModalProps } from './modal-types';\nimport type { FC } from 'react';\n\nimport { captureException } from '@sentry/browser';\nimport { memo, Suspense, useCallback } from 'react';\nimport { ErrorBoundary } from 'react-error-boundary';\nimport { useTheme } from 'styled-components';\n\nimport CrossIcon from '../../../assets/line-icons/icons/cross';\nimport Error from '../../ui/error/error';\nimport Clickable from '../buttons/clickable/clickable';\nimport FlexView from '../layout/flex-view';\nimport AppLoader from '../loader/app-loader/app-loader';\nimport { EDeviceType } from '../theme/constants';\nimport * as Styled from './modal-styled';\n\n/**\n * Modal component that renders modal content with close button\n * Handles animation state for entry and exit transitions\n */\nconst Modal: FC<IModalProps> = memo(({ modal, isClosing = false, onClose }) => {\n  const { device } = useTheme();\n  const isMobile = device <= EDeviceType.MOBILE;\n  const { renderAs, element, modalWidth, isDismissable, renderOnMobileAs, blocking = true } = modal;\n\n  const sentryCaptureException = useCallback((error: Error) => {\n    captureException(error);\n  }, []);\n\n  const handleStopPropagation = useCallback((e: React.MouseEvent) => {\n    e.stopPropagation();\n  }, []);\n\n  if (renderAs === 'bottom-sheet' || (isMobile && renderOnMobileAs === 'bottom-sheet')) {\n    return (\n      <Styled.ModalContainer\n        $isClosing={isClosing}\n        $blocking={blocking}\n        onClick={isDismissable ? onClose : () => null}\n      >\n        <Styled.BottomSheetModal $isClosing={isClosing} onClick={handleStopPropagation}>\n          <ErrorBoundary\n            fallback={\n              <FlexView $gap={24}>\n                <Error height=\"100%\" />\n              </FlexView>\n            }\n            onError={sentryCaptureException}\n          >\n            <Suspense fallback={<AppLoader height=\"50vh\" />}>{element}</Suspense>\n          </ErrorBoundary>\n        </Styled.BottomSheetModal>\n      </Styled.ModalContainer>\n    );\n  }\n\n  if (renderAs === 'spotlight') {\n    return (\n      <Styled.ModalContainer $isClosing={isClosing} $blocking={blocking}>\n        <ErrorBoundary\n          fallback={\n            <Styled.ModalLoaderWrapper>\n              <Error height=\"100vh\" />\n            </Styled.ModalLoaderWrapper>\n          }\n          onError={sentryCaptureException}\n        >\n          <Suspense\n            fallback={\n              <Styled.ModalLoaderWrapper>\n                <AppLoader height=\"100vh\" />\n              </Styled.ModalLoaderWrapper>\n            }\n          >\n            <Styled.SpotlightModal $isClosing={isClosing} />\n            {element}\n          </Suspense>\n        </ErrorBoundary>\n      </Styled.ModalContainer>\n    );\n  }\n\n  if (renderAs === 'fullscreen-transparent') {\n    return (\n      <Styled.TransparentModalContainer $isClosing={isClosing} $blocking={blocking}>\n        {element}\n      </Styled.TransparentModalContainer>\n    );\n  }\n\n  return (\n    <Styled.ModalContainer $isClosing={isClosing} $blocking={blocking}>\n      <Styled.BaseModal $isClosing={isClosing} $width={modalWidth}>\n        {isDismissable !== false && (\n          <Styled.CloseButtonContainer $modalWidth={modalWidth}>\n            <Clickable label=\"Close\" onClick={onClose}>\n              <CrossIcon width={40} height={40} />\n            </Clickable>\n          </Styled.CloseButtonContainer>\n        )}\n        <Styled.BaseModalContent $modalWidth={modalWidth}>\n          <ErrorBoundary\n            fallback={<Error height=\"50vh\" size=\"compact\" />}\n            onError={sentryCaptureException}\n          >\n            <Suspense fallback={<AppLoader height=\"50vh\" />}>{element}</Suspense>\n          </ErrorBoundary>\n        </Styled.BaseModalContent>\n      </Styled.BaseModal>\n    </Styled.ModalContainer>\n  );\n});\n\nexport default Modal;\n"],"names":["Modal","memo","modal","isClosing","onClose","device","useTheme","isMobile","EDeviceType","renderAs","element","modalWidth","isDismissable","renderOnMobileAs","blocking","sentryCaptureException","useCallback","error","captureException","handleStopPropagation","e","jsx","Styled.ModalContainer","Styled.BottomSheetModal","ErrorBoundary","FlexView","Error","Suspense","AppLoader","Styled.ModalLoaderWrapper","jsxs","Styled.SpotlightModal","Styled.TransparentModalContainer","Styled.BaseModal","Styled.CloseButtonContainer","Clickable","CrossIcon","Styled.BaseModalContent"],"mappings":";;;;;;;;;;;;AAoBM,MAAAA,IAAyBC,EAAK,CAAC,EAAE,OAAAC,GAAO,WAAAC,IAAY,IAAO,SAAAC,QAAc;AACvE,QAAA,EAAE,QAAAC,MAAWC,KACbC,IAAWF,KAAUG,EAAY,QACjC,EAAE,UAAAC,GAAU,SAAAC,GAAS,YAAAC,GAAY,eAAAC,GAAe,kBAAAC,GAAkB,UAAAC,IAAW,GAAS,IAAAZ,GAEtFa,IAAyBC,EAAY,CAACC,MAAiB;AAC3D,IAAAC,EAAiBD,CAAK;AAAA,EACxB,GAAG,CAAE,CAAA,GAECE,IAAwBH,EAAY,CAACI,MAAwB;AACjE,IAAAA,EAAE,gBAAgB;AAAA,EACpB,GAAG,CAAE,CAAA;AAEL,SAAIX,MAAa,kBAAmBF,KAAYM,MAAqB,iBAEjE,gBAAAQ;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,YAAYnB;AAAA,MACZ,WAAWW;AAAA,MACX,SAASF,IAAgBR,IAAU,MAAM;AAAA,MAEzC,4BAACmB,GAAA,EAAwB,YAAYpB,GAAW,SAASgB,GACvD,UAAA,gBAAAE;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,4BACGC,GAAS,EAAA,MAAM,IACd,UAAC,gBAAAJ,EAAAK,GAAA,EAAM,QAAO,OAAA,CAAO,EACvB,CAAA;AAAA,UAEF,SAASX;AAAA,UAET,UAAA,gBAAAM,EAACM,KAAS,UAAU,gBAAAN,EAACO,KAAU,QAAO,OAAO,CAAA,GAAK,UAAQlB,EAAA,CAAA;AAAA,QAAA;AAAA,MAAA,GAE9D;AAAA,IAAA;AAAA,EAAA,IAKFD,MAAa,gCAEZa,GAAA,EAAsB,YAAYnB,GAAW,WAAWW,GACvD,UAAA,gBAAAO;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,4BACGK,GAAA,EACC,UAAC,gBAAAR,EAAAK,GAAA,EAAM,QAAO,QAAQ,CAAA,GACxB;AAAA,MAEF,SAASX;AAAA,MAET,UAAA,gBAAAe;AAAA,QAACH;AAAA,QAAA;AAAA,UACC,4BACGE,GAAA,EACC,UAAC,gBAAAR,EAAAO,GAAA,EAAU,QAAO,QAAQ,CAAA,GAC5B;AAAA,UAGF,UAAA;AAAA,YAAA,gBAAAP,EAACU,GAAA,EAAsB,YAAY5B,EAAW,CAAA;AAAA,YAC7CO;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA,IAIAD,MAAa,2BAEb,gBAAAY,EAACW,GAAA,EAAiC,YAAY7B,GAAW,WAAWW,GACjE,UACHJ,EAAA,CAAA,IAKD,gBAAAW,EAAAC,GAAA,EAAsB,YAAYnB,GAAW,WAAWW,GACvD,UAAA,gBAAAgB,EAACG,GAAA,EAAiB,YAAY9B,GAAW,QAAQQ,GAC9C,UAAA;AAAA,IAAkBC,MAAA,wBAChBsB,GAAA,EAA4B,aAAavB,GACxC,4BAACwB,GAAU,EAAA,OAAM,SAAQ,SAAS/B,GAChC,4BAACgC,GAAU,EAAA,OAAO,IAAI,QAAQ,IAAI,GACpC,EACF,CAAA;AAAA,IAED,gBAAAf,EAAAgB,GAAA,EAAwB,aAAa1B,GACpC,UAAA,gBAAAU;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,UAAW,gBAAAH,EAAAK,GAAA,EAAM,QAAO,QAAO,MAAK,WAAU;AAAA,QAC9C,SAASX;AAAA,QAET,UAAA,gBAAAM,EAACM,KAAS,UAAU,gBAAAN,EAACO,KAAU,QAAO,OAAO,CAAA,GAAK,UAAQlB,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA,GAE9D;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ,CAAC;"}

package/dist/features/worksheet/worksheet/worksheet-sidebar/question-guide.js

@@ -1,80 +1,126 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { memo as L, useState as T, useCallback as h, useMemo as v, useRef as H, useEffect as X } from "react";
-import $ from "../../../ui/buttons/clickable/clickable.js";
-import c from "../../../ui/layout/flex-view.js";
-import y from "../../../ui/separator/separator.js";
-import u from "../../../ui/text/text.js";
-import N from "../../constants/events.js";
-import { GuideContainer as P, HintIcon as V, SolIcon as j, Pointer as x, SectionContainer as B, Section as W, CloseIcon as K, Guide as M } from "./worksheet-sidebar-styled.js";
-const Z = L(
-  ({ questionWidth: f, questions: _, activeQuestionIndex: O, learnosity: S, actionbarHeight: p, loggerRef: l }) => {
-    var C;
-    const [t, s] = T(), [k, A] = T({
+import { jsx as e, jsxs as o } from "react/jsx-runtime";
+import { memo as V, useState as p, useCallback as s, useMemo as $, useRef as w, useEffect as W } from "react";
+import M from "../../../stickers/sticker-selector/sticker-selector.js";
+import m from "../../../ui/buttons/clickable/clickable.js";
+import i from "../../../ui/layout/flex-view.js";
+import O from "../../../ui/separator/separator.js";
+import d from "../../../ui/text/text.js";
+import R from "../../constants/events.js";
+import { StickersIcon as q, GuideContainer as z, HintIcon as U, SolIcon as D, Pointer as F, SectionContainer as Q, Section as J, CloseIcon as Z, Guide as ee } from "./worksheet-sidebar-styled.js";
+const ae = V(
+  ({
+    questionWidth: C,
+    questions: A,
+    activeQuestionIndex: G,
+    learnosity: b,
+    actionbarHeight: I,
+    loggerRef: a,
+    enableStickers: L,
+    handleStickerSend: E
+  }) => {
+    var _;
+    const [t, h] = p(), [v, y] = p({
       top: 0,
       left: 0
-    }), { top: g, left: b } = k, R = h(() => {
-      s("HINT"), l.current(N.WORKSHEET_V3_HINT_SEEN);
-    }, [l]), w = h(() => {
-      s("SOL"), l.current(N.WORKSHEET_V3_SOLUTION_SEEN);
-    }, [l]), G = h(() => {
-      s(() => {
+    }), [g, X] = p(!1), { top: T, left: k } = v, B = s(() => {
+      h("HINT"), a.current(R.WORKSHEET_V3_HINT_SEEN);
+    }, [a]), Y = s(() => {
+      h("SOL"), a.current(R.WORKSHEET_V3_SOLUTION_SEEN);
+    }, [a]), j = s(() => {
+      h(() => {
       });
-    }, []), { hints: n, solution: d } = ((C = _[O]) == null ? void 0 : C.metadata) || {}, o = v(() => t === void 0 ? void 0 : t === "HINT" ? n : d, [t, n, d]), E = H(null), I = H(null), m = h((a) => {
-      if (a.current) {
-        const i = a.current.getBoundingClientRect();
-        A({
-          top: i.top + i.height / 2 - 8,
-          left: i.right - 78
+    }, []), f = s(() => {
+      X((c) => !c);
+    }, []), { hints: n, solution: u } = ((_ = A[G]) == null ? void 0 : _.metadata) || {}, r = $(() => t === void 0 ? void 0 : t === "HINT" ? n : u, [t, n, u]), H = w(null), N = w(null), S = s((c) => {
+      if (c.current) {
+        const l = c.current.getBoundingClientRect();
+        y({
+          top: l.top + l.height / 2 - 8,
+          left: l.right - 78
           // 52px (sidebar width) + 16px (gutter) + 10px
         });
       }
-    }, []);
-    return t && o && S && S.renderMath("mathjax"), X(() => {
-      t === "HINT" ? m(I) : t === "SOL" ? m(E) : o || s(void 0);
-    }, [t, m, o]), /* @__PURE__ */ r(P, { $background: "WHITE", children: [
-      /* @__PURE__ */ e($, { label: "hints", onClick: R, disabled: !n, children: /* @__PURE__ */ r(c, { $alignItems: "center", $justifyContent: "center", ref: I, children: [
-        /* @__PURE__ */ e(V, { width: 32, height: 32, $disabled: !n }),
-        /* @__PURE__ */ e(u, { $renderAs: "eyebrow2", $color: n ? "BLACK" : "GREY_4", children: "HINT" }),
-        /* @__PURE__ */ e(c, { $gap: 8, $alignItems: "center", children: /* @__PURE__ */ e(y, { width: 24, height: 1, background: "GREY_2" }) })
+    }, []), x = $(
+      () => /* @__PURE__ */ e(m, { label: "teacher-badges", onClick: f, children: /* @__PURE__ */ o(i, { $alignItems: "center", $justifyContent: "center", children: [
+        /* @__PURE__ */ e(q, { width: 32, height: 32, $disabled: !g }),
+        /* @__PURE__ */ e(d, { $renderAs: "eyebrow2", $color: g ? "BLACK" : "GREY_4", children: "STICKERS" }),
+        /* @__PURE__ */ e(i, { $gap: 8, $alignItems: "center", children: /* @__PURE__ */ e(O, { width: 24, height: 1, background: "GREY_2" }) })
       ] }) }),
-      /* @__PURE__ */ e($, { label: "solution", onClick: w, disabled: !d, children: /* @__PURE__ */ r(c, { $alignItems: "center", $justifyContent: "center", ref: E, children: [
-        /* @__PURE__ */ e(j, { width: 32, height: 32, $disabled: !d }),
-        /* @__PURE__ */ e(u, { $renderAs: "eyebrow2", $color: n ? "BLACK" : "GREY_4", children: "SOL" })
+      [g, f]
+    ), K = $(
+      () => ({
+        stickerSize: 48,
+        columns: 4,
+        gap: 8
+      }),
+      []
+    ), P = $(
+      () => ({
+        position: "left",
+        zIndex: 1e3,
+        arrowYCoOrdinates: -175,
+        tooltipXCoOrdinates: "7.5%",
+        tooltipYCoOrdinates: "40%"
+      }),
+      []
+    );
+    return t && r && b && b.renderMath("mathjax"), W(() => {
+      t === "HINT" ? S(N) : t === "SOL" ? S(H) : r || h(void 0);
+    }, [t, S, r]), /* @__PURE__ */ o(z, { $background: "WHITE", children: [
+      L && E && /* @__PURE__ */ e(
+        M,
+        {
+          triggerNode: x,
+          onStickerSend: E,
+          gridConfig: K,
+          tooltipConfig: P,
+          visible: g,
+          onToggle: f
+        }
+      ),
+      /* @__PURE__ */ e(m, { label: "hints", onClick: B, disabled: !n, children: /* @__PURE__ */ o(i, { $alignItems: "center", $justifyContent: "center", ref: N, children: [
+        /* @__PURE__ */ e(U, { width: 32, height: 32, $disabled: !n }),
+        /* @__PURE__ */ e(d, { $renderAs: "eyebrow2", $color: n ? "BLACK" : "GREY_4", children: "HINT" }),
+        /* @__PURE__ */ e(i, { $gap: 8, $alignItems: "center", children: /* @__PURE__ */ e(O, { width: 24, height: 1, background: "GREY_2" }) })
+      ] }) }),
+      /* @__PURE__ */ e(m, { label: "solution", onClick: Y, disabled: !u, children: /* @__PURE__ */ o(i, { $alignItems: "center", $justifyContent: "center", ref: H, children: [
+        /* @__PURE__ */ e(D, { width: 32, height: 32, $disabled: !u }),
+        /* @__PURE__ */ e(d, { $renderAs: "eyebrow2", $color: n ? "BLACK" : "GREY_4", children: "SOL" })
       ] }) }),
-      t && g && b && /* @__PURE__ */ e(x, { topValue: g, leftValue: b }),
+      t && T && k && /* @__PURE__ */ e(F, { topValue: T, leftValue: k }),
       t && /* @__PURE__ */ e(
-        B,
+        Q,
         {
           $background: "WHITE",
-          $questionWidth: f,
-          $actionbarHeight: p,
+          $questionWidth: C,
+          $actionbarHeight: I,
           $borderRadius: 10,
-          children: /* @__PURE__ */ r(
-            W,
+          children: /* @__PURE__ */ o(
+            J,
             {
               $gutterX: 1,
               $gapX: 1,
-              $questionWidth: f,
-              $actionbarHeight: p,
+              $questionWidth: C,
+              $actionbarHeight: I,
               children: [
-                /* @__PURE__ */ e($, { label: "close", onClick: G, children: /* @__PURE__ */ e(K, {}) }),
-                /* @__PURE__ */ e(c, { $gutterX: 0.5, children: /* @__PURE__ */ e(u, { $renderAs: "eyebrow2", $color: "ORANGE_5", $marginBottomX: 0.25, children: t === "HINT" ? "HINTS:" : "SOLUTION:" }) }),
-                o && o.map((a, i) => /* @__PURE__ */ r(c, { $gutterX: 0.5, $gapX: 0.5, children: [
-                  o.length > 1 && /* @__PURE__ */ r(u, { $renderAs: "eyebrow2", $color: "ORANGE_5", $marginBottomX: 0.25, children: [
+                /* @__PURE__ */ e(m, { label: "close", onClick: j, children: /* @__PURE__ */ e(Z, {}) }),
+                /* @__PURE__ */ e(i, { $gutterX: 0.5, children: /* @__PURE__ */ e(d, { $renderAs: "eyebrow2", $color: "ORANGE_5", $marginBottomX: 0.25, children: t === "HINT" ? "HINTS:" : "SOLUTION:" }) }),
+                r && r.map((c, l) => /* @__PURE__ */ o(i, { $gutterX: 0.5, $gapX: 0.5, children: [
+                  r.length > 1 && /* @__PURE__ */ o(d, { $renderAs: "eyebrow2", $color: "ORANGE_5", $marginBottomX: 0.25, children: [
                     t,
                     " ",
-                    i + 1,
+                    l + 1,
                     ":"
                   ] }),
                   /* @__PURE__ */ e(
-                    M,
+                    ee,
                     {
                       dangerouslySetInnerHTML: {
-                        __html: a
+                        __html: c
                       }
                     }
                   )
-                ] }, i.toString()))
+                ] }, l.toString()))
               ]
             }
           )
@@ -84,6 +130,6 @@ const Z = L(
   }
 );
 export {
-  Z as default
+  ae as default
 };
 //# sourceMappingURL=question-guide.js.map

package/dist/features/worksheet/worksheet/worksheet-sidebar/question-guide.js.map

@@ -1 +1 @@
-{"version":3,"file":"question-guide.js","sources":["../../../../../src/features/worksheet/worksheet/worksheet-sidebar/question-guide.tsx"],"sourcesContent":["import type { ILearnosity, IWorksheetProps, IWorksheetQuestion } from '../worksheet-types';\n\nimport React, { memo, useCallback, useEffect, useMemo, useState, useRef } from 'react';\n\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport EVENTS from '../../constants/events';\nimport {\n  Section,\n  GuideContainer,\n  CloseIcon,\n  SolIcon,\n  HintIcon,\n  SectionContainer,\n  Guide,\n  Pointer,\n} from './worksheet-sidebar-styled';\n\ntype TSections = 'HINT' | 'SOL';\n\ninterface IQuestionGuideProps extends Pick<IWorksheetProps, 'loggerRef'> {\n  questionWidth: number;\n  questions: IWorksheetQuestion[];\n  activeQuestionIndex: number;\n  learnosity: ILearnosity;\n  actionbarHeight: number;\n}\n\nconst QuestionGuide: React.FC<IQuestionGuideProps> = memo(\n  ({ questionWidth, questions, activeQuestionIndex, learnosity, actionbarHeight, loggerRef }) => {\n    const [activeSection, setActiveSection] = useState<TSections | undefined>();\n    const [pointerPosition, setPointerPosition] = useState({\n      top: 0,\n      left: 0,\n    });\n    const { top, left } = pointerPosition;\n\n    const handleHintClick = useCallback(() => {\n      setActiveSection('HINT');\n      loggerRef.current(EVENTS.WORKSHEET_V3_HINT_SEEN);\n    }, [loggerRef]);\n    const handleSolClick = useCallback(() => {\n      setActiveSection('SOL');\n      loggerRef.current(EVENTS.WORKSHEET_V3_SOLUTION_SEEN);\n    }, [loggerRef]);\n    const handleClose = useCallback(() => {\n      setActiveSection(() => undefined);\n    }, []);\n\n    const { hints, solution } = questions[activeQuestionIndex]?.metadata || {};\n\n    const activeSectionData = useMemo(() => {\n      return activeSection === undefined ? undefined : activeSection === 'HINT' ? hints : solution;\n    }, [activeSection, hints, solution]);\n\n    const sqlRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n    const hintRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n\n    const updatePointerPosition = useCallback((ref: React.RefObject<HTMLDivElement>) => {\n      if (ref.current) {\n        const rect = ref.current.getBoundingClientRect();\n\n        setPointerPosition({\n          top: rect.top + rect.height / 2 - 8,\n          left: rect.right - 78, // 52px (sidebar width) + 16px (gutter) + 10px\n        });\n      }\n    }, []);\n\n    if (activeSection && activeSectionData && learnosity) {\n      learnosity.renderMath('mathjax');\n    }\n\n    useEffect(() => {\n      if (activeSection === 'HINT') {\n        updatePointerPosition(hintRef);\n      } else if (activeSection === 'SOL') {\n        updatePointerPosition(sqlRef);\n      } else if (!activeSectionData) {\n        setActiveSection(undefined);\n      }\n    }, [activeSection, updatePointerPosition, activeSectionData]);\n\n    return (\n      <GuideContainer $background=\"WHITE\">\n        <Clickable label=\"hints\" onClick={handleHintClick} disabled={!hints}>\n          <FlexView $alignItems=\"center\" $justifyContent=\"center\" ref={hintRef}>\n            <HintIcon width={32} height={32} $disabled={!hints} />\n            <Text $renderAs=\"eyebrow2\" $color={!hints ? 'GREY_4' : 'BLACK'}>\n              HINT\n            </Text>\n            <FlexView $gap={8} $alignItems=\"center\">\n              <Separator width={24} height={1} background=\"GREY_2\" />\n            </FlexView>\n          </FlexView>\n        </Clickable>\n        <Clickable label=\"solution\" onClick={handleSolClick} disabled={!solution}>\n          <FlexView $alignItems=\"center\" $justifyContent=\"center\" ref={sqlRef}>\n            <SolIcon width={32} height={32} $disabled={!solution} />\n            <Text $renderAs=\"eyebrow2\" $color={!hints ? 'GREY_4' : 'BLACK'}>\n              SOL\n            </Text>\n          </FlexView>\n        </Clickable>\n        {activeSection && top && left && <Pointer topValue={top} leftValue={left} />}\n        {activeSection && (\n          <SectionContainer\n            $background=\"WHITE\"\n            $questionWidth={questionWidth}\n            $actionbarHeight={actionbarHeight}\n            $borderRadius={10}\n          >\n            <Section\n              $gutterX={1}\n              $gapX={1}\n              $questionWidth={questionWidth}\n              $actionbarHeight={actionbarHeight}\n            >\n              <Clickable label=\"close\" onClick={handleClose}>\n                <CloseIcon />\n              </Clickable>\n              <FlexView $gutterX={0.5}>\n                <Text $renderAs=\"eyebrow2\" $color=\"ORANGE_5\" $marginBottomX={0.25}>\n                  {activeSection === 'HINT' ? 'HINTS:' : 'SOLUTION:'}\n                </Text>\n              </FlexView>\n              {activeSectionData &&\n                activeSectionData.map((item, index) => (\n                  <FlexView $gutterX={0.5} $gapX={0.5} key={index.toString()}>\n                    {activeSectionData.length > 1 && (\n                      <Text $renderAs=\"eyebrow2\" $color=\"ORANGE_5\" $marginBottomX={0.25}>\n                        {activeSection} {index + 1}:\n                      </Text>\n                    )}\n                    <Guide\n                      dangerouslySetInnerHTML={{\n                        __html: item,\n                      }}\n                    />\n                  </FlexView>\n                ))}\n            </Section>\n          </SectionContainer>\n        )}\n      </GuideContainer>\n    );\n  },\n);\n\nexport default QuestionGuide;\n"],"names":["QuestionGuide","memo","questionWidth","questions","activeQuestionIndex","learnosity","actionbarHeight","loggerRef","activeSection","setActiveSection","useState","pointerPosition","setPointerPosition","top","left","handleHintClick","useCallback","EVENTS","handleSolClick","handleClose","hints","solution","_a","activeSectionData","useMemo","sqlRef","useRef","hintRef","updatePointerPosition","ref","rect","useEffect","jsxs","GuideContainer","jsx","Clickable","FlexView","HintIcon","Text","Separator","SolIcon","Pointer","SectionContainer","Section","CloseIcon","item","index","Guide"],"mappings":"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"}
+{"version":3,"file":"question-guide.js","sources":["../../../../../src/features/worksheet/worksheet/worksheet-sidebar/question-guide.tsx"],"sourcesContent":["import type { IStickerData } from '../../../stickers/sticker-selector/sticker-selector-types';\nimport type { TPositionProps } from '../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { ILearnosity, IWorksheetProps, IWorksheetQuestion } from '../worksheet-types';\n\nimport React, { memo, useCallback, useEffect, useMemo, useState, useRef } from 'react';\n\nimport StickerSelector from '../../../stickers/sticker-selector/sticker-selector';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport EVENTS from '../../constants/events';\nimport {\n  Section,\n  GuideContainer,\n  CloseIcon,\n  SolIcon,\n  HintIcon,\n  StickersIcon,\n  SectionContainer,\n  Guide,\n  Pointer,\n} from './worksheet-sidebar-styled';\n\ntype TSections = 'HINT' | 'SOL';\n\ninterface IQuestionGuideProps extends Pick<IWorksheetProps, 'loggerRef'> {\n  questionWidth: number;\n  questions: IWorksheetQuestion[];\n  activeQuestionIndex: number;\n  learnosity: ILearnosity;\n  actionbarHeight: number;\n  enableStickers?: boolean;\n  handleStickerSend?: (sticker: IStickerData) => void;\n}\n\nconst QuestionGuide: React.FC<IQuestionGuideProps> = memo(\n  ({\n    questionWidth,\n    questions,\n    activeQuestionIndex,\n    learnosity,\n    actionbarHeight,\n    loggerRef,\n    enableStickers,\n    handleStickerSend,\n  }) => {\n    const [activeSection, setActiveSection] = useState<TSections | undefined>();\n    const [pointerPosition, setPointerPosition] = useState({\n      top: 0,\n      left: 0,\n    });\n    const [showStickers, setShowStickers] = useState(false);\n    const { top, left } = pointerPosition;\n\n    const handleHintClick = useCallback(() => {\n      setActiveSection('HINT');\n      loggerRef.current(EVENTS.WORKSHEET_V3_HINT_SEEN);\n    }, [loggerRef]);\n    const handleSolClick = useCallback(() => {\n      setActiveSection('SOL');\n      loggerRef.current(EVENTS.WORKSHEET_V3_SOLUTION_SEEN);\n    }, [loggerRef]);\n    const handleClose = useCallback(() => {\n      setActiveSection(() => undefined);\n    }, []);\n    const handleBadgeToggle = useCallback(() => {\n      setShowStickers(prev => !prev);\n    }, []);\n\n    const { hints, solution } = questions[activeQuestionIndex]?.metadata || {};\n\n    const activeSectionData = useMemo(() => {\n      return activeSection === undefined ? undefined : activeSection === 'HINT' ? hints : solution;\n    }, [activeSection, hints, solution]);\n\n    const sqlRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n    const hintRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n\n    const updatePointerPosition = useCallback((ref: React.RefObject<HTMLDivElement>) => {\n      if (ref.current) {\n        const rect = ref.current.getBoundingClientRect();\n\n        setPointerPosition({\n          top: rect.top + rect.height / 2 - 8,\n          left: rect.right - 78, // 52px (sidebar width) + 16px (gutter) + 10px\n        });\n      }\n    }, []);\n\n    const stickerTrigger = useMemo(\n      () => (\n        <Clickable label=\"teacher-badges\" onClick={handleBadgeToggle}>\n          <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n            <StickersIcon width={32} height={32} $disabled={!showStickers} />\n            <Text $renderAs=\"eyebrow2\" $color={!showStickers ? 'GREY_4' : 'BLACK'}>\n              STICKERS\n            </Text>\n            <FlexView $gap={8} $alignItems=\"center\">\n              <Separator width={24} height={1} background=\"GREY_2\" />\n            </FlexView>\n          </FlexView>\n        </Clickable>\n      ),\n      [showStickers, handleBadgeToggle],\n    );\n\n    const stickerGridConfig = useMemo(\n      () => ({\n        stickerSize: 48,\n        columns: 4,\n        gap: 8,\n      }),\n      [],\n    );\n\n    const stickerTooltipConfig = useMemo(\n      () => ({\n        position: 'left' as TPositionProps,\n        zIndex: 1000,\n        arrowYCoOrdinates: -175,\n        tooltipXCoOrdinates: '7.5%',\n        tooltipYCoOrdinates: '40%',\n      }),\n      [],\n    );\n\n    if (activeSection && activeSectionData && learnosity) {\n      learnosity.renderMath('mathjax');\n    }\n\n    useEffect(() => {\n      if (activeSection === 'HINT') {\n        updatePointerPosition(hintRef);\n      } else if (activeSection === 'SOL') {\n        updatePointerPosition(sqlRef);\n      } else if (!activeSectionData) {\n        setActiveSection(undefined);\n      }\n    }, [activeSection, updatePointerPosition, activeSectionData]);\n\n    return (\n      <GuideContainer $background=\"WHITE\">\n        {enableStickers && handleStickerSend && (\n          <StickerSelector\n            triggerNode={stickerTrigger}\n            onStickerSend={handleStickerSend}\n            gridConfig={stickerGridConfig}\n            tooltipConfig={stickerTooltipConfig}\n            visible={showStickers}\n            onToggle={handleBadgeToggle}\n          />\n        )}\n        <Clickable label=\"hints\" onClick={handleHintClick} disabled={!hints}>\n          <FlexView $alignItems=\"center\" $justifyContent=\"center\" ref={hintRef}>\n            <HintIcon width={32} height={32} $disabled={!hints} />\n            <Text $renderAs=\"eyebrow2\" $color={!hints ? 'GREY_4' : 'BLACK'}>\n              HINT\n            </Text>\n            <FlexView $gap={8} $alignItems=\"center\">\n              <Separator width={24} height={1} background=\"GREY_2\" />\n            </FlexView>\n          </FlexView>\n        </Clickable>\n        <Clickable label=\"solution\" onClick={handleSolClick} disabled={!solution}>\n          <FlexView $alignItems=\"center\" $justifyContent=\"center\" ref={sqlRef}>\n            <SolIcon width={32} height={32} $disabled={!solution} />\n            <Text $renderAs=\"eyebrow2\" $color={!hints ? 'GREY_4' : 'BLACK'}>\n              SOL\n            </Text>\n          </FlexView>\n        </Clickable>\n        {activeSection && top && left && <Pointer topValue={top} leftValue={left} />}\n        {activeSection && (\n          <SectionContainer\n            $background=\"WHITE\"\n            $questionWidth={questionWidth}\n            $actionbarHeight={actionbarHeight}\n            $borderRadius={10}\n          >\n            <Section\n              $gutterX={1}\n              $gapX={1}\n              $questionWidth={questionWidth}\n              $actionbarHeight={actionbarHeight}\n            >\n              <Clickable label=\"close\" onClick={handleClose}>\n                <CloseIcon />\n              </Clickable>\n              <FlexView $gutterX={0.5}>\n                <Text $renderAs=\"eyebrow2\" $color=\"ORANGE_5\" $marginBottomX={0.25}>\n                  {activeSection === 'HINT' ? 'HINTS:' : 'SOLUTION:'}\n                </Text>\n              </FlexView>\n              {activeSectionData &&\n                activeSectionData.map((item, index) => (\n                  <FlexView $gutterX={0.5} $gapX={0.5} key={index.toString()}>\n                    {activeSectionData.length > 1 && (\n                      <Text $renderAs=\"eyebrow2\" $color=\"ORANGE_5\" $marginBottomX={0.25}>\n                        {activeSection} {index + 1}:\n                      </Text>\n                    )}\n                    <Guide\n                      dangerouslySetInnerHTML={{\n                        __html: item,\n                      }}\n                    />\n                  </FlexView>\n                ))}\n            </Section>\n          </SectionContainer>\n        )}\n      </GuideContainer>\n    );\n  },\n);\n\nexport default QuestionGuide;\n"],"names":["QuestionGuide","memo","questionWidth","questions","activeQuestionIndex","learnosity","actionbarHeight","loggerRef","enableStickers","handleStickerSend","activeSection","setActiveSection","useState","pointerPosition","setPointerPosition","showStickers","setShowStickers","top","left","handleHintClick","useCallback","EVENTS","handleSolClick","handleClose","handleBadgeToggle","prev","hints","solution","_a","activeSectionData","useMemo","sqlRef","useRef","hintRef","updatePointerPosition","ref","rect","stickerTrigger","jsx","Clickable","jsxs","FlexView","StickersIcon","Text","Separator","stickerGridConfig","stickerTooltipConfig","useEffect","GuideContainer","StickerSelector","HintIcon","SolIcon","Pointer","SectionContainer","Section","CloseIcon","item","index","Guide"],"mappings":"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"}

package/dist/features/worksheet/worksheet/worksheet-sidebar/sidebar.js

@@ -1,12 +1,12 @@
 import { jsxs as n, jsx as r } from "react/jsx-runtime";
-import { memo as $, useCallback as x } from "react";
-import C from "../../../ui/layout/flex-view.js";
-import g from "../../../ui/separator/separator.js";
+import { memo as C, useCallback as g } from "react";
+import u from "../../../ui/layout/flex-view.js";
+import w from "../../../ui/separator/separator.js";
 import { SIDEBAR_WIDTH as f } from "../constants.js";
-import u from "./navigator.js";
-import w from "./question-guide.js";
-import { SideBarContainer as S, UnderlinedTextWrapper as T, UnderlinedText as j } from "./worksheet-sidebar-styled.js";
-const I = $(
+import S from "./navigator.js";
+import T from "./question-guide.js";
+import { SideBarContainer as j, UnderlinedTextWrapper as k, UnderlinedText as A } from "./worksheet-sidebar-styled.js";
+const X = C(
   ({
     questionWidth: t,
     questions: i,
@@ -16,34 +16,38 @@ const I = $(
     height: l,
     actionbarHeight: s,
     openQuestionFeedbackModal: e,
-    loggerRef: h
+    loggerRef: h,
+    enableStickers: p,
+    handleStickerSend: d
   }) => {
-    const p = i[m], { item_reference: o } = p ?? {}, d = x(() => {
+    const $ = i[m], { item_reference: o } = $ ?? {}, x = g(() => {
       e && e(o || "");
     }, [o, e]);
     return c !== "TEACHER" || !e ? null : /* @__PURE__ */ n(
-      S,
+      j,
       {
         $width: f,
         $questionWidth: t,
         $height: l,
         $justifyContent: "space-between",
         children: [
-          /* @__PURE__ */ r(T, { $width: f, $alignItems: "flex-start", $gapX: 0.5, children: /* @__PURE__ */ r(j, { $renderAs: "cta1", onClick: d, children: "Question Feedback" }) }),
-          /* @__PURE__ */ n(C, { children: [
+          /* @__PURE__ */ r(k, { $width: f, $alignItems: "flex-start", $gapX: 0.5, children: /* @__PURE__ */ r(A, { $renderAs: "cta1", onClick: x, children: "Question Feedback" }) }),
+          /* @__PURE__ */ n(u, { children: [
             /* @__PURE__ */ r(
-              w,
+              T,
               {
                 questionWidth: t,
                 questions: i,
                 activeQuestionIndex: m,
                 learnosity: a,
                 actionbarHeight: s,
-                loggerRef: h
+                loggerRef: h,
+                enableStickers: p,
+                handleStickerSend: d
               }
             ),
-            /* @__PURE__ */ r(g, { heightX: 0.5 }),
-            /* @__PURE__ */ r(u, {})
+            /* @__PURE__ */ r(w, { heightX: 0.5 }),
+            /* @__PURE__ */ r(S, {})
           ] })
         ]
       }
@@ -51,6 +55,6 @@ const I = $(
   }
 );
 export {
-  I as default
+  X as default
 };
 //# sourceMappingURL=sidebar.js.map

package/dist/features/worksheet/worksheet/worksheet-sidebar/sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.js","sources":["../../../../../src/features/worksheet/worksheet/worksheet-sidebar/sidebar.tsx"],"sourcesContent":["import type { TUserTypes } from '../../../ui/types';\nimport type { ILearnosity, IWorksheetProps, IWorksheetQuestion } from '../worksheet-types';\n\nimport { memo, useCallback } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport { SIDEBAR_WIDTH } from '../constants';\nimport Navigator from './navigator';\nimport QuestionGuide from './question-guide';\nimport {\n  SideBarContainer,\n  UnderlinedText,\n  UnderlinedTextWrapper,\n} from './worksheet-sidebar-styled';\n\ninterface IWorksheetSideBarProps extends Pick<IWorksheetProps, 'loggerRef'> {\n  questionWidth: number;\n  questions: IWorksheetQuestion[];\n  activeQuestionIndex: number;\n  learnosity: ILearnosity;\n  userType: TUserTypes;\n  height: number | string;\n  actionbarHeight: number;\n  openQuestionFeedbackModal?: (itemRef: string) => void;\n}\n\nconst WorksheetSideBar: React.FC<IWorksheetSideBarProps> = memo(\n  ({\n    questionWidth,\n    questions,\n    activeQuestionIndex,\n    learnosity,\n    userType,\n    height,\n    actionbarHeight,\n    openQuestionFeedbackModal,\n    loggerRef,\n  }) => {\n    const activeQuestion = questions[activeQuestionIndex];\n    const { item_reference: itemRef } = activeQuestion ?? {};\n\n    const onFeedbackClick = useCallback(() => {\n      if (openQuestionFeedbackModal) {\n        openQuestionFeedbackModal(itemRef || '');\n      }\n    }, [itemRef, openQuestionFeedbackModal]);\n\n    if (userType !== 'TEACHER' || !openQuestionFeedbackModal) return null;\n\n    return (\n      <SideBarContainer\n        $width={SIDEBAR_WIDTH}\n        $questionWidth={questionWidth}\n        $height={height}\n        $justifyContent=\"space-between\"\n      >\n        <UnderlinedTextWrapper $width={SIDEBAR_WIDTH} $alignItems=\"flex-start\" $gapX={0.5}>\n          <UnderlinedText $renderAs=\"cta1\" onClick={onFeedbackClick}>\n            Question Feedback\n          </UnderlinedText>\n        </UnderlinedTextWrapper>\n\n        <FlexView>\n          <QuestionGuide\n            questionWidth={questionWidth}\n            questions={questions}\n            activeQuestionIndex={activeQuestionIndex}\n            learnosity={learnosity}\n            actionbarHeight={actionbarHeight}\n            loggerRef={loggerRef}\n          />\n          <Separator heightX={0.5} />\n          <Navigator />\n        </FlexView>\n      </SideBarContainer>\n    );\n  },\n);\n\nexport default WorksheetSideBar;\n"],"names":["WorksheetSideBar","memo","questionWidth","questions","activeQuestionIndex","learnosity","userType","height","actionbarHeight","openQuestionFeedbackModal","loggerRef","activeQuestion","itemRef","onFeedbackClick","useCallback","jsxs","SideBarContainer","SIDEBAR_WIDTH","jsx","UnderlinedTextWrapper","UnderlinedText","FlexView","QuestionGuide","Separator","Navigator"],"mappings":";;;;;;;;AA2BA,MAAMA,IAAqDC;AAAA,EACzD,CAAC;AAAA,IACC,eAAAC;AAAA,IACA,WAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,2BAAAC;AAAA,IACA,WAAAC;AAAA,EAAA,MACI;AACE,UAAAC,IAAiBR,EAAUC,CAAmB,GAC9C,EAAE,gBAAgBQ,MAAYD,KAAkB,CAAA,GAEhDE,IAAkBC,EAAY,MAAM;AACxC,MAAIL,KACFA,EAA0BG,KAAW,EAAE;AAAA,IACzC,GACC,CAACA,GAASH,CAAyB,CAAC;AAEvC,WAAIH,MAAa,aAAa,CAACG,IAAkC,OAG/D,gBAAAM;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,QAAQC;AAAA,QACR,gBAAgBf;AAAA,QAChB,SAASK;AAAA,QACT,iBAAgB;AAAA,QAEhB,UAAA;AAAA,UAAA,gBAAAW,EAACC,GAAsB,EAAA,QAAQF,GAAe,aAAY,cAAa,OAAO,KAC5E,UAAC,gBAAAC,EAAAE,GAAA,EAAe,WAAU,QAAO,SAASP,GAAiB,8BAE3D,CAAA,GACF;AAAA,4BAECQ,GACC,EAAA,UAAA;AAAA,YAAA,gBAAAH;AAAA,cAACI;AAAA,cAAA;AAAA,gBACC,eAAApB;AAAA,gBACA,WAAAC;AAAA,gBACA,qBAAAC;AAAA,gBACA,YAAAC;AAAA,gBACA,iBAAAG;AAAA,gBACA,WAAAE;AAAA,cAAA;AAAA,YACF;AAAA,YACA,gBAAAQ,EAACK,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,8BACxBC,GAAU,EAAA;AAAA,UAAA,GACb;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}
+{"version":3,"file":"sidebar.js","sources":["../../../../../src/features/worksheet/worksheet/worksheet-sidebar/sidebar.tsx"],"sourcesContent":["import type { IStickerData } from '../../../stickers/sticker-selector/sticker-selector-types';\nimport type { TUserTypes } from '../../../ui/types';\nimport type { ILearnosity, IWorksheetProps, IWorksheetQuestion } from '../worksheet-types';\n\nimport { memo, useCallback } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport { SIDEBAR_WIDTH } from '../constants';\nimport Navigator from './navigator';\nimport QuestionGuide from './question-guide';\nimport {\n  SideBarContainer,\n  UnderlinedText,\n  UnderlinedTextWrapper,\n} from './worksheet-sidebar-styled';\n\ninterface IWorksheetSideBarProps extends Pick<IWorksheetProps, 'loggerRef'> {\n  questionWidth: number;\n  questions: IWorksheetQuestion[];\n  activeQuestionIndex: number;\n  learnosity: ILearnosity;\n  userType: TUserTypes;\n  height: number | string;\n  actionbarHeight: number;\n  openQuestionFeedbackModal?: (itemRef: string) => void;\n  enableStickers?: boolean;\n  handleStickerSend?: (sticker: IStickerData) => void;\n}\n\nconst WorksheetSideBar: React.FC<IWorksheetSideBarProps> = memo(\n  ({\n    questionWidth,\n    questions,\n    activeQuestionIndex,\n    learnosity,\n    userType,\n    height,\n    actionbarHeight,\n    openQuestionFeedbackModal,\n    loggerRef,\n    enableStickers,\n    handleStickerSend,\n  }) => {\n    const activeQuestion = questions[activeQuestionIndex];\n    const { item_reference: itemRef } = activeQuestion ?? {};\n\n    const onFeedbackClick = useCallback(() => {\n      if (openQuestionFeedbackModal) {\n        openQuestionFeedbackModal(itemRef || '');\n      }\n    }, [itemRef, openQuestionFeedbackModal]);\n\n    if (userType !== 'TEACHER' || !openQuestionFeedbackModal) return null;\n\n    return (\n      <SideBarContainer\n        $width={SIDEBAR_WIDTH}\n        $questionWidth={questionWidth}\n        $height={height}\n        $justifyContent=\"space-between\"\n      >\n        <UnderlinedTextWrapper $width={SIDEBAR_WIDTH} $alignItems=\"flex-start\" $gapX={0.5}>\n          <UnderlinedText $renderAs=\"cta1\" onClick={onFeedbackClick}>\n            Question Feedback\n          </UnderlinedText>\n        </UnderlinedTextWrapper>\n\n        <FlexView>\n          <QuestionGuide\n            questionWidth={questionWidth}\n            questions={questions}\n            activeQuestionIndex={activeQuestionIndex}\n            learnosity={learnosity}\n            actionbarHeight={actionbarHeight}\n            loggerRef={loggerRef}\n            enableStickers={enableStickers}\n            handleStickerSend={handleStickerSend}\n          />\n          <Separator heightX={0.5} />\n          <Navigator />\n        </FlexView>\n      </SideBarContainer>\n    );\n  },\n);\n\nexport default WorksheetSideBar;\n"],"names":["WorksheetSideBar","memo","questionWidth","questions","activeQuestionIndex","learnosity","userType","height","actionbarHeight","openQuestionFeedbackModal","loggerRef","enableStickers","handleStickerSend","activeQuestion","itemRef","onFeedbackClick","useCallback","jsxs","SideBarContainer","SIDEBAR_WIDTH","jsx","UnderlinedTextWrapper","UnderlinedText","FlexView","QuestionGuide","Separator","Navigator"],"mappings":";;;;;;;;AA8BA,MAAMA,IAAqDC;AAAA,EACzD,CAAC;AAAA,IACC,eAAAC;AAAA,IACA,WAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,2BAAAC;AAAA,IACA,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,mBAAAC;AAAA,EAAA,MACI;AACE,UAAAC,IAAiBV,EAAUC,CAAmB,GAC9C,EAAE,gBAAgBU,MAAYD,KAAkB,CAAA,GAEhDE,IAAkBC,EAAY,MAAM;AACxC,MAAIP,KACFA,EAA0BK,KAAW,EAAE;AAAA,IACzC,GACC,CAACA,GAASL,CAAyB,CAAC;AAEvC,WAAIH,MAAa,aAAa,CAACG,IAAkC,OAG/D,gBAAAQ;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,QAAQC;AAAA,QACR,gBAAgBjB;AAAA,QAChB,SAASK;AAAA,QACT,iBAAgB;AAAA,QAEhB,UAAA;AAAA,UAAA,gBAAAa,EAACC,GAAsB,EAAA,QAAQF,GAAe,aAAY,cAAa,OAAO,KAC5E,UAAC,gBAAAC,EAAAE,GAAA,EAAe,WAAU,QAAO,SAASP,GAAiB,8BAE3D,CAAA,GACF;AAAA,4BAECQ,GACC,EAAA,UAAA;AAAA,YAAA,gBAAAH;AAAA,cAACI;AAAA,cAAA;AAAA,gBACC,eAAAtB;AAAA,gBACA,WAAAC;AAAA,gBACA,qBAAAC;AAAA,gBACA,YAAAC;AAAA,gBACA,iBAAAG;AAAA,gBACA,WAAAE;AAAA,gBACA,gBAAAC;AAAA,gBACA,mBAAAC;AAAA,cAAA;AAAA,YACF;AAAA,YACA,gBAAAQ,EAACK,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,8BACxBC,GAAU,EAAA;AAAA,UAAA,GACb;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}

package/dist/features/worksheet/worksheet/worksheet-sidebar/worksheet-sidebar-styled.js

@@ -1,10 +1,11 @@
 import r from "styled-components";
-import c from "../../../../assets/line-icons/icons/bulb.js";
-import d from "../../../../assets/line-icons/icons/cross.js";
-import l from "../../../../assets/line-icons/icons/info.js";
+import p from "../../../../assets/line-icons/icons/bulb.js";
+import l from "../../../../assets/line-icons/icons/cross.js";
+import d from "../../../../assets/line-icons/icons/info.js";
+import a from "../../../../assets/line-icons/icons/sticker.js";
 import e from "../../../ui/layout/flex-view.js";
-import a from "../../../ui/text/text.js";
-import { CustomElement as x } from "../worksheet-question/worksheet-question-styled.js";
+import x from "../../../ui/text/text.js";
+import { CustomElement as m } from "../worksheet-question/worksheet-question-styled.js";
 r(e)`
   border: 2px solid #000;
 `;
@@ -19,29 +20,29 @@ const y = r(e)(
   border: 1px solid ${i.colors.GREY_2};
   overflow: hidden;
 `
-), C = r(e)`
+), S = r(e)`
   cursor: pointer;
-`, I = r(a)`
+`, k = r(x)`
   text-decoration: underline;
   white-space: nowrap;
   writing-mode: vertical-rl;
   text-align: right;
-`, s = (t) => t.startsWith("calc(") ? t.replace(")", " - 0px)") : t, p = (t) => t.trim().split(/\s+(?=[+-])/).map((n) => n.startsWith("-") ? `+${n.slice(1)}` : n.startsWith("+") ? `-${n.slice(1)}` : `-${n}`).join(" "), m = (t) => t.startsWith("calc(") && t.endsWith(")") ? (t = t.slice(5, -1), `calc(${p(t)})`) : p(t), T = r(e)(
+`, s = (t) => t.startsWith("calc(") ? t.replace(")", " - 0px)") : t, c = (t) => t.trim().split(/\s+(?=[+-])/).map((n) => n.startsWith("-") ? `+${n.slice(1)}` : n.startsWith("+") ? `-${n.slice(1)}` : `-${n}`).join(" "), f = (t) => t.startsWith("calc(") && t.endsWith(")") ? (t = t.slice(5, -1), `calc(${c(t)})`) : c(t), E = r(e)(
   ({ $questionWidth: t }) => `
   width: calc(${t}px - 32px); // 32px is the left + right padding
   overflow-y: auto;
   height: 100%;
   display: flex;
 `
-), E = r(e)(({ $questionWidth: t, $height: o }) => `
-  margin-top: ${typeof o == "number" ? `${-o}px` : m(s(o))};
+), G = r(e)(({ $questionWidth: t, $height: o }) => `
+  margin-top: ${typeof o == "number" ? `${-o}px` : f(s(o))};
   position: sticky;
   left: calc((100% - ${t}px ) *.5 + ${t}px + 12px);
   bottom: 16px;
   align-items: center;
   height: ${typeof o == "number" ? `${o}px` : s(o)};
   z-index: 1;
-`), G = r(e)(
+`), T = r(e)(
   ({ theme: t }) => `
   width: 100%;
   border-radius: 8px;
@@ -50,7 +51,7 @@ const y = r(e)(
   align-items: center;
   padding: 10px;
 `
-), S = r.div`
+), B = r.div`
   position: fixed;
   top: ${({ topValue: t }) => `${t}px`};
   left: ${({ leftValue: t }) => `${t}px`};
@@ -60,32 +61,37 @@ const y = r(e)(
   background: white;
   border-top: 1px solid #e0e0e0;
   border-right: 1px solid #e0e0e0;
-`, W = r(d)`
+`, R = r(l)`
   position: absolute;
   top: 8px;
   right: 16px;
-`, k = r(l)(({ theme: t, $disabled: o }) => `
+`, W = r(d)(({ theme: t, $disabled: o }) => `
     & path {
       stroke: ${o ? t.colors.GREY_4 : t.colors.BLACK};
     }
-  `), v = r(c)(({ theme: t, $disabled: o }) => `
+  `), Y = r(p)(({ theme: t, $disabled: o }) => `
     & path {
       stroke: ${o ? t.colors.GREY_4 : t.colors.BLACK};
     }
-  `), B = r(x)``;
+  `), _ = r(a)(({ theme: t, $disabled: o }) => `
+    & path {
+      stroke: ${o ? t.colors.GREY_4 : t.colors.BLACK};
+    }
+  `), v = r(m)``;
 export {
-  W as CloseIcon,
-  B as Guide,
-  G as GuideContainer,
-  k as HintIcon,
-  S as Pointer,
-  T as Section,
+  R as CloseIcon,
+  v as Guide,
+  T as GuideContainer,
+  W as HintIcon,
+  B as Pointer,
+  E as Section,
   y as SectionContainer,
-  E as SideBarContainer,
-  v as SolIcon,
-  I as UnderlinedText,
-  C as UnderlinedTextWrapper,
+  G as SideBarContainer,
+  Y as SolIcon,
+  _ as StickersIcon,
+  k as UnderlinedText,
+  S as UnderlinedTextWrapper,
   s as getMinHeightFromString,
-  m as negateExpression
+  f as negateExpression
 };
 //# sourceMappingURL=worksheet-sidebar-styled.js.map

package/dist/features/worksheet/worksheet/worksheet-sidebar/worksheet-sidebar-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"worksheet-sidebar-styled.js","sources":["../../../../../src/features/worksheet/worksheet/worksheet-sidebar/worksheet-sidebar-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport BulbIcon from '../../../../assets/line-icons/icons/bulb';\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport InfoIcon from '../../../../assets/line-icons/icons/info';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { CustomElement } from '../worksheet-question/worksheet-question-styled';\n\nexport const Circle = styled(FlexView)`\n  border: 2px solid #000;\n`;\nexport const SectionContainer = styled(FlexView)<{\n  $questionWidth: number;\n  $actionbarHeight: number;\n}>(\n  ({ $questionWidth, $actionbarHeight, theme }) => `\n  position: absolute;\n  bottom: ${$actionbarHeight}px;\n  right: 80px; //52px(sidebar(width) +12px(gutter) + (16px)\n  width: calc(${$questionWidth}px - 32px); // 32px is the left + right padding\n  height: 30%;\n  display: flex;\n  border: 1px solid ${theme.colors.GREY_2};\n  overflow: hidden;\n`,\n);\n\nexport const UnderlinedTextWrapper = styled(FlexView)`\n  cursor: pointer;\n`;\n\nexport const UnderlinedText = styled(Text)`\n  text-decoration: underline;\n  white-space: nowrap;\n  writing-mode: vertical-rl;\n  text-align: right;\n`;\n\nexport const getMinHeightFromString = (minHeight: string) => {\n  if (minHeight.startsWith('calc(')) {\n    return minHeight.replace(')', ' - 0px)');\n  }\n\n  return minHeight;\n};\n\nconst negateString = (expression: string) => {\n  const terms = expression.trim().split(/\\s+(?=[+-])/);\n  const negatedTerms = terms.map(term => {\n    if (term.startsWith('-')) {\n      return `+${term.slice(1)}`; // change - to +\n    }\n\n    if (term.startsWith('+')) {\n      return `-${term.slice(1)}`; // change + to -\n    }\n\n    return `-${term}`; // add leading '-'\n  });\n\n  return negatedTerms.join(' ');\n};\n\nexport const negateExpression = (expression: string) => {\n  if (expression.startsWith('calc(') && expression.endsWith(')')) {\n    expression = expression.slice(5, -1); // Remove 'calc(' and ')'\n    const negatedTerms = negateString(expression);\n\n    return `calc(${negatedTerms})`;\n  }\n\n  return negateString(expression);\n};\n\nexport const Section = styled(FlexView)<{\n  $questionWidth: number;\n  $actionbarHeight: number;\n}>(\n  ({ $questionWidth }) => `\n  width: calc(${$questionWidth}px - 32px); // 32px is the left + right padding\n  overflow-y: auto;\n  height: 100%;\n  display: flex;\n`,\n);\nexport const SideBarContainer = styled(FlexView)<{\n  $questionWidth: number;\n  $height: number | string;\n}>(({ $questionWidth, $height }) => {\n  return `\n  margin-top: ${\n    typeof $height === 'number'\n      ? `${-$height}px`\n      : negateExpression(getMinHeightFromString($height))\n  };\n  position: sticky;\n  left: calc((100% - ${$questionWidth}px ) *.5 + ${$questionWidth}px + 12px);\n  bottom: 16px;\n  align-items: center;\n  height: ${typeof $height === 'number' ? `${$height}px` : getMinHeightFromString($height)};\n  z-index: 1;\n`;\n});\n\nexport const GuideContainer = styled(FlexView)(\n  ({ theme }) => `\n  width: 100%;\n  border-radius: 8px;\n  border: 1px solid ${theme.colors.GREY_2};\n  justify-content: center;\n  align-items: center;\n  padding: 10px;\n`,\n);\n\nexport const Pointer = styled.div<{ topValue: number; leftValue: number }>`\n  position: fixed;\n  top: ${({ topValue }) => `${topValue}px`};\n  left: ${({ leftValue }) => `${leftValue}px`};\n  width: 15px;\n  height: 15px;\n  transform: rotate(45deg);\n  background: white;\n  border-top: 1px solid #e0e0e0;\n  border-right: 1px solid #e0e0e0;\n`;\n\nexport const CloseIcon = styled(CrossIcon)`\n  position: absolute;\n  top: 8px;\n  right: 16px;\n`;\n\nexport const HintIcon = styled(InfoIcon)<{ $disabled: boolean }>(({ theme, $disabled }) => {\n  return `\n    & path {\n      stroke: ${$disabled ? theme.colors.GREY_4 : theme.colors.BLACK};\n    }\n  `;\n});\n\nexport const SolIcon = styled(BulbIcon)<{ $disabled: boolean }>(({ theme, $disabled }) => {\n  return `\n    & path {\n      stroke: ${$disabled ? theme.colors.GREY_4 : theme.colors.BLACK};\n    }\n  `;\n});\n\nexport const Guide = styled(CustomElement)``;\n"],"names":["styled","FlexView","SectionContainer","$questionWidth","$actionbarHeight","theme","UnderlinedTextWrapper","UnderlinedText","Text","getMinHeightFromString","minHeight","negateString","expression","term","negateExpression","Section","SideBarContainer","$height","GuideContainer","Pointer","topValue","leftValue","CloseIcon","CrossIcon","HintIcon","InfoIcon","$disabled","SolIcon","BulbIcon","Guide","CustomElement"],"mappings":";;;;;;;AASsBA,EAAOC,CAAQ;AAAA;AAAA;AAGxB,MAAAC,IAAmBF,EAAOC,CAAQ;AAAA,EAI7C,CAAC,EAAE,gBAAAE,GAAgB,kBAAAC,GAAkB,OAAAC,EAAY,MAAA;AAAA;AAAA,YAEvCD,CAAgB;AAAA;AAAA,gBAEZD,CAAc;AAAA;AAAA;AAAA,sBAGRE,EAAM,OAAO,MAAM;AAAA;AAAA;AAGzC,GAEaC,IAAwBN,EAAOC,CAAQ;AAAA;AAAA,GAIvCM,IAAiBP,EAAOQ,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA,GAO5BC,IAAyB,CAACC,MACjCA,EAAU,WAAW,OAAO,IACvBA,EAAU,QAAQ,KAAK,SAAS,IAGlCA,GAGHC,IAAe,CAACC,MACNA,EAAW,KAAK,EAAE,MAAM,aAAa,EACxB,IAAI,CAAQC,MACjCA,EAAK,WAAW,GAAG,IACd,IAAIA,EAAK,MAAM,CAAC,CAAC,KAGtBA,EAAK,WAAW,GAAG,IACd,IAAIA,EAAK,MAAM,CAAC,CAAC,KAGnB,IAAIA,CAAI,EAChB,EAEmB,KAAK,GAAG,GAGjBC,IAAmB,CAACF,MAC3BA,EAAW,WAAW,OAAO,KAAKA,EAAW,SAAS,GAAG,KAC9CA,IAAAA,EAAW,MAAM,GAAG,EAAE,GAG5B,QAFcD,EAAaC,CAAU,CAEjB,OAGtBD,EAAaC,CAAU,GAGnBG,IAAUf,EAAOC,CAAQ;AAAA,EAIpC,CAAC,EAAE,gBAAAE,EAAA,MAAqB;AAAA,gBACVA,CAAc;AAAA;AAAA;AAAA;AAAA;AAK9B,GACaa,IAAmBhB,EAAOC,CAAQ,EAG5C,CAAC,EAAE,gBAAAE,GAAgB,SAAAc,QACb;AAAA,gBAEL,OAAOA,KAAY,WACf,GAAG,CAACA,CAAO,OACXH,EAAiBL,EAAuBQ,CAAO,CAAC,CACtD;AAAA;AAAA,uBAEqBd,CAAc,cAAcA,CAAc;AAAA;AAAA;AAAA,YAGrD,OAAOc,KAAY,WAAW,GAAGA,CAAO,OAAOR,EAAuBQ,CAAO,CAAC;AAAA;AAAA,CAGzF,GAEYC,IAAiBlB,EAAOC,CAAQ;AAAA,EAC3C,CAAC,EAAE,OAAAI,EAAA,MAAY;AAAA;AAAA;AAAA,sBAGKA,EAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAKzC,GAEac,IAAUnB,EAAO;AAAA;AAAA,SAErB,CAAC,EAAE,UAAAoB,EAAe,MAAA,GAAGA,CAAQ,IAAI;AAAA,UAChC,CAAC,EAAE,WAAAC,EAAgB,MAAA,GAAGA,CAAS,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAShCC,IAAYtB,EAAOuB,CAAS;AAAA;AAAA;AAAA;AAAA,GAM5BC,IAAWxB,EAAOyB,CAAQ,EAA0B,CAAC,EAAE,OAAApB,GAAO,WAAAqB,QAClE;AAAA;AAAA,gBAEOA,IAAYrB,EAAM,OAAO,SAASA,EAAM,OAAO,KAAK;AAAA;AAAA,GAGnE,GAEYsB,IAAU3B,EAAO4B,CAAQ,EAA0B,CAAC,EAAE,OAAAvB,GAAO,WAAAqB,QACjE;AAAA;AAAA,gBAEOA,IAAYrB,EAAM,OAAO,SAASA,EAAM,OAAO,KAAK;AAAA;AAAA,GAGnE,GAEYwB,IAAQ7B,EAAO8B,CAAa;"}
+{"version":3,"file":"worksheet-sidebar-styled.js","sources":["../../../../../src/features/worksheet/worksheet/worksheet-sidebar/worksheet-sidebar-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport BulbIcon from '../../../../assets/line-icons/icons/bulb';\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport InfoIcon from '../../../../assets/line-icons/icons/info';\nimport StickerIcon from '../../../../assets/line-icons/icons/sticker';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { CustomElement } from '../worksheet-question/worksheet-question-styled';\n\nexport const Circle = styled(FlexView)`\n  border: 2px solid #000;\n`;\nexport const SectionContainer = styled(FlexView)<{\n  $questionWidth: number;\n  $actionbarHeight: number;\n}>(\n  ({ $questionWidth, $actionbarHeight, theme }) => `\n  position: absolute;\n  bottom: ${$actionbarHeight}px;\n  right: 80px; //52px(sidebar(width) +12px(gutter) + (16px)\n  width: calc(${$questionWidth}px - 32px); // 32px is the left + right padding\n  height: 30%;\n  display: flex;\n  border: 1px solid ${theme.colors.GREY_2};\n  overflow: hidden;\n`,\n);\n\nexport const UnderlinedTextWrapper = styled(FlexView)`\n  cursor: pointer;\n`;\n\nexport const UnderlinedText = styled(Text)`\n  text-decoration: underline;\n  white-space: nowrap;\n  writing-mode: vertical-rl;\n  text-align: right;\n`;\n\nexport const getMinHeightFromString = (minHeight: string) => {\n  if (minHeight.startsWith('calc(')) {\n    return minHeight.replace(')', ' - 0px)');\n  }\n\n  return minHeight;\n};\n\nconst negateString = (expression: string) => {\n  const terms = expression.trim().split(/\\s+(?=[+-])/);\n  const negatedTerms = terms.map(term => {\n    if (term.startsWith('-')) {\n      return `+${term.slice(1)}`; // change - to +\n    }\n\n    if (term.startsWith('+')) {\n      return `-${term.slice(1)}`; // change + to -\n    }\n\n    return `-${term}`; // add leading '-'\n  });\n\n  return negatedTerms.join(' ');\n};\n\nexport const negateExpression = (expression: string) => {\n  if (expression.startsWith('calc(') && expression.endsWith(')')) {\n    expression = expression.slice(5, -1); // Remove 'calc(' and ')'\n    const negatedTerms = negateString(expression);\n\n    return `calc(${negatedTerms})`;\n  }\n\n  return negateString(expression);\n};\n\nexport const Section = styled(FlexView)<{\n  $questionWidth: number;\n  $actionbarHeight: number;\n}>(\n  ({ $questionWidth }) => `\n  width: calc(${$questionWidth}px - 32px); // 32px is the left + right padding\n  overflow-y: auto;\n  height: 100%;\n  display: flex;\n`,\n);\nexport const SideBarContainer = styled(FlexView)<{\n  $questionWidth: number;\n  $height: number | string;\n}>(({ $questionWidth, $height }) => {\n  return `\n  margin-top: ${\n    typeof $height === 'number'\n      ? `${-$height}px`\n      : negateExpression(getMinHeightFromString($height))\n  };\n  position: sticky;\n  left: calc((100% - ${$questionWidth}px ) *.5 + ${$questionWidth}px + 12px);\n  bottom: 16px;\n  align-items: center;\n  height: ${typeof $height === 'number' ? `${$height}px` : getMinHeightFromString($height)};\n  z-index: 1;\n`;\n});\n\nexport const GuideContainer = styled(FlexView)(\n  ({ theme }) => `\n  width: 100%;\n  border-radius: 8px;\n  border: 1px solid ${theme.colors.GREY_2};\n  justify-content: center;\n  align-items: center;\n  padding: 10px;\n`,\n);\n\nexport const Pointer = styled.div<{ topValue: number; leftValue: number }>`\n  position: fixed;\n  top: ${({ topValue }) => `${topValue}px`};\n  left: ${({ leftValue }) => `${leftValue}px`};\n  width: 15px;\n  height: 15px;\n  transform: rotate(45deg);\n  background: white;\n  border-top: 1px solid #e0e0e0;\n  border-right: 1px solid #e0e0e0;\n`;\n\nexport const CloseIcon = styled(CrossIcon)`\n  position: absolute;\n  top: 8px;\n  right: 16px;\n`;\n\nexport const HintIcon = styled(InfoIcon)<{ $disabled: boolean }>(({ theme, $disabled }) => {\n  return `\n    & path {\n      stroke: ${$disabled ? theme.colors.GREY_4 : theme.colors.BLACK};\n    }\n  `;\n});\n\nexport const SolIcon = styled(BulbIcon)<{ $disabled: boolean }>(({ theme, $disabled }) => {\n  return `\n    & path {\n      stroke: ${$disabled ? theme.colors.GREY_4 : theme.colors.BLACK};\n    }\n  `;\n});\n\nexport const StickersIcon = styled(StickerIcon)<{ $disabled: boolean }>(({ theme, $disabled }) => {\n  return `\n    & path {\n      stroke: ${$disabled ? theme.colors.GREY_4 : theme.colors.BLACK};\n    }\n  `;\n});\n\nexport const Guide = styled(CustomElement)``;\n"],"names":["styled","FlexView","SectionContainer","$questionWidth","$actionbarHeight","theme","UnderlinedTextWrapper","UnderlinedText","Text","getMinHeightFromString","minHeight","negateString","expression","term","negateExpression","Section","SideBarContainer","$height","GuideContainer","Pointer","topValue","leftValue","CloseIcon","CrossIcon","HintIcon","InfoIcon","$disabled","SolIcon","BulbIcon","StickersIcon","StickerIcon","Guide","CustomElement"],"mappings":";;;;;;;;AAUsBA,EAAOC,CAAQ;AAAA;AAAA;AAGxB,MAAAC,IAAmBF,EAAOC,CAAQ;AAAA,EAI7C,CAAC,EAAE,gBAAAE,GAAgB,kBAAAC,GAAkB,OAAAC,EAAY,MAAA;AAAA;AAAA,YAEvCD,CAAgB;AAAA;AAAA,gBAEZD,CAAc;AAAA;AAAA;AAAA,sBAGRE,EAAM,OAAO,MAAM;AAAA;AAAA;AAGzC,GAEaC,IAAwBN,EAAOC,CAAQ;AAAA;AAAA,GAIvCM,IAAiBP,EAAOQ,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA,GAO5BC,IAAyB,CAACC,MACjCA,EAAU,WAAW,OAAO,IACvBA,EAAU,QAAQ,KAAK,SAAS,IAGlCA,GAGHC,IAAe,CAACC,MACNA,EAAW,KAAK,EAAE,MAAM,aAAa,EACxB,IAAI,CAAQC,MACjCA,EAAK,WAAW,GAAG,IACd,IAAIA,EAAK,MAAM,CAAC,CAAC,KAGtBA,EAAK,WAAW,GAAG,IACd,IAAIA,EAAK,MAAM,CAAC,CAAC,KAGnB,IAAIA,CAAI,EAChB,EAEmB,KAAK,GAAG,GAGjBC,IAAmB,CAACF,MAC3BA,EAAW,WAAW,OAAO,KAAKA,EAAW,SAAS,GAAG,KAC9CA,IAAAA,EAAW,MAAM,GAAG,EAAE,GAG5B,QAFcD,EAAaC,CAAU,CAEjB,OAGtBD,EAAaC,CAAU,GAGnBG,IAAUf,EAAOC,CAAQ;AAAA,EAIpC,CAAC,EAAE,gBAAAE,EAAA,MAAqB;AAAA,gBACVA,CAAc;AAAA;AAAA;AAAA;AAAA;AAK9B,GACaa,IAAmBhB,EAAOC,CAAQ,EAG5C,CAAC,EAAE,gBAAAE,GAAgB,SAAAc,QACb;AAAA,gBAEL,OAAOA,KAAY,WACf,GAAG,CAACA,CAAO,OACXH,EAAiBL,EAAuBQ,CAAO,CAAC,CACtD;AAAA;AAAA,uBAEqBd,CAAc,cAAcA,CAAc;AAAA;AAAA;AAAA,YAGrD,OAAOc,KAAY,WAAW,GAAGA,CAAO,OAAOR,EAAuBQ,CAAO,CAAC;AAAA;AAAA,CAGzF,GAEYC,IAAiBlB,EAAOC,CAAQ;AAAA,EAC3C,CAAC,EAAE,OAAAI,EAAA,MAAY;AAAA;AAAA;AAAA,sBAGKA,EAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAKzC,GAEac,IAAUnB,EAAO;AAAA;AAAA,SAErB,CAAC,EAAE,UAAAoB,EAAe,MAAA,GAAGA,CAAQ,IAAI;AAAA,UAChC,CAAC,EAAE,WAAAC,EAAgB,MAAA,GAAGA,CAAS,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAShCC,IAAYtB,EAAOuB,CAAS;AAAA;AAAA;AAAA;AAAA,GAM5BC,IAAWxB,EAAOyB,CAAQ,EAA0B,CAAC,EAAE,OAAApB,GAAO,WAAAqB,QAClE;AAAA;AAAA,gBAEOA,IAAYrB,EAAM,OAAO,SAASA,EAAM,OAAO,KAAK;AAAA;AAAA,GAGnE,GAEYsB,IAAU3B,EAAO4B,CAAQ,EAA0B,CAAC,EAAE,OAAAvB,GAAO,WAAAqB,QACjE;AAAA;AAAA,gBAEOA,IAAYrB,EAAM,OAAO,SAASA,EAAM,OAAO,KAAK;AAAA;AAAA,GAGnE,GAEYwB,IAAe7B,EAAO8B,CAAW,EAA0B,CAAC,EAAE,OAAAzB,GAAO,WAAAqB,QACzE;AAAA;AAAA,gBAEOA,IAAYrB,EAAM,OAAO,SAASA,EAAM,OAAO,KAAK;AAAA;AAAA,GAGnE,GAEY0B,IAAQ/B,EAAOgC,CAAa;"}