@cuemath/leap 3.0.31 → 3.1.0-aa0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (95) hide show
  1. package/dist/assets/line-icons/icons/check.js +3 -3
  2. package/dist/assets/line-icons/icons/check.js.map +1 -1
  3. package/dist/assets/line-icons/icons/puzzle-icon.js +51 -0
  4. package/dist/assets/line-icons/icons/puzzle-icon.js.map +1 -0
  5. package/dist/assets/line-icons/icons/share.js +48 -0
  6. package/dist/assets/line-icons/icons/share.js.map +1 -0
  7. package/dist/assets/line-icons/icons/tile.js +54 -0
  8. package/dist/assets/line-icons/icons/tile.js.map +1 -0
  9. package/dist/features/cue-canvas/bottombar/homework-controls.js +73 -0
  10. package/dist/features/cue-canvas/bottombar/homework-controls.js.map +1 -0
  11. package/dist/features/cue-canvas/cue-canvas-context.js +8 -5
  12. package/dist/features/cue-canvas/cue-canvas-context.js.map +1 -1
  13. package/dist/features/cue-canvas/cue-canvas-core.js +68 -70
  14. package/dist/features/cue-canvas/cue-canvas-core.js.map +1 -1
  15. package/dist/features/cue-canvas/cue-canvas-helpers.js +31 -25
  16. package/dist/features/cue-canvas/cue-canvas-helpers.js.map +1 -1
  17. package/dist/features/cue-canvas/cue-canvas-provider.js +14 -12
  18. package/dist/features/cue-canvas/cue-canvas-provider.js.map +1 -1
  19. package/dist/features/cue-canvas/cue-canvas.js +86 -66
  20. package/dist/features/cue-canvas/cue-canvas.js.map +1 -1
  21. package/dist/features/cue-canvas/cue-cavas-styled.js +45 -42
  22. package/dist/features/cue-canvas/cue-cavas-styled.js.map +1 -1
  23. package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js +61 -54
  24. package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js.map +1 -1
  25. package/dist/features/cue-canvas/hooks/use-cue-canvas-actions.js +18 -14
  26. package/dist/features/cue-canvas/hooks/use-cue-canvas-actions.js.map +1 -1
  27. package/dist/features/cue-canvas/hooks/use-upload-helper.js +23 -0
  28. package/dist/features/cue-canvas/hooks/use-upload-helper.js.map +1 -0
  29. package/dist/features/cue-canvas/sidebar/homework/helper.js +20 -0
  30. package/dist/features/cue-canvas/sidebar/homework/helper.js.map +1 -0
  31. package/dist/features/cue-canvas/sidebar/homework/homework-menu.js +33 -0
  32. package/dist/features/cue-canvas/sidebar/homework/homework-menu.js.map +1 -0
  33. package/dist/features/cue-canvas/sidebar/homework/homework-request.js +68 -0
  34. package/dist/features/cue-canvas/sidebar/homework/homework-request.js.map +1 -0
  35. package/dist/features/cue-canvas/sidebar/homework/homework-styled.js +25 -0
  36. package/dist/features/cue-canvas/sidebar/homework/homework-styled.js.map +1 -0
  37. package/dist/features/cue-canvas/sidebar/homework/homework.js +39 -0
  38. package/dist/features/cue-canvas/sidebar/homework/homework.js.map +1 -0
  39. package/dist/features/cue-canvas/sidebar/puzzles/api/get-puzzles.js +13 -0
  40. package/dist/features/cue-canvas/sidebar/puzzles/api/get-puzzles.js.map +1 -0
  41. package/dist/features/cue-canvas/sidebar/puzzles/filter-selection-menu.js +60 -0
  42. package/dist/features/cue-canvas/sidebar/puzzles/filter-selection-menu.js.map +1 -0
  43. package/dist/features/cue-canvas/sidebar/puzzles/filters-section.js +44 -0
  44. package/dist/features/cue-canvas/sidebar/puzzles/filters-section.js.map +1 -0
  45. package/dist/features/cue-canvas/sidebar/puzzles/filters.js +107 -0
  46. package/dist/features/cue-canvas/sidebar/puzzles/filters.js.map +1 -0
  47. package/dist/features/cue-canvas/sidebar/puzzles/hooks/use-fetch-cue-canvas-activity.js +42 -0
  48. package/dist/features/cue-canvas/sidebar/puzzles/hooks/use-fetch-cue-canvas-activity.js.map +1 -0
  49. package/dist/features/cue-canvas/sidebar/puzzles/launch-puzzle.js +84 -0
  50. package/dist/features/cue-canvas/sidebar/puzzles/launch-puzzle.js.map +1 -0
  51. package/dist/features/cue-canvas/sidebar/puzzles/puzzle-menu-header.js +36 -0
  52. package/dist/features/cue-canvas/sidebar/puzzles/puzzle-menu-header.js.map +1 -0
  53. package/dist/features/cue-canvas/sidebar/puzzles/puzzle-menu.js +133 -0
  54. package/dist/features/cue-canvas/sidebar/puzzles/puzzle-menu.js.map +1 -0
  55. package/dist/features/cue-canvas/sidebar/puzzles/puzzles-styled.js +96 -0
  56. package/dist/features/cue-canvas/sidebar/puzzles/puzzles-styled.js.map +1 -0
  57. package/dist/features/cue-canvas/sidebar/puzzles/puzzles.js +29 -0
  58. package/dist/features/cue-canvas/sidebar/puzzles/puzzles.js.map +1 -0
  59. package/dist/features/cue-canvas/sidebar/puzzles/utils.js +120 -0
  60. package/dist/features/cue-canvas/sidebar/puzzles/utils.js.map +1 -0
  61. package/dist/features/cue-canvas/sidebar/sidebar-styled.js +32 -0
  62. package/dist/features/cue-canvas/sidebar/sidebar-styled.js.map +1 -0
  63. package/dist/features/cue-canvas/sidebar/sidebar.js +29 -0
  64. package/dist/features/cue-canvas/sidebar/sidebar.js.map +1 -0
  65. package/dist/features/cue-canvas/sidebar/tiles/tile.js +16 -0
  66. package/dist/features/cue-canvas/sidebar/tiles/tile.js.map +1 -0
  67. package/dist/features/cue-canvas/toolbar/grid-menu.js +13 -13
  68. package/dist/features/cue-canvas/toolbar/grid-menu.js.map +1 -1
  69. package/dist/features/homework/styles.js +4 -5
  70. package/dist/features/homework/styles.js.map +1 -1
  71. package/dist/features/hooks/use-debounce.js +16 -0
  72. package/dist/features/hooks/use-debounce.js.map +1 -0
  73. package/dist/features/milestone/create/comps/add-custom-chapter/course-catalog.js +36 -38
  74. package/dist/features/milestone/create/comps/add-custom-chapter/course-catalog.js.map +1 -1
  75. package/dist/features/milestone/create/comps/add-custom-chapter/hooks/use-catalog-helpers.js +22 -24
  76. package/dist/features/milestone/create/comps/add-custom-chapter/hooks/use-catalog-helpers.js.map +1 -1
  77. package/dist/features/milestone/create/comps/chapters-selection-step/chapter-selection-step-v2/chapter-category/chapter-category-container.js +22 -23
  78. package/dist/features/milestone/create/comps/chapters-selection-step/chapter-selection-step-v2/chapter-category/chapter-category-container.js.map +1 -1
  79. package/dist/features/milestone/create/comps/chapters-selection-step/utils.js +47 -49
  80. package/dist/features/milestone/create/comps/chapters-selection-step/utils.js.map +1 -1
  81. package/dist/features/milestone/create/comps/class-details-step/class-details-step.js +87 -94
  82. package/dist/features/milestone/create/comps/class-details-step/class-details-step.js.map +1 -1
  83. package/dist/features/milestone/create/comps/class-details-step/class-details-utils.js +12 -13
  84. package/dist/features/milestone/create/comps/class-details-step/class-details-utils.js.map +1 -1
  85. package/dist/features/milestone/create/comps/test-type-step/test-type-step.js +21 -23
  86. package/dist/features/milestone/create/comps/test-type-step/test-type-step.js.map +1 -1
  87. package/dist/features/milestone/create/milestone-create-helpers.js +162 -165
  88. package/dist/features/milestone/create/milestone-create-helpers.js.map +1 -1
  89. package/dist/features/ui/stepper/stepper.js +7 -7
  90. package/dist/features/worksheet/worksheet/hooks/use-s3-helper.js +22 -19
  91. package/dist/features/worksheet/worksheet/hooks/use-s3-helper.js.map +1 -1
  92. package/dist/index.d.ts +48 -3
  93. package/dist/index.js +184 -180
  94. package/dist/index.js.map +1 -1
  95. package/package.json +1 -1
@@ -0,0 +1,36 @@
1
+ import { jsxs as o, jsx as e } from "react/jsx-runtime";
2
+ import { memo as i } from "react";
3
+ import n from "../../../../assets/line-icons/icons/cross.js";
4
+ import c from "../../../../assets/line-icons/icons/puzzle-icon.js";
5
+ import m from "../../../ui/buttons/clickable/clickable.js";
6
+ import s from "../../../ui/buttons/text-button/text-button.js";
7
+ import r from "../../../ui/layout/flex-view.js";
8
+ import a from "../../../ui/text/text.js";
9
+ const f = ({
10
+ toggleMenu: t,
11
+ onReset: l
12
+ }) => /* @__PURE__ */ o(
13
+ r,
14
+ {
15
+ $flexDirection: "row",
16
+ $justifyContent: "space-between",
17
+ $alignItems: "center",
18
+ $gutterX: 1,
19
+ $gapX: 0.5,
20
+ $heightX: 3,
21
+ children: [
22
+ /* @__PURE__ */ o(r, { $flexDirection: "row", $alignItems: "center", $flexColumnGapX: 0.5, children: [
23
+ /* @__PURE__ */ e(c, { color: "WHITE" }),
24
+ /* @__PURE__ */ e(a, { $color: "WHITE", $renderAs: "body2", children: "ACTIVITIES" })
25
+ ] }),
26
+ /* @__PURE__ */ o(r, { $flexDirection: "row", $alignItems: "center", $flexColumnGapX: 1, children: [
27
+ /* @__PURE__ */ e(s, { color: "WHITE", label: "Reset", onClick: l }),
28
+ /* @__PURE__ */ e(m, { onClick: t, label: "close activities menu", children: /* @__PURE__ */ e(n, { color: "WHITE" }) })
29
+ ] })
30
+ ]
31
+ }
32
+ ), h = i(f);
33
+ export {
34
+ h as default
35
+ };
36
+ //# sourceMappingURL=puzzle-menu-header.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"puzzle-menu-header.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzle-menu-header.tsx"],"sourcesContent":["import { memo } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport PuzzleIcon from '../../../../assets/line-icons/icons/puzzle-icon';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst MenuHeader: React.FC<{ toggleMenu: () => void; onReset?: () => void }> = ({\n toggleMenu,\n onReset,\n}) => (\n <FlexView\n $flexDirection=\"row\"\n $justifyContent=\"space-between\"\n $alignItems=\"center\"\n $gutterX={1}\n $gapX={0.5}\n $heightX={3}\n >\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={0.5}>\n <PuzzleIcon color=\"WHITE\" />\n <Text $color=\"WHITE\" $renderAs=\"body2\">\n ACTIVITIES\n </Text>\n </FlexView>\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n <TextButton color=\"WHITE\" label=\"Reset\" onClick={onReset} />\n <Clickable onClick={toggleMenu} label=\"close activities menu\">\n <CrossIcon color=\"WHITE\" />\n </Clickable>\n </FlexView>\n </FlexView>\n);\n\nexport default memo(MenuHeader);\n"],"names":["MenuHeader","toggleMenu","onReset","jsxs","FlexView","jsx","PuzzleIcon","Text","TextButton","Clickable","CrossIcon","PuzzleMenuHeader","memo"],"mappings":";;;;;;;;AASA,MAAMA,IAAyE,CAAC;AAAA,EAC9E,YAAAC;AAAA,EACA,SAAAC;AACF,MACE,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,gBAAe;AAAA,IACf,iBAAgB;AAAA,IAChB,aAAY;AAAA,IACZ,UAAU;AAAA,IACV,OAAO;AAAA,IACP,UAAU;AAAA,IAEV,UAAA;AAAA,MAAA,gBAAAD,EAACC,KAAS,gBAAe,OAAM,aAAY,UAAS,iBAAiB,KACnE,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAW,OAAM,QAAQ,CAAA;AAAA,0BACzBC,GAAK,EAAA,QAAO,SAAQ,WAAU,SAAQ,UAEvC,cAAA;AAAA,MAAA,GACF;AAAA,wBACCH,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,iBAAiB,GACnE,UAAA;AAAA,QAAA,gBAAAC,EAACG,KAAW,OAAM,SAAQ,OAAM,SAAQ,SAASN,GAAS;AAAA,QAC1D,gBAAAG,EAACI,GAAU,EAAA,SAASR,GAAY,OAAM,yBACpC,UAAC,gBAAAI,EAAAK,GAAA,EAAU,OAAM,QAAA,CAAQ,EAC3B,CAAA;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AACF,GAGaC,IAAAC,EAAKZ,CAAU;"}
@@ -0,0 +1,133 @@
1
+ import { jsxs as o, jsx as t } from "react/jsx-runtime";
2
+ import { memo as j, useState as f, useCallback as c } from "react";
3
+ import { ILLUSTRATIONS as O } from "../../../../assets/illustrations/illustrations.js";
4
+ import V from "../../../hooks/use-debounce.js";
5
+ import { Loader as Y } from "../../../ui/buttons/button/button-styled.js";
6
+ import G from "../../../ui/buttons/clickable/clickable.js";
7
+ import X from "../../../ui/inputs/searchable-input/searchable-input.js";
8
+ import h from "../../../ui/layout/flex-view.js";
9
+ import H from "../../../ui/text/text.js";
10
+ import N from "./filter-selection-menu.js";
11
+ import U from "./filters.js";
12
+ import W from "./hooks/use-fetch-cue-canvas-activity.js";
13
+ import K from "./launch-puzzle.js";
14
+ import q from "./puzzle-menu-header.js";
15
+ import { MenuContainer as x, FilterSidebar as B, SearchHeaderWrapper as J, ActivitiesList as Q, ActivityImage as Z, ActivityTitle as ee, EmptyStateContainer as te } from "./puzzles-styled.js";
16
+ import { FILTER_KEYS as p } from "./utils.js";
17
+ const re = ({ toggleMenu: y, studentGrade: F }) => {
18
+ const { isPuzzlesProcessing: P, setActivityFilters: a, puzzlesData: _ } = W(F), { filters: L, results: i } = _ || {}, {
19
+ activity_tiles: n,
20
+ activity_topics: l,
21
+ activity_types: g,
22
+ grades: m,
23
+ search: z
24
+ } = L || {}, [$, C] = f(), [S, T] = f(
25
+ null
26
+ ), [I, b] = f(z || ""), v = V((e) => {
27
+ e !== z && d({ search: e });
28
+ }, 300), D = c(
29
+ (e) => {
30
+ b(e), v(e);
31
+ },
32
+ [v]
33
+ ), k = c((e) => {
34
+ T((r) => r === e ? null : e);
35
+ }, []), w = c(() => {
36
+ T(null);
37
+ }, []), d = c(
38
+ (e) => {
39
+ const r = Object.keys(e)[0], s = r && e[r];
40
+ a((u) => ({
41
+ ...u,
42
+ [r]: s
43
+ }));
44
+ },
45
+ [a]
46
+ ), E = c(() => {
47
+ a({}), b("");
48
+ }, [a]), M = c(() => {
49
+ C(void 0);
50
+ }, []);
51
+ if (P && (!n || (n == null ? void 0 : n.length) === 0) && (!l || (l == null ? void 0 : l.length) === 0))
52
+ return /* @__PURE__ */ o(x, { $justifyContent: "center", $alignItems: "center", children: [
53
+ /* @__PURE__ */ t(Y, { src: O.LOADER, alt: "Loader", $size: "small" }),
54
+ ";"
55
+ ] });
56
+ if ($)
57
+ return /* @__PURE__ */ t(
58
+ K,
59
+ {
60
+ launchPuzzleData: $,
61
+ onMenuVisibilityChange: M,
62
+ toggleMenu: y
63
+ }
64
+ );
65
+ if (S) {
66
+ let e, r;
67
+ switch (S) {
68
+ case "grades":
69
+ e = m, r = p.ACTIVITY_GRADES;
70
+ break;
71
+ case "topics":
72
+ e = l, r = p.ACTIVITY_TOPICS;
73
+ break;
74
+ case "tiles":
75
+ e = n, r = p.ACTIVITY_TILES;
76
+ break;
77
+ default:
78
+ return null;
79
+ }
80
+ return e ? /* @__PURE__ */ t(
81
+ N,
82
+ {
83
+ closeAllPopups: w,
84
+ menuItems: e,
85
+ onFiltersChange: d,
86
+ type: r
87
+ }
88
+ ) : null;
89
+ }
90
+ return /* @__PURE__ */ o(x, { children: [
91
+ /* @__PURE__ */ t(q, { toggleMenu: y, onReset: E }),
92
+ /* @__PURE__ */ o(h, { $flexDirection: "row", $alignItems: "flex-start", children: [
93
+ /* @__PURE__ */ t(B, { $width: "35%", $gutterX: 1, children: m && n && l && g && /* @__PURE__ */ t(
94
+ U,
95
+ {
96
+ handleFiltersChange: d,
97
+ filterGrades: m,
98
+ filterTiles: n,
99
+ filterTypes: g,
100
+ filterTopics: l,
101
+ togglePopup: k
102
+ }
103
+ ) }),
104
+ /* @__PURE__ */ o(h, { $width: "65%", children: [
105
+ /* @__PURE__ */ t(J, { $heightX: 4, $alignItems: "center", $justifyContent: "center", children: /* @__PURE__ */ t(
106
+ X,
107
+ {
108
+ value: I,
109
+ onSearchTextChange: D,
110
+ renderAs: "secondary",
111
+ width: "99%",
112
+ size: "regular",
113
+ label: "Type topic name...",
114
+ searchOnClear: !0
115
+ }
116
+ ) }),
117
+ /* @__PURE__ */ t(h, { $gutterX: 1, children: /* @__PURE__ */ t(H, { $renderAs: "body3", $color: "GREY_2", children: i && i.length > 0 ? `${i.length} activities found` : I ? "No activities found" : null }) }),
118
+ /* @__PURE__ */ t(Q, { $flexDirection: "row", $flexWrap: !0, $justifyContent: "space-evenly", children: i && (i == null ? void 0 : i.length) > 0 ? i.map((e) => {
119
+ var A;
120
+ const { activity_url: r, name: s, id: u } = e, R = (A = r.split("_")[0]) == null ? void 0 : A.concat("_thumbnail.png");
121
+ return r ? /* @__PURE__ */ t(G, { onClick: () => C(e), label: "puzzle", children: /* @__PURE__ */ o(h, { $alignItems: "center", children: [
122
+ /* @__PURE__ */ t(Z, { title: s, id: u, src: R }),
123
+ s && /* @__PURE__ */ t(ee, { children: s })
124
+ ] }) }, u) : null;
125
+ }) : /* @__PURE__ */ t(te, { children: "Use Filters or Search to find activities" }) })
126
+ ] })
127
+ ] })
128
+ ] });
129
+ }, $e = j(re);
130
+ export {
131
+ $e as default
132
+ };
133
+ //# sourceMappingURL=puzzle-menu.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"puzzle-menu.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzle-menu.tsx"],"sourcesContent":["import type { IGetPuzzles, IPuzzlesResultData } from './api/get-puzzles';\nimport type { FilterType, PuzzleMenuProps, TActiveFilterMenuType } from './puzzles-type';\n\nimport { memo, useCallback, useState } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport useDebounce from '../../../hooks/use-debounce';\nimport { Loader } from '../../../ui/buttons/button/button-styled';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport SearchableInput from '../../../ui/inputs/searchable-input/searchable-input';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport FilterSelectionMenu from './filter-selection-menu';\nimport Filters from './filters';\nimport useFetchCueCanvasActivity from './hooks/use-fetch-cue-canvas-activity';\nimport LaunchPuzzle from './launch-puzzle';\nimport PuzzleMenuHeader from './puzzle-menu-header';\nimport * as Styled from './puzzles-styled';\nimport { FILTER_KEYS } from './utils';\n\nconst PuzzleMenu: React.FC<PuzzleMenuProps> = ({ toggleMenu, studentGrade }) => {\n const { isPuzzlesProcessing, setActivityFilters, puzzlesData } =\n useFetchCueCanvasActivity(studentGrade);\n\n const { filters, results: puzzles } = puzzlesData || {};\n const {\n activity_tiles: filterTiles,\n activity_topics: filterTopics,\n activity_types: filterTypes,\n grades: filterGrades,\n search: filterSearch,\n } = filters || {};\n\n const [launchPuzzleData, setLaunchPuzzlesData] = useState<IPuzzlesResultData | undefined>();\n const [activeFilterMenuType, setActiveFilterMenuType] = useState<TActiveFilterMenuType | null>(\n null,\n );\n const [searchText, setSearchText] = useState(filterSearch || '');\n\n const debouncedSearch = useDebounce((value: string) => {\n if (value !== filterSearch) {\n handleFiltersChange({ search: value });\n }\n }, 300);\n\n const handleSearchChange = useCallback(\n (value: string) => {\n setSearchText(value);\n debouncedSearch(value);\n },\n [debouncedSearch],\n );\n\n const togglePopup = useCallback((popupType: TActiveFilterMenuType) => {\n setActiveFilterMenuType(prev => (prev === popupType ? null : popupType));\n }, []);\n\n const closeAllPopups = useCallback(() => {\n setActiveFilterMenuType(null);\n }, []);\n\n const handleFiltersChange = useCallback(\n (filterChange: IGetPuzzles) => {\n const filterType = Object.keys(filterChange)[0] as FilterType;\n const value = filterType && filterChange[filterType];\n\n setActivityFilters(prevFilters => ({\n ...prevFilters,\n [filterType]: value,\n }));\n },\n [setActivityFilters],\n );\n\n const handleReset = useCallback(() => {\n setActivityFilters({});\n setSearchText('');\n }, [setActivityFilters]);\n\n const clearPuzzleData = useCallback(() => {\n setLaunchPuzzlesData(undefined);\n }, []);\n\n if (\n isPuzzlesProcessing &&\n (!filterTiles || filterTiles?.length === 0) &&\n (!filterTopics || filterTopics?.length === 0)\n ) {\n return (\n <Styled.MenuContainer $justifyContent=\"center\" $alignItems=\"center\">\n <Loader src={ILLUSTRATIONS.LOADER} alt=\"Loader\" $size=\"small\" />;\n </Styled.MenuContainer>\n );\n }\n\n if (launchPuzzleData) {\n return (\n <LaunchPuzzle\n launchPuzzleData={launchPuzzleData}\n onMenuVisibilityChange={clearPuzzleData}\n toggleMenu={toggleMenu}\n />\n );\n }\n\n if (activeFilterMenuType) {\n let menuItems;\n let filterType: FilterType;\n\n switch (activeFilterMenuType) {\n case 'grades':\n menuItems = filterGrades;\n filterType = FILTER_KEYS.ACTIVITY_GRADES as FilterType;\n break;\n case 'topics':\n menuItems = filterTopics;\n filterType = FILTER_KEYS.ACTIVITY_TOPICS as FilterType;\n break;\n case 'tiles':\n menuItems = filterTiles;\n filterType = FILTER_KEYS.ACTIVITY_TILES as FilterType;\n break;\n default:\n return null;\n }\n\n if (!menuItems) return null;\n\n return (\n <FilterSelectionMenu\n closeAllPopups={closeAllPopups}\n menuItems={menuItems}\n onFiltersChange={handleFiltersChange}\n type={filterType}\n />\n );\n }\n\n return (\n <Styled.MenuContainer>\n <PuzzleMenuHeader toggleMenu={toggleMenu} onReset={handleReset} />\n <FlexView $flexDirection=\"row\" $alignItems=\"flex-start\">\n <Styled.FilterSidebar $width=\"35%\" $gutterX={1}>\n {filterGrades && filterTiles && filterTopics && filterTypes && (\n <Filters\n handleFiltersChange={handleFiltersChange}\n filterGrades={filterGrades}\n filterTiles={filterTiles}\n filterTypes={filterTypes}\n filterTopics={filterTopics}\n togglePopup={togglePopup}\n />\n )}\n </Styled.FilterSidebar>\n <FlexView $width=\"65%\">\n <Styled.SearchHeaderWrapper $heightX={4} $alignItems=\"center\" $justifyContent=\"center\">\n <SearchableInput\n value={searchText}\n onSearchTextChange={handleSearchChange}\n renderAs=\"secondary\"\n width=\"99%\"\n size=\"regular\"\n label=\"Type topic name...\"\n searchOnClear\n />\n </Styled.SearchHeaderWrapper>\n <FlexView $gutterX={1}>\n <Text $renderAs=\"body3\" $color=\"GREY_2\">\n {puzzles && puzzles.length > 0\n ? `${puzzles.length} activities found`\n : searchText\n ? 'No activities found'\n : null}\n </Text>\n </FlexView>\n <Styled.ActivitiesList $flexDirection=\"row\" $flexWrap $justifyContent=\"space-evenly\">\n {puzzles && puzzles?.length > 0 ? (\n puzzles.map(activity => {\n const { activity_url: reference, name, id } = activity;\n const thumbnailSrc = reference.split('_')[0]?.concat('_thumbnail.png');\n\n if (!reference) return null;\n\n return (\n <Clickable onClick={() => setLaunchPuzzlesData(activity)} key={id} label=\"puzzle\">\n <FlexView $alignItems=\"center\">\n <Styled.ActivityImage title={name} id={id} src={thumbnailSrc} />\n {name && <Styled.ActivityTitle>{name}</Styled.ActivityTitle>}\n </FlexView>\n </Clickable>\n );\n })\n ) : (\n <Styled.EmptyStateContainer>\n Use Filters or Search to find activities\n </Styled.EmptyStateContainer>\n )}\n </Styled.ActivitiesList>\n </FlexView>\n </FlexView>\n </Styled.MenuContainer>\n );\n};\n\nexport default memo(PuzzleMenu);\n"],"names":["PuzzleMenu","toggleMenu","studentGrade","isPuzzlesProcessing","setActivityFilters","puzzlesData","useFetchCueCanvasActivity","filters","puzzles","filterTiles","filterTopics","filterTypes","filterGrades","filterSearch","launchPuzzleData","setLaunchPuzzlesData","useState","activeFilterMenuType","setActiveFilterMenuType","searchText","setSearchText","debouncedSearch","useDebounce","value","handleFiltersChange","handleSearchChange","useCallback","togglePopup","popupType","prev","closeAllPopups","filterChange","filterType","prevFilters","handleReset","clearPuzzleData","Styled.MenuContainer","jsx","Loader","ILLUSTRATIONS","LaunchPuzzle","menuItems","FILTER_KEYS","FilterSelectionMenu","jsxs","PuzzleMenuHeader","FlexView","Styled.FilterSidebar","Filters","Styled.SearchHeaderWrapper","SearchableInput","Text","Styled.ActivitiesList","activity","reference","name","id","thumbnailSrc","_a","Clickable","Styled.ActivityImage","Styled.ActivityTitle","Styled.EmptyStateContainer","PuzzleMenu$1","memo"],"mappings":"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"}
@@ -0,0 +1,96 @@
1
+ import r from "styled-components";
2
+ import e from "../../../ui/layout/flex-view.js";
3
+ import t from "../../../ui/text/text.js";
4
+ const l = r(e)`
5
+ position: absolute;
6
+ top: 38px;
7
+ left: -47px; //32px for icon + 8 sep+ 7 padding
8
+ width: 650px;
9
+ height: 438px;
10
+ border-radius: 6px;
11
+ background: #292734;
12
+ box-shadow: 0px 4px 8px ${({ theme: o }) => o.colors.BLACK_T_20};
13
+ `, d = r.img`
14
+ position: relative;
15
+ width: 160px;
16
+ height: 120px;
17
+ border: 1px solid white;
18
+ border-radius: 8px;
19
+ margin: 16px;
20
+ background-color: black;
21
+ cursor: pointer;
22
+ `, p = r.div`
23
+ color: white;
24
+ cursor: pointer;
25
+ width: 150px;
26
+ overflow: hidden;
27
+ white-space: nowrap;
28
+ text-overflow: ellipsis;
29
+ `, a = r.div`
30
+ width: 336px;
31
+ height: 300px;
32
+ display: flex;
33
+ justify-content: center;
34
+ align-items: center;
35
+ color: ${({ theme: o }) => o.colors.GREY_4};
36
+ `, b = r(e)`
37
+ max-height: 300px;
38
+ width: 100%;
39
+ overflow-y: auto;
40
+ &::-webkit-scrollbar {
41
+ border-radius: 6px;
42
+ background-color: ${({ theme: o }) => o.colors.WHITE};
43
+ }
44
+
45
+ &::-webkit-scrollbar-thumb {
46
+ border-radius: 6px;
47
+ background: ${({ theme: o }) => o.colors.REAL_BLACK_60};
48
+ }
49
+ `, n = r(e)`
50
+ background: #292734;
51
+
52
+ & > div {
53
+ width: calc(100% - 32px);
54
+ }
55
+ `, x = r(e)`
56
+ overflow-y: auto;
57
+ &::-webkit-scrollbar {
58
+ border-radius: 6px;
59
+ background-color: ${({ theme: o }) => o.colors.WHITE};
60
+ }
61
+
62
+ &::-webkit-scrollbar-thumb {
63
+ border-radius: 6px;
64
+ background: ${({ theme: o }) => o.colors.REAL_BLACK_60};
65
+ }
66
+ `, h = r(e)`
67
+ border-right: 1px solid ${({ theme: o }) => o.colors.GREY_4};
68
+ height: 385px;
69
+ overflow-y: auto;
70
+ &::-webkit-scrollbar {
71
+ border-radius: 6px;
72
+ background-color: ${({ theme: o }) => o.colors.WHITE};
73
+ }
74
+
75
+ &::-webkit-scrollbar-thumb {
76
+ border-radius: 6px;
77
+ background: ${({ theme: o }) => o.colors.REAL_BLACK_60};
78
+ }
79
+ `, u = r(t)`
80
+ width: 130px;
81
+ white-space: nowrap;
82
+ text-overflow: ellipsis;
83
+ overflow: hidden;
84
+ `;
85
+ export {
86
+ b as ActivitiesList,
87
+ d as ActivityImage,
88
+ p as ActivityTitle,
89
+ x as CheckboxWrapper,
90
+ a as EmptyStateContainer,
91
+ h as FilterSidebar,
92
+ l as MenuContainer,
93
+ n as SearchHeaderWrapper,
94
+ u as SelectedGrades
95
+ };
96
+ //# sourceMappingURL=puzzles-styled.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"puzzles-styled.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzles-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst MenuContainer = styled(FlexView)`\n position: absolute;\n top: 38px;\n left: -47px; //32px for icon + 8 sep+ 7 padding\n width: 650px;\n height: 438px;\n border-radius: 6px;\n background: #292734;\n box-shadow: 0px 4px 8px ${({ theme }) => theme.colors.BLACK_T_20};\n`;\n\nconst ActivityImage = styled.img`\n position: relative;\n width: 160px;\n height: 120px;\n border: 1px solid white;\n border-radius: 8px;\n margin: 16px;\n background-color: black;\n cursor: pointer;\n`;\n\nconst ActivityTitle = styled.div`\n color: white;\n cursor: pointer;\n width: 150px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n`;\n\nconst EmptyStateContainer = styled.div`\n width: 336px;\n height: 300px;\n display: flex;\n justify-content: center;\n align-items: center;\n color: ${({ theme }) => theme.colors.GREY_4};\n`;\n\nconst ActivitiesList = styled(FlexView)`\n max-height: 300px;\n width: 100%;\n overflow-y: auto;\n &::-webkit-scrollbar {\n border-radius: 6px;\n background-color: ${({ theme }) => theme.colors.WHITE};\n }\n\n &::-webkit-scrollbar-thumb {\n border-radius: 6px;\n background: ${({ theme }) => theme.colors.REAL_BLACK_60};\n }\n`;\n\nconst SearchHeaderWrapper = styled(FlexView)<{ $noBorder?: boolean }>`\n background: #292734;\n\n & > div {\n width: calc(100% - 32px);\n }\n`;\n\nconst CheckboxWrapper = styled(FlexView)`\n overflow-y: auto;\n &::-webkit-scrollbar {\n border-radius: 6px;\n background-color: ${({ theme }) => theme.colors.WHITE};\n }\n\n &::-webkit-scrollbar-thumb {\n border-radius: 6px;\n background: ${({ theme }) => theme.colors.REAL_BLACK_60};\n }\n`;\n\nconst FilterSidebar = styled(FlexView)`\n border-right: 1px solid ${({ theme }) => theme.colors.GREY_4};\n height: 385px;\n overflow-y: auto;\n &::-webkit-scrollbar {\n border-radius: 6px;\n background-color: ${({ theme }) => theme.colors.WHITE};\n }\n\n &::-webkit-scrollbar-thumb {\n border-radius: 6px;\n background: ${({ theme }) => theme.colors.REAL_BLACK_60};\n }\n`;\n\nconst SelectedGrades = styled(Text)`\n width: 130px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n`;\n\nexport {\n MenuContainer,\n ActivityImage,\n ActivityTitle,\n EmptyStateContainer,\n ActivitiesList,\n SearchHeaderWrapper,\n CheckboxWrapper,\n FilterSidebar,\n SelectedGrades,\n};\n"],"names":["MenuContainer","styled","FlexView","theme","ActivityImage","ActivityTitle","EmptyStateContainer","ActivitiesList","SearchHeaderWrapper","CheckboxWrapper","FilterSidebar","SelectedGrades","Text"],"mappings":";;;AAKM,MAAAA,IAAgBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAQT,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA,GAG5DC,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWvBI,IAAgBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASvBK,IAAsBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMxB,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,MAAM;AAAA,GAGvCI,IAAiBN,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMd,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,aAAa;AAAA;AAAA,GAIrDK,IAAsBP,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQrCO,IAAkBR,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,wBAIf,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,aAAa;AAAA;AAAA,GAIrDO,IAAgBT,EAAOC,CAAQ;AAAA,4BACT,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,wBAKtC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,aAAa;AAAA;AAAA,GAIrDQ,IAAiBV,EAAOW,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;"}
@@ -0,0 +1,29 @@
1
+ import { jsxs as m, jsx as i } from "react/jsx-runtime";
2
+ import { memo as a, useRef as p, useCallback as z, useEffect as f } from "react";
3
+ import d from "../../../../assets/line-icons/icons/puzzle-icon.js";
4
+ import C from "../../../ui/buttons/clickable/clickable.js";
5
+ import v from "../../../ui/hooks/use-context-menu-click-handler.js";
6
+ import h from "../../../ui/layout/flex-view.js";
7
+ import { StyledWrapper as k } from "../../cue-cavas-styled.js";
8
+ import { useCueCanvasActions as b } from "../../hooks/use-cue-canvas-actions.js";
9
+ import g from "./puzzle-menu.js";
10
+ const x = (s) => {
11
+ const { activeSidebar: e, setActiveSidebar: r, grade: u } = s, { activeInstance: o } = b(), c = p(null), { menuVisible: l, onMenuClick: t } = v(
12
+ c,
13
+ void 0,
14
+ !0,
15
+ void 0
16
+ ), n = z(() => {
17
+ e === "tile" && (o == null || o.toggleTiles(!1)), r(e === "puzzle" ? void 0 : "puzzle"), t();
18
+ }, [e, o, t, r]);
19
+ return f(() => {
20
+ (e === "tile" || e === "homework") && l && t();
21
+ }, [e, l, t]), /* @__PURE__ */ m(h, { $position: "relative", $height: "100%", children: [
22
+ /* @__PURE__ */ i(C, { onClick: n, label: "puzzles", children: /* @__PURE__ */ i(k, { $active: e === "puzzle", children: /* @__PURE__ */ i(d, {}) }) }),
23
+ l && /* @__PURE__ */ i(g, { toggleMenu: n, studentGrade: u })
24
+ ] });
25
+ }, V = a(x);
26
+ export {
27
+ V as default
28
+ };
29
+ //# sourceMappingURL=puzzles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"puzzles.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzles.tsx"],"sourcesContent":["import type { IPuzzlesContainer } from './puzzles-type';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect, useRef } from 'react';\n\nimport PuzzleIcon from '../../../../assets/line-icons/icons/puzzle-icon';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport useContextMenuClickHandler from '../../../ui/hooks/use-context-menu-click-handler';\nimport FlexView from '../../../ui/layout/flex-view';\nimport { StyledWrapper } from '../../cue-cavas-styled';\nimport { useCueCanvasActions } from '../../hooks/use-cue-canvas-actions';\nimport PuzzleMenu from './puzzle-menu';\n\nconst PuzzlesContainer: FC<IPuzzlesContainer> = props => {\n const { activeSidebar, setActiveSidebar, grade } = props;\n const { activeInstance: cueCanvas } = useCueCanvasActions();\n const puzzleMenuRef = useRef(null);\n\n const { menuVisible, onMenuClick } = useContextMenuClickHandler(\n puzzleMenuRef,\n undefined,\n true,\n undefined,\n );\n\n const handleClick = useCallback(() => {\n if (activeSidebar === 'tile') {\n cueCanvas?.toggleTiles(false);\n }\n setActiveSidebar(activeSidebar === 'puzzle' ? undefined : 'puzzle');\n onMenuClick();\n }, [activeSidebar, cueCanvas, onMenuClick, setActiveSidebar]);\n\n useEffect(() => {\n if ((activeSidebar === 'tile' || activeSidebar === 'homework') && menuVisible) {\n onMenuClick();\n }\n }, [activeSidebar, menuVisible, onMenuClick]);\n\n return (\n <FlexView $position=\"relative\" $height=\"100%\">\n <Clickable onClick={handleClick} label=\"puzzles\">\n <StyledWrapper $active={activeSidebar === 'puzzle'}>\n <PuzzleIcon />\n </StyledWrapper>\n </Clickable>\n {menuVisible && <PuzzleMenu toggleMenu={handleClick} studentGrade={grade} />}\n </FlexView>\n );\n};\n\nexport default memo(PuzzlesContainer);\n"],"names":["PuzzlesContainer","props","activeSidebar","setActiveSidebar","grade","cueCanvas","useCueCanvasActions","puzzleMenuRef","useRef","menuVisible","onMenuClick","useContextMenuClickHandler","handleClick","useCallback","useEffect","jsxs","FlexView","jsx","Clickable","StyledWrapper","PuzzleIcon","PuzzleMenu","Puzzles","memo"],"mappings":";;;;;;;;;AAaA,MAAMA,IAA0C,CAASC,MAAA;AACvD,QAAM,EAAE,eAAAC,GAAe,kBAAAC,GAAkB,OAAAC,EAAA,IAAUH,GAC7C,EAAE,gBAAgBI,EAAU,IAAIC,EAAoB,GACpDC,IAAgBC,EAAO,IAAI,GAE3B,EAAE,aAAAC,GAAa,aAAAC,EAAA,IAAgBC;AAAA,IACnCJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAGIK,IAAcC,EAAY,MAAM;AACpC,IAAIX,MAAkB,WACpBG,KAAA,QAAAA,EAAW,YAAY,MAERF,EAAAD,MAAkB,WAAW,SAAY,QAAQ,GACtDQ;KACX,CAACR,GAAeG,GAAWK,GAAaP,CAAgB,CAAC;AAE5D,SAAAW,EAAU,MAAM;AACd,KAAKZ,MAAkB,UAAUA,MAAkB,eAAeO,KACpDC;EAEb,GAAA,CAACR,GAAeO,GAAaC,CAAW,CAAC,GAGzC,gBAAAK,EAAAC,GAAA,EAAS,WAAU,YAAW,SAAQ,QACrC,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAU,EAAA,SAASN,GAAa,OAAM,WACrC,UAAA,gBAAAK,EAACE,GAAc,EAAA,SAASjB,MAAkB,UACxC,UAAC,gBAAAe,EAAAG,GAAA,CAAA,CAAW,EACd,CAAA,GACF;AAAA,IACCX,KAAgB,gBAAAQ,EAAAI,GAAA,EAAW,YAAYT,GAAa,cAAcR,GAAO;AAAA,EAC5E,EAAA,CAAA;AAEJ,GAEekB,IAAAC,EAAKvB,CAAgB;"}
@@ -0,0 +1,120 @@
1
+ const I = (l) => {
2
+ const { grid: m, strokes: c, tiles: f } = l || {}, a = {};
3
+ (f || []).forEach((o) => {
4
+ var G, u, g, D, A, h;
5
+ const { name: t, options: i, id: r, size: T } = o || {};
6
+ if (r) {
7
+ if (t === "text") {
8
+ const e = { ...o, html: i };
9
+ delete e.options, delete e.id, a[r] = [void 0, e];
10
+ }
11
+ if (t === "equation" || t === "algebra-tile") {
12
+ const e = { ...o, expr: i };
13
+ t === "algebra-tile" && (e.name = "algebra"), delete e.options, delete e.id, a[r] = [void 0, e];
14
+ }
15
+ if (t === "image") {
16
+ const e = { ...o, href: i, width: T };
17
+ delete e.options, delete e.id, a[r] = [void 0, e];
18
+ }
19
+ if (t === "polygon" || t === "token" || t === "custom-polygon") {
20
+ const e = { ...o, shape: i };
21
+ delete e.options, delete e.id, a[r] = [void 0, e];
22
+ }
23
+ if (t === "dice") {
24
+ const e = (G = i == null ? void 0 : i.trim()) == null ? void 0 : G.split(":")[0], d = { ...o, value: e };
25
+ delete d.options, delete d.id, a[r] = [void 0, d];
26
+ }
27
+ if (t === "number-tile") {
28
+ const [e, d] = ((u = i == null ? void 0 : i.trim()) == null ? void 0 : u.split(":")) || [], n = { ...o, value: d || 0, width: e || 0 };
29
+ delete n.options, delete n.id, a[r] = [void 0, n];
30
+ }
31
+ if (t === "geo") {
32
+ const [e, d] = ((g = i == null ? void 0 : i.trim()) == null ? void 0 : g.split("=")) || [], n = { ...o, key: e || "", expr: d || 0 };
33
+ delete n.options, delete n.id, a[r] = [void 0, n];
34
+ }
35
+ if (t === "number-line") {
36
+ const [e, d, n, s, E] = ((D = i == null ? void 0 : i.trim()) == null ? void 0 : D.split(":")) || [], p = {
37
+ ...o,
38
+ start: e || 0,
39
+ step: d || 0,
40
+ width: n || 0,
41
+ size: s || 0,
42
+ minor: E || 0
43
+ };
44
+ delete p.options, delete p.id, a[r] = [void 0, p];
45
+ }
46
+ if (t === "fraction-bar") {
47
+ const [e, d, n] = ((A = i == null ? void 0 : i.trim()) == null ? void 0 : A.split(":")) || [], s = { ...o };
48
+ e && (s.denominator = +e), d && (s.count = +d), n && (s.active = +n), delete s.options, delete s.id, a[r] = [void 0, s];
49
+ }
50
+ if (t === "fraction-circle") {
51
+ const [e, d, n] = ((h = i == null ? void 0 : i.trim()) == null ? void 0 : h.split(":")) || [], s = { ...o };
52
+ e && (s.denominator = +e), d && (s.count = +d), n && (s.active = +n), delete s.options, delete s.id, a[r] = [void 0, s];
53
+ }
54
+ if (t === "number-card" || t === "number-bar" || t === "tantrix") {
55
+ const e = { ...o, value: i };
56
+ delete e.options, delete e.id, a[r] = [void 0, e];
57
+ }
58
+ if (t === "tangram" || t === "garden" || t === "kolam" || t === "penrose" || t === "polyomino") {
59
+ const e = { ...o, index: i };
60
+ delete e.options, delete e.id, a[r] = [void 0, e];
61
+ }
62
+ if (t === "ruler" || t === "protractor" || t === "set-triangle" || t === "compass") {
63
+ const e = { ...o, width: i };
64
+ delete e.options, delete e.id, a[r] = [void 0, e];
65
+ }
66
+ }
67
+ });
68
+ const v = {};
69
+ return c.forEach((o) => {
70
+ const { id: t } = o || {};
71
+ if (t) {
72
+ const i = { ...o };
73
+ delete i.id, v[t] = [void 0, i];
74
+ }
75
+ }), {
76
+ gridName: m,
77
+ data: { ...v, ...a }
78
+ };
79
+ }, L = (l, m = "") => {
80
+ const c = [];
81
+ return l && l.length > 0 && l.forEach((f) => {
82
+ if (m === "grades") {
83
+ const a = `G${f.name}`;
84
+ c.push(a);
85
+ } else
86
+ c.push(f.name);
87
+ }), c;
88
+ }, y = {
89
+ ACTIVITY_TILES: "activity_tiles",
90
+ ACTIVITY_TOPICS: "activity_topics",
91
+ ACTIVITY_TYPES: "activity_types",
92
+ ACTIVITY_GRADES: "grades"
93
+ }, _ = {
94
+ "-1": "LKG",
95
+ 0: "UKG",
96
+ 1: "G1",
97
+ 2: "G2",
98
+ 3: "G3",
99
+ 4: "G4",
100
+ 5: "G5",
101
+ 6: "G6",
102
+ 7: "G7",
103
+ 8: "G8",
104
+ 9: "G9",
105
+ 10: "G10",
106
+ 11: "G11",
107
+ 12: "G12",
108
+ ALG1: "ALG1",
109
+ ALG2: "ALG2",
110
+ PCAL: "PCAL",
111
+ GEO: "GEO",
112
+ CAL: "CAL"
113
+ };
114
+ export {
115
+ y as FILTER_KEYS,
116
+ _ as GRADE_DISPLAY_NAMES,
117
+ L as getTags,
118
+ I as serializeData
119
+ };
120
+ //# sourceMappingURL=utils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"utils.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/utils.ts"],"sourcesContent":["import type { TCueCanvasChangeDataObject, TCueCanvasGridName } from '../../types/cue-canvas';\nimport type { ActivityMetadata, IActivityGrade } from './api/get-puzzles';\nimport type { ITypeStroke, ITypeTile } from './puzzles-type';\n\nexport const serializeData = (jsonOBJ: {\n grid: TCueCanvasGridName;\n strokes: ITypeStroke[];\n tiles: ITypeTile[];\n}) => {\n const { grid, strokes, tiles } = jsonOBJ || {};\n const newTilesArray = {} as TCueCanvasChangeDataObject;\n\n (tiles || []).forEach(tile => {\n const { name, options, id, size } = tile || {};\n\n if (id) {\n if (name === 'text') {\n const tileData = { ...tile, html: options };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'equation' || name === 'algebra-tile') {\n const tileData = { ...tile, expr: options };\n\n if (name === 'algebra-tile') {\n tileData.name = 'algebra';\n }\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'image') {\n const tileData = { ...tile, href: options, width: size };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'polygon' || name === 'token' || name === 'custom-polygon') {\n const tileData = { ...tile, shape: options };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'dice') {\n const val = options?.trim()?.split(':')[0];\n const tileData = { ...tile, value: val };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'number-tile') {\n const [width, value] = options?.trim()?.split(':') || [];\n const tileData = { ...tile, value: value || 0, width: width || 0 };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'geo') {\n const [key, expr] = options?.trim()?.split('=') || [];\n const tileData = { ...tile, key: key || '', expr: expr || 0 };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'number-line') {\n const [start, step, width, stepSize, minor] = options?.trim()?.split(':') || [];\n const tileData = {\n ...tile,\n start: start || 0,\n step: step || 0,\n width: width || 0,\n size: stepSize || 0,\n minor: minor || 0,\n };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'fraction-bar') {\n const [denominator, count, active] = options?.trim()?.split(':') || [];\n\n const tileData = { ...tile };\n\n if (denominator) {\n tileData.denominator = +denominator;\n }\n\n if (count) {\n tileData.count = +count;\n }\n\n if (active) {\n tileData.active = +active;\n }\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'fraction-circle') {\n const [denominator, count, active] = options?.trim()?.split(':') || [];\n\n const tileData = { ...tile };\n\n if (denominator) {\n tileData.denominator = +denominator;\n }\n\n if (count) {\n tileData.count = +count;\n }\n\n if (active) {\n tileData.active = +active;\n }\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (name === 'number-card' || name === 'number-bar' || name === 'tantrix') {\n const tileData = { ...tile, value: options };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (\n name === 'tangram' ||\n name === 'garden' ||\n name === 'kolam' ||\n name === 'penrose' ||\n name === 'polyomino'\n ) {\n const tileData = { ...tile, index: options };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n\n if (\n name === 'ruler' ||\n name === 'protractor' ||\n name === 'set-triangle' ||\n name === 'compass'\n ) {\n const tileData = { ...tile, width: options };\n\n delete tileData.options;\n delete tileData.id;\n newTilesArray[id] = [undefined, tileData];\n }\n }\n });\n const newStrokeMap = {} as TCueCanvasChangeDataObject;\n\n strokes.forEach((stroke: ITypeStroke) => {\n const { id } = stroke || {};\n\n if (id) {\n const strokeData = { ...stroke };\n\n delete strokeData.id;\n newStrokeMap[id] = [undefined, strokeData];\n }\n });\n\n return {\n gridName: grid,\n data: { ...newStrokeMap, ...newTilesArray },\n };\n};\n\nexport const getTags = (data: ActivityMetadata[] | IActivityGrade[], type = '') => {\n const arr: string[] = [];\n\n if (data && data.length > 0) {\n data.forEach(res => {\n if (type === 'grades') {\n const grade = `G${res.name}`;\n\n arr.push(grade);\n } else {\n arr.push(res.name);\n }\n });\n }\n\n return arr;\n};\n\nexport const FILTER_KEYS = {\n ACTIVITY_TILES: 'activity_tiles',\n ACTIVITY_TOPICS: 'activity_topics',\n ACTIVITY_TYPES: 'activity_types',\n ACTIVITY_GRADES: 'grades',\n} as const;\n\nexport const GRADE_DISPLAY_NAMES: Record<string, string> = {\n '-1': 'LKG',\n '0': 'UKG',\n '1': 'G1',\n '2': 'G2',\n '3': 'G3',\n '4': 'G4',\n '5': 'G5',\n '6': 'G6',\n '7': 'G7',\n '8': 'G8',\n '9': 'G9',\n '10': 'G10',\n '11': 'G11',\n '12': 'G12',\n 'ALG1': 'ALG1',\n 'ALG2': 'ALG2',\n 'PCAL': 'PCAL',\n 'GEO': 'GEO',\n 'CAL': 'CAL',\n};\n"],"names":["serializeData","jsonOBJ","grid","strokes","tiles","newTilesArray","tile","_a","_b","_c","_d","_e","_f","name","options","id","size","tileData","val","width","value","key","expr","start","step","stepSize","minor","denominator","count","active","newStrokeMap","stroke","strokeData","getTags","data","type","arr","res","grade","FILTER_KEYS","GRADE_DISPLAY_NAMES"],"mappings":"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"}
@@ -0,0 +1,32 @@
1
+ import p, { css as r } from "styled-components";
2
+ import x from "../../ui/layout/flex-view.js";
3
+ const t = p(x)(({
4
+ theme: o,
5
+ $activeSidebar: d
6
+ }) => r`
7
+ z-index: ${o.zIndex.TILE_CONTAINER};
8
+ background-color: ${o.colors.WHITE};
9
+ padding: 7px;
10
+ gap: 4px;
11
+ border-radius: 8px;
12
+ border: 1px solid ${o.colors.BLACK_10};
13
+ box-shadow: 0px 1px 5px 0px ${o.colors.BLACK_10};
14
+
15
+ ${d === "tile" && r`
16
+ border: none;
17
+ box-shadow: none;
18
+ `}
19
+ `);
20
+ p(x)`
21
+ margin: auto;
22
+ box-shadow: 0px 1px 5px 0px ${({ theme: o }) => o.colors.BLACK_10};
23
+ border-top-left-radius: 8px;
24
+ border-top-right-radius: 8px;
25
+ bottom: 0;
26
+ left: 50%;
27
+ transform: translateX(-50%);
28
+ `;
29
+ export {
30
+ t as SideBarContainer
31
+ };
32
+ //# sourceMappingURL=sidebar-styled.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sidebar-styled.js","sources":["../../../../src/features/cue-canvas/sidebar/sidebar-styled.tsx"],"sourcesContent":["import type { TActiveSidebar } from '../sidebar/puzzles/puzzles-type';\n\nimport styled, { css } from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\n\ninterface IStyledTileContainer {\n $activeSidebar?: TActiveSidebar;\n}\n\nexport const SideBarContainer = styled(FlexView)<IStyledTileContainer>(({\n theme,\n $activeSidebar,\n}) => {\n return css`\n z-index: ${theme.zIndex.TILE_CONTAINER};\n background-color: ${theme.colors.WHITE};\n padding: 7px;\n gap: 4px;\n border-radius: 8px;\n border: 1px solid ${theme.colors.BLACK_10};\n box-shadow: 0px 1px 5px 0px ${theme.colors.BLACK_10};\n\n ${$activeSidebar === 'tile' &&\n css`\n border: none;\n box-shadow: none;\n `}\n `;\n});\n\nexport const StyledToolContainer = styled(FlexView)`\n margin: auto;\n box-shadow: 0px 1px 5px 0px ${({ theme }) => theme.colors.BLACK_10};\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n`;\n"],"names":["SideBarContainer","styled","FlexView","theme","$activeSidebar","css"],"mappings":";;AAUO,MAAMA,IAAmBC,EAAOC,CAAQ,EAAwB,CAAC;AAAA,EACtE,OAAAC;AAAA,EACA,gBAAAC;AACF,MACSC;AAAA,eACMF,EAAM,OAAO,cAAc;AAAA,wBAClBA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,wBAIlBA,EAAM,OAAO,QAAQ;AAAA,kCACXA,EAAM,OAAO,QAAQ;AAAA;AAAA,MAEjDC,MAAmB,UACrBC;AAAA;AAAA;AAAA,KAGC;AAAA,GAEJ;AAEkCJ,EAAOC,CAAQ;AAAA;AAAA,gCAElB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
@@ -0,0 +1,29 @@
1
+ import { jsx as e, jsxs as n } from "react/jsx-runtime";
2
+ import { memo as p, useState as d, useMemo as f } from "react";
3
+ import c from "../../ui/layout/flex-view.js";
4
+ import o from "../../ui/separator/separator.js";
5
+ import l from "./homework/homework.js";
6
+ import s from "./puzzles/puzzles.js";
7
+ import { SideBarContainer as u } from "./sidebar-styled.js";
8
+ import x from "./tiles/tile.js";
9
+ const S = ({ grade: m, hwRequests: t }) => {
10
+ const [r, i] = d(), a = f(() => r === "tile" ? "300px" : r === "homework" ? "248px" : r === "puzzle" ? "650px" : "auto", [r]);
11
+ return /* @__PURE__ */ e(u, { $activeSidebar: r, $width: a, children: /* @__PURE__ */ n(c, { $flexDirection: "row", children: [
12
+ /* @__PURE__ */ e(x, { activeSidebar: r, setActiveSidebar: i }),
13
+ /* @__PURE__ */ e(o, { width: 8 }),
14
+ /* @__PURE__ */ e(s, { grade: m, activeSidebar: r, setActiveSidebar: i }),
15
+ /* @__PURE__ */ e(o, { width: 8 }),
16
+ t && t.length > 0 && /* @__PURE__ */ e(
17
+ l,
18
+ {
19
+ activeSidebar: r,
20
+ setActiveSidebar: i,
21
+ hwRequests: t
22
+ }
23
+ )
24
+ ] }) });
25
+ }, B = p(S);
26
+ export {
27
+ B as default
28
+ };
29
+ //# sourceMappingURL=sidebar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sidebar.js","sources":["../../../../src/features/cue-canvas/sidebar/sidebar.tsx"],"sourcesContent":["import type { IHomeWorkHelpRequestModelWithStudentName } from './homework/homework-types';\nimport type { TActiveSidebar } from './puzzles/puzzles-type';\nimport type { FC } from 'react';\n\nimport { memo, useMemo, useState } from 'react';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Homework from './homework/homework';\nimport Puzzles from './puzzles/puzzles';\nimport { SideBarContainer } from './sidebar-styled';\nimport TileBar from './tiles/tile';\n\ninterface ISidebar {\n grade?: string;\n hwRequests?: IHomeWorkHelpRequestModelWithStudentName[];\n}\n\nconst Sidebar: FC<ISidebar> = ({ grade, hwRequests }) => {\n const [activeSidebar, setActiveSidebar] = useState<TActiveSidebar | undefined>();\n\n const width = useMemo(() => {\n if (activeSidebar === 'tile') {\n return '300px';\n }\n\n if (activeSidebar === 'homework') {\n return '248px';\n }\n\n if (activeSidebar === 'puzzle') {\n return '650px';\n }\n\n return 'auto';\n }, [activeSidebar]);\n\n return (\n <SideBarContainer $activeSidebar={activeSidebar} $width={width}>\n <FlexView $flexDirection=\"row\">\n <TileBar activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n <Separator width={8} />\n <Puzzles grade={grade} activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n <Separator width={8} />\n\n {hwRequests && hwRequests.length > 0 && (\n <Homework\n activeSidebar={activeSidebar}\n setActiveSidebar={setActiveSidebar}\n hwRequests={hwRequests}\n />\n )}\n </FlexView>\n </SideBarContainer>\n );\n};\n\nexport default memo(Sidebar);\n"],"names":["Sidebar","grade","hwRequests","activeSidebar","setActiveSidebar","useState","width","useMemo","jsx","SideBarContainer","jsxs","FlexView","TileBar","Separator","Puzzles","Homework","sidebar","memo"],"mappings":";;;;;;;;AAkBA,MAAMA,IAAwB,CAAC,EAAE,OAAAC,GAAO,YAAAC,QAAiB;AACvD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAqC,GAEzEC,IAAQC,EAAQ,MAChBJ,MAAkB,SACb,UAGLA,MAAkB,aACb,UAGLA,MAAkB,WACb,UAGF,QACN,CAACA,CAAa,CAAC;AAGhB,SAAA,gBAAAK,EAACC,KAAiB,gBAAgBN,GAAe,QAAQG,GACvD,UAAA,gBAAAI,EAACC,GAAS,EAAA,gBAAe,OACvB,UAAA;AAAA,IAAC,gBAAAH,EAAAI,GAAA,EAAQ,eAAAT,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,IAC3E,gBAAAI,EAACK,GAAU,EAAA,OAAO,EAAG,CAAA;AAAA,IACpB,gBAAAL,EAAAM,GAAA,EAAQ,OAAAb,GAAc,eAAAE,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,IACzF,gBAAAI,EAACK,GAAU,EAAA,OAAO,EAAG,CAAA;AAAA,IAEpBX,KAAcA,EAAW,SAAS,KACjC,gBAAAM;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,eAAAZ;AAAA,QACA,kBAAAC;AAAA,QACA,YAAAF;AAAA,MAAA;AAAA,IACF;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA;AAEJ,GAEec,IAAAC,EAAKjB,CAAO;"}
@@ -0,0 +1,16 @@
1
+ import { jsx as l } from "react/jsx-runtime";
2
+ import { memo as c, useCallback as a } from "react";
3
+ import n from "../../../../assets/line-icons/icons/tile.js";
4
+ import { StyledWrapper as p } from "../../cue-cavas-styled.js";
5
+ import { useCueCanvasActions as d } from "../../hooks/use-cue-canvas-actions.js";
6
+ const C = c((s) => {
7
+ const { setActiveSidebar: t, activeSidebar: o } = s, { activeInstance: e, setActiveTool: i } = d(), m = a(() => {
8
+ const r = o !== "tile";
9
+ e == null || e.toggleTiles(r), t(r ? "tile" : void 0), i("move");
10
+ }, [o, e, t, i]);
11
+ return /* @__PURE__ */ l(p, { $active: o === "tile", onClick: m, children: /* @__PURE__ */ l(n, {}) });
12
+ });
13
+ export {
14
+ C as default
15
+ };
16
+ //# sourceMappingURL=tile.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tile.js","sources":["../../../../../src/features/cue-canvas/sidebar/tiles/tile.tsx"],"sourcesContent":["import type { TActiveSidebar } from '../puzzles/puzzles-type';\nimport type { Dispatch, FC, SetStateAction } from 'react';\n\nimport { memo, useCallback } from 'react';\n\nimport TileIcon from '../../../../assets/line-icons/icons/tile';\nimport { StyledWrapper } from '../../cue-cavas-styled';\nimport { useCueCanvasActions } from '../../hooks/use-cue-canvas-actions';\n\ninterface ITileBar {\n setActiveSidebar: Dispatch<SetStateAction<TActiveSidebar | undefined>>;\n activeSidebar?: TActiveSidebar;\n}\n\nconst TileBar: FC<ITileBar> = memo(props => {\n const { setActiveSidebar, activeSidebar } = props;\n const { activeInstance, setActiveTool } = useCueCanvasActions();\n\n const toggleTiles = useCallback(() => {\n const newTileState = activeSidebar !== 'tile';\n\n activeInstance?.toggleTiles(newTileState);\n setActiveSidebar(newTileState ? 'tile' : undefined);\n setActiveTool('move');\n }, [activeSidebar, activeInstance, setActiveSidebar, setActiveTool]);\n\n return (\n <StyledWrapper $active={activeSidebar === 'tile'} onClick={toggleTiles}>\n <TileIcon />\n </StyledWrapper>\n );\n});\n\nexport default TileBar;\n"],"names":["TileBar","memo","props","setActiveSidebar","activeSidebar","activeInstance","setActiveTool","useCueCanvasActions","toggleTiles","useCallback","newTileState","jsx","StyledWrapper","TileIcon"],"mappings":";;;;;AAcM,MAAAA,IAAwBC,EAAK,CAASC,MAAA;AACpC,QAAA,EAAE,kBAAAC,GAAkB,eAAAC,EAAkB,IAAAF,GACtC,EAAE,gBAAAG,GAAgB,eAAAC,EAAc,IAAIC,EAAoB,GAExDC,IAAcC,EAAY,MAAM;AACpC,UAAMC,IAAeN,MAAkB;AAEvC,IAAAC,KAAA,QAAAA,EAAgB,YAAYK,IACXP,EAAAO,IAAe,SAAS,MAAS,GAClDJ,EAAc,MAAM;AAAA,KACnB,CAACF,GAAeC,GAAgBF,GAAkBG,CAAa,CAAC;AAGjE,SAAA,gBAAAK,EAACC,KAAc,SAASR,MAAkB,QAAQ,SAASI,GACzD,UAAC,gBAAAG,EAAAE,GAAA,CAAS,CAAA,EACZ,CAAA;AAEJ,CAAC;"}