@local-civics/mgmt-ui 0.1.187 → 0.1.188

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 (5) hide show
  1. package/dist/index.js +325 -255
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +325 -255
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -14,35 +14,35 @@ import AvatarInit from 'avatar-initials';
14
14
  import { Chart } from 'react-charts';
15
15
  import { useUncontrolled } from '@mantine/hooks';
16
16
 
17
- var __defProp$9 = Object.defineProperty;
18
- var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
19
- var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
20
- var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
21
- var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
22
- var __spreadValues$9 = (a, b) => {
17
+ var __defProp$a = Object.defineProperty;
18
+ var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
19
+ var __hasOwnProp$a = Object.prototype.hasOwnProperty;
20
+ var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
21
+ var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
22
+ var __spreadValues$a = (a, b) => {
23
23
  for (var prop in b || (b = {}))
24
- if (__hasOwnProp$9.call(b, prop))
25
- __defNormalProp$9(a, prop, b[prop]);
26
- if (__getOwnPropSymbols$9)
27
- for (var prop of __getOwnPropSymbols$9(b)) {
28
- if (__propIsEnum$9.call(b, prop))
29
- __defNormalProp$9(a, prop, b[prop]);
24
+ if (__hasOwnProp$a.call(b, prop))
25
+ __defNormalProp$a(a, prop, b[prop]);
26
+ if (__getOwnPropSymbols$a)
27
+ for (var prop of __getOwnPropSymbols$a(b)) {
28
+ if (__propIsEnum$a.call(b, prop))
29
+ __defNormalProp$a(a, prop, b[prop]);
30
30
  }
31
31
  return a;
32
32
  };
33
33
  var __objRest$2 = (source, exclude) => {
34
34
  var target = {};
35
35
  for (var prop in source)
36
- if (__hasOwnProp$9.call(source, prop) && exclude.indexOf(prop) < 0)
36
+ if (__hasOwnProp$a.call(source, prop) && exclude.indexOf(prop) < 0)
37
37
  target[prop] = source[prop];
38
- if (source != null && __getOwnPropSymbols$9)
39
- for (var prop of __getOwnPropSymbols$9(source)) {
40
- if (exclude.indexOf(prop) < 0 && __propIsEnum$9.call(source, prop))
38
+ if (source != null && __getOwnPropSymbols$a)
39
+ for (var prop of __getOwnPropSymbols$a(source)) {
40
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$a.call(source, prop))
41
41
  target[prop] = source[prop];
42
42
  }
43
43
  return target;
44
44
  };
45
- const useStyles$v = createStyles((theme) => ({
45
+ const useStyles$w = createStyles((theme) => ({
46
46
  user: {
47
47
  display: "block",
48
48
  width: "100%",
@@ -53,8 +53,8 @@ const useStyles$v = createStyles((theme) => ({
53
53
  }));
54
54
  function UserButton(_a) {
55
55
  var _b = _a, { image, name, email, icon } = _b, others = __objRest$2(_b, ["image", "name", "email", "icon"]);
56
- const { classes } = useStyles$v();
57
- return /* @__PURE__ */ React.createElement(Group, __spreadValues$9({ className: classes.user }, others), /* @__PURE__ */ React.createElement(Avatar, { src: image, radius: "xl" }), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }, /* @__PURE__ */ React.createElement(Text, { size: "sm", weight: 500 }, name), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", size: "xs" }, email)));
56
+ const { classes } = useStyles$w();
57
+ return /* @__PURE__ */ React.createElement(Group, __spreadValues$a({ className: classes.user }, others), /* @__PURE__ */ React.createElement(Avatar, { src: image, radius: "xl" }), /* @__PURE__ */ React.createElement("div", { style: { flex: 1 } }, /* @__PURE__ */ React.createElement(Text, { size: "sm", weight: 500 }, name), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", size: "xs" }, email)));
58
58
  }
59
59
 
60
60
  const compact = (num) => {
@@ -64,7 +64,7 @@ const compact = (num) => {
64
64
  }).format(num || 0);
65
65
  };
66
66
 
67
- const useStyles$u = createStyles((theme, _params, getRef) => {
67
+ const useStyles$v = createStyles((theme, _params, getRef) => {
68
68
  const icon = getRef("icon");
69
69
  return {
70
70
  control: {
@@ -117,7 +117,7 @@ const useStyles$u = createStyles((theme, _params, getRef) => {
117
117
  };
118
118
  });
119
119
  function LinksGroup({ icon: Icon, href, label, initiallyOpened, links, active, notifications }) {
120
- const { classes, theme, cx } = useStyles$u();
120
+ const { classes, theme, cx } = useStyles$v();
121
121
  const hasLinks = Array.isArray(links) && links.length > 0;
122
122
  const hasActiveLinks = Array.isArray(links) && links.map((l) => !!active && active === `${label}/${l.label}`).reduce((a, b) => a || b, false);
123
123
  const [opened, setOpened] = useState(initiallyOpened || hasActiveLinks || false);
@@ -162,26 +162,26 @@ function LinksGroup({ icon: Icon, href, label, initiallyOpened, links, active, n
162
162
  ), hasLinks ? /* @__PURE__ */ React.createElement(Collapse, { in: opened }, items) : null);
163
163
  }
164
164
 
165
- var __defProp$8 = Object.defineProperty;
166
- var __defProps$5 = Object.defineProperties;
167
- var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
168
- var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
169
- var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
170
- var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
171
- var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
172
- var __spreadValues$8 = (a, b) => {
165
+ var __defProp$9 = Object.defineProperty;
166
+ var __defProps$6 = Object.defineProperties;
167
+ var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
168
+ var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
169
+ var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
170
+ var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
171
+ var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
172
+ var __spreadValues$9 = (a, b) => {
173
173
  for (var prop in b || (b = {}))
174
- if (__hasOwnProp$8.call(b, prop))
175
- __defNormalProp$8(a, prop, b[prop]);
176
- if (__getOwnPropSymbols$8)
177
- for (var prop of __getOwnPropSymbols$8(b)) {
178
- if (__propIsEnum$8.call(b, prop))
179
- __defNormalProp$8(a, prop, b[prop]);
174
+ if (__hasOwnProp$9.call(b, prop))
175
+ __defNormalProp$9(a, prop, b[prop]);
176
+ if (__getOwnPropSymbols$9)
177
+ for (var prop of __getOwnPropSymbols$9(b)) {
178
+ if (__propIsEnum$9.call(b, prop))
179
+ __defNormalProp$9(a, prop, b[prop]);
180
180
  }
181
181
  return a;
182
182
  };
183
- var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
184
- const useStyles$t = createStyles((theme, _params, getRef) => {
183
+ var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
184
+ const useStyles$u = createStyles((theme, _params, getRef) => {
185
185
  const icon = getRef("icon");
186
186
  return {
187
187
  navbar: {
@@ -212,7 +212,7 @@ const useStyles$t = createStyles((theme, _params, getRef) => {
212
212
  color: theme.colorScheme === "dark" ? theme.white : theme.black,
213
213
  borderBottom: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3]}`
214
214
  },
215
- link: __spreadProps$5(__spreadValues$8({}, theme.fn.focusStyles()), {
215
+ link: __spreadProps$6(__spreadValues$9({}, theme.fn.focusStyles()), {
216
216
  display: "flex",
217
217
  alignItems: "center",
218
218
  textDecoration: "none",
@@ -281,7 +281,7 @@ const TRIAL_PAGES = [
281
281
  "Badges"
282
282
  ];
283
283
  function Navbar(props) {
284
- const { classes, cx } = useStyles$t();
284
+ const { classes, cx } = useStyles$u();
285
285
  const [burgerOpen, setBurgerOpen] = React.useState(false);
286
286
  const toggle = () => setBurgerOpen(!burgerOpen);
287
287
  const links = data.map((item) => {
@@ -294,12 +294,12 @@ function Navbar(props) {
294
294
  }
295
295
  return /* @__PURE__ */ React.createElement(
296
296
  LinksGroup,
297
- __spreadProps$5(__spreadValues$8(__spreadValues$8({
297
+ __spreadProps$6(__spreadValues$9(__spreadValues$9({
298
298
  key: item.label,
299
299
  active: props.active
300
300
  }, item), context), {
301
301
  links: (item.links || []).map((link) => {
302
- return __spreadValues$8(__spreadValues$8({}, link), props.links[`${item.label}/${link.label}`] || { notifications: 0, href: "" });
302
+ return __spreadValues$9(__spreadValues$9({}, link), props.links[`${item.label}/${link.label}`] || { notifications: 0, href: "" });
303
303
  })
304
304
  })
305
305
  );
@@ -324,7 +324,7 @@ function Navbar(props) {
324
324
  } }, /* @__PURE__ */ React.createElement(IconLogout, { className: classes.linkIcon, stroke: 1.5 }), /* @__PURE__ */ React.createElement("span", null, "Logout"))))));
325
325
  }
326
326
 
327
- const useStyles$s = createStyles((theme) => ({
327
+ const useStyles$t = createStyles((theme) => ({
328
328
  inner: {
329
329
  paddingTop: theme.spacing.xl,
330
330
  paddingBottom: theme.spacing.xl * 4
@@ -360,7 +360,7 @@ const useStyles$s = createStyles((theme) => ({
360
360
  }
361
361
  }));
362
362
  const GettingStarted = (props) => {
363
- const { classes } = useStyles$s();
363
+ const { classes } = useStyles$t();
364
364
  return /* @__PURE__ */ React.createElement(
365
365
  Modal,
366
366
  {
@@ -374,7 +374,7 @@ const GettingStarted = (props) => {
374
374
  );
375
375
  };
376
376
 
377
- const useStyles$r = createStyles((theme) => ({
377
+ const useStyles$s = createStyles((theme) => ({
378
378
  title: {
379
379
  fontSize: 34,
380
380
  fontWeight: 900,
@@ -415,7 +415,7 @@ const useStyles$r = createStyles((theme) => ({
415
415
  }
416
416
  }));
417
417
  const SwitchAccount = (props) => {
418
- const { classes, theme } = useStyles$r();
418
+ const { classes, theme } = useStyles$s();
419
419
  const options = props.accounts.map((a) => {
420
420
  return /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: () => props.onClick && props.onClick(a.accountId), key: a.accountId, p: theme.spacing.md }, /* @__PURE__ */ React.createElement(Card, { withBorder: true, shadow: "md", radius: "md", className: classes.card, p: "xl" }, a.isAdmin && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(IconBatteryEco, { size: 50, stroke: 2, color: theme.fn.primaryColor() })), a.isGroupAdmin && !a.isAdmin && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(IconBooks, { size: 50, stroke: 2, color: theme.fn.primaryColor() })), !a.isAdmin && !a.isGroupAdmin && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(IconBackpack, { size: 50, stroke: 2, color: theme.fn.primaryColor() })), /* @__PURE__ */ React.createElement(Text, { size: "lg", weight: 500, className: classes.cardTitle, mt: "md" }, a.name), /* @__PURE__ */ React.createElement(Text, { size: "sm", color: "dimmed", mt: "sm" }, a.isAdmin ? "Admin" : a.isGroupAdmin ? "Educator" : "Student")));
421
421
  });
@@ -432,7 +432,7 @@ const SwitchAccount = (props) => {
432
432
  );
433
433
  };
434
434
 
435
- const useStyles$q = createStyles((theme) => ({
435
+ const useStyles$r = createStyles((theme) => ({
436
436
  root: {
437
437
  display: "flex",
438
438
  backgroundImage: `linear-gradient(-60deg, ${theme.colors[theme.primaryColor][4]} 0%, ${theme.colors[theme.primaryColor][7]} 100%)`,
@@ -476,7 +476,7 @@ const useStyles$q = createStyles((theme) => ({
476
476
  }
477
477
  }));
478
478
  const StatsGroup = ({ data, footer }) => {
479
- const { classes } = useStyles$q();
479
+ const { classes } = useStyles$r();
480
480
  const stats = data.map((stat) => {
481
481
  const value = (() => {
482
482
  if (stat.unit === "%") {
@@ -496,7 +496,7 @@ const Tabs = (props) => {
496
496
  return /* @__PURE__ */ React.createElement(Tabs$1, { value: props.value, onTabChange: props.onChange }, /* @__PURE__ */ React.createElement(Tabs$1.List, null, tabs));
497
497
  };
498
498
 
499
- const useStyles$p = createStyles((theme) => ({
499
+ const useStyles$q = createStyles((theme) => ({
500
500
  button: {
501
501
  borderTopRightRadius: 0,
502
502
  borderBottomRightRadius: 0,
@@ -511,7 +511,7 @@ const useStyles$p = createStyles((theme) => ({
511
511
  }
512
512
  }));
513
513
  const SplitButton$4 = (props) => {
514
- const { classes, theme } = useStyles$p();
514
+ const { classes, theme } = useStyles$q();
515
515
  theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
516
516
  return /* @__PURE__ */ React.createElement(Stack$4, { spacing: "sm" }, /* @__PURE__ */ React.createElement(
517
517
  Button,
@@ -539,7 +539,7 @@ const SplitButton$4 = (props) => {
539
539
  ));
540
540
  };
541
541
 
542
- const useStyles$o = createStyles((theme) => ({
542
+ const useStyles$p = createStyles((theme) => ({
543
543
  wrapper: {
544
544
  display: "flex",
545
545
  alignItems: "center",
@@ -590,7 +590,7 @@ const useStyles$o = createStyles((theme) => ({
590
590
  }
591
591
  }));
592
592
  const PlaceholderBanner = (props) => {
593
- const { classes } = useStyles$o();
593
+ const { classes } = useStyles$p();
594
594
  const title = props.title || "Nothing to display";
595
595
  const description = props.description || "We don't have anything to show you here just yet. Add data, check back later, or adjust your search.";
596
596
  return /* @__PURE__ */ React.createElement("div", { className: classes.wrapper }, /* @__PURE__ */ React.createElement("div", { className: classes.body }, /* @__PURE__ */ React.createElement(Title, { className: classes.title }, props.loading ? "Loading..." : title), /* @__PURE__ */ React.createElement(Text, { size: "sm", color: "dimmed" }, props.loading ? "Hold on, we're loading your data." : description)), /* @__PURE__ */ React.createElement(Image, { src: `https://cdn.localcivics.io/illustrations/${props.icon}.svg`, className: classes.image }));
@@ -662,7 +662,7 @@ function Table$i(props) {
662
662
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { verticalSpacing: "sm", sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("th", null, "Lesson Name"), /* @__PURE__ */ React.createElement("th", null, "Lesson Completion"))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
663
663
  }
664
664
 
665
- const useStyles$n = createStyles((theme) => ({
665
+ const useStyles$o = createStyles((theme) => ({
666
666
  title: {
667
667
  fontSize: 34,
668
668
  fontWeight: 900,
@@ -675,7 +675,7 @@ const useStyles$n = createStyles((theme) => ({
675
675
  }
676
676
  }));
677
677
  const Badge = (props) => {
678
- const { classes } = useStyles$n();
678
+ const { classes } = useStyles$o();
679
679
  const [tab, setTab] = useState("lessons");
680
680
  const numberOfStudents = props.students.length;
681
681
  const numberOfBadges = numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length : 0;
@@ -773,7 +773,7 @@ function Table$h(props) {
773
773
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { horizontalSpacing: 0, verticalSpacing: 0, sx: { minWidth: 700 } }, /* @__PURE__ */ React.createElement("tbody", null, rows)));
774
774
  }
775
775
 
776
- const useStyles$m = createStyles((theme) => ({
776
+ const useStyles$n = createStyles((theme) => ({
777
777
  title: {
778
778
  fontSize: 34,
779
779
  fontWeight: 900,
@@ -786,7 +786,7 @@ const useStyles$m = createStyles((theme) => ({
786
786
  }
787
787
  }));
788
788
  const Badges = (props) => {
789
- const { classes } = useStyles$m();
789
+ const { classes } = useStyles$n();
790
790
  return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(Badge$1, { variant: "filled", size: "lg" }, "Badges"), /* @__PURE__ */ React.createElement(Title, { order: 2, className: classes.title, mt: "md" }, "Badges and micro-credentials"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", className: classes.description, mt: "sm" }, "Key milestones that reflect skill development, micro-credentials, or academic progress"))), /* @__PURE__ */ React.createElement(
791
791
  Autocomplete,
792
792
  {
@@ -1056,7 +1056,7 @@ function useSortableData(items, config = { key: "", direction: null }) {
1056
1056
  return { items: sortedItems, requestSort, sortConfig };
1057
1057
  }
1058
1058
 
1059
- const useStyles$l = createStyles((theme) => ({
1059
+ const useStyles$m = createStyles((theme) => ({
1060
1060
  th: { padding: "0 !important" },
1061
1061
  control: {
1062
1062
  width: "100%",
@@ -1066,10 +1066,10 @@ const useStyles$l = createStyles((theme) => ({
1066
1066
  }
1067
1067
  }
1068
1068
  }));
1069
- function Th$1({ children, reversed, sorted, onSort }) {
1070
- const { classes } = useStyles$l();
1069
+ function Th$2({ children, reversed, sorted, onSort }) {
1070
+ const { classes } = useStyles$m();
1071
1071
  const Icon = sorted ? reversed ? IconChevronUp : IconChevronDown : IconSelector;
1072
- return /* @__PURE__ */ React.createElement("th", { className: classes.th }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: onSort, className: classes.control }, /* @__PURE__ */ React.createElement(Group, { position: "apart" }, /* @__PURE__ */ React.createElement(Text, { weight: 500, size: "sm" }, children), /* @__PURE__ */ React.createElement(Center, null, /* @__PURE__ */ React.createElement(Icon, { size: 14, stroke: 1.5 })))));
1072
+ return /* @__PURE__ */ React.createElement("th", { className: classes.th }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: onSort, className: classes.control }, /* @__PURE__ */ React.createElement(Group, { position: "apart", noWrap: true, spacing: "xs" }, /* @__PURE__ */ React.createElement(Text, { weight: 500, size: "sm", sx: { whiteSpace: "nowrap" } }, children), /* @__PURE__ */ React.createElement(Center, null, /* @__PURE__ */ React.createElement(Icon, { size: 14, stroke: 1.5 })))));
1073
1073
  }
1074
1074
  function Table$b(props) {
1075
1075
  const { items: sortedItems, requestSort, sortConfig } = useSortableData(props.items);
@@ -1102,7 +1102,7 @@ function Table$b(props) {
1102
1102
  }
1103
1103
  ))), /* @__PURE__ */ React.createElement("td", null, row.badgesEarned), /* @__PURE__ */ React.createElement("td", null, row.lessonsCompleted), /* @__PURE__ */ React.createElement("td", null, row.hasAccount && /* @__PURE__ */ React.createElement(IconCheck, { color: "green" })), /* @__PURE__ */ React.createElement("td", null, row.lastActivity ? relativeTimeFromDates(row.lastActivity) : ""), /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Group, { noWrap: true, spacing: 0, position: "right" }, !row.readonly && !!props.onDelete && /* @__PURE__ */ React.createElement(ActionIcon, { color: "red" }, /* @__PURE__ */ React.createElement(IconTrash, { onClick: () => openDeleteModal(row), size: 16, stroke: 1.5 }))))));
1104
1104
  return /* @__PURE__ */ React.createElement(ScrollArea, null, /* @__PURE__ */ React.createElement(Table$k, { verticalSpacing: 20, sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement(
1105
- Th$1,
1105
+ Th$2,
1106
1106
  {
1107
1107
  sorted: sortConfig.key === "givenName",
1108
1108
  reversed: sortConfig.direction === "desc",
@@ -1110,7 +1110,7 @@ function Table$b(props) {
1110
1110
  },
1111
1111
  "Name"
1112
1112
  ), /* @__PURE__ */ React.createElement(
1113
- Th$1,
1113
+ Th$2,
1114
1114
  {
1115
1115
  sorted: sortConfig.key === "isAdmin",
1116
1116
  reversed: sortConfig.direction === "desc",
@@ -1118,7 +1118,7 @@ function Table$b(props) {
1118
1118
  },
1119
1119
  "Role"
1120
1120
  ), /* @__PURE__ */ React.createElement(
1121
- Th$1,
1121
+ Th$2,
1122
1122
  {
1123
1123
  sorted: sortConfig.key === "badgesEarned",
1124
1124
  reversed: sortConfig.direction === "desc",
@@ -1126,7 +1126,7 @@ function Table$b(props) {
1126
1126
  },
1127
1127
  "Badges Earned"
1128
1128
  ), /* @__PURE__ */ React.createElement(
1129
- Th$1,
1129
+ Th$2,
1130
1130
  {
1131
1131
  sorted: sortConfig.key === "lessonsCompleted",
1132
1132
  reversed: sortConfig.direction === "desc",
@@ -1134,7 +1134,7 @@ function Table$b(props) {
1134
1134
  },
1135
1135
  "Lessons Completed"
1136
1136
  ), /* @__PURE__ */ React.createElement(
1137
- Th$1,
1137
+ Th$2,
1138
1138
  {
1139
1139
  sorted: sortConfig.key === "hasAccount",
1140
1140
  reversed: sortConfig.direction === "desc",
@@ -1142,7 +1142,7 @@ function Table$b(props) {
1142
1142
  },
1143
1143
  "Account Created?"
1144
1144
  ), /* @__PURE__ */ React.createElement(
1145
- Th$1,
1145
+ Th$2,
1146
1146
  {
1147
1147
  sorted: sortConfig.key === "lastActivity",
1148
1148
  reversed: sortConfig.direction === "desc",
@@ -1152,26 +1152,26 @@ function Table$b(props) {
1152
1152
  ), /* @__PURE__ */ React.createElement("th", null), " ")), /* @__PURE__ */ React.createElement("tbody", null, rows)));
1153
1153
  }
1154
1154
 
1155
- var __defProp$7 = Object.defineProperty;
1156
- var __defProps$4 = Object.defineProperties;
1157
- var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
1158
- var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
1159
- var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
1160
- var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
1161
- var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1162
- var __spreadValues$7 = (a, b) => {
1155
+ var __defProp$8 = Object.defineProperty;
1156
+ var __defProps$5 = Object.defineProperties;
1157
+ var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
1158
+ var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
1159
+ var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
1160
+ var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
1161
+ var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1162
+ var __spreadValues$8 = (a, b) => {
1163
1163
  for (var prop in b || (b = {}))
1164
- if (__hasOwnProp$7.call(b, prop))
1165
- __defNormalProp$7(a, prop, b[prop]);
1166
- if (__getOwnPropSymbols$7)
1167
- for (var prop of __getOwnPropSymbols$7(b)) {
1168
- if (__propIsEnum$7.call(b, prop))
1169
- __defNormalProp$7(a, prop, b[prop]);
1164
+ if (__hasOwnProp$8.call(b, prop))
1165
+ __defNormalProp$8(a, prop, b[prop]);
1166
+ if (__getOwnPropSymbols$8)
1167
+ for (var prop of __getOwnPropSymbols$8(b)) {
1168
+ if (__propIsEnum$8.call(b, prop))
1169
+ __defNormalProp$8(a, prop, b[prop]);
1170
1170
  }
1171
1171
  return a;
1172
1172
  };
1173
- var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
1174
- const useStyles$k = createStyles((theme) => ({
1173
+ var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
1174
+ const useStyles$l = createStyles((theme) => ({
1175
1175
  title: {
1176
1176
  fontSize: 34,
1177
1177
  fontWeight: 900,
@@ -1204,7 +1204,7 @@ const useStyles$k = createStyles((theme) => ({
1204
1204
  }
1205
1205
  }));
1206
1206
  const Class = (props) => {
1207
- const { classes } = useStyles$k();
1207
+ const { classes } = useStyles$l();
1208
1208
  const form = useForm({
1209
1209
  initialValues: {
1210
1210
  classId: "",
@@ -1236,27 +1236,27 @@ const Class = (props) => {
1236
1236
  padding: "xl",
1237
1237
  size: "xl"
1238
1238
  },
1239
- /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(DropzoneButton$1, __spreadProps$4(__spreadValues$7({}, props), { close: () => setOpened(false) })), /* @__PURE__ */ React.createElement(Divider, { label: "or", labelPosition: "center", my: "md", variant: "dashed" }), /* @__PURE__ */ React.createElement("form", { onSubmit: form.onSubmit(() => {
1239
+ /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(DropzoneButton$1, __spreadProps$5(__spreadValues$8({}, props), { close: () => setOpened(false) })), /* @__PURE__ */ React.createElement(Divider, { label: "or", labelPosition: "center", my: "md", variant: "dashed" }), /* @__PURE__ */ React.createElement("form", { onSubmit: form.onSubmit(() => {
1240
1240
  const values = form.values;
1241
1241
  form.reset();
1242
1242
  setOpened(false);
1243
1243
  props.onCreateMembers && props.onCreateMembers([values]);
1244
1244
  }) }, /* @__PURE__ */ React.createElement(Stack$4, null, /* @__PURE__ */ React.createElement(
1245
1245
  TextInput,
1246
- __spreadValues$7({
1246
+ __spreadValues$8({
1247
1247
  withAsterisk: true,
1248
1248
  label: "Email",
1249
1249
  placeholder: "Email"
1250
1250
  }, form.getInputProps("email"))
1251
1251
  ), /* @__PURE__ */ React.createElement(Group, { grow: true }, /* @__PURE__ */ React.createElement(
1252
1252
  TextInput,
1253
- __spreadValues$7({
1253
+ __spreadValues$8({
1254
1254
  label: "Given name",
1255
1255
  placeholder: "Given name"
1256
1256
  }, form.getInputProps("givenName"))
1257
1257
  ), /* @__PURE__ */ React.createElement(
1258
1258
  TextInput,
1259
- __spreadValues$7({
1259
+ __spreadValues$8({
1260
1260
  label: "Family name",
1261
1261
  placeholder: "Family name"
1262
1262
  }, form.getInputProps("familyName"))
@@ -1305,7 +1305,7 @@ const Class = (props) => {
1305
1305
  ))))));
1306
1306
  };
1307
1307
  const DropzoneButton$1 = (props) => {
1308
- const { classes, theme } = useStyles$k();
1308
+ const { classes, theme } = useStyles$l();
1309
1309
  const openRef = React.useRef(null);
1310
1310
  const [loading, setLoading] = React.useState(false);
1311
1311
  const onDrop = React.useCallback((acceptedFiles) => {
@@ -1351,7 +1351,7 @@ const DropzoneButton$1 = (props) => {
1351
1351
  } }, "Select file"));
1352
1352
  };
1353
1353
 
1354
- const useStyles$j = createStyles((theme) => ({
1354
+ const useStyles$k = createStyles((theme) => ({
1355
1355
  th: { padding: "0 !important" },
1356
1356
  control: {
1357
1357
  width: "100%",
@@ -1361,10 +1361,10 @@ const useStyles$j = createStyles((theme) => ({
1361
1361
  }
1362
1362
  }
1363
1363
  }));
1364
- function Th({ children, reversed, sorted, onSort }) {
1365
- const { classes } = useStyles$j();
1364
+ function Th$1({ children, reversed, sorted, onSort }) {
1365
+ const { classes } = useStyles$k();
1366
1366
  const Icon = sorted ? reversed ? IconChevronUp : IconChevronDown : IconSelector;
1367
- return /* @__PURE__ */ React.createElement("th", { className: classes.th }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: onSort, className: classes.control }, /* @__PURE__ */ React.createElement(Group, { position: "apart" }, /* @__PURE__ */ React.createElement(Text, { weight: 500, size: "sm" }, children), /* @__PURE__ */ React.createElement(Center, null, /* @__PURE__ */ React.createElement(Icon, { size: 14, stroke: 1.5 })))));
1367
+ return /* @__PURE__ */ React.createElement("th", { className: classes.th }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: onSort, className: classes.control }, /* @__PURE__ */ React.createElement(Group, { position: "apart", noWrap: true, spacing: "xs" }, /* @__PURE__ */ React.createElement(Text, { weight: 500, size: "sm", sx: { whiteSpace: "nowrap" } }, children), /* @__PURE__ */ React.createElement(Center, null, /* @__PURE__ */ React.createElement(Icon, { size: 14, stroke: 1.5 })))));
1368
1368
  }
1369
1369
  function Table$a(props) {
1370
1370
  const { items: sortedItems, requestSort, sortConfig } = useSortableData(props.items);
@@ -1389,7 +1389,7 @@ function Table$a(props) {
1389
1389
  });
1390
1390
  const rows = sortedItems.map((row) => /* @__PURE__ */ React.createElement("tr", { key: row.classId }, /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(UnstyledButton, { component: Link, to: row.href }, /* @__PURE__ */ React.createElement(Text, { size: 14 }, row.name))), /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Text, { size: 14 }, row.description)), /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Text, { size: 14 }, row.numberOfStudents || 0)), /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Group, { noWrap: true, spacing: 0, position: "right" }, /* @__PURE__ */ React.createElement(ActionIcon, { color: "red" }, /* @__PURE__ */ React.createElement(IconTrash, { onClick: () => openDeleteModal(row), size: 16, stroke: 1.5 }))))));
1391
1391
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { verticalSpacing: 20, sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement(
1392
- Th,
1392
+ Th$1,
1393
1393
  {
1394
1394
  sorted: sortConfig.key === "name",
1395
1395
  reversed: sortConfig.direction === "desc",
@@ -1397,7 +1397,7 @@ function Table$a(props) {
1397
1397
  },
1398
1398
  "Class Name"
1399
1399
  ), /* @__PURE__ */ React.createElement("th", { style: { padding: "7px 16px" } }, /* @__PURE__ */ React.createElement(Text, { weight: 500, size: "sm" }, "Description")), /* @__PURE__ */ React.createElement(
1400
- Th,
1400
+ Th$1,
1401
1401
  {
1402
1402
  sorted: sortConfig.key === "numberOfStudents",
1403
1403
  reversed: sortConfig.direction === "desc",
@@ -1407,23 +1407,23 @@ function Table$a(props) {
1407
1407
  ), /* @__PURE__ */ React.createElement("th", null))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
1408
1408
  }
1409
1409
 
1410
- var __defProp$6 = Object.defineProperty;
1411
- var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
1412
- var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
1413
- var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
1414
- var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1415
- var __spreadValues$6 = (a, b) => {
1410
+ var __defProp$7 = Object.defineProperty;
1411
+ var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
1412
+ var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
1413
+ var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
1414
+ var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1415
+ var __spreadValues$7 = (a, b) => {
1416
1416
  for (var prop in b || (b = {}))
1417
- if (__hasOwnProp$6.call(b, prop))
1418
- __defNormalProp$6(a, prop, b[prop]);
1419
- if (__getOwnPropSymbols$6)
1420
- for (var prop of __getOwnPropSymbols$6(b)) {
1421
- if (__propIsEnum$6.call(b, prop))
1422
- __defNormalProp$6(a, prop, b[prop]);
1417
+ if (__hasOwnProp$7.call(b, prop))
1418
+ __defNormalProp$7(a, prop, b[prop]);
1419
+ if (__getOwnPropSymbols$7)
1420
+ for (var prop of __getOwnPropSymbols$7(b)) {
1421
+ if (__propIsEnum$7.call(b, prop))
1422
+ __defNormalProp$7(a, prop, b[prop]);
1423
1423
  }
1424
1424
  return a;
1425
1425
  };
1426
- const useStyles$i = createStyles((theme) => ({
1426
+ const useStyles$j = createStyles((theme) => ({
1427
1427
  title: {
1428
1428
  fontSize: 34,
1429
1429
  fontWeight: 900,
@@ -1436,7 +1436,7 @@ const useStyles$i = createStyles((theme) => ({
1436
1436
  }
1437
1437
  }));
1438
1438
  const Classes = (props) => {
1439
- const { classes } = useStyles$i();
1439
+ const { classes } = useStyles$j();
1440
1440
  const form = useForm({
1441
1441
  initialValues: {
1442
1442
  classId: "",
@@ -1466,14 +1466,14 @@ const Classes = (props) => {
1466
1466
  props.onCreateClass && props.onCreateClass(values);
1467
1467
  }) }, /* @__PURE__ */ React.createElement(Stack$4, null, /* @__PURE__ */ React.createElement(
1468
1468
  TextInput,
1469
- __spreadValues$6({
1469
+ __spreadValues$7({
1470
1470
  withAsterisk: true,
1471
1471
  label: "Name",
1472
1472
  placeholder: "Class name"
1473
1473
  }, form.getInputProps("name"))
1474
1474
  ), /* @__PURE__ */ React.createElement(
1475
1475
  TextInput,
1476
- __spreadValues$6({
1476
+ __spreadValues$7({
1477
1477
  label: "Description",
1478
1478
  placeholder: "A class for my first period English students"
1479
1479
  }, form.getInputProps("description"))
@@ -1507,7 +1507,7 @@ const Classes = (props) => {
1507
1507
  ))))));
1508
1508
  };
1509
1509
 
1510
- const useStyles$h = createStyles((theme) => ({
1510
+ const useStyles$i = createStyles((theme) => ({
1511
1511
  title: {
1512
1512
  fontSize: 34,
1513
1513
  fontWeight: 900,
@@ -1521,7 +1521,7 @@ const useStyles$h = createStyles((theme) => ({
1521
1521
  }
1522
1522
  }));
1523
1523
  const UserInfo = (props) => {
1524
- const { classes } = useStyles$h();
1524
+ const { classes } = useStyles$i();
1525
1525
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Title, { className: classes.title }, props.name), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", className: classes.description, mt: "xs" }, props.impactStatement));
1526
1526
  };
1527
1527
 
@@ -1659,7 +1659,7 @@ const Student = (props) => {
1659
1659
  ))))));
1660
1660
  };
1661
1661
 
1662
- const useStyles$g = createStyles((theme, props) => {
1662
+ const useStyles$h = createStyles((theme, props) => {
1663
1663
  const from = props.from || "blue";
1664
1664
  const to = props.to || "green";
1665
1665
  return {
@@ -1687,7 +1687,7 @@ const useStyles$g = createStyles((theme, props) => {
1687
1687
  };
1688
1688
  });
1689
1689
  function CardGradient(props) {
1690
- const { classes } = useStyles$g(props);
1690
+ const { classes } = useStyles$h(props);
1691
1691
  const from = props.from || "blue";
1692
1692
  const to = props.to || "green";
1693
1693
  const icon = props.icon || /* @__PURE__ */ React.createElement(IconColorSwatch, { size: 28, stroke: 1.5 });
@@ -1703,35 +1703,35 @@ function CardGradient(props) {
1703
1703
  ), /* @__PURE__ */ React.createElement(Text, { size: "xl", weight: 500, mt: "md" }, props.title), /* @__PURE__ */ React.createElement(Text, { size: "sm", mt: "sm", color: "dimmed" }, props.description));
1704
1704
  }
1705
1705
 
1706
- var __defProp$5 = Object.defineProperty;
1707
- var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
1708
- var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
1709
- var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
1710
- var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1711
- var __spreadValues$5 = (a, b) => {
1706
+ var __defProp$6 = Object.defineProperty;
1707
+ var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
1708
+ var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
1709
+ var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
1710
+ var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1711
+ var __spreadValues$6 = (a, b) => {
1712
1712
  for (var prop in b || (b = {}))
1713
- if (__hasOwnProp$5.call(b, prop))
1714
- __defNormalProp$5(a, prop, b[prop]);
1715
- if (__getOwnPropSymbols$5)
1716
- for (var prop of __getOwnPropSymbols$5(b)) {
1717
- if (__propIsEnum$5.call(b, prop))
1718
- __defNormalProp$5(a, prop, b[prop]);
1713
+ if (__hasOwnProp$6.call(b, prop))
1714
+ __defNormalProp$6(a, prop, b[prop]);
1715
+ if (__getOwnPropSymbols$6)
1716
+ for (var prop of __getOwnPropSymbols$6(b)) {
1717
+ if (__propIsEnum$6.call(b, prop))
1718
+ __defNormalProp$6(a, prop, b[prop]);
1719
1719
  }
1720
1720
  return a;
1721
1721
  };
1722
1722
  var __objRest$1 = (source, exclude) => {
1723
1723
  var target = {};
1724
1724
  for (var prop in source)
1725
- if (__hasOwnProp$5.call(source, prop) && exclude.indexOf(prop) < 0)
1725
+ if (__hasOwnProp$6.call(source, prop) && exclude.indexOf(prop) < 0)
1726
1726
  target[prop] = source[prop];
1727
- if (source != null && __getOwnPropSymbols$5)
1728
- for (var prop of __getOwnPropSymbols$5(source)) {
1729
- if (exclude.indexOf(prop) < 0 && __propIsEnum$5.call(source, prop))
1727
+ if (source != null && __getOwnPropSymbols$6)
1728
+ for (var prop of __getOwnPropSymbols$6(source)) {
1729
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$6.call(source, prop))
1730
1730
  target[prop] = source[prop];
1731
1731
  }
1732
1732
  return target;
1733
1733
  };
1734
- const useStyles$f = createStyles((theme) => ({
1734
+ const useStyles$g = createStyles((theme) => ({
1735
1735
  card: {
1736
1736
  height: 240,
1737
1737
  backgroundSize: "cover",
@@ -1776,7 +1776,7 @@ const TenantBanner = (_a) => {
1776
1776
  "className",
1777
1777
  "code"
1778
1778
  ]);
1779
- const { classes, cx, theme } = useStyles$f();
1779
+ const { classes, cx, theme } = useStyles$g();
1780
1780
  const handleCopy = async () => {
1781
1781
  if (!code)
1782
1782
  return;
@@ -1793,9 +1793,9 @@ const TenantBanner = (_a) => {
1793
1793
  };
1794
1794
  return /* @__PURE__ */ React.createElement(
1795
1795
  Card,
1796
- __spreadValues$5({
1796
+ __spreadValues$6({
1797
1797
  radius: "md",
1798
- style: __spreadValues$5({ backgroundImage: `url(${image})` }, style),
1798
+ style: __spreadValues$6({ backgroundImage: `url(${image})` }, style),
1799
1799
  className: cx(classes.card, className)
1800
1800
  }, others),
1801
1801
  /* @__PURE__ */ React.createElement(
@@ -1893,7 +1893,7 @@ function Table$6(props) {
1893
1893
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { verticalSpacing: "sm", sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("th", null, "Student Name"), /* @__PURE__ */ React.createElement("th", null, "Reflection"), /* @__PURE__ */ React.createElement("th", null, "Rating"))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
1894
1894
  }
1895
1895
 
1896
- const useStyles$e = createStyles((theme) => ({
1896
+ const useStyles$f = createStyles((theme) => ({
1897
1897
  button: {
1898
1898
  borderTopRightRadius: 0,
1899
1899
  borderBottomRightRadius: 0,
@@ -1908,7 +1908,7 @@ const useStyles$e = createStyles((theme) => ({
1908
1908
  }
1909
1909
  }));
1910
1910
  const SplitButton$2 = (props) => {
1911
- const { classes, theme } = useStyles$e();
1911
+ const { classes, theme } = useStyles$f();
1912
1912
  theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
1913
1913
  return /* @__PURE__ */ React.createElement(Stack$4, { spacing: "sm" }, /* @__PURE__ */ React.createElement(
1914
1914
  Button,
@@ -2052,7 +2052,7 @@ function Stack$1(props) {
2052
2052
  }
2053
2053
  const truncateWithEllipses = (text, max) => text.substr(0, max - 1) + (text.length > max ? "&hellip;" : "");
2054
2054
 
2055
- const useStyles$d = createStyles((theme) => ({
2055
+ const useStyles$e = createStyles((theme) => ({
2056
2056
  title: {
2057
2057
  fontSize: 34,
2058
2058
  fontWeight: 900,
@@ -2065,7 +2065,7 @@ const useStyles$d = createStyles((theme) => ({
2065
2065
  }
2066
2066
  }));
2067
2067
  const Lesson = (props) => {
2068
- const { classes } = useStyles$d();
2068
+ const { classes } = useStyles$e();
2069
2069
  const [tab, setTab] = useState("question");
2070
2070
  const numberOfStudents = props.students.length;
2071
2071
  const numberOfLessons = numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length : 0;
@@ -2209,7 +2209,7 @@ function Table$4(props) {
2209
2209
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { horizontalSpacing: 0, verticalSpacing: 0, sx: { minWidth: 700 } }, /* @__PURE__ */ React.createElement("tbody", null, rows)));
2210
2210
  }
2211
2211
 
2212
- const useStyles$c = createStyles((theme) => ({
2212
+ const useStyles$d = createStyles((theme) => ({
2213
2213
  title: {
2214
2214
  fontSize: 34,
2215
2215
  fontWeight: 900,
@@ -2222,7 +2222,7 @@ const useStyles$c = createStyles((theme) => ({
2222
2222
  }
2223
2223
  }));
2224
2224
  const Lessons = (props) => {
2225
- const { classes } = useStyles$c();
2225
+ const { classes } = useStyles$d();
2226
2226
  return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(Badge$1, { variant: "filled", size: "lg" }, "Lessons"), /* @__PURE__ */ React.createElement(Title, { order: 2, className: classes.title, mt: "md" }, "Lessons"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", className: classes.description, mt: "sm" }, "Bite-sized activities and learning experiences accelerating students achievement"))), /* @__PURE__ */ React.createElement(
2227
2227
  Autocomplete,
2228
2228
  {
@@ -2239,7 +2239,7 @@ const Lessons = (props) => {
2239
2239
  ))));
2240
2240
  };
2241
2241
 
2242
- const useStyles$b = createStyles((theme) => ({
2242
+ const useStyles$c = createStyles((theme) => ({
2243
2243
  title: {
2244
2244
  fontSize: 22,
2245
2245
  fontWeight: 900,
@@ -2258,7 +2258,7 @@ const useStyles$b = createStyles((theme) => ({
2258
2258
  }
2259
2259
  }));
2260
2260
  function AccessCode(props) {
2261
- const { classes } = useStyles$b();
2261
+ const { classes } = useStyles$c();
2262
2262
  return /* @__PURE__ */ React.createElement(Container, { mx: "0", px: "0", size: 460, my: 30 }, /* @__PURE__ */ React.createElement(Title, { className: classes.title }, "Access code"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", size: "sm" }, "Grant access to join your organization"), /* @__PURE__ */ React.createElement(Paper, { withBorder: true, shadow: "md", p: 30, radius: "md", mt: "xl" }, /* @__PURE__ */ React.createElement(TextInput, { value: props.value, readOnly: true }), /* @__PURE__ */ React.createElement(Group, { position: "apart", mt: "lg", className: classes.controls }, /* @__PURE__ */ React.createElement(
2263
2263
  Anchor,
2264
2264
  {
@@ -2286,7 +2286,7 @@ const monthNames = [
2286
2286
  "November",
2287
2287
  "December"
2288
2288
  ];
2289
- const useStyles$a = createStyles((theme) => ({
2289
+ const useStyles$b = createStyles((theme) => ({
2290
2290
  title: {
2291
2291
  fontSize: 34,
2292
2292
  fontWeight: 900,
@@ -2316,7 +2316,7 @@ const useStyles$a = createStyles((theme) => ({
2316
2316
  }
2317
2317
  }));
2318
2318
  const Organization = (props) => {
2319
- const { classes } = useStyles$a();
2319
+ const { classes } = useStyles$b();
2320
2320
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
2321
2321
  Badge$1,
2322
2322
  {
@@ -2342,7 +2342,7 @@ const Organization = (props) => {
2342
2342
  ] }))))));
2343
2343
  };
2344
2344
 
2345
- const useStyles$9 = createStyles((theme) => ({
2345
+ const useStyles$a = createStyles((theme) => ({
2346
2346
  button: {
2347
2347
  borderTopRightRadius: 0,
2348
2348
  borderBottomRightRadius: 0,
@@ -2357,7 +2357,7 @@ const useStyles$9 = createStyles((theme) => ({
2357
2357
  }
2358
2358
  }));
2359
2359
  const SplitButton$1 = (props) => {
2360
- const { classes, theme } = useStyles$9();
2360
+ const { classes, theme } = useStyles$a();
2361
2361
  const menuIconColor = theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
2362
2362
  const hasMenu = !!props.withOrganizationLink;
2363
2363
  return /* @__PURE__ */ React.createElement(Group, { noWrap: true, spacing: 0 }, /* @__PURE__ */ React.createElement(
@@ -2419,26 +2419,26 @@ function Table$3(props) {
2419
2419
  return /* @__PURE__ */ React.createElement(ScrollArea, null, /* @__PURE__ */ React.createElement(Table$k, { verticalSpacing: 20, sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("th", null, "Name"), /* @__PURE__ */ React.createElement("th", null, "Role"), /* @__PURE__ */ React.createElement("th", null, "Account Created?"), /* @__PURE__ */ React.createElement("th", null, "# of Classes"), /* @__PURE__ */ React.createElement("th", null, "Last Active"), /* @__PURE__ */ React.createElement("th", null))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
2420
2420
  }
2421
2421
 
2422
- var __defProp$4 = Object.defineProperty;
2423
- var __defProps$3 = Object.defineProperties;
2424
- var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
2425
- var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
2426
- var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
2427
- var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
2428
- var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2429
- var __spreadValues$4 = (a, b) => {
2422
+ var __defProp$5 = Object.defineProperty;
2423
+ var __defProps$4 = Object.defineProperties;
2424
+ var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
2425
+ var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
2426
+ var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
2427
+ var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
2428
+ var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2429
+ var __spreadValues$5 = (a, b) => {
2430
2430
  for (var prop in b || (b = {}))
2431
- if (__hasOwnProp$4.call(b, prop))
2432
- __defNormalProp$4(a, prop, b[prop]);
2433
- if (__getOwnPropSymbols$4)
2434
- for (var prop of __getOwnPropSymbols$4(b)) {
2435
- if (__propIsEnum$4.call(b, prop))
2436
- __defNormalProp$4(a, prop, b[prop]);
2431
+ if (__hasOwnProp$5.call(b, prop))
2432
+ __defNormalProp$5(a, prop, b[prop]);
2433
+ if (__getOwnPropSymbols$5)
2434
+ for (var prop of __getOwnPropSymbols$5(b)) {
2435
+ if (__propIsEnum$5.call(b, prop))
2436
+ __defNormalProp$5(a, prop, b[prop]);
2437
2437
  }
2438
2438
  return a;
2439
2439
  };
2440
- var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
2441
- const useStyles$8 = createStyles((theme) => ({
2440
+ var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
2441
+ const useStyles$9 = createStyles((theme) => ({
2442
2442
  title: {
2443
2443
  fontSize: 34,
2444
2444
  fontWeight: 900,
@@ -2468,7 +2468,7 @@ const useStyles$8 = createStyles((theme) => ({
2468
2468
  }
2469
2469
  }));
2470
2470
  const People = (props) => {
2471
- const { classes } = useStyles$8();
2471
+ const { classes } = useStyles$9();
2472
2472
  const form = useForm({
2473
2473
  initialValues: {
2474
2474
  userId: "",
@@ -2499,27 +2499,27 @@ const People = (props) => {
2499
2499
  padding: "xl",
2500
2500
  size: "xl"
2501
2501
  },
2502
- /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(DropzoneButton, __spreadProps$3(__spreadValues$4({}, props), { close: () => setOpened(false) })), /* @__PURE__ */ React.createElement(Divider, { label: "or", labelPosition: "center", my: "md", variant: "dashed" }), /* @__PURE__ */ React.createElement("form", { onSubmit: form.onSubmit(() => {
2502
+ /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(DropzoneButton, __spreadProps$4(__spreadValues$5({}, props), { close: () => setOpened(false) })), /* @__PURE__ */ React.createElement(Divider, { label: "or", labelPosition: "center", my: "md", variant: "dashed" }), /* @__PURE__ */ React.createElement("form", { onSubmit: form.onSubmit(() => {
2503
2503
  const values = form.values;
2504
2504
  form.reset();
2505
2505
  setOpened(false);
2506
2506
  props.onCreateUsers && props.onCreateUsers([values]);
2507
2507
  }) }, /* @__PURE__ */ React.createElement(Stack$4, null, /* @__PURE__ */ React.createElement(
2508
2508
  TextInput,
2509
- __spreadValues$4({
2509
+ __spreadValues$5({
2510
2510
  withAsterisk: true,
2511
2511
  label: "Email",
2512
2512
  placeholder: "Email"
2513
2513
  }, form.getInputProps("email"))
2514
2514
  ), /* @__PURE__ */ React.createElement(Group, { grow: true }, /* @__PURE__ */ React.createElement(
2515
2515
  TextInput,
2516
- __spreadValues$4({
2516
+ __spreadValues$5({
2517
2517
  label: "Given name",
2518
2518
  placeholder: "Given name"
2519
2519
  }, form.getInputProps("givenName"))
2520
2520
  ), /* @__PURE__ */ React.createElement(
2521
2521
  TextInput,
2522
- __spreadValues$4({
2522
+ __spreadValues$5({
2523
2523
  label: "Family name",
2524
2524
  placeholder: "Family name"
2525
2525
  }, form.getInputProps("familyName"))
@@ -2572,7 +2572,7 @@ const People = (props) => {
2572
2572
  ))))));
2573
2573
  };
2574
2574
  const DropzoneButton = (props) => {
2575
- const { classes, theme } = useStyles$8();
2575
+ const { classes, theme } = useStyles$9();
2576
2576
  const openRef = React.useRef(null);
2577
2577
  const [loading, setLoading] = React.useState(false);
2578
2578
  const onDrop = React.useCallback((acceptedFiles) => {
@@ -2618,7 +2618,7 @@ const DropzoneButton = (props) => {
2618
2618
  } }, "Select file"));
2619
2619
  };
2620
2620
 
2621
- const useStyles$7 = createStyles((theme) => ({
2621
+ const useStyles$8 = createStyles((theme) => ({
2622
2622
  form: {
2623
2623
  backgroundColor: theme.white,
2624
2624
  padding: theme.spacing.xl,
@@ -2681,7 +2681,7 @@ const useStyles$7 = createStyles((theme) => ({
2681
2681
  }
2682
2682
  }));
2683
2683
  const StartAnonymousLesson = (props) => {
2684
- const { classes } = useStyles$7();
2684
+ const { classes } = useStyles$8();
2685
2685
  const [name, setName] = React.useState("");
2686
2686
  return /* @__PURE__ */ React.createElement("div", { className: classes.wrapper }, /* @__PURE__ */ React.createElement(Container, null, /* @__PURE__ */ React.createElement(SimpleGrid, { maw: 960, cols: 2, spacing: 15, breakpoints: [{ maxWidth: "sm", cols: 1 }] }, /* @__PURE__ */ React.createElement("div", { className: classes.content }, /* @__PURE__ */ React.createElement(Badge$1, { color: "violet" }, "Community"), /* @__PURE__ */ React.createElement(Title, { className: classes.title }, props.title), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", mt: "md" }, props.description), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", mt: "md" }, "You are now part of ", `${props.educatorName}'s`, " Class")), /* @__PURE__ */ React.createElement("div", { className: classes.form }, /* @__PURE__ */ React.createElement(
2687
2687
  TextInput,
@@ -2705,24 +2705,24 @@ const StartAnonymousLesson = (props) => {
2705
2705
  ))))));
2706
2706
  };
2707
2707
 
2708
- var __defProp$3 = Object.defineProperty;
2709
- var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
2710
- var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
2711
- var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
2712
- var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2713
- var __spreadValues$3 = (a, b) => {
2708
+ var __defProp$4 = Object.defineProperty;
2709
+ var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
2710
+ var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
2711
+ var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
2712
+ var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2713
+ var __spreadValues$4 = (a, b) => {
2714
2714
  for (var prop in b || (b = {}))
2715
- if (__hasOwnProp$3.call(b, prop))
2716
- __defNormalProp$3(a, prop, b[prop]);
2717
- if (__getOwnPropSymbols$3)
2718
- for (var prop of __getOwnPropSymbols$3(b)) {
2719
- if (__propIsEnum$3.call(b, prop))
2720
- __defNormalProp$3(a, prop, b[prop]);
2715
+ if (__hasOwnProp$4.call(b, prop))
2716
+ __defNormalProp$4(a, prop, b[prop]);
2717
+ if (__getOwnPropSymbols$4)
2718
+ for (var prop of __getOwnPropSymbols$4(b)) {
2719
+ if (__propIsEnum$4.call(b, prop))
2720
+ __defNormalProp$4(a, prop, b[prop]);
2721
2721
  }
2722
2722
  return a;
2723
2723
  };
2724
2724
  const BadgeGrid = (props) => {
2725
- const badges = props.badges.map((b) => /* @__PURE__ */ React.createElement(TaskCard, __spreadValues$3({ key: b.title }, b)));
2725
+ const badges = props.badges.map((b) => /* @__PURE__ */ React.createElement(TaskCard, __spreadValues$4({ key: b.title }, b)));
2726
2726
  return /* @__PURE__ */ React.createElement(SimpleGrid, { cols: 4, breakpoints: [{ maxWidth: "sm", cols: 1 }, { maxWidth: "md", cols: 3 }] }, badges);
2727
2727
  };
2728
2728
  function TaskCard(props) {
@@ -2738,7 +2738,7 @@ function TaskCard(props) {
2738
2738
  ));
2739
2739
  }
2740
2740
 
2741
- const useStyles$6 = createStyles((theme) => ({
2741
+ const useStyles$7 = createStyles((theme) => ({
2742
2742
  action: {
2743
2743
  backgroundColor: "inherit",
2744
2744
  ":hover": {
@@ -2757,7 +2757,7 @@ const useStyles$6 = createStyles((theme) => ({
2757
2757
  }
2758
2758
  }));
2759
2759
  const TrialHome = (props) => {
2760
- const { classes } = useStyles$6();
2760
+ const { classes } = useStyles$7();
2761
2761
  return /* @__PURE__ */ React.createElement(Container, { size: "lg" }, /* @__PURE__ */ React.createElement(Badge$1, null, props.daysRemaining, " day", props.daysRemaining !== 1 ? "s" : "", " left"), /* @__PURE__ */ React.createElement(
2762
2762
  Button,
2763
2763
  {
@@ -2786,38 +2786,38 @@ const TrialHome = (props) => {
2786
2786
  )), /* @__PURE__ */ React.createElement(Title, { maw: 500, mb: 20, mt: 20, className: classes.title }, "Based on the tags you selected, check out these lessons to get started with your students!"), /* @__PURE__ */ React.createElement(BadgeGrid, { onAssign: props.onAssign, badges: props.badges })));
2787
2787
  };
2788
2788
 
2789
- var __defProp$2 = Object.defineProperty;
2790
- var __defProps$2 = Object.defineProperties;
2791
- var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
2792
- var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
2793
- var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
2794
- var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
2795
- var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2796
- var __spreadValues$2 = (a, b) => {
2789
+ var __defProp$3 = Object.defineProperty;
2790
+ var __defProps$3 = Object.defineProperties;
2791
+ var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
2792
+ var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
2793
+ var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
2794
+ var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
2795
+ var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2796
+ var __spreadValues$3 = (a, b) => {
2797
2797
  for (var prop in b || (b = {}))
2798
- if (__hasOwnProp$2.call(b, prop))
2799
- __defNormalProp$2(a, prop, b[prop]);
2800
- if (__getOwnPropSymbols$2)
2801
- for (var prop of __getOwnPropSymbols$2(b)) {
2802
- if (__propIsEnum$2.call(b, prop))
2803
- __defNormalProp$2(a, prop, b[prop]);
2798
+ if (__hasOwnProp$3.call(b, prop))
2799
+ __defNormalProp$3(a, prop, b[prop]);
2800
+ if (__getOwnPropSymbols$3)
2801
+ for (var prop of __getOwnPropSymbols$3(b)) {
2802
+ if (__propIsEnum$3.call(b, prop))
2803
+ __defNormalProp$3(a, prop, b[prop]);
2804
2804
  }
2805
2805
  return a;
2806
2806
  };
2807
- var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
2807
+ var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
2808
2808
  var __objRest = (source, exclude) => {
2809
2809
  var target = {};
2810
2810
  for (var prop in source)
2811
- if (__hasOwnProp$2.call(source, prop) && exclude.indexOf(prop) < 0)
2811
+ if (__hasOwnProp$3.call(source, prop) && exclude.indexOf(prop) < 0)
2812
2812
  target[prop] = source[prop];
2813
- if (source != null && __getOwnPropSymbols$2)
2814
- for (var prop of __getOwnPropSymbols$2(source)) {
2815
- if (exclude.indexOf(prop) < 0 && __propIsEnum$2.call(source, prop))
2813
+ if (source != null && __getOwnPropSymbols$3)
2814
+ for (var prop of __getOwnPropSymbols$3(source)) {
2815
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$3.call(source, prop))
2816
2816
  target[prop] = source[prop];
2817
2817
  }
2818
2818
  return target;
2819
2819
  };
2820
- const useStyles$5 = createStyles((theme, { checked }) => ({
2820
+ const useStyles$6 = createStyles((theme, { checked }) => ({
2821
2821
  button: {
2822
2822
  display: "flex",
2823
2823
  alignItems: "center",
@@ -2859,10 +2859,10 @@ function ImageCheckbox(_a) {
2859
2859
  finalValue: false,
2860
2860
  onChange
2861
2861
  });
2862
- const { classes, cx } = useStyles$5({ checked: value });
2862
+ const { classes, cx } = useStyles$6({ checked: value });
2863
2863
  return /* @__PURE__ */ React.createElement(
2864
2864
  UnstyledButton,
2865
- __spreadProps$2(__spreadValues$2({}, others), {
2865
+ __spreadProps$3(__spreadValues$3({}, others), {
2866
2866
  onClick: () => handleChange(!value),
2867
2867
  className: cx(classes.button, className)
2868
2868
  }),
@@ -2883,7 +2883,7 @@ function ImageCheckbox(_a) {
2883
2883
  function SelectGrid(props) {
2884
2884
  const items = props.items.map((item) => /* @__PURE__ */ React.createElement(
2885
2885
  ImageCheckbox,
2886
- __spreadProps$2(__spreadValues$2({}, item), {
2886
+ __spreadProps$3(__spreadValues$3({}, item), {
2887
2887
  key: item.title,
2888
2888
  onChange: (checked) => props.onChange(item.title, checked)
2889
2889
  })
@@ -2901,26 +2901,26 @@ function SelectGrid(props) {
2901
2901
  );
2902
2902
  }
2903
2903
 
2904
- var __defProp$1 = Object.defineProperty;
2905
- var __defProps$1 = Object.defineProperties;
2906
- var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
2907
- var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
2908
- var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
2909
- var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
2910
- var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2911
- var __spreadValues$1 = (a, b) => {
2904
+ var __defProp$2 = Object.defineProperty;
2905
+ var __defProps$2 = Object.defineProperties;
2906
+ var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
2907
+ var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
2908
+ var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
2909
+ var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
2910
+ var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2911
+ var __spreadValues$2 = (a, b) => {
2912
2912
  for (var prop in b || (b = {}))
2913
- if (__hasOwnProp$1.call(b, prop))
2914
- __defNormalProp$1(a, prop, b[prop]);
2915
- if (__getOwnPropSymbols$1)
2916
- for (var prop of __getOwnPropSymbols$1(b)) {
2917
- if (__propIsEnum$1.call(b, prop))
2918
- __defNormalProp$1(a, prop, b[prop]);
2913
+ if (__hasOwnProp$2.call(b, prop))
2914
+ __defNormalProp$2(a, prop, b[prop]);
2915
+ if (__getOwnPropSymbols$2)
2916
+ for (var prop of __getOwnPropSymbols$2(b)) {
2917
+ if (__propIsEnum$2.call(b, prop))
2918
+ __defNormalProp$2(a, prop, b[prop]);
2919
2919
  }
2920
2920
  return a;
2921
2921
  };
2922
- var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
2923
- const useStyles$4 = createStyles((theme) => ({
2922
+ var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
2923
+ const useStyles$5 = createStyles((theme) => ({
2924
2924
  wrapper: {
2925
2925
  minHeight: "100%",
2926
2926
  boxSizing: "border-box",
@@ -2983,7 +2983,7 @@ const OPTIONS = [
2983
2983
  { description: "project-based learning", title: "Project-Based Learning", icon: IconTools }
2984
2984
  ];
2985
2985
  const TrialRegistration = (props) => {
2986
- const { classes } = useStyles$4();
2986
+ const { classes } = useStyles$5();
2987
2987
  const [firstName, setFirstName] = React.useState("");
2988
2988
  const [lastName, setLastName] = React.useState("");
2989
2989
  const [organization, setOrganization] = React.useState({ organizationId: "", displayName: "" });
@@ -3029,7 +3029,7 @@ const TrialRegistration = (props) => {
3029
3029
  label: "School/Organization Name",
3030
3030
  placeholder: "What's the name of your school?",
3031
3031
  data: props.organizations.map((o) => {
3032
- return __spreadProps$1(__spreadValues$1({}, o), { value: o.displayName });
3032
+ return __spreadProps$2(__spreadValues$2({}, o), { value: o.displayName });
3033
3033
  }),
3034
3034
  onItemSubmit: (item) => setOrganization({ organizationId: item.organizationId, displayName: item.displayName }),
3035
3035
  onChange: (next) => {
@@ -3041,7 +3041,7 @@ const TrialRegistration = (props) => {
3041
3041
  SelectGrid,
3042
3042
  {
3043
3043
  items: OPTIONS,
3044
- onChange: (e, checked) => setInterests(__spreadProps$1(__spreadValues$1({}, interests), { [e]: checked }))
3044
+ onChange: (e, checked) => setInterests(__spreadProps$2(__spreadValues$2({}, interests), { [e]: checked }))
3045
3045
  }
3046
3046
  ), /* @__PURE__ */ React.createElement(Group, { position: "right", mt: "md" }, /* @__PURE__ */ React.createElement(
3047
3047
  Button,
@@ -3079,26 +3079,26 @@ const AdminProvider = (props) => {
3079
3079
  );
3080
3080
  };
3081
3081
 
3082
- var __defProp = Object.defineProperty;
3083
- var __defProps = Object.defineProperties;
3084
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
3085
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3086
- var __hasOwnProp = Object.prototype.hasOwnProperty;
3087
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
3088
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3089
- var __spreadValues = (a, b) => {
3082
+ var __defProp$1 = Object.defineProperty;
3083
+ var __defProps$1 = Object.defineProperties;
3084
+ var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
3085
+ var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
3086
+ var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
3087
+ var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
3088
+ var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3089
+ var __spreadValues$1 = (a, b) => {
3090
3090
  for (var prop in b || (b = {}))
3091
- if (__hasOwnProp.call(b, prop))
3092
- __defNormalProp(a, prop, b[prop]);
3093
- if (__getOwnPropSymbols)
3094
- for (var prop of __getOwnPropSymbols(b)) {
3095
- if (__propIsEnum.call(b, prop))
3096
- __defNormalProp(a, prop, b[prop]);
3091
+ if (__hasOwnProp$1.call(b, prop))
3092
+ __defNormalProp$1(a, prop, b[prop]);
3093
+ if (__getOwnPropSymbols$1)
3094
+ for (var prop of __getOwnPropSymbols$1(b)) {
3095
+ if (__propIsEnum$1.call(b, prop))
3096
+ __defNormalProp$1(a, prop, b[prop]);
3097
3097
  }
3098
3098
  return a;
3099
3099
  };
3100
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
3101
- const useStyles$3 = createStyles((theme, props) => ({
3100
+ var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
3101
+ const useStyles$4 = createStyles((theme, props) => ({
3102
3102
  footer: {
3103
3103
  paddingTop: theme.spacing.md,
3104
3104
  paddingBottom: theme.spacing.md,
@@ -3185,7 +3185,7 @@ const useStyles$3 = createStyles((theme, props) => ({
3185
3185
  }
3186
3186
  }));
3187
3187
  const App = (props) => {
3188
- const { classes } = useStyles$3(props);
3188
+ const { classes } = useStyles$4(props);
3189
3189
  const account = useAccount(props.account, props.accounts, props.onAccountChange);
3190
3190
  return /* @__PURE__ */ React.createElement(
3191
3191
  AppShell,
@@ -3193,7 +3193,7 @@ const App = (props) => {
3193
3193
  padding: "xs",
3194
3194
  navbar: props.navbar && /* @__PURE__ */ React.createElement(
3195
3195
  Navbar,
3196
- __spreadProps(__spreadValues({}, props.navbar.props), {
3196
+ __spreadProps$1(__spreadValues$1({}, props.navbar.props), {
3197
3197
  onSwitchAccounts: account.accounts && account.accounts.length > 1 ? () => account.setChangeModalOpen(true) : void 0
3198
3198
  })
3199
3199
  ),
@@ -3312,7 +3312,7 @@ function Table$2(props) {
3312
3312
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { horizontalSpacing: 0, verticalSpacing: 0, sx: { minWidth: 700 } }, /* @__PURE__ */ React.createElement("tbody", null, rows)));
3313
3313
  }
3314
3314
 
3315
- const useStyles$2 = createStyles((theme) => ({
3315
+ const useStyles$3 = createStyles((theme) => ({
3316
3316
  title: {
3317
3317
  fontSize: 34,
3318
3318
  fontWeight: 900,
@@ -3325,7 +3325,7 @@ const useStyles$2 = createStyles((theme) => ({
3325
3325
  }
3326
3326
  }));
3327
3327
  const Pathways = (props) => {
3328
- const { classes } = useStyles$2();
3328
+ const { classes } = useStyles$3();
3329
3329
  return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$4, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(Badge$1, { variant: "filled", size: "lg" }, "Pathways"), /* @__PURE__ */ React.createElement(Title, { order: 2, className: classes.title, mt: "md" }, "Pathways"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", className: classes.description, mt: "sm" }, "Explore all your unique pathway requirements in one clear space"))), /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(LoadingOverlay, { visible: props.loading, overlayBlur: 2 }), /* @__PURE__ */ React.createElement(
3330
3330
  Table$2,
3331
3331
  {
@@ -3335,7 +3335,7 @@ const Pathways = (props) => {
3335
3335
  ))));
3336
3336
  };
3337
3337
 
3338
- const useStyles$1 = createStyles((theme) => ({
3338
+ const useStyles$2 = createStyles((theme) => ({
3339
3339
  button: {
3340
3340
  borderTopRightRadius: 0,
3341
3341
  borderBottomRightRadius: 0,
@@ -3350,7 +3350,7 @@ const useStyles$1 = createStyles((theme) => ({
3350
3350
  }
3351
3351
  }));
3352
3352
  const SplitButton = (props) => {
3353
- const { classes, theme } = useStyles$1();
3353
+ const { classes, theme } = useStyles$2();
3354
3354
  theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
3355
3355
  return /* @__PURE__ */ React.createElement(Stack$4, { spacing: "sm" }, /* @__PURE__ */ React.createElement(
3356
3356
  Button,
@@ -3386,7 +3386,32 @@ function Stack(props) {
3386
3386
  return /* @__PURE__ */ React.createElement(Grid, { grow: true, gutter: "lg", sx: { padding: 20, minWidth: 700 } }, rows);
3387
3387
  }
3388
3388
 
3389
+ var __defProp = Object.defineProperty;
3390
+ var __defProps = Object.defineProperties;
3391
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
3392
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3393
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
3394
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
3395
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3396
+ var __spreadValues = (a, b) => {
3397
+ for (var prop in b || (b = {}))
3398
+ if (__hasOwnProp.call(b, prop))
3399
+ __defNormalProp(a, prop, b[prop]);
3400
+ if (__getOwnPropSymbols)
3401
+ for (var prop of __getOwnPropSymbols(b)) {
3402
+ if (__propIsEnum.call(b, prop))
3403
+ __defNormalProp(a, prop, b[prop]);
3404
+ }
3405
+ return a;
3406
+ };
3407
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
3389
3408
  function Table$1(props) {
3409
+ const preparedItems = React.useMemo(() => {
3410
+ return props.items.map((item) => __spreadValues(__spreadProps(__spreadValues({}, item), {
3411
+ status: item.isComplete
3412
+ }), item.categoryPoints));
3413
+ }, [props.items]);
3414
+ const { items: sortedItems, requestSort, sortConfig } = useSortableData(preparedItems);
3390
3415
  if (props.items.length === 0) {
3391
3416
  return /* @__PURE__ */ React.createElement(
3392
3417
  PlaceholderBanner,
@@ -3398,6 +3423,10 @@ function Table$1(props) {
3398
3423
  }
3399
3424
  );
3400
3425
  }
3426
+ const sortStatus = {
3427
+ columnAccessor: sortConfig.key,
3428
+ direction: sortConfig.direction === "desc" ? "desc" : "asc"
3429
+ };
3401
3430
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(
3402
3431
  DataTable,
3403
3432
  {
@@ -3408,24 +3437,33 @@ function Table$1(props) {
3408
3437
  withColumnBorders: true,
3409
3438
  striped: true,
3410
3439
  highlightOnHover: true,
3411
- records: props.items,
3440
+ records: sortedItems,
3412
3441
  idAccessor: "userId",
3442
+ sortStatus,
3443
+ onSortStatusChange: (status) => requestSort(status.columnAccessor),
3413
3444
  columns: [
3414
3445
  {
3415
3446
  accessor: "name",
3416
3447
  title: "Student Name",
3417
- render: (row) => /* @__PURE__ */ React.createElement(Group, { spacing: "sm" }, /* @__PURE__ */ React.createElement(Avatar, { size: 40, src: row.avatar, radius: 40 }), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Text, { size: "sm", weight: 500 }, row.name), /* @__PURE__ */ React.createElement(Text, { size: "xs", color: "dimmed" }, row.email)))
3448
+ sortable: true,
3449
+ titleStyle: { whiteSpace: "nowrap" },
3450
+ render: (row) => /* @__PURE__ */ React.createElement(Group, { spacing: "sm", noWrap: true }, /* @__PURE__ */ React.createElement(Avatar, { size: 40, src: row.avatar, radius: 40 }), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Text, { size: "sm", weight: 500 }, row.name), /* @__PURE__ */ React.createElement(Text, { size: "xs", color: "dimmed" }, row.email)))
3418
3451
  },
3419
3452
  {
3420
3453
  accessor: "status",
3421
- render: (row) => /* @__PURE__ */ React.createElement(React.Fragment, null, !!row.isComplete && /* @__PURE__ */ React.createElement(Badge$1, { variant: "filled" }, "Complete"), !row.isComplete && /* @__PURE__ */ React.createElement(Badge$1, { color: "red", variant: "filled" }, "Incomplete"))
3454
+ title: "Status",
3455
+ sortable: true,
3456
+ titleStyle: { whiteSpace: "nowrap" },
3457
+ render: (row) => /* @__PURE__ */ React.createElement(Badge$1, { color: row.isComplete ? "blue" : "red", variant: "filled" }, row.isComplete ? "Complete" : "Incomplete")
3422
3458
  },
3423
3459
  ...props.categories.map((category) => ({
3424
3460
  accessor: category.categoryId,
3425
3461
  title: category.name,
3462
+ sortable: true,
3463
+ titleStyle: { whiteSpace: "nowrap" },
3426
3464
  render: (row) => {
3427
3465
  var _a, _b;
3428
- return /* @__PURE__ */ React.createElement(Badge$1, { color: "blue", variant: "filled" }, (_b = (_a = row.categoryPoints) == null ? void 0 : _a[category.categoryId]) != null ? _b : 0);
3466
+ return /* @__PURE__ */ React.createElement(Badge$1, { color: "blue", variant: "filled" }, (_b = (_a = row.categoryPoints) == null ? void 0 : _a[category.categoryId]) != null ? _b : 0, " pts");
3429
3467
  }
3430
3468
  }))
3431
3469
  ],
@@ -3436,7 +3474,23 @@ function Table$1(props) {
3436
3474
  ));
3437
3475
  }
3438
3476
 
3477
+ const useStyles$1 = createStyles((theme) => ({
3478
+ th: { padding: "0 !important" },
3479
+ control: {
3480
+ width: "100%",
3481
+ padding: `${theme.spacing.xs}px ${theme.spacing.md}px`,
3482
+ "&:hover": {
3483
+ backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[0]
3484
+ }
3485
+ }
3486
+ }));
3487
+ function Th({ children, reversed, sorted, onSort }) {
3488
+ const { classes } = useStyles$1();
3489
+ const Icon = sorted ? reversed ? IconChevronUp : IconChevronDown : IconSelector;
3490
+ return /* @__PURE__ */ React.createElement("th", { className: classes.th }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: onSort, className: classes.control }, /* @__PURE__ */ React.createElement(Group, { position: "apart", noWrap: true, spacing: "xs" }, /* @__PURE__ */ React.createElement(Text, { weight: 500, size: "sm", sx: { whiteSpace: "nowrap" } }, children), /* @__PURE__ */ React.createElement(Center, null, /* @__PURE__ */ React.createElement(Icon, { size: 14, stroke: 1.5 })))));
3491
+ }
3439
3492
  function Table(props) {
3493
+ const { items: sortedItems, requestSort, sortConfig } = useSortableData(props.items);
3440
3494
  if (props.items.length === 0) {
3441
3495
  return /* @__PURE__ */ React.createElement(
3442
3496
  PlaceholderBanner,
@@ -3448,11 +3502,27 @@ function Table(props) {
3448
3502
  }
3449
3503
  );
3450
3504
  }
3451
- const rows = props.items.map((row) => {
3505
+ const rows = sortedItems.map((row) => {
3452
3506
  const percentageCompletion = Math.round((row.percentageCompletion + Number.EPSILON) * 100);
3453
- return /* @__PURE__ */ React.createElement("tr", { key: row.badgeName }, /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Text, { component: Link, to: row.href }, row.badgeName)), /* @__PURE__ */ React.createElement("td", null, percentageCompletion, "%"));
3507
+ return /* @__PURE__ */ React.createElement("tr", { key: row.badgeId }, /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Text, { component: Link, to: row.href }, row.badgeName)), /* @__PURE__ */ React.createElement("td", null, percentageCompletion, "%"));
3454
3508
  });
3455
- return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { verticalSpacing: "sm", sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("th", null, "Badge Name"), /* @__PURE__ */ React.createElement("th", null, "Badge Completion"))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
3509
+ return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$k, { verticalSpacing: "sm", sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement(
3510
+ Th,
3511
+ {
3512
+ sorted: sortConfig.key === "badgeName",
3513
+ reversed: sortConfig.direction === "desc",
3514
+ onSort: () => requestSort("badgeName")
3515
+ },
3516
+ "Badge Name"
3517
+ ), /* @__PURE__ */ React.createElement(
3518
+ Th,
3519
+ {
3520
+ sorted: sortConfig.key === "percentageCompletion",
3521
+ reversed: sortConfig.direction === "desc",
3522
+ onSort: () => requestSort("percentageCompletion")
3523
+ },
3524
+ "Badge Completion"
3525
+ ))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
3456
3526
  }
3457
3527
 
3458
3528
  const useStyles = createStyles((theme) => ({