@cuemath/leap 3.0.12 → 3.0.13-gs1

package/dist/features/cue-canvas/hooks/use-cue-canvas-actions.js

@@ -1,14 +1,16 @@
-import { useContext as c, useMemo as l } from "react";
-import a from "../cue-canvas-context.js";
-const m = () => {
+import { useContext as l, useMemo as v } from "react";
+import u from "../cue-canvas-context.js";
+const C = () => {
   const {
     activeInstance: t,
     setActiveTool: o,
     activeTool: e,
     setActiveInstance: i,
-    activeColor: s,
-    setActiveColor: n
-  } = c(a), r = l(
+    activeColor: r,
+    setActiveColor: s,
+    setActiveSidebar: c,
+    activeSidebar: n
+  } = l(u), a = v(
     () => e ? ["pen", "ruler", "highlighter", "marker"].includes(e) : !1,
     [e]
   );
@@ -17,12 +19,14 @@ const m = () => {
     setActiveTool: o,
     activeTool: e,
     setActiveInstance: i,
-    activeColor: s,
-    setActiveColor: n,
-    isWritingToolActive: r
+    activeColor: r,
+    setActiveColor: s,
+    isWritingToolActive: a,
+    setActiveSidebar: c,
+    activeSidebar: n
   };
 };
 export {
-  m as useCueCanvasActions
+  C as useCueCanvasActions
 };
 //# sourceMappingURL=use-cue-canvas-actions.js.map

package/dist/features/cue-canvas/hooks/use-cue-canvas-actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-cue-canvas-actions.js","sources":["../../../../src/features/cue-canvas/hooks/use-cue-canvas-actions.ts"],"sourcesContent":["import { useContext, useMemo } from 'react';\n\nimport PolyContext from '../cue-canvas-context';\n\nexport const useCueCanvasActions = () => {\n  const {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n  } = useContext(PolyContext);\n\n  const isWritingToolActive = useMemo(\n    () => (activeTool ? ['pen', 'ruler', 'highlighter', 'marker'].includes(activeTool) : false),\n    [activeTool],\n  );\n\n  return {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n    isWritingToolActive,\n  };\n};\n"],"names":["useCueCanvasActions","activeInstance","setActiveTool","activeTool","setActiveInstance","activeColor","setActiveColor","useContext","PolyContext","isWritingToolActive","useMemo"],"mappings":";;AAIO,MAAMA,IAAsB,MAAM;AACjC,QAAA;AAAA,IACJ,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,EAAA,IACEC,EAAWC,CAAW,GAEpBC,IAAsBC;AAAA,IAC1B,MAAOP,IAAa,CAAC,OAAO,SAAS,eAAe,QAAQ,EAAE,SAASA,CAAU,IAAI;AAAA,IACrF,CAACA,CAAU;AAAA,EAAA;AAGN,SAAA;AAAA,IACL,gBAAAF;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,qBAAAG;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"use-cue-canvas-actions.js","sources":["../../../../src/features/cue-canvas/hooks/use-cue-canvas-actions.ts"],"sourcesContent":["import { useContext, useMemo } from 'react';\n\nimport PolyContext from '../cue-canvas-context';\n\nexport const useCueCanvasActions = () => {\n  const {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n    setActiveSidebar,\n    activeSidebar,\n  } = useContext(PolyContext);\n\n  const isWritingToolActive = useMemo(\n    () => (activeTool ? ['pen', 'ruler', 'highlighter', 'marker'].includes(activeTool) : false),\n    [activeTool],\n  );\n\n  return {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n    isWritingToolActive,\n    setActiveSidebar,\n    activeSidebar,\n  };\n};\n"],"names":["useCueCanvasActions","activeInstance","setActiveTool","activeTool","setActiveInstance","activeColor","setActiveColor","setActiveSidebar","activeSidebar","useContext","PolyContext","isWritingToolActive","useMemo"],"mappings":";;AAIO,MAAMA,IAAsB,MAAM;AACjC,QAAA;AAAA,IACJ,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,eAAAC;AAAA,EAAA,IACEC,EAAWC,CAAW,GAEpBC,IAAsBC;AAAA,IAC1B,MAAOT,IAAa,CAAC,OAAO,SAAS,eAAe,QAAQ,EAAE,SAASA,CAAU,IAAI;AAAA,IACrF,CAACA,CAAU;AAAA,EAAA;AAGN,SAAA;AAAA,IACL,gBAAAF;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,qBAAAK;AAAA,IACA,kBAAAJ;AAAA,IACA,eAAAC;AAAA,EAAA;AAEJ;"}

package/dist/features/ui/border-path-animation/border-path-animation-styled.js

@@ -0,0 +1,51 @@
+import i, { css as s } from "styled-components";
+const o = i.div`
+  position: absolute;
+  z-index: 1;
+  overflow: hidden;
+`, d = i(o)(
+  ({ $borderWidth: t }) => `
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: ${t}px;
+`
+), c = i(o)(
+  ({ $borderWidth: t }) => `
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: ${t}px;
+`
+), l = i(o)(
+  ({ $borderWidth: t }) => `
+  top: 0;
+  right: 0;
+  width: ${t}px;
+  height: 100%;
+`
+), $ = i(o)(
+  ({ $borderWidth: t }) => `
+  top: 0;
+  left: 0;
+  width: ${t}px;
+  height: 100%;
+`
+), g = i.div(
+  ({ theme: t, $width: n, $height: e, $borderColor: h, $animationDuration: p, $keyframes: r }) => s`
+    position: relative;
+    width: ${n}px;
+    height: ${e}px;
+    background-color: ${t.colors[h]};
+    opacity: 0;
+    animation: ${r} ${p}s linear infinite;
+  `
+);
+export {
+  c as BottomLineContainer,
+  $ as LeftLineContainer,
+  g as Line,
+  l as RightLineContainer,
+  d as TopLineContainer
+};
+//# sourceMappingURL=border-path-animation-styled.js.map

package/dist/features/ui/border-path-animation/border-path-animation-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"border-path-animation-styled.js","sources":["../../../../src/features/ui/border-path-animation/border-path-animation-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../types';\nimport type { keyframes } from 'styled-components';\n\nimport styled, { css } from 'styled-components';\n\nconst LineContainer = styled.div`\n  position: absolute;\n  z-index: 1;\n  overflow: hidden;\n`;\n\nexport const TopLineContainer = styled(LineContainer)<{\n  $borderWidth: number;\n}>(\n  ({ $borderWidth }) => `\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: ${$borderWidth}px;\n`,\n);\n\nexport const BottomLineContainer = styled(LineContainer)<{\n  $borderWidth: number;\n}>(\n  ({ $borderWidth }) => `\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: ${$borderWidth}px;\n`,\n);\n\nexport const RightLineContainer = styled(LineContainer)<{\n  $borderWidth: number;\n}>(\n  ({ $borderWidth }) => `\n  top: 0;\n  right: 0;\n  width: ${$borderWidth}px;\n  height: 100%;\n`,\n);\n\nexport const LeftLineContainer = styled(LineContainer)<{\n  $borderWidth: number;\n}>(\n  ({ $borderWidth }) => `\n  top: 0;\n  left: 0;\n  width: ${$borderWidth}px;\n  height: 100%;\n`,\n);\n\nexport const Line = styled.div<{\n  $borderColor: TColorNames;\n  $animationDuration: number;\n  $keyframes: ReturnType<typeof keyframes>;\n  $width: number;\n  $height: number;\n}>(\n  ({ theme, $width, $height, $borderColor, $animationDuration, $keyframes }) => css`\n    position: relative;\n    width: ${$width}px;\n    height: ${$height}px;\n    background-color: ${theme.colors[$borderColor]};\n    opacity: 0;\n    animation: ${$keyframes} ${$animationDuration}s linear infinite;\n  `,\n);\n"],"names":["LineContainer","styled","TopLineContainer","$borderWidth","BottomLineContainer","RightLineContainer","LeftLineContainer","Line","theme","$width","$height","$borderColor","$animationDuration","$keyframes","css"],"mappings":";AAKA,MAAMA,IAAgBC,EAAO;AAAA;AAAA;AAAA;AAAA,GAMhBC,IAAmBD,EAAOD,CAAa;AAAA,EAGlD,CAAC,EAAE,cAAAG,EAAA,MAAmB;AAAA;AAAA;AAAA;AAAA,YAIZA,CAAY;AAAA;AAExB,GAEaC,IAAsBH,EAAOD,CAAa;AAAA,EAGrD,CAAC,EAAE,cAAAG,EAAA,MAAmB;AAAA;AAAA;AAAA;AAAA,YAIZA,CAAY;AAAA;AAExB,GAEaE,IAAqBJ,EAAOD,CAAa;AAAA,EAGpD,CAAC,EAAE,cAAAG,EAAA,MAAmB;AAAA;AAAA;AAAA,WAGbA,CAAY;AAAA;AAAA;AAGvB,GAEaG,IAAoBL,EAAOD,CAAa;AAAA,EAGnD,CAAC,EAAE,cAAAG,EAAA,MAAmB;AAAA;AAAA;AAAA,WAGbA,CAAY;AAAA;AAAA;AAGvB,GAEaI,IAAON,EAAO;AAAA,EAOzB,CAAC,EAAE,OAAAO,GAAO,QAAAC,GAAQ,SAAAC,GAAS,cAAAC,GAAc,oBAAAC,GAAoB,YAAAC,EAAiB,MAAAC;AAAA;AAAA,aAEnEL,CAAM;AAAA,cACLC,CAAO;AAAA,wBACGF,EAAM,OAAOG,CAAY,CAAC;AAAA;AAAA,iBAEjCE,CAAU,IAAID,CAAkB;AAAA;AAEjD;"}

package/dist/features/ui/border-path-animation/border-path-animation.js

@@ -0,0 +1,108 @@
+import { jsxs as p, Fragment as g, jsx as s } from "react/jsx-runtime";
+import { memo as b, useState as d, useMemo as l, useRef as u, useLayoutEffect as C } from "react";
+import { keyframes as L } from "styled-components";
+import { TopLineContainer as k, Line as c, RightLineContainer as W, BottomLineContainer as R, LeftLineContainer as D } from "./border-path-animation-styled.js";
+const F = (i, r) => {
+  const t = (i + r) * 2, o = i, e = r, y = i / t, n = (i + r) / t, a = (i + r + i) / t;
+  return {
+    top: [
+      [0, { x: 0, y: 0, o: 1 }],
+      [y, { x: o, y: 0, o: 1 }],
+      [y + 1e-3, { x: o, y: 0, o: 0 }],
+      [n - 1e-3, { x: -o, y: 0, o: 0 }],
+      [n, { x: -o, y: 0, o: 1 }],
+      [a, { x: 0, y: 0, o: 1 }],
+      [1, { x: 0, y: 0, o: 1 }]
+    ],
+    right: [
+      [0, { x: 0, y: 0, o: 1 }],
+      [y, { x: 0, y: 0, o: 1 }],
+      [n, { x: 0, y: e, o: 1 }],
+      [n + 1e-3, { x: 0, y: e, o: 0 }],
+      [a - 1e-3, { x: 0, y: -e, o: 0 }],
+      [a, { x: 0, y: -e, o: 1 }],
+      [1, { x: 0, y: 0, o: 1 }]
+    ],
+    bottom: [
+      [0, { x: o, y: 0, o: 1 }],
+      [y, { x: 0, y: 0, o: 1 }],
+      [n, { x: 0, y: 0, o: 1 }],
+      [a, { x: -o, y: 0, o: 1 }],
+      [a + 1e-3, { x: -o, y: 0, o: 0 }],
+      [a + 2e-3, { x: o, y: 0, o: 0 }],
+      [1, { x: o, y: 0, o: 1 }]
+    ],
+    left: [
+      [0, { x: 0, y: e, o: 1 }],
+      [y, { x: 0, y: e, o: 1 }],
+      [n, { x: 0, y: 0, o: 1 }],
+      [a, { x: 0, y: 0, o: 1 }],
+      [1, { x: 0, y: -e, o: 1 }]
+    ]
+  };
+}, $ = (i) => L`
+    ${i.map(
+  ([r, { x: t, y: o, o: e }]) => `${r * 100}% {
+          transform: translate(${t}px, ${o}px);
+          opacity: ${e};
+        }`
+).join(" ")}
+  `, K = b((i) => {
+  const { animationDuration: r = 6, borderWidth: t = 1, borderColor: o = "YELLOW_3" } = i, [e, y] = d(1), [n, a] = d(1), m = l(() => F(e, n), [e, n]), x = l(
+    () => ({
+      top: $(m.top),
+      right: $(m.right),
+      bottom: $(m.bottom),
+      left: $(m.left)
+    }),
+    [m]
+  ), f = u(null), h = u(null);
+  return C(() => {
+    f.current && y(f.current.getBoundingClientRect().width), h.current && a(h.current.getBoundingClientRect().height);
+  }, []), /* @__PURE__ */ p(g, { children: [
+    /* @__PURE__ */ s(k, { className: "top-line", ref: f, $borderWidth: t, children: /* @__PURE__ */ s(
+      c,
+      {
+        $borderColor: o,
+        $width: e,
+        $height: t,
+        $animationDuration: r,
+        $keyframes: x.top
+      }
+    ) }),
+    /* @__PURE__ */ s(W, { ref: h, $borderWidth: t, children: /* @__PURE__ */ s(
+      c,
+      {
+        $width: t,
+        $height: n,
+        $borderColor: o,
+        $animationDuration: r,
+        $keyframes: x.right
+      }
+    ) }),
+    /* @__PURE__ */ s(R, { $borderWidth: t, children: /* @__PURE__ */ s(
+      c,
+      {
+        $borderColor: o,
+        $width: e,
+        $height: t,
+        $animationDuration: r,
+        $keyframes: x.bottom
+      }
+    ) }),
+    /* @__PURE__ */ s(D, { $borderWidth: t, children: /* @__PURE__ */ s(
+      c,
+      {
+        $width: t,
+        $height: n,
+        $borderColor: o,
+        $animationDuration: r,
+        $keyframes: x.left
+      }
+    ) })
+  ] });
+});
+export {
+  K as default
+};
+//# sourceMappingURL=border-path-animation.js.map

package/dist/features/ui/border-path-animation/border-path-animation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"border-path-animation.js","sources":["../../../../src/features/ui/border-path-animation/border-path-animation.tsx"],"sourcesContent":["import type {\n  IBorderPathAnimationProps,\n  IGetKeyFrames,\n  IGetKeyFramesConfig,\n} from './border-path-animation-types';\nimport type { FC } from 'react';\n\nimport { memo, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { keyframes } from 'styled-components';\n\nimport * as Styled from './border-path-animation-styled';\n\nconst getKeyFramesConfig: IGetKeyFramesConfig = (width, height) => {\n  const p = (width + height) * 2; // perimeter\n  const w = width;\n  const h = height;\n  const bp1 = width / p;\n  const bp2 = (width + height) / p;\n  const bp3 = (width + height + width) / p;\n\n  return {\n    top: [\n      [0, { x: 0, y: 0, o: 1 }],\n      [bp1, { x: w, y: 0, o: 1 }],\n\n      [bp1 + 0.001, { x: w, y: 0, o: 0 }],\n      [bp2 - 0.001, { x: -w, y: 0, o: 0 }],\n\n      [bp2, { x: -w, y: 0, o: 1 }],\n      [bp3, { x: 0, y: 0, o: 1 }],\n      [1, { x: 0, y: 0, o: 1 }],\n    ],\n    right: [\n      [0, { x: 0, y: 0, o: 1 }],\n      [bp1, { x: 0, y: 0, o: 1 }],\n      [bp2, { x: 0, y: h, o: 1 }],\n\n      [bp2 + 0.001, { x: 0, y: h, o: 0 }],\n      [bp3 - 0.001, { x: 0, y: -h, o: 0 }],\n\n      [bp3, { x: 0, y: -h, o: 1 }],\n      [1, { x: 0, y: 0, o: 1 }],\n    ],\n    bottom: [\n      [0, { x: w, y: 0, o: 1 }],\n      [bp1, { x: 0, y: 0, o: 1 }],\n      [bp2, { x: 0, y: 0, o: 1 }],\n      [bp3, { x: -w, y: 0, o: 1 }],\n\n      [bp3 + 0.001, { x: -w, y: 0, o: 0 }],\n      [bp3 + 0.002, { x: w, y: 0, o: 0 }],\n      [1, { x: w, y: 0, o: 1 }],\n    ],\n    left: [\n      [0, { x: 0, y: h, o: 1 }],\n      [bp1, { x: 0, y: h, o: 1 }],\n      [bp2, { x: 0, y: 0, o: 1 }],\n      [bp3, { x: 0, y: 0, o: 1 }],\n      [1, { x: 0, y: -h, o: 1 }],\n    ],\n  };\n};\n\nconst getKeyFrames: IGetKeyFrames = config => {\n  return keyframes`\n    ${config\n      .map(\n        ([percentage, { x, y, o }]) => `${percentage * 100}% {\n          transform: translate(${x}px, ${y}px);\n          opacity: ${o};\n        }`,\n      )\n      .join(' ')}\n  `;\n};\n\nconst BorderPathAnimation: FC<IBorderPathAnimationProps> = memo(props => {\n  const { animationDuration = 6, borderWidth = 1, borderColor = 'YELLOW_3' } = props;\n  const [width, setWidth] = useState(1);\n  const [height, setHeight] = useState(1);\n  const keyFramesConfig = useMemo(() => getKeyFramesConfig(width, height), [width, height]);\n  const keyFrames = useMemo(\n    () => ({\n      top: getKeyFrames(keyFramesConfig.top),\n      right: getKeyFrames(keyFramesConfig.right),\n      bottom: getKeyFrames(keyFramesConfig.bottom),\n      left: getKeyFrames(keyFramesConfig.left),\n    }),\n    [keyFramesConfig],\n  );\n  const topRef = useRef<HTMLDivElement>(null);\n  const rightRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (topRef.current) {\n      setWidth(topRef.current.getBoundingClientRect().width);\n    }\n\n    if (rightRef.current) {\n      setHeight(rightRef.current.getBoundingClientRect().height);\n    }\n  }, []);\n\n  return (\n    <>\n      <Styled.TopLineContainer className=\"top-line\" ref={topRef} $borderWidth={borderWidth}>\n        <Styled.Line\n          $borderColor={borderColor}\n          $width={width}\n          $height={borderWidth}\n          $animationDuration={animationDuration}\n          $keyframes={keyFrames.top}\n        />\n      </Styled.TopLineContainer>\n      <Styled.RightLineContainer ref={rightRef} $borderWidth={borderWidth}>\n        <Styled.Line\n          $width={borderWidth}\n          $height={height}\n          $borderColor={borderColor}\n          $animationDuration={animationDuration}\n          $keyframes={keyFrames.right}\n        />\n      </Styled.RightLineContainer>\n      <Styled.BottomLineContainer $borderWidth={borderWidth}>\n        <Styled.Line\n          $borderColor={borderColor}\n          $width={width}\n          $height={borderWidth}\n          $animationDuration={animationDuration}\n          $keyframes={keyFrames.bottom}\n        />\n      </Styled.BottomLineContainer>\n      <Styled.LeftLineContainer $borderWidth={borderWidth}>\n        <Styled.Line\n          $width={borderWidth}\n          $height={height}\n          $borderColor={borderColor}\n          $animationDuration={animationDuration}\n          $keyframes={keyFrames.left}\n        />\n      </Styled.LeftLineContainer>\n    </>\n  );\n});\n\nexport default BorderPathAnimation;\n"],"names":["getKeyFramesConfig","width","height","p","w","h","bp1","bp2","bp3","getKeyFrames","config","keyframes","percentage","x","y","o","BorderPathAnimation","memo","props","animationDuration","borderWidth","borderColor","setWidth","useState","setHeight","keyFramesConfig","useMemo","keyFrames","topRef","useRef","rightRef","useLayoutEffect","jsxs","Fragment","jsx","Styled.TopLineContainer","Styled.Line","Styled.RightLineContainer","Styled.BottomLineContainer","Styled.LeftLineContainer"],"mappings":"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"}

package/dist/features/ui/theme/tab.js

@@ -45,32 +45,6 @@ const o = (a) => ({ sizes: {
       hover: 500,
       disabled: 400
     }
-  },
-  secondary: {
-    backgroundColorName: {
-      inactive: "BLACK",
-      active: "WHITE",
-      hover: "WHITE",
-      disabled: "GREY_1"
-    },
-    colorName: {
-      inactive: "WHITE",
-      active: "BLACK",
-      hover: "BLACK",
-      disabled: "BLACK_50"
-    },
-    borderColorName: {
-      inactive: "WHITE",
-      active: "WHITE",
-      hover: "BLACK",
-      disabled: "GREY_1"
-    },
-    fontWeight: {
-      inactive: 400,
-      active: 500,
-      hover: 500,
-      disabled: 400
-    }
   }
 } });
 export {

package/dist/features/ui/theme/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sources":["../../../../src/features/ui/theme/tab.ts"],"sourcesContent":["import type { ITabSizeConfig, ITabVariantConfig, TTabSizes, TTabVariants } from '../types';\n\ninterface IGetTabConfig {\n  (gutter: number): {\n    sizes: Record<TTabSizes, ITabSizeConfig>;\n    variants: Record<TTabVariants, ITabVariantConfig>;\n  };\n}\n\nconst getTabConfig: IGetTabConfig = (gutter: number) => {\n  const sizes: Record<TTabSizes, ITabSizeConfig> = {\n    xsmall: {\n      height: gutter * 1.625,\n      paddingHorizontal: gutter * 0.5,\n      textVariant: 'body3',\n    },\n    small: {\n      height: gutter * 2,\n      paddingHorizontal: gutter * 0.75,\n      textVariant: 'body2',\n    },\n    regular: {\n      height: gutter * 2.5,\n      paddingHorizontal: gutter,\n      textVariant: 'body1',\n    },\n    medium: {\n      height: gutter * 3,\n      paddingHorizontal: gutter,\n      textVariant: 'body1',\n    },\n  };\n\n  const variants: Record<TTabVariants, ITabVariantConfig> = {\n    primary: {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        hover: 'BLACK',\n        disabled: 'GREY_1',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        hover: 'WHITE',\n        disabled: 'BLACK_50',\n      },\n      borderColorName: {\n        inactive: 'GREY_3',\n        active: 'BLACK',\n        hover: 'BLACK',\n        disabled: 'GREY_1',\n      },\n      fontWeight: {\n        inactive: 400,\n        active: 500,\n        hover: 500,\n        disabled: 400,\n      },\n    },\n    secondary: {\n      backgroundColorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        hover: 'WHITE',\n        disabled: 'GREY_1',\n      },\n      colorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        hover: 'BLACK',\n        disabled: 'BLACK_50',\n      },\n      borderColorName: {\n        inactive: 'WHITE',\n        active: 'WHITE',\n        hover: 'BLACK',\n        disabled: 'GREY_1',\n      },\n      fontWeight: {\n        inactive: 400,\n        active: 500,\n        hover: 500,\n        disabled: 400,\n      },\n    },\n  };\n\n  return { sizes, variants };\n};\n\nexport default getTabConfig;\n"],"names":["getTabConfig","gutter"],"mappings":"AASM,MAAAA,IAA8B,CAACC,OA+E5B,EAAE,OA9EwC;AAAA,EAC/C,QAAQ;AAAA,IACN,QAAQA,IAAS;AAAA,IACjB,mBAAmBA,IAAS;AAAA,IAC5B,aAAa;AAAA,EACf;AAAA,EACA,OAAO;AAAA,IACL,QAAQA,IAAS;AAAA,IACjB,mBAAmBA,IAAS;AAAA,IAC5B,aAAa;AAAA,EACf;AAAA,EACA,SAAS;AAAA,IACP,QAAQA,IAAS;AAAA,IACjB,mBAAmBA;AAAA,IACnB,aAAa;AAAA,EACf;AAAA,EACA,QAAQ;AAAA,IACN,QAAQA,IAAS;AAAA,IACjB,mBAAmBA;AAAA,IACnB,aAAa;AAAA,EACf;AAAA,GA0Dc,UAvD0C;AAAA,EACxD,SAAS;AAAA,IACP,qBAAqB;AAAA,MACnB,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,WAAW;AAAA,MACT,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,iBAAiB;AAAA,MACf,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,YAAY;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA,WAAW;AAAA,IACT,qBAAqB;AAAA,MACnB,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,WAAW;AAAA,MACT,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,iBAAiB;AAAA,MACf,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,YAAY;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,EACF;AAAA;"}
+{"version":3,"file":"tab.js","sources":["../../../../src/features/ui/theme/tab.ts"],"sourcesContent":["import type { ITabSizeConfig, ITabVariantConfig, TTabSizes, TTabVariants } from '../types';\n\ninterface IGetTabConfig {\n  (gutter: number): {\n    sizes: Record<TTabSizes, ITabSizeConfig>;\n    variants: Record<TTabVariants, ITabVariantConfig>;\n  };\n}\n\nconst getTabConfig: IGetTabConfig = (gutter: number) => {\n  const sizes: Record<TTabSizes, ITabSizeConfig> = {\n    xsmall: {\n      height: gutter * 1.625,\n      paddingHorizontal: gutter * 0.5,\n      textVariant: 'body3',\n    },\n    small: {\n      height: gutter * 2,\n      paddingHorizontal: gutter * 0.75,\n      textVariant: 'body2',\n    },\n    regular: {\n      height: gutter * 2.5,\n      paddingHorizontal: gutter,\n      textVariant: 'body1',\n    },\n    medium: {\n      height: gutter * 3,\n      paddingHorizontal: gutter,\n      textVariant: 'body1',\n    },\n  };\n\n  const variants: Record<TTabVariants, ITabVariantConfig> = {\n    primary: {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        hover: 'BLACK',\n        disabled: 'GREY_1',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        hover: 'WHITE',\n        disabled: 'BLACK_50',\n      },\n      borderColorName: {\n        inactive: 'GREY_3',\n        active: 'BLACK',\n        hover: 'BLACK',\n        disabled: 'GREY_1',\n      },\n      fontWeight: {\n        inactive: 400,\n        active: 500,\n        hover: 500,\n        disabled: 400,\n      },\n    },\n  };\n\n  return { sizes, variants };\n};\n\nexport default getTabConfig;\n"],"names":["getTabConfig","gutter"],"mappings":"AASM,MAAAA,IAA8B,CAACC,OAqD5B,EAAE,OApDwC;AAAA,EAC/C,QAAQ;AAAA,IACN,QAAQA,IAAS;AAAA,IACjB,mBAAmBA,IAAS;AAAA,IAC5B,aAAa;AAAA,EACf;AAAA,EACA,OAAO;AAAA,IACL,QAAQA,IAAS;AAAA,IACjB,mBAAmBA,IAAS;AAAA,IAC5B,aAAa;AAAA,EACf;AAAA,EACA,SAAS;AAAA,IACP,QAAQA,IAAS;AAAA,IACjB,mBAAmBA;AAAA,IACnB,aAAa;AAAA,EACf;AAAA,EACA,QAAQ;AAAA,IACN,QAAQA,IAAS;AAAA,IACjB,mBAAmBA;AAAA,IACnB,aAAa;AAAA,EACf;AAAA,GAgCc,UA7B0C;AAAA,EACxD,SAAS;AAAA,IACP,qBAAqB;AAAA,MACnB,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,WAAW;AAAA,MACT,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,iBAAiB;AAAA,MACf,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA,YAAY;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,EACF;AAAA;"}

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

@@ -1,4 +1,4 @@
-import { jsxs as T, jsx as e, Fragment as Kt } from "react/jsx-runtime";
+import { jsxs as I, jsx as e, Fragment as Kt } from "react/jsx-runtime";
 import { memo as Vt, useMemo as R, useState as A, useRef as U, useCallback as Xt, useEffect as E, useLayoutEffect as Pt } from "react";
 import { IMAGES as jt } from "../../../../assets/images/images.js";
 import Gt from "../../../cue-canvas/cue-canvas.js";
@@ -23,8 +23,8 @@ const Ai = Vt(
     worksheetCompleted: f,
     question: n,
     response: i,
-    nextQuestionId: v,
-    isActive: S,
+    nextQuestionId: S,
+    isActive: v,
     isHidden: M,
     canRender: K,
     loggerRef: O,
@@ -38,7 +38,7 @@ const Ai = Vt(
     background: G = "paper",
     onMediaStateChange: Bt,
     onMarkForReview: xt,
-    userId: It,
+    userId: Lt,
     onPublishStrokes: Y,
     onReceiveStrokes: Z,
     isScribblingEnabled: J,
@@ -47,8 +47,8 @@ const Ai = Vt(
     onPublishMouseMove: k,
     onSubscribeMouseMove: tt,
     setActiveQuestionId: it,
-    canResolveDoubt: Lt,
-    onResolveDoubt: Tt,
+    canResolveDoubt: Tt,
+    onResolveDoubt: It,
     studentId: At,
     responses: Mt,
     subjectiveProps: et
@@ -86,7 +86,7 @@ const Ai = Vt(
       _t,
       H,
       c
-    ]), F = U({}), I = (i == null ? void 0 : i.hintsUsed) ?? 0, [$t] = A((i == null ? void 0 : i.validatedByTeacher) ?? !1), L = U(null), z = U(null), D = R(() => d == null ? void 0 : d.slice(0, I), [d, I]), pt = R(() => c === "TEACHER" || f ? !0 : !i || !i.response || i.responseEdited ? !1 : ot, [i, c, ot, f]), Rt = R(() => {
+    ]), F = U({}), L = (i == null ? void 0 : i.hintsUsed) ?? 0, [$t] = A((i == null ? void 0 : i.validatedByTeacher) ?? !1), T = U(null), z = U(null), D = R(() => d == null ? void 0 : d.slice(0, L), [d, L]), pt = R(() => c === "TEACHER" || f ? !0 : !i || !i.response || i.responseEdited ? !1 : ot, [i, c, ot, f]), Rt = R(() => {
       if (c === "TEACHER") return !0;
       if (Q) {
         const { attemptsHistory: t } = i ?? {};
@@ -96,14 +96,14 @@ const Ai = Vt(
     }, [ct, nt, i, Q, c]), zt = R(
       () => b && f && !at,
       [at, b, f]
-    ), [vt, Dt] = A({
+    ), [St, Dt] = A({
       width: 0,
       height: 0
     }), Ut = Xt((t) => {
       Nt(t);
     }, []);
     return E(() => {
-      L.current && j.observe(L.current);
+      T.current && j.observe(T.current);
     }, [j]), E(() => {
       if (a && (n.type === "clozeassociation" || n.type === "association" || n.type === "clozeformula")) {
         const t = document.querySelectorAll(
@@ -160,7 +160,7 @@ const Ai = Vt(
       r,
       lt
     ]), E(() => {
-      const t = L.current, s = (o) => {
+      const t = T.current, s = (o) => {
         const m = o.querySelector(".lrn_response_wrapper");
         if (!m)
           return 0;
@@ -176,37 +176,37 @@ const Ai = Vt(
           return Math.ceil(
             p + (W ? s(t) : 0)
           );
-        const St = Math.ceil(
+        const vt = Math.ceil(
           p + (W ? s(t) : 0)
         );
-        return Math.abs(St - o) > 4 ? St : o;
+        return Math.abs(vt - o) > 4 ? vt : o;
       });
     }), Pt(() => {
       !B && !M && Wt(r);
     }, [M, B, r, st]), E(() => {
-      (I || gt || b && f) && w.renderMath("mathjax");
-    }, [gt, I, w, b, f]), E(() => {
-      if (H && v && !$t && (i != null && i.validatedByTeacher)) {
+      (L || gt || b && f) && w.renderMath("mathjax");
+    }, [gt, L, w, b, f]), E(() => {
+      if (H && S && !$t && (i != null && i.validatedByTeacher)) {
         const t = setTimeout(() => {
-          B ? Wt(v) : it(v);
+          B ? Wt(S) : it(S);
         }, 1e3);
         return () => {
           clearTimeout(t);
         };
       }
     }, [
-      v,
+      S,
       H,
       $t,
       B,
       it,
       i == null ? void 0 : i.validatedByTeacher
-    ]), /* @__PURE__ */ T(
+    ]), /* @__PURE__ */ I(
       si,
       {
         "data-response-id": r,
         className: `widget-${r}`,
-        ref: L,
+        ref: T,
         $topOffset: st,
         $flexDirection: $ ? "row" : "column",
         $alignItems: $ ? "flex-start" : "center",
@@ -221,17 +221,17 @@ const Ai = Vt(
               }
             }
           ),
-          /* @__PURE__ */ T(
+          /* @__PURE__ */ I(
             li,
             {
               ref: z,
               $width: $ ? "50%" : `${V}px`,
               $minHeight: y ? Math.max(y - 72, rt ?? 0) : Qt,
-              $isActive: S,
+              $isActive: v,
               $paperColor: C,
-              $opacity: S ? 1 : 0.2,
+              $opacity: v ? 1 : 0.2,
               children: [
-                S && !!k && !!tt && q && /* @__PURE__ */ e(
+                v && !!k && !!tt && q && /* @__PURE__ */ e(
                   Yt,
                   {
                     containerRef: z,
@@ -240,12 +240,12 @@ const Ai = Vt(
                     responseId: r
                   }
                 ),
-                /* @__PURE__ */ T(
+                /* @__PURE__ */ I(
                   ui,
                   {
                     className: Ft,
-                    $dropzoneMinWidth: vt.width,
-                    $dropzoneMinHeight: vt.height,
+                    $dropzoneMinWidth: St.width,
+                    $dropzoneMinHeight: St.height,
                     children: [
                       !(x || l || g) && /* @__PURE__ */ e(
                         ti,
@@ -258,14 +258,14 @@ const Ai = Vt(
                           paperColor: C,
                           onMarkForReview: xt,
                           actionbarHeight: yt,
-                          canResolveDoubt: Lt,
-                          onResolveDoubt: Tt,
+                          canResolveDoubt: Tt,
+                          onResolveDoubt: It,
                           worksheetCompleted: f
                         }
                       ),
                       x && /* @__PURE__ */ e(fi, { src: jt.LESSON_OVERVIEW_BANNER }),
                       l && C && /* @__PURE__ */ e(ei, { paperColor: C }),
-                      g ? /* @__PURE__ */ T(Kt, { children: [
+                      g ? /* @__PURE__ */ I(Kt, { children: [
                         h === "practice-basic" && /* @__PURE__ */ e(ni, {}),
                         h === "practice-regular" && /* @__PURE__ */ e(ai, {}),
                         h === "exit-ticket" && /* @__PURE__ */ e(ci, {}),
@@ -278,7 +278,7 @@ const Ai = Vt(
                           appended: a,
                           question: n,
                           response: i == null ? void 0 : i.response,
-                          canRender: K || S,
+                          canRender: K || v,
                           learnosity: w,
                           canForceAppend: c === "TEACHER",
                           isConceptIntro: l,
@@ -290,15 +290,15 @@ const Ai = Vt(
                         Gt,
                         {
                           canRender: K,
-                          canScribble: J && S,
+                          canScribble: J && v,
                           appended: a,
-                          canvasId: r,
+                          responseId: r,
                           width: V,
                           height: Math.max(y, rt ?? 0),
                           onUpdateHeight: Ut,
                           onPublish: Y,
                           onSubscribe: Z,
-                          userId: It,
+                          userId: Lt,
                           initialData: N == null ? void 0 : N[r],
                           userType: c
                         }
@@ -345,7 +345,7 @@ const Ai = Vt(
                         {
                           responses: Mt,
                           response: i,
-                          nextQuestionId: v,
+                          nextQuestionId: S,
                           responseId: r,
                           studentId: At,
                           userType: c,