@local-civics/mgmt-ui 0.1.63 → 0.1.65

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.
package/dist/index.js CHANGED
@@ -3,6 +3,7 @@
3
3
  var React = require('react');
4
4
  var core = require('@mantine/core');
5
5
  var icons = require('@tabler/icons');
6
+ var reactRouterDom = require('react-router-dom');
6
7
  var notifications = require('@mantine/notifications');
7
8
  var mantineDatatable = require('mantine-datatable');
8
9
  var dropzone = require('@mantine/dropzone');
@@ -208,7 +209,7 @@ function LinksGroup({ icon: Icon, href, label, initiallyOpened, links, active, n
208
209
  className: cx(classes.link, { [classes.linkActive]: !!active && active === `${label}/${link.label}` }),
209
210
  key: link.label
210
211
  },
211
- /* @__PURE__ */ React__namespace.createElement(core.Group, { position: "apart", spacing: 0 }, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: "a", href: link.href }, link.label), !!link.notifications && /* @__PURE__ */ React__namespace.createElement(core.Badge, { size: "sm", variant: "filled", className: classes.badge }, compact(link.notifications)))
212
+ /* @__PURE__ */ React__namespace.createElement(core.Group, { position: "apart", spacing: 0 }, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: reactRouterDom.Link, to: link.href }, link.label), !!link.notifications && /* @__PURE__ */ React__namespace.createElement(core.Badge, { size: "sm", variant: "filled", className: classes.badge }, compact(link.notifications)))
212
213
  );
213
214
  });
214
215
  return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(
@@ -222,7 +223,7 @@ function LinksGroup({ icon: Icon, href, label, initiallyOpened, links, active, n
222
223
  position: "apart",
223
224
  spacing: 0
224
225
  },
225
- /* @__PURE__ */ React__namespace.createElement(core.Box, { sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React__namespace.createElement(core.ThemeIcon, { variant: "light", size: 30 }, /* @__PURE__ */ React__namespace.createElement(Icon, { className: classes.linkIcon, size: 18 })), /* @__PURE__ */ React__namespace.createElement(core.Box, { ml: "md" }, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: "a", href }, label))),
226
+ /* @__PURE__ */ React__namespace.createElement(core.Box, { sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React__namespace.createElement(core.ThemeIcon, { variant: "light", size: 30 }, /* @__PURE__ */ React__namespace.createElement(Icon, { className: classes.linkIcon, size: 18 })), /* @__PURE__ */ React__namespace.createElement(core.Box, { ml: "md" }, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: reactRouterDom.Link, to: href }, label))),
226
227
  !!notifications && /* @__PURE__ */ React__namespace.createElement(core.Badge, { size: "sm", variant: "filled", className: classes.badge }, compact(notifications)),
227
228
  hasLinks && /* @__PURE__ */ React__namespace.createElement(
228
229
  ChevronIcon,
@@ -263,6 +264,13 @@ const useStyles$g = core.createStyles((theme, _params, getRef) => {
263
264
  navbar: {
264
265
  backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.white
265
266
  },
267
+ navHeader: {
268
+ [`@media (max-width: ${theme.breakpoints.sm}px)`]: {
269
+ height: 71,
270
+ position: "absolute",
271
+ top: 0
272
+ }
273
+ },
266
274
  navBody: {
267
275
  [`@media (max-width: ${theme.breakpoints.sm}px)`]: {
268
276
  display: "none"
@@ -364,7 +372,7 @@ function NestedNavbar(props) {
364
372
  })
365
373
  );
366
374
  });
367
- return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(core.Burger, { opened: burgerOpen, onClick: toggle, className: classes.burger, size: "sm" }), /* @__PURE__ */ React__namespace.createElement(core.Navbar, { width: { sm: 300 }, p: "md", className: classes.navbar }, /* @__PURE__ */ React__namespace.createElement(core.Navbar.Section, { className: classes.header }, /* @__PURE__ */ React__namespace.createElement(core.Group, { position: "apart" }, /* @__PURE__ */ React__namespace.createElement(core.Center, null, /* @__PURE__ */ React__namespace.createElement(core.Avatar, { color: "blue", radius: "sm" }, /* @__PURE__ */ React__namespace.createElement("div", { style: { width: 15, marginLeft: "auto", marginRight: "auto" } }, /* @__PURE__ */ React__namespace.createElement(core.Image, { fit: "contain", src: "https://cdn.localcivics.io/brand/l.png" })))), /* @__PURE__ */ React__namespace.createElement(core.Group, { position: "apart" }, /* @__PURE__ */ React__namespace.createElement(core.Code, { sx: { fontWeight: 700 } }, props.version), /* @__PURE__ */ React__namespace.createElement(core.Burger, { opened: burgerOpen, onClick: toggle, className: classes.burger, size: "sm" })))), /* @__PURE__ */ React__namespace.createElement("div", { className: cx({ [classes.navBody]: !burgerOpen }) }, /* @__PURE__ */ React__namespace.createElement(
375
+ return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(core.Navbar, { width: { sm: 300 }, p: "md", className: cx(classes.navbar, { [classes.navHeader]: !burgerOpen }) }, /* @__PURE__ */ React__namespace.createElement(core.Navbar.Section, { className: classes.header }, /* @__PURE__ */ React__namespace.createElement(core.Group, { position: "apart" }, /* @__PURE__ */ React__namespace.createElement(core.Center, null, /* @__PURE__ */ React__namespace.createElement(core.Avatar, { color: "blue", radius: "sm" }, /* @__PURE__ */ React__namespace.createElement("div", { style: { width: 15, marginLeft: "auto", marginRight: "auto" } }, /* @__PURE__ */ React__namespace.createElement(core.Image, { fit: "contain", src: "https://cdn.localcivics.io/brand/l.png" })))), /* @__PURE__ */ React__namespace.createElement(core.Group, { position: "apart" }, /* @__PURE__ */ React__namespace.createElement(core.Code, { sx: { fontWeight: 700 } }, props.version), /* @__PURE__ */ React__namespace.createElement(core.Burger, { opened: burgerOpen, onClick: toggle, className: classes.burger, size: "sm" })))), /* @__PURE__ */ React__namespace.createElement("div", { className: cx({ [classes.navBody]: !burgerOpen }) }, /* @__PURE__ */ React__namespace.createElement(
368
376
  UserButton,
369
377
  {
370
378
  className: classes.user,
@@ -525,8 +533,8 @@ const SplitButton$2 = (props) => {
525
533
  return /* @__PURE__ */ React__namespace.createElement(core.Group, { noWrap: true, spacing: 0 }, /* @__PURE__ */ React__namespace.createElement(
526
534
  core.Button,
527
535
  {
528
- component: "a",
529
- href: props.href,
536
+ component: reactRouterDom.Link,
537
+ to: props.href,
530
538
  className: classes.button,
531
539
  variant: "gradient"
532
540
  },
@@ -618,7 +626,7 @@ function Stack$2(props) {
618
626
  if (props.items.length === 0) {
619
627
  return null;
620
628
  }
621
- const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(core.Grid.Col, { span: 6 }, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: "a", href: row.href, color: "dark.4", weight: "bold", size: "md" }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement(core.Grid.Col, { span: 6 }, row.completion >= 1 && /* @__PURE__ */ React__namespace.createElement(core.Badge, { variant: "filled" }, "Complete"), row.completion === 0 && !row.isStarted && /* @__PURE__ */ React__namespace.createElement(core.Badge, { color: "red", variant: "filled" }, "Not started"), row.completion > 0 && row.completion < 1 && /* @__PURE__ */ React__namespace.createElement(core.Badge, { color: "violet", variant: "filled" }, Math.round((row.completion + Number.EPSILON) * 100), "% Complete"))));
629
+ const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(core.Grid.Col, { span: 6 }, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: reactRouterDom.Link, to: row.href, color: "dark.4", weight: "bold", size: "md" }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement(core.Grid.Col, { span: 6 }, row.completion >= 1 && /* @__PURE__ */ React__namespace.createElement(core.Badge, { variant: "filled" }, "Complete"), row.completion === 0 && !row.isStarted && /* @__PURE__ */ React__namespace.createElement(core.Badge, { color: "red", variant: "filled" }, "Not started"), row.completion > 0 && row.completion < 1 && /* @__PURE__ */ React__namespace.createElement(core.Badge, { color: "violet", variant: "filled" }, Math.round((row.completion + Number.EPSILON) * 100), "% Complete"))));
622
630
  return /* @__PURE__ */ React__namespace.createElement(core.Grid, { grow: true, gutter: "lg", sx: { padding: 20, minWidth: 700 } }, rows);
623
631
  }
624
632
 
@@ -649,7 +657,7 @@ function Table$f(props) {
649
657
  columns: [{
650
658
  accessor: "name",
651
659
  title: "Student Name",
652
- render: (row) => /* @__PURE__ */ React__namespace.createElement(core.Group, { spacing: "sm" }, /* @__PURE__ */ React__namespace.createElement(core.Avatar, { size: 40, src: row.avatar, radius: 40 }), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: "sm", weight: 500 }, row.name), /* @__PURE__ */ React__namespace.createElement(core.Text, { component: "a", size: "xs", color: "dimmed" }, row.email)))
660
+ render: (row) => /* @__PURE__ */ React__namespace.createElement(core.Group, { spacing: "sm" }, /* @__PURE__ */ React__namespace.createElement(core.Avatar, { size: 40, src: row.avatar, radius: 40 }), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: "sm", weight: 500 }, row.name), /* @__PURE__ */ React__namespace.createElement(core.Text, { size: "xs", color: "dimmed" }, row.email)))
653
661
  }, {
654
662
  accessor: "status",
655
663
  render: (row) => /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, !!row.isComplete && /* @__PURE__ */ React__namespace.createElement(core.Badge, { variant: "filled" }, "Complete"), !row.isComplete && /* @__PURE__ */ React__namespace.createElement(core.Badge, { color: "red", variant: "filled" }, "Incomplete"))
@@ -675,7 +683,7 @@ function Table$e(props) {
675
683
  }
676
684
  const rows = props.items.map((row) => {
677
685
  const percentageCompletion = Math.round((row.percentageCompletion + Number.EPSILON) * 100);
678
- return /* @__PURE__ */ React__namespace.createElement("tr", { key: row.lessonName }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { href: row.href, component: "a" }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement("td", null, percentageCompletion, "%"));
686
+ return /* @__PURE__ */ React__namespace.createElement("tr", { key: row.lessonName }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: reactRouterDom.Link, to: row.href }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement("td", null, percentageCompletion, "%"));
679
687
  });
680
688
  return /* @__PURE__ */ React__namespace.createElement(core.ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React__namespace.createElement(core.Table, { verticalSpacing: "sm", sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React__namespace.createElement("thead", null, /* @__PURE__ */ React__namespace.createElement("tr", null, /* @__PURE__ */ React__namespace.createElement("th", null, "Lesson Name"), /* @__PURE__ */ React__namespace.createElement("th", null, "Lesson Completion"))), /* @__PURE__ */ React__namespace.createElement("tbody", null, rows)));
681
689
  }
@@ -773,8 +781,8 @@ function Table$d(props) {
773
781
  const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.badgeId }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(
774
782
  core.UnstyledButton,
775
783
  {
776
- component: "a",
777
- href: row.href,
784
+ component: reactRouterDom.Link,
785
+ to: row.href,
778
786
  sx: (theme) => ({
779
787
  display: "block",
780
788
  width: "100%",
@@ -1075,7 +1083,7 @@ function Table$7(props) {
1075
1083
  confirmProps: { color: "red" },
1076
1084
  onConfirm: () => props.onDelete && props.onDelete(student)
1077
1085
  });
1078
- const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.email }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.UnstyledButton, { component: "a", href: row.href }, /* @__PURE__ */ React__namespace.createElement(core.Group, { spacing: "sm" }, /* @__PURE__ */ React__namespace.createElement(core.Avatar, { size: 40, src: row.avatar, radius: 40 }), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: "sm", weight: 500 }, row.givenName && row.familyName ? `${row.givenName} ${row.familyName}` : row.email), /* @__PURE__ */ React__namespace.createElement(core.Text, { size: "xs", color: "dimmed" }, row.email))))), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Box, { maw: 100 }, /* @__PURE__ */ React__namespace.createElement(
1086
+ const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.email }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.UnstyledButton, { component: reactRouterDom.Link, to: row.href }, /* @__PURE__ */ React__namespace.createElement(core.Group, { spacing: "sm" }, /* @__PURE__ */ React__namespace.createElement(core.Avatar, { size: 40, src: row.avatar, radius: 40 }), /* @__PURE__ */ React__namespace.createElement("div", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: "sm", weight: 500 }, row.givenName && row.familyName ? `${row.givenName} ${row.familyName}` : row.email), /* @__PURE__ */ React__namespace.createElement(core.Text, { size: "xs", color: "dimmed" }, row.email))))), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Box, { maw: 100 }, /* @__PURE__ */ React__namespace.createElement(
1079
1087
  core.Select,
1080
1088
  {
1081
1089
  size: "sm",
@@ -1306,7 +1314,7 @@ function Table$6(props) {
1306
1314
  confirmProps: { color: "red" },
1307
1315
  onConfirm: () => props.onDeleteClass(group)
1308
1316
  });
1309
- const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.classId }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.UnstyledButton, { component: "a", href: row.href }, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: 14 }, row.name))), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: 14 }, row.description)), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: 14 }, row.numberOfStudents || 0)), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Group, { noWrap: true, spacing: 0, position: "right" }, /* @__PURE__ */ React__namespace.createElement(core.ActionIcon, { color: "red" }, /* @__PURE__ */ React__namespace.createElement(icons.IconTrash, { onClick: () => openDeleteModal(row), size: 16, stroke: 1.5 }))))));
1317
+ const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.classId }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.UnstyledButton, { component: reactRouterDom.Link, to: row.href }, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: 14 }, row.name))), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: 14 }, row.description)), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { size: 14 }, row.numberOfStudents || 0)), /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Group, { noWrap: true, spacing: 0, position: "right" }, /* @__PURE__ */ React__namespace.createElement(core.ActionIcon, { color: "red" }, /* @__PURE__ */ React__namespace.createElement(icons.IconTrash, { onClick: () => openDeleteModal(row), size: 16, stroke: 1.5 }))))));
1310
1318
  return /* @__PURE__ */ React__namespace.createElement(core.ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React__namespace.createElement(core.Table, { verticalSpacing: 20, sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React__namespace.createElement("thead", null, /* @__PURE__ */ React__namespace.createElement("tr", null, /* @__PURE__ */ React__namespace.createElement("th", null, "Class Name"), /* @__PURE__ */ React__namespace.createElement("th", null, "Description"), /* @__PURE__ */ React__namespace.createElement("th", null, "# of Students"), /* @__PURE__ */ React__namespace.createElement("th", null))), /* @__PURE__ */ React__namespace.createElement("tbody", null, rows)));
1311
1319
  }
1312
1320
 
@@ -1479,7 +1487,7 @@ function Table$4(props) {
1479
1487
  }
1480
1488
  );
1481
1489
  }
1482
- const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.questionName }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: "a", href: row.href }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement("td", null, row.questionName), /* @__PURE__ */ React__namespace.createElement("td", null, row.answer.join(","))));
1490
+ const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.questionName }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: reactRouterDom.Link, to: row.href }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement("td", null, row.questionName), /* @__PURE__ */ React__namespace.createElement("td", null, row.answer.join(","))));
1483
1491
  return /* @__PURE__ */ React__namespace.createElement(core.ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React__namespace.createElement(core.Table, { verticalSpacing: "sm", sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React__namespace.createElement("thead", null, /* @__PURE__ */ React__namespace.createElement("tr", null, /* @__PURE__ */ React__namespace.createElement("th", null, "Lesson Name"), /* @__PURE__ */ React__namespace.createElement("th", null, "Question"), /* @__PURE__ */ React__namespace.createElement("th", null, "Answer"))), /* @__PURE__ */ React__namespace.createElement("tbody", null, rows)));
1484
1492
  }
1485
1493
 
@@ -1495,7 +1503,7 @@ function Table$3(props) {
1495
1503
  }
1496
1504
  );
1497
1505
  }
1498
- const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.lessonName }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: "a", href: row.href }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement("td", null, row.reflection), /* @__PURE__ */ React__namespace.createElement("td", null, row.rating.toLocaleString())));
1506
+ const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.lessonName }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(core.Text, { component: reactRouterDom.Link, to: row.href }, row.lessonName)), /* @__PURE__ */ React__namespace.createElement("td", null, row.reflection), /* @__PURE__ */ React__namespace.createElement("td", null, row.rating.toLocaleString())));
1499
1507
  return /* @__PURE__ */ React__namespace.createElement(core.ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React__namespace.createElement(core.Table, { verticalSpacing: "sm", sx: { minWidth: 700 }, highlightOnHover: true, striped: true }, /* @__PURE__ */ React__namespace.createElement("thead", null, /* @__PURE__ */ React__namespace.createElement("tr", null, /* @__PURE__ */ React__namespace.createElement("th", null, "Lesson Name"), /* @__PURE__ */ React__namespace.createElement("th", null, "Reflection"), /* @__PURE__ */ React__namespace.createElement("th", null, "Rating"))), /* @__PURE__ */ React__namespace.createElement("tbody", null, rows)));
1500
1508
  }
1501
1509
 
@@ -1800,8 +1808,8 @@ const SplitButton = (props) => {
1800
1808
  return /* @__PURE__ */ React__namespace.createElement(core.Group, { noWrap: true, spacing: 0 }, /* @__PURE__ */ React__namespace.createElement(
1801
1809
  core.Button,
1802
1810
  {
1803
- component: "a",
1804
- href: props.href,
1811
+ component: reactRouterDom.Link,
1812
+ to: props.href,
1805
1813
  className: classes.button,
1806
1814
  variant: "gradient"
1807
1815
  },
@@ -1837,7 +1845,7 @@ function Stack$1(props) {
1837
1845
  return null;
1838
1846
  }
1839
1847
  const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement(core.Stack, { spacing: 0, key: row.questionName }, /* @__PURE__ */ React__namespace.createElement(core.Title, { color: "dark.4", size: "lg" }, row.questionName), /* @__PURE__ */ React__namespace.createElement(core.Text, null, row.answer.join(",") || "No answer.")));
1840
- return /* @__PURE__ */ React__namespace.createElement(core.ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React__namespace.createElement(core.UnstyledButton, { component: "a", href: props.href }, /* @__PURE__ */ React__namespace.createElement(core.Stack, { spacing: 24, sx: { padding: 20, minWidth: 700 } }, rows)));
1848
+ return /* @__PURE__ */ React__namespace.createElement(core.ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React__namespace.createElement(core.UnstyledButton, { component: reactRouterDom.Link, to: props.href }, /* @__PURE__ */ React__namespace.createElement(core.Stack, { spacing: 24, sx: { padding: 20, minWidth: 700 } }, rows)));
1841
1849
  }
1842
1850
 
1843
1851
  function Table$1(props) {
@@ -2047,8 +2055,8 @@ function Table(props) {
2047
2055
  const rows = props.items.map((row) => /* @__PURE__ */ React__namespace.createElement("tr", { key: row.lessonId }, /* @__PURE__ */ React__namespace.createElement("td", null, /* @__PURE__ */ React__namespace.createElement(
2048
2056
  core.UnstyledButton,
2049
2057
  {
2050
- component: "a",
2051
- href: row.href,
2058
+ component: reactRouterDom.Link,
2059
+ to: row.href,
2052
2060
  sx: (theme) => ({
2053
2061
  display: "block",
2054
2062
  width: "100%",
@@ -2134,11 +2142,16 @@ var __spreadValues = (a, b) => {
2134
2142
  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
2135
2143
  const useStyles = core.createStyles((theme) => ({
2136
2144
  footer: {
2137
- paddingTop: theme.spacing.xl * 2,
2138
- paddingBottom: theme.spacing.xl * 2,
2139
- paddingLeft: theme.spacing.xl * 13,
2145
+ paddingTop: theme.spacing.md,
2146
+ paddingBottom: theme.spacing.md,
2147
+ paddingLeft: theme.spacing.md,
2140
2148
  backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[0],
2141
- borderTop: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[2]}`
2149
+ borderTop: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[2]}`,
2150
+ [theme.fn.largerThan("sm")]: {
2151
+ paddingTop: theme.spacing.xl * 2,
2152
+ paddingBottom: theme.spacing.xl * 2,
2153
+ paddingLeft: theme.spacing.xl * 13
2154
+ }
2142
2155
  },
2143
2156
  logo: {
2144
2157
  maxWidth: 200,