@local-civics/mgmt-ui 0.1.64 → 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,
@@ -532,8 +533,8 @@ const SplitButton$2 = (props) => {
532
533
  return /* @__PURE__ */ React__namespace.createElement(core.Group, { noWrap: true, spacing: 0 }, /* @__PURE__ */ React__namespace.createElement(
533
534
  core.Button,
534
535
  {
535
- component: "a",
536
- href: props.href,
536
+ component: reactRouterDom.Link,
537
+ to: props.href,
537
538
  className: classes.button,
538
539
  variant: "gradient"
539
540
  },
@@ -625,7 +626,7 @@ function Stack$2(props) {
625
626
  if (props.items.length === 0) {
626
627
  return null;
627
628
  }
628
- 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"))));
629
630
  return /* @__PURE__ */ React__namespace.createElement(core.Grid, { grow: true, gutter: "lg", sx: { padding: 20, minWidth: 700 } }, rows);
630
631
  }
631
632
 
@@ -656,7 +657,7 @@ function Table$f(props) {
656
657
  columns: [{
657
658
  accessor: "name",
658
659
  title: "Student Name",
659
- 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)))
660
661
  }, {
661
662
  accessor: "status",
662
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"))
@@ -682,7 +683,7 @@ function Table$e(props) {
682
683
  }
683
684
  const rows = props.items.map((row) => {
684
685
  const percentageCompletion = Math.round((row.percentageCompletion + Number.EPSILON) * 100);
685
- 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, "%"));
686
687
  });
687
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)));
688
689
  }
@@ -780,8 +781,8 @@ function Table$d(props) {
780
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(
781
782
  core.UnstyledButton,
782
783
  {
783
- component: "a",
784
- href: row.href,
784
+ component: reactRouterDom.Link,
785
+ to: row.href,
785
786
  sx: (theme) => ({
786
787
  display: "block",
787
788
  width: "100%",
@@ -1082,7 +1083,7 @@ function Table$7(props) {
1082
1083
  confirmProps: { color: "red" },
1083
1084
  onConfirm: () => props.onDelete && props.onDelete(student)
1084
1085
  });
1085
- 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(
1086
1087
  core.Select,
1087
1088
  {
1088
1089
  size: "sm",
@@ -1313,7 +1314,7 @@ function Table$6(props) {
1313
1314
  confirmProps: { color: "red" },
1314
1315
  onConfirm: () => props.onDeleteClass(group)
1315
1316
  });
1316
- 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 }))))));
1317
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)));
1318
1319
  }
1319
1320
 
@@ -1486,7 +1487,7 @@ function Table$4(props) {
1486
1487
  }
1487
1488
  );
1488
1489
  }
1489
- 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(","))));
1490
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)));
1491
1492
  }
1492
1493
 
@@ -1502,7 +1503,7 @@ function Table$3(props) {
1502
1503
  }
1503
1504
  );
1504
1505
  }
1505
- 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())));
1506
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)));
1507
1508
  }
1508
1509
 
@@ -1807,8 +1808,8 @@ const SplitButton = (props) => {
1807
1808
  return /* @__PURE__ */ React__namespace.createElement(core.Group, { noWrap: true, spacing: 0 }, /* @__PURE__ */ React__namespace.createElement(
1808
1809
  core.Button,
1809
1810
  {
1810
- component: "a",
1811
- href: props.href,
1811
+ component: reactRouterDom.Link,
1812
+ to: props.href,
1812
1813
  className: classes.button,
1813
1814
  variant: "gradient"
1814
1815
  },
@@ -1844,7 +1845,7 @@ function Stack$1(props) {
1844
1845
  return null;
1845
1846
  }
1846
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.")));
1847
- 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)));
1848
1849
  }
1849
1850
 
1850
1851
  function Table$1(props) {
@@ -2054,8 +2055,8 @@ function Table(props) {
2054
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(
2055
2056
  core.UnstyledButton,
2056
2057
  {
2057
- component: "a",
2058
- href: row.href,
2058
+ component: reactRouterDom.Link,
2059
+ to: row.href,
2059
2060
  sx: (theme) => ({
2060
2061
  display: "block",
2061
2062
  width: "100%",