@local-civics/mgmt-ui 0.1.213 → 0.1.215

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 (7) hide show
  1. package/dist/index.d.ts +65 -79
  2. package/dist/index.d.ts.css +18 -0
  3. package/dist/index.js +826 -855
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +829 -857
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { useState, useMemo } from 'react';
3
- import { IconChevronRight, IconVideo, IconSwitchHorizontal, IconLogout, IconHome2, IconGauge, IconCategory2, IconRoute, IconAlbum, IconLambda, IconClipboard, IconBuilding, IconBatteryEco, IconBooks, IconBackpack, IconClipboardCopy, IconTableExport, IconArrowLeft, IconSearch, IconCheck, IconTrash, IconPlus, IconLink, IconDownload, IconCloudUpload, IconInfoCircle, IconPlaylistAdd, IconColorSwatch, IconPointer, IconChevronDown, IconX, IconScribble, IconSchool, IconPodium, IconBriefcase, IconPresentation, IconNews, IconTools, IconBrandInstagram, IconBrandLinkedin, IconBrandFacebook } from '@tabler/icons';
4
- import { Avatar, createStyles, Modal, Center, Loader, Container, Group, Button, Title, Text, UnstyledButton, Card, ScrollArea, SimpleGrid, Tabs as Tabs$1, Stack as Stack$5, Image, Grid, Badge as Badge$1, ActionIcon, LoadingOverlay, Select, Table as Table$l, Drawer, Divider, TextInput, Tooltip, Autocomplete, Paper, ThemeIcon, Overlay, Anchor, Box, Menu, Checkbox, createEmotionCache, MantineProvider, AppShell, Accordion } from '@mantine/core';
3
+ import { IconChevronRight, IconVideo, IconSwitchHorizontal, IconLogout, IconHome2, IconGauge, IconCategory2, IconRoute, IconAlbum, IconLambda, IconClipboard, IconBuilding, IconBatteryEco, IconBooks, IconBackpack, IconClipboardCopy, IconTableExport, IconArrowLeft, IconSearch, IconCheck, IconTrash, IconPlus, IconLink, IconDownload, IconCloudUpload, IconInfoCircle, IconPlaylistAdd, IconPointer, IconChevronDown, IconX, IconScribble, IconSchool, IconPodium, IconBriefcase, IconPresentation, IconNews, IconTools, IconBrandInstagram, IconBrandLinkedin, IconBrandFacebook, IconExternalLink, IconChevronLeft } from '@tabler/icons';
4
+ import { Avatar, createStyles, Modal, Center, Loader, Container, Group, Button, Title, Text, UnstyledButton, Card, ScrollArea, SimpleGrid, Tabs as Tabs$1, Stack as Stack$5, Image, Grid, Badge as Badge$1, ActionIcon, LoadingOverlay, Select, Table as Table$l, Drawer, Divider, TextInput, Tooltip, Autocomplete, Paper, Anchor, Box, Menu, Overlay, ThemeIcon, Checkbox, createEmotionCache, MantineProvider, AppShell } from '@mantine/core';
5
5
  import { Link } from 'react-router-dom';
6
6
  import { showNotification, NotificationsProvider } from '@mantine/notifications';
7
7
  export { showNotification, updateNotification } from '@mantine/notifications';
@@ -41,7 +41,7 @@ function styleInject(css, ref) {
41
41
  }
42
42
  }
43
43
 
44
- var css_248z = "@font-face{font-family:ProximaNova;src:url(https://cdn.localcivics.io/fonts/ProximaNova.otf) format(\"opentype\")}@font-face{font-family:ProximaNova;font-weight:700;src:url(https://cdn.localcivics.io/fonts/ProximaNovaBold.otf) format(\"opentype\")}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.visible{visibility:visible}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.\\!relative{position:relative!important}.m-3{margin:.75rem}.mx-auto{margin-left:auto;margin-right:auto}.mt-1{margin-top:.25rem}.mt-6{margin-top:1.5rem}.mt-2{margin-top:.5rem}.mt-1\\.5{margin-top:.375rem}.ml-\\[29px\\]{margin-left:29px}.mt-0\\.5{margin-top:.125rem}.mt-0{margin-top:0}.block{display:block}.inline{display:inline}.flex{display:flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-full{height:100%}.h-8{height:2rem}.h-7{height:1.75rem}.h-screen{height:100vh}.h-\\[30px\\]{height:30px}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-8{width:2rem}.w-fit{width:-moz-fit-content;width:fit-content}.w-7{width:1.75rem}.w-screen{width:100vw}.w-\\[230px\\]{width:230px}.w-24{width:6rem}.w-\\[30px\\]{width:30px}.min-w-0{min-width:0}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.rotate-90{--tw-rotate:90deg}.rotate-90,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.grid-cols-\\[2\\.2fr_1\\.2fr_1fr_1\\.2fr_1fr_0\\.6fr\\]{grid-template-columns:2.2fr 1.2fr 1fr 1.2fr 1fr .6fr}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-5{gap:1.25rem}.gap-2\\.5{gap:.625rem}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-3{gap:.75rem}.gap-0\\.5{gap:.125rem}.gap-0{gap:0}.gap-x-10{-moz-column-gap:2.5rem;column-gap:2.5rem}.gap-y-4{row-gap:1rem}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.25rem*var(--tw-space-y-reverse));margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)))}.space-y-1\\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.375rem*var(--tw-space-y-reverse));margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-none{overscroll-behavior:none}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-xl{border-radius:.75rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-md{border-radius:.375rem}.rounded-2xl{border-radius:1rem}.rounded-\\[10px\\]{border-radius:10px}.rounded-\\[8px\\]{border-radius:8px}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-l{border-left-width:1px}.border-none{border-style:none}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity))}.border-slate-100{--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity))}.border-sky-blue-400\\/30{border-color:rgba(59,208,242,.3)}.border-mint-400\\/30{border-color:rgba(30,226,175,.3)}.border-gold-400\\/30{border-color:rgba(255,212,77,.3)}.border-transparent{border-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-transparent{background-color:transparent}.bg-dark-blue-400{--tw-bg-opacity:1;background-color:rgb(35 42 58/var(--tw-bg-opacity))}.bg-mint-400\\/20{background-color:rgba(30,226,175,.2)}.bg-gold-400\\/15{background-color:rgba(255,212,77,.15)}.bg-sky-blue-400\\/15{background-color:rgba(59,208,242,.15)}.bg-sky-blue-400\\/25{background-color:rgba(59,208,242,.25)}.bg-mint-400\\/15{background-color:rgba(30,226,175,.15)}.bg-mint-400\\/25{background-color:rgba(30,226,175,.25)}.bg-gold-400\\/25{background-color:rgba(255,212,77,.25)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.from-gold-400{--tw-gradient-from:#ffd44d;--tw-gradient-to:rgba(255,212,77,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-dark-blue-600{--tw-gradient-from:#0a0f2e;--tw-gradient-to:rgba(10,15,46,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-sky-blue-400\\/15{--tw-gradient-from:rgba(59,208,242,.15);--tw-gradient-to:rgba(59,208,242,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.via-dark-blue-400{--tw-gradient-to:rgba(35,42,58,0);--tw-gradient-stops:var(--tw-gradient-from),#232a3a,var(--tw-gradient-to)}.to-\\[\\#f5c300\\]{--tw-gradient-to:#f5c300}.to-sky-blue-400{--tw-gradient-to:#3bd0f2}.to-mint-400\\/15{--tw-gradient-to:rgba(30,226,175,.15)}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-8{padding:2rem}.p-4{padding:1rem}.p-2\\.5{padding:.625rem}.p-2{padding:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-8{padding-bottom:2rem;padding-top:2rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-4{padding-bottom:1rem;padding-top:1rem}.px-3\\.5{padding-left:.875rem;padding-right:.875rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2\\.5{padding-bottom:.625rem;padding-top:.625rem}.py-3\\.5{padding-bottom:.875rem;padding-top:.875rem}.px-2\\.5{padding-left:.625rem;padding-right:.625rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.px-8{padding-left:2rem;padding-right:2rem}.py-6{padding-bottom:1.5rem;padding-top:1.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-0{padding-bottom:0;padding-top:0}.pl-2\\.5{padding-left:.625rem}.pl-2{padding-left:.5rem}.text-center{text-align:center}.font-proxima{font-family:ProximaNova}.text-2xl{font-size:1.5rem;line-height:2rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-\\[10px\\]{font-size:10px}.text-\\[10\\.5px\\]{font-size:10.5px}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-\\[11px\\]{font-size:11px}.text-\\[11\\.5px\\]{font-size:11.5px}.font-extrabold{font-weight:800}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-black{font-weight:900}.uppercase{text-transform:uppercase}.leading-relaxed{line-height:1.625}.tracking-tight{letter-spacing:-.025em}.tracking-wide{letter-spacing:.025em}.text-dark-blue-400{--tw-text-opacity:1;color:rgb(35 42 58/var(--tw-text-opacity))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.text-sky-blue-400{--tw-text-opacity:1;color:rgb(59 208 242/var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.text-mint-400{--tw-text-opacity:1;color:rgb(30 226 175/var(--tw-text-opacity))}.text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity))}.text-white\\/70{color:hsla(0,0%,100%,.7)}.text-gold-400{--tw-text-opacity:1;color:rgb(255 212 77/var(--tw-text-opacity))}.underline{text-decoration-line:underline}.no-underline{text-decoration-line:none}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-\\[0_3px_12px_rgba\\(255\\2c 212\\2c 77\\2c 0\\.35\\)\\],.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\\[0_3px_12px_rgba\\(255\\2c 212\\2c 77\\2c 0\\.35\\)\\]{--tw-shadow:0 3px 12px rgba(255,212,77,.35);--tw-shadow-colored:0 3px 12px var(--tw-shadow-color)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-\\[0_2px_10px_rgba\\(30\\2c 226\\2c 175\\2c 0\\.15\\)\\]{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\\[0_2px_10px_rgba\\(30\\2c 226\\2c 175\\2c 0\\.15\\)\\]{--tw-shadow:0 2px 10px rgba(30,226,175,.15);--tw-shadow-colored:0 2px 10px var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-duration:.15s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}*,:after,:before{border-style:solid;border-width:0}.placeholder\\:text-slate-400::-moz-placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.placeholder\\:text-slate-400::placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.hover\\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.hover\\:bg-red-50:hover{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity))}.hover\\:text-red-500:hover{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity))}.hover\\:text-slate-500:hover{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.disabled\\:opacity-50:disabled{opacity:.5}";
44
+ var css_248z = "@font-face{font-family:ProximaNova;src:url(https://cdn.localcivics.io/fonts/ProximaNova.otf) format(\"opentype\")}@font-face{font-family:ProximaNova;font-weight:700;src:url(https://cdn.localcivics.io/fonts/ProximaNovaBold.otf) format(\"opentype\")}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.pointer-events-none{pointer-events:none}.visible{visibility:visible}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.\\!relative{position:relative!important}.left-3\\.5{left:.875rem}.top-1\\/2{top:50%}.left-3{left:.75rem}.m-3{margin:.75rem}.mt-0\\.5{margin-top:.125rem}.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-6{margin-top:1.5rem}.mt-2{margin-top:.5rem}.mt-1\\.5{margin-top:.375rem}.ml-\\[29px\\]{margin-left:29px}.block{display:block}.inline{display:inline}.flex{display:flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-10{height:2.5rem}.h-full{height:100%}.h-8{height:2rem}.h-7{height:1.75rem}.h-12{height:3rem}.h-9{height:2.25rem}.h-screen{height:100vh}.h-\\[30px\\]{height:30px}.w-10{width:2.5rem}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-8{width:2rem}.w-fit{width:-moz-fit-content;width:fit-content}.w-7{width:1.75rem}.w-64{width:16rem}.w-12{width:3rem}.w-16{width:4rem}.w-36{width:9rem}.w-4{width:1rem}.w-9{width:2.25rem}.w-\\[440px\\]{width:440px}.w-40{width:10rem}.w-screen{width:100vw}.w-\\[230px\\]{width:230px}.w-24{width:6rem}.w-\\[30px\\]{width:30px}.min-w-0{min-width:0}.max-w-xl{max-width:36rem}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.-translate-y-1\\/2{--tw-translate-y:-50%}.-translate-y-1\\/2,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-180{--tw-rotate:180deg}.rotate-90{--tw-rotate:90deg}.rotate-90,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.grid-cols-\\[2\\.2fr_1\\.2fr_1fr_1\\.2fr_1fr_0\\.6fr\\]{grid-template-columns:2.2fr 1.2fr 1fr 1.2fr 1fr .6fr}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-\\[18px\\]{gap:18px}.gap-5{gap:1.25rem}.gap-2\\.5{gap:.625rem}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-3{gap:.75rem}.gap-3\\.5{gap:.875rem}.gap-0\\.5{gap:.125rem}.gap-0{gap:0}.gap-x-3{-moz-column-gap:.75rem;column-gap:.75rem}.gap-x-10{-moz-column-gap:2.5rem;column-gap:2.5rem}.gap-y-4{row-gap:1rem}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.25rem*var(--tw-space-y-reverse));margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)))}.space-y-1\\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.375rem*var(--tw-space-y-reverse));margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-none{overscroll-behavior:none}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-2xl{border-radius:1rem}.rounded-\\[10px\\]{border-radius:10px}.rounded-xl{border-radius:.75rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-md{border-radius:.375rem}.rounded-\\[8px\\]{border-radius:8px}.border{border-width:1px}.border-l-4{border-left-width:4px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-r{border-right-width:1px}.border-l{border-left-width:1px}.border-none{border-style:none}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity))}.border-slate-100{--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity))}.border-sky-blue-400\\/30{border-color:rgba(59,208,242,.3)}.border-mint-400\\/30{border-color:rgba(30,226,175,.3)}.border-gold-400\\/30{border-color:rgba(255,212,77,.3)}.border-transparent{border-color:transparent}.border-l-sky-blue-400{--tw-border-opacity:1;border-left-color:rgb(59 208 242/var(--tw-border-opacity))}.border-l-mint-400{--tw-border-opacity:1;border-left-color:rgb(30 226 175/var(--tw-border-opacity))}.border-l-gold-400{--tw-border-opacity:1;border-left-color:rgb(255 212 77/var(--tw-border-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-transparent{background-color:transparent}.bg-dark-blue-400{--tw-bg-opacity:1;background-color:rgb(35 42 58/var(--tw-bg-opacity))}.bg-mint-400\\/20{background-color:rgba(30,226,175,.2)}.bg-mint-100{--tw-bg-opacity:1;background-color:rgb(208 251 240/var(--tw-bg-opacity))}.bg-sky-blue-400\\/20{background-color:rgba(59,208,242,.2)}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity))}.bg-white\\/90{background-color:hsla(0,0%,100%,.9)}.bg-gold-100{--tw-bg-opacity:1;background-color:rgb(255 248 214/var(--tw-bg-opacity))}.bg-gold-400\\/15{background-color:rgba(255,212,77,.15)}.bg-sky-blue-400\\/15{background-color:rgba(59,208,242,.15)}.bg-sky-blue-400\\/25{background-color:rgba(59,208,242,.25)}.bg-mint-400\\/15{background-color:rgba(30,226,175,.15)}.bg-mint-400\\/25{background-color:rgba(30,226,175,.25)}.bg-gold-400\\/25{background-color:rgba(255,212,77,.25)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.from-sky-blue-400{--tw-gradient-from:#3bd0f2;--tw-gradient-to:rgba(59,208,242,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-mint-400{--tw-gradient-from:#1ee2af;--tw-gradient-to:rgba(30,226,175,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-gold-400{--tw-gradient-from:#ffd44d;--tw-gradient-to:rgba(255,212,77,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-dark-blue-600{--tw-gradient-from:#0a0f2e;--tw-gradient-to:rgba(10,15,46,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-sky-blue-400\\/15{--tw-gradient-from:rgba(59,208,242,.15);--tw-gradient-to:rgba(59,208,242,0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.via-dark-blue-400{--tw-gradient-to:rgba(35,42,58,0);--tw-gradient-stops:var(--tw-gradient-from),#232a3a,var(--tw-gradient-to)}.to-dark-blue-400{--tw-gradient-to:#232a3a}.to-\\[\\#f5c300\\]{--tw-gradient-to:#f5c300}.to-sky-blue-400{--tw-gradient-to:#3bd0f2}.to-mint-400\\/15{--tw-gradient-to:rgba(30,226,175,.15)}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-8{padding:2rem}.p-4{padding:1rem}.p-1{padding:.25rem}.p-5{padding:1.25rem}.p-2\\.5{padding:.625rem}.p-2{padding:.5rem}.px-\\[22px\\]{padding-left:22px;padding-right:22px}.py-\\[18px\\]{padding-bottom:18px;padding-top:18px}.px-4{padding-left:1rem;padding-right:1rem}.py-8{padding-bottom:2rem;padding-top:2rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-4{padding-bottom:1rem;padding-top:1rem}.px-3\\.5{padding-left:.875rem;padding-right:.875rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2\\.5{padding-bottom:.625rem;padding-top:.625rem}.py-3\\.5{padding-bottom:.875rem;padding-top:.875rem}.px-2\\.5{padding-left:.625rem;padding-right:.625rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.px-8{padding-left:2rem;padding-right:2rem}.py-6{padding-bottom:1.5rem;padding-top:1.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-0{padding-bottom:0;padding-top:0}.pb-2{padding-bottom:.5rem}.pl-10{padding-left:2.5rem}.pr-4{padding-right:1rem}.pl-2\\.5{padding-left:.625rem}.pl-2{padding-left:.5rem}.text-left{text-align:left}.text-center{text-align:center}.font-proxima{font-family:ProximaNova}.text-\\[15\\.5px\\]{font-size:15.5px}.text-xs{font-size:.75rem;line-height:1rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-\\[10px\\]{font-size:10px}.text-\\[10\\.5px\\]{font-size:10.5px}.text-\\[11px\\]{font-size:11px}.text-\\[28px\\]{font-size:28px}.text-\\[12\\.5px\\]{font-size:12.5px}.text-base{font-size:1rem;line-height:1.5rem}.text-\\[11\\.5px\\]{font-size:11.5px}.text-3xl{font-size:1.875rem;line-height:2.25rem}.font-extrabold{font-weight:800}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-black{font-weight:900}.uppercase{text-transform:uppercase}.leading-relaxed{line-height:1.625}.tracking-tight{letter-spacing:-.025em}.tracking-wide{letter-spacing:.025em}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.text-dark-blue-400{--tw-text-opacity:1;color:rgb(35 42 58/var(--tw-text-opacity))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.text-sky-blue-400{--tw-text-opacity:1;color:rgb(59 208 242/var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.text-mint-400{--tw-text-opacity:1;color:rgb(30 226 175/var(--tw-text-opacity))}.text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity))}.text-white\\/70{color:hsla(0,0%,100%,.7)}.text-gold-400{--tw-text-opacity:1;color:rgb(255 212 77/var(--tw-text-opacity))}.underline{text-decoration-line:underline}.no-underline{text-decoration-line:none}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-\\[0_3px_12px_rgba\\(255\\2c 212\\2c 77\\2c 0\\.35\\)\\],.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\\[0_3px_12px_rgba\\(255\\2c 212\\2c 77\\2c 0\\.35\\)\\]{--tw-shadow:0 3px 12px rgba(255,212,77,.35);--tw-shadow-colored:0 3px 12px var(--tw-shadow-color)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-\\[0_2px_10px_rgba\\(30\\2c 226\\2c 175\\2c 0\\.15\\)\\]{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\\[0_2px_10px_rgba\\(30\\2c 226\\2c 175\\2c 0\\.15\\)\\]{--tw-shadow:0 2px 10px rgba(30,226,175,.15);--tw-shadow-colored:0 2px 10px var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-transform{transition-duration:.15s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}*,:after,:before{border-style:solid;border-width:0}button{background-color:transparent;background-image:none;color:inherit;cursor:pointer;font:inherit;margin:0;padding:0;text-transform:none}.placeholder\\:text-slate-400::-moz-placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.placeholder\\:text-slate-400::placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.hover\\:scale-\\[1\\.02\\]:hover{--tw-scale-x:1.02;--tw-scale-y:1.02;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.hover\\:bg-red-50:hover{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity))}.hover\\:bg-white:hover{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.hover\\:text-slate-700:hover{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.hover\\:text-red-500:hover{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity))}.hover\\:text-slate-600:hover{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.hover\\:text-slate-500:hover{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity))}.hover\\:underline:hover{text-decoration-line:underline}.hover\\:shadow-md:hover{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.focus\\:border-sky-blue-400:focus{--tw-border-opacity:1;border-color:rgb(59 208 242/var(--tw-border-opacity))}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.disabled\\:opacity-50:disabled{opacity:.5}";
45
45
  styleInject(css_248z);
46
46
 
47
47
  function UserButton({ image, name, email }) {
@@ -125,25 +125,25 @@ function LinksGroup({ icon: Icon, href, label, accent = "cyan", initiallyOpened,
125
125
  ), hasLinks && opened && /* @__PURE__ */ React.createElement("div", { className: "ml-[29px] mt-0.5 flex flex-col gap-0.5 border-l border-slate-100 pl-2.5" }, items));
126
126
  }
127
127
 
128
- var __defProp$d = Object.defineProperty;
129
- var __defProps$9 = Object.defineProperties;
130
- var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
131
- var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
132
- var __hasOwnProp$d = Object.prototype.hasOwnProperty;
133
- var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
134
- var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
135
- var __spreadValues$d = (a, b) => {
128
+ var __defProp$f = Object.defineProperty;
129
+ var __defProps$b = Object.defineProperties;
130
+ var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
131
+ var __getOwnPropSymbols$f = Object.getOwnPropertySymbols;
132
+ var __hasOwnProp$f = Object.prototype.hasOwnProperty;
133
+ var __propIsEnum$f = Object.prototype.propertyIsEnumerable;
134
+ var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
135
+ var __spreadValues$f = (a, b) => {
136
136
  for (var prop in b || (b = {}))
137
- if (__hasOwnProp$d.call(b, prop))
138
- __defNormalProp$d(a, prop, b[prop]);
139
- if (__getOwnPropSymbols$d)
140
- for (var prop of __getOwnPropSymbols$d(b)) {
141
- if (__propIsEnum$d.call(b, prop))
142
- __defNormalProp$d(a, prop, b[prop]);
137
+ if (__hasOwnProp$f.call(b, prop))
138
+ __defNormalProp$f(a, prop, b[prop]);
139
+ if (__getOwnPropSymbols$f)
140
+ for (var prop of __getOwnPropSymbols$f(b)) {
141
+ if (__propIsEnum$f.call(b, prop))
142
+ __defNormalProp$f(a, prop, b[prop]);
143
143
  }
144
144
  return a;
145
145
  };
146
- var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
146
+ var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
147
147
  const data = [
148
148
  { label: "Home", icon: IconHome2, accent: "cyan" },
149
149
  { label: "Dashboard", icon: IconGauge, accent: "mint" },
@@ -170,12 +170,12 @@ function Navbar(props) {
170
170
  }
171
171
  return /* @__PURE__ */ React.createElement(
172
172
  LinksGroup,
173
- __spreadProps$9(__spreadValues$d(__spreadValues$d({
173
+ __spreadProps$b(__spreadValues$f(__spreadValues$f({
174
174
  key: item.label,
175
175
  active: props.active
176
176
  }, item), context), {
177
177
  links: (item.links || []).map((link) => {
178
- return __spreadValues$d(__spreadValues$d({}, link), props.links[`${item.label}/${link.label}`] || { notifications: 0, href: "" });
178
+ return __spreadValues$f(__spreadValues$f({}, link), props.links[`${item.label}/${link.label}`] || { notifications: 0, href: "" });
179
179
  })
180
180
  })
181
181
  );
@@ -195,7 +195,7 @@ const UtilLink = (props) => {
195
195
  );
196
196
  };
197
197
 
198
- const useStyles$o = createStyles((theme) => ({
198
+ const useStyles$k = createStyles((theme) => ({
199
199
  inner: {
200
200
  paddingTop: theme.spacing.xl,
201
201
  paddingBottom: theme.spacing.xl * 4
@@ -231,7 +231,7 @@ const useStyles$o = createStyles((theme) => ({
231
231
  }
232
232
  }));
233
233
  const GettingStarted = (props) => {
234
- const { classes } = useStyles$o();
234
+ const { classes } = useStyles$k();
235
235
  return /* @__PURE__ */ React.createElement(
236
236
  Modal,
237
237
  {
@@ -245,7 +245,7 @@ const GettingStarted = (props) => {
245
245
  );
246
246
  };
247
247
 
248
- const useStyles$n = createStyles((theme) => ({
248
+ const useStyles$j = createStyles((theme) => ({
249
249
  title: {
250
250
  fontSize: 34,
251
251
  fontWeight: 900,
@@ -286,7 +286,7 @@ const useStyles$n = createStyles((theme) => ({
286
286
  }
287
287
  }));
288
288
  const SwitchAccount = (props) => {
289
- const { classes, theme } = useStyles$n();
289
+ const { classes, theme } = useStyles$j();
290
290
  const options = props.accounts.map((a) => {
291
291
  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")));
292
292
  });
@@ -323,7 +323,7 @@ const Tabs = (props) => {
323
323
  return /* @__PURE__ */ React.createElement(Tabs$1, { value: props.value, onTabChange: props.onChange }, /* @__PURE__ */ React.createElement(Tabs$1.List, null, tabs));
324
324
  };
325
325
 
326
- const useStyles$m = createStyles((theme) => ({
326
+ const useStyles$i = createStyles((theme) => ({
327
327
  button: {
328
328
  borderTopRightRadius: 0,
329
329
  borderBottomRightRadius: 0,
@@ -338,7 +338,7 @@ const useStyles$m = createStyles((theme) => ({
338
338
  }
339
339
  }));
340
340
  const SplitButton$4 = (props) => {
341
- const { classes, theme } = useStyles$m();
341
+ const { classes, theme } = useStyles$i();
342
342
  theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
343
343
  return /* @__PURE__ */ React.createElement(Stack$5, { spacing: "sm" }, /* @__PURE__ */ React.createElement(
344
344
  Button,
@@ -366,7 +366,7 @@ const SplitButton$4 = (props) => {
366
366
  ));
367
367
  };
368
368
 
369
- const useStyles$l = createStyles((theme) => ({
369
+ const useStyles$h = createStyles((theme) => ({
370
370
  wrapper: {
371
371
  display: "flex",
372
372
  alignItems: "center",
@@ -417,7 +417,7 @@ const useStyles$l = createStyles((theme) => ({
417
417
  }
418
418
  }));
419
419
  const PlaceholderBanner = (props) => {
420
- const { classes } = useStyles$l();
420
+ const { classes } = useStyles$h();
421
421
  const title = props.title || "Nothing to display";
422
422
  const description = props.description || "We don't have anything to show you here just yet. Add data, check back later, or adjust your search.";
423
423
  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 }));
@@ -469,28 +469,28 @@ function useSortableData(items, config = { key: "", direction: null }) {
469
469
  return { items: sortedItems, requestSort, sortConfig };
470
470
  }
471
471
 
472
- var __defProp$c = Object.defineProperty;
473
- var __defProps$8 = Object.defineProperties;
474
- var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
475
- var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
476
- var __hasOwnProp$c = Object.prototype.hasOwnProperty;
477
- var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
478
- var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
479
- var __spreadValues$c = (a, b) => {
472
+ var __defProp$e = Object.defineProperty;
473
+ var __defProps$a = Object.defineProperties;
474
+ var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
475
+ var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
476
+ var __hasOwnProp$e = Object.prototype.hasOwnProperty;
477
+ var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
478
+ var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
479
+ var __spreadValues$e = (a, b) => {
480
480
  for (var prop in b || (b = {}))
481
- if (__hasOwnProp$c.call(b, prop))
482
- __defNormalProp$c(a, prop, b[prop]);
483
- if (__getOwnPropSymbols$c)
484
- for (var prop of __getOwnPropSymbols$c(b)) {
485
- if (__propIsEnum$c.call(b, prop))
486
- __defNormalProp$c(a, prop, b[prop]);
481
+ if (__hasOwnProp$e.call(b, prop))
482
+ __defNormalProp$e(a, prop, b[prop]);
483
+ if (__getOwnPropSymbols$e)
484
+ for (var prop of __getOwnPropSymbols$e(b)) {
485
+ if (__propIsEnum$e.call(b, prop))
486
+ __defNormalProp$e(a, prop, b[prop]);
487
487
  }
488
488
  return a;
489
489
  };
490
- var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
490
+ var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
491
491
  function Table$k(props) {
492
492
  const preparedItems = React.useMemo(() => {
493
- return props.items.map((item) => __spreadProps$8(__spreadValues$c({}, item), {
493
+ return props.items.map((item) => __spreadProps$a(__spreadValues$e({}, item), {
494
494
  status: item.isComplete ? 1 : 0
495
495
  }));
496
496
  }, [props.items]);
@@ -587,7 +587,7 @@ function Table$j(props) {
587
587
  ));
588
588
  }
589
589
 
590
- const useStyles$k = createStyles((theme) => ({
590
+ const useStyles$g = createStyles((theme) => ({
591
591
  title: {
592
592
  fontSize: 34,
593
593
  fontWeight: 900,
@@ -600,12 +600,12 @@ const useStyles$k = createStyles((theme) => ({
600
600
  }
601
601
  }));
602
602
  const Badge = (props) => {
603
- const { classes } = useStyles$k();
603
+ const { classes } = useStyles$g();
604
604
  const [tab, setTab] = useState("lessons");
605
605
  const numberOfStudents = props.students.length;
606
606
  const numberOfBadges = numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length : 0;
607
607
  numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length / numberOfStudents : 0;
608
- return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
608
+ return /* @__PURE__ */ React.createElement(Container, { fluid: true, py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
609
609
  Badge$1,
610
610
  {
611
611
  variant: "filled",
@@ -686,7 +686,7 @@ function Table$i(props) {
686
686
  }
687
687
 
688
688
  const Badges = (props) => {
689
- return /* @__PURE__ */ React.createElement("div", { className: "mx-auto flex max-w-4xl flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, "Badges and micro-credentials"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-500" }, "Project-sized skills acquisition and standards alignment.")), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2.5 rounded-xl border border-slate-200 bg-white px-4 py-3 shadow-sm" }, /* @__PURE__ */ React.createElement(IconSearch, { size: 15, stroke: 1.75, className: "text-slate-400" }), /* @__PURE__ */ React.createElement(
689
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, "Badges and micro-credentials"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-500" }, "Project-sized skills acquisition and standards alignment.")), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2.5 rounded-xl border border-slate-200 bg-white px-4 py-3 shadow-sm" }, /* @__PURE__ */ React.createElement(IconSearch, { size: 15, stroke: 1.75, className: "text-slate-400" }), /* @__PURE__ */ React.createElement(
690
690
  "input",
691
691
  {
692
692
  type: "text",
@@ -803,7 +803,7 @@ function Table$d(props) {
803
803
 
804
804
  const Dashboard = (props) => {
805
805
  const [tab, setTab] = useState("students");
806
- return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, null, /* @__PURE__ */ React.createElement(Stack$5, { spacing: 0 }, /* @__PURE__ */ React.createElement(Title, { size: "h3" }, "Dashboard"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", size: "sm", mt: "md" }, "Track your students\u2019 pathway progress")), /* @__PURE__ */ React.createElement(Stack$5, null, /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(LoadingOverlay, { visible: props.loading, overlayBlur: 2 }), /* @__PURE__ */ React.createElement(Stack$5, { spacing: "sm" }, /* @__PURE__ */ React.createElement(StatsGroup, { data: [
806
+ return /* @__PURE__ */ React.createElement(Container, { fluid: true, py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, null, /* @__PURE__ */ React.createElement(Stack$5, { spacing: 0 }, /* @__PURE__ */ React.createElement(Title, { size: "h3" }, "Dashboard"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", size: "sm", mt: "md" }, "Track your students\u2019 pathway progress")), /* @__PURE__ */ React.createElement(Stack$5, null, /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(LoadingOverlay, { visible: props.loading, overlayBlur: 2 }), /* @__PURE__ */ React.createElement(Stack$5, { spacing: "sm" }, /* @__PURE__ */ React.createElement(StatsGroup, { data: [
807
807
  {
808
808
  title: "# OF STUDENTS",
809
809
  value: props.students.length
@@ -885,6 +885,25 @@ const Dashboard = (props) => {
885
885
  )))))));
886
886
  };
887
887
 
888
+ var __defProp$d = Object.defineProperty;
889
+ var __defProps$9 = Object.defineProperties;
890
+ var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
891
+ var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
892
+ var __hasOwnProp$d = Object.prototype.hasOwnProperty;
893
+ var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
894
+ var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
895
+ var __spreadValues$d = (a, b) => {
896
+ for (var prop in b || (b = {}))
897
+ if (__hasOwnProp$d.call(b, prop))
898
+ __defNormalProp$d(a, prop, b[prop]);
899
+ if (__getOwnPropSymbols$d)
900
+ for (var prop of __getOwnPropSymbols$d(b)) {
901
+ if (__propIsEnum$d.call(b, prop))
902
+ __defNormalProp$d(a, prop, b[prop]);
903
+ }
904
+ return a;
905
+ };
906
+ var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
888
907
  const openDeleteModal = (student, onDelete) => openConfirmModal({
889
908
  title: `Remove "${student.givenName && student.familyName ? `${student.givenName} ${student.familyName}` : student.email}" from this class?`,
890
909
  centered: true,
@@ -894,24 +913,32 @@ const openDeleteModal = (student, onDelete) => openConfirmModal({
894
913
  onConfirm: () => onDelete(student)
895
914
  });
896
915
  function Table$c(props) {
916
+ const preparedItems = React.useMemo(() => {
917
+ return props.items.map((item) => __spreadProps$9(__spreadValues$d({}, item), {
918
+ fullName: item.givenName && item.familyName ? `${item.givenName} ${item.familyName}`.toLowerCase() : item.email.toLowerCase()
919
+ }));
920
+ }, [props.items]);
921
+ const { items: sortedItems, requestSort, sortConfig } = useSortableData(preparedItems);
897
922
  if (props.loading) {
898
923
  return /* @__PURE__ */ React.createElement("div", { className: "text-sm text-slate-400" }, "Loading\u2026");
899
924
  }
900
925
  if (props.items.length === 0) {
901
926
  return /* @__PURE__ */ React.createElement("div", { className: "rounded-xl border border-slate-200 bg-white p-8 text-center text-sm text-slate-400 shadow-sm" }, "You have not rostered any students yet.");
902
927
  }
903
- return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-[2.2fr_1.2fr_1fr_1.2fr_1fr_0.6fr] gap-3 border-b border-slate-100 px-5 py-3 text-[10px] font-bold uppercase tracking-wide text-slate-400" }, /* @__PURE__ */ React.createElement("div", null, "Name"), /* @__PURE__ */ React.createElement("div", null, "Role"), /* @__PURE__ */ React.createElement("div", null, "Badges Earned"), /* @__PURE__ */ React.createElement("div", null, "Lessons Completed"), /* @__PURE__ */ React.createElement("div", null, "Account Created?"), /* @__PURE__ */ React.createElement("div", null)), props.items.map((row, i) => {
928
+ const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
929
+ return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-[2.2fr_1.2fr_1fr_1.2fr_1fr_0.6fr] gap-3 border-b border-slate-100 px-5 py-3 text-[10px] font-bold uppercase tracking-wide text-slate-500" }, /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("fullName"), className: "flex items-center text-left hover:text-slate-700" }, "Name", indicator("fullName")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("isAdmin"), className: "flex items-center justify-center text-center hover:text-slate-700" }, "Role", indicator("isAdmin")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("badgesEarned"), className: "flex items-center justify-center text-center hover:text-slate-700" }, "Badges Earned", indicator("badgesEarned")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("lessonsCompleted"), className: "flex items-center justify-center text-center hover:text-slate-700" }, "Lessons Completed", indicator("lessonsCompleted")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("hasAccount"), className: "flex items-center justify-center text-center hover:text-slate-700" }, "Account Created?", indicator("hasAccount")), /* @__PURE__ */ React.createElement("div", null)), sortedItems.map((row, i) => {
904
930
  var _a, _b;
905
931
  const name = row.givenName && row.familyName ? `${row.givenName} ${row.familyName}` : row.email;
906
932
  const initials = (((_a = row.givenName) == null ? void 0 : _a[0]) || row.email[0] || "?") + (((_b = row.familyName) == null ? void 0 : _b[0]) || "");
933
+ const identity = /* @__PURE__ */ React.createElement(React.Fragment, null, row.avatar ? /* @__PURE__ */ React.createElement("img", { className: "h-8 w-8 shrink-0 rounded-full object-cover", src: row.avatar, alt: name }) : /* @__PURE__ */ React.createElement("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-mint-400/20 text-[10px] font-bold text-dark-blue-400" }, initials.toUpperCase()), /* @__PURE__ */ React.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React.createElement("div", { className: "truncate text-xs font-bold text-dark-blue-400" }, name), /* @__PURE__ */ React.createElement("div", { className: "truncate text-[10.5px] text-slate-500" }, row.email)));
907
934
  return /* @__PURE__ */ React.createElement(
908
935
  "div",
909
936
  {
910
937
  key: row.email,
911
- className: `grid grid-cols-[2.2fr_1.2fr_1fr_1.2fr_1fr_0.6fr] items-center gap-3 px-5 py-3.5 ${i < props.items.length - 1 ? "border-b border-slate-100" : ""}`
938
+ className: `grid grid-cols-[2.2fr_1.2fr_1fr_1.2fr_1fr_0.6fr] items-center gap-3 px-5 py-3.5 ${i < sortedItems.length - 1 ? "border-b border-slate-100" : ""}`
912
939
  },
913
- /* @__PURE__ */ React.createElement(Link, { to: row.href, className: "flex min-w-0 items-center gap-2.5 no-underline" }, row.avatar ? /* @__PURE__ */ React.createElement("img", { className: "h-8 w-8 shrink-0 rounded-full object-cover", src: row.avatar, alt: name }) : /* @__PURE__ */ React.createElement("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-mint-400/20 text-[10px] font-bold text-dark-blue-400" }, initials.toUpperCase()), /* @__PURE__ */ React.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React.createElement("div", { className: "truncate text-xs font-bold text-dark-blue-400" }, name), /* @__PURE__ */ React.createElement("div", { className: "truncate text-[10.5px] text-slate-400" }, row.email))),
914
- /* @__PURE__ */ React.createElement(
940
+ row.href ? /* @__PURE__ */ React.createElement(Link, { to: row.href, className: "flex min-w-0 items-center gap-2.5 no-underline" }, identity) : /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 items-center gap-2.5" }, identity),
941
+ /* @__PURE__ */ React.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React.createElement(
915
942
  "select",
916
943
  {
917
944
  disabled: row.readonly,
@@ -921,16 +948,16 @@ function Table$c(props) {
921
948
  },
922
949
  /* @__PURE__ */ React.createElement("option", { value: "student" }, "Student"),
923
950
  /* @__PURE__ */ React.createElement("option", { value: "educator" }, "Educator")
924
- ),
925
- /* @__PURE__ */ React.createElement("div", { className: "text-xs font-bold text-dark-blue-400" }, row.badgesEarned),
926
- /* @__PURE__ */ React.createElement("div", { className: "text-xs font-bold text-dark-blue-400" }, row.lessonsCompleted),
927
- /* @__PURE__ */ React.createElement("div", null, row.hasAccount && /* @__PURE__ */ React.createElement(IconCheck, { size: 16, stroke: 3, className: "text-mint-400" })),
951
+ )),
952
+ /* @__PURE__ */ React.createElement("div", { className: "text-center text-xs font-bold text-dark-blue-400" }, row.badgesEarned),
953
+ /* @__PURE__ */ React.createElement("div", { className: "text-center text-xs font-bold text-dark-blue-400" }, row.lessonsCompleted),
954
+ /* @__PURE__ */ React.createElement("div", { className: "flex justify-center" }, row.hasAccount && /* @__PURE__ */ React.createElement(IconCheck, { size: 16, stroke: 3, className: "text-mint-400" })),
928
955
  /* @__PURE__ */ React.createElement("div", null, !row.readonly && !!props.onDelete && /* @__PURE__ */ React.createElement(
929
956
  "button",
930
957
  {
931
958
  type: "button",
932
959
  onClick: () => openDeleteModal(row, props.onDelete),
933
- className: "flex h-7 w-7 items-center justify-center rounded-md text-slate-300 hover:bg-red-50 hover:text-red-500"
960
+ className: "flex h-7 w-7 items-center justify-center rounded-md text-slate-400 hover:bg-red-50 hover:text-red-500"
934
961
  },
935
962
  /* @__PURE__ */ React.createElement(IconTrash, { size: 14, stroke: 1.75 })
936
963
  ))
@@ -938,25 +965,25 @@ function Table$c(props) {
938
965
  }));
939
966
  }
940
967
 
941
- var __defProp$b = Object.defineProperty;
942
- var __defProps$7 = Object.defineProperties;
943
- var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
944
- var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
945
- var __hasOwnProp$b = Object.prototype.hasOwnProperty;
946
- var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
947
- var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
948
- var __spreadValues$b = (a, b) => {
968
+ var __defProp$c = Object.defineProperty;
969
+ var __defProps$8 = Object.defineProperties;
970
+ var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
971
+ var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
972
+ var __hasOwnProp$c = Object.prototype.hasOwnProperty;
973
+ var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
974
+ var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
975
+ var __spreadValues$c = (a, b) => {
949
976
  for (var prop in b || (b = {}))
950
- if (__hasOwnProp$b.call(b, prop))
951
- __defNormalProp$b(a, prop, b[prop]);
952
- if (__getOwnPropSymbols$b)
953
- for (var prop of __getOwnPropSymbols$b(b)) {
954
- if (__propIsEnum$b.call(b, prop))
955
- __defNormalProp$b(a, prop, b[prop]);
977
+ if (__hasOwnProp$c.call(b, prop))
978
+ __defNormalProp$c(a, prop, b[prop]);
979
+ if (__getOwnPropSymbols$c)
980
+ for (var prop of __getOwnPropSymbols$c(b)) {
981
+ if (__propIsEnum$c.call(b, prop))
982
+ __defNormalProp$c(a, prop, b[prop]);
956
983
  }
957
984
  return a;
958
985
  };
959
- var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
986
+ var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
960
987
  const Class = (props) => {
961
988
  const [opened, setOpened] = useState(false);
962
989
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
@@ -968,8 +995,8 @@ const Class = (props) => {
968
995
  padding: "xl",
969
996
  size: "xl"
970
997
  },
971
- /* @__PURE__ */ React.createElement(DropzoneButton$1, __spreadProps$7(__spreadValues$b({}, props), { close: () => setOpened(false) }))
972
- ), /* @__PURE__ */ React.createElement("div", { className: "mx-auto flex max-w-5xl flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-start justify-between gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React.createElement("div", { onClick: props.onBackClick, className: "flex w-max cursor-pointer items-center gap-1 text-xs font-bold text-sky-blue-400" }, /* @__PURE__ */ React.createElement(IconArrowLeft, { size: 13, stroke: 2.5 }), "Back"), /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, props.displayName || "Class"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-500" }, props.description || "No description")), !props.loading && /* @__PURE__ */ React.createElement("div", { className: "flex gap-2" }, /* @__PURE__ */ React.createElement(
998
+ /* @__PURE__ */ React.createElement(DropzoneButton$1, __spreadProps$8(__spreadValues$c({}, props), { close: () => setOpened(false) }))
999
+ ), /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-start justify-between gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React.createElement("div", { onClick: props.onBackClick, className: "flex w-max cursor-pointer items-center gap-1 text-xs font-bold text-sky-blue-400" }, /* @__PURE__ */ React.createElement(IconArrowLeft, { size: 13, stroke: 2.5 }), "Back"), /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, props.displayName || "Class"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-500" }, props.description || "No description")), !props.loading && /* @__PURE__ */ React.createElement("div", { className: "flex gap-2" }, /* @__PURE__ */ React.createElement(
973
1000
  "button",
974
1001
  {
975
1002
  type: "button",
@@ -1094,20 +1121,20 @@ const DropzoneButton$1 = (props) => {
1094
1121
  props.onCreateMembers && props.onCreateMembers([values]);
1095
1122
  }) }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement(
1096
1123
  TextInput,
1097
- __spreadValues$b({
1124
+ __spreadValues$c({
1098
1125
  withAsterisk: true,
1099
1126
  label: "Email",
1100
1127
  placeholder: "Email"
1101
1128
  }, form.getInputProps("email"))
1102
1129
  ), /* @__PURE__ */ React.createElement(Group, { grow: true }, /* @__PURE__ */ React.createElement(
1103
1130
  TextInput,
1104
- __spreadValues$b({
1131
+ __spreadValues$c({
1105
1132
  label: "Given name",
1106
1133
  placeholder: "Given name"
1107
1134
  }, form.getInputProps("givenName"))
1108
1135
  ), /* @__PURE__ */ React.createElement(
1109
1136
  TextInput,
1110
- __spreadValues$b({
1137
+ __spreadValues$c({
1111
1138
  label: "Family name",
1112
1139
  placeholder: "Family name"
1113
1140
  }, form.getInputProps("familyName"))
@@ -1187,23 +1214,23 @@ function Table$b(props) {
1187
1214
  ));
1188
1215
  }
1189
1216
 
1190
- var __defProp$a = Object.defineProperty;
1191
- var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
1192
- var __hasOwnProp$a = Object.prototype.hasOwnProperty;
1193
- var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
1194
- var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1195
- var __spreadValues$a = (a, b) => {
1217
+ var __defProp$b = Object.defineProperty;
1218
+ var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
1219
+ var __hasOwnProp$b = Object.prototype.hasOwnProperty;
1220
+ var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
1221
+ var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1222
+ var __spreadValues$b = (a, b) => {
1196
1223
  for (var prop in b || (b = {}))
1197
- if (__hasOwnProp$a.call(b, prop))
1198
- __defNormalProp$a(a, prop, b[prop]);
1199
- if (__getOwnPropSymbols$a)
1200
- for (var prop of __getOwnPropSymbols$a(b)) {
1201
- if (__propIsEnum$a.call(b, prop))
1202
- __defNormalProp$a(a, prop, b[prop]);
1224
+ if (__hasOwnProp$b.call(b, prop))
1225
+ __defNormalProp$b(a, prop, b[prop]);
1226
+ if (__getOwnPropSymbols$b)
1227
+ for (var prop of __getOwnPropSymbols$b(b)) {
1228
+ if (__propIsEnum$b.call(b, prop))
1229
+ __defNormalProp$b(a, prop, b[prop]);
1203
1230
  }
1204
1231
  return a;
1205
1232
  };
1206
- const useStyles$j = createStyles((theme) => ({
1233
+ const useStyles$f = createStyles((theme) => ({
1207
1234
  title: {
1208
1235
  fontSize: 34,
1209
1236
  fontWeight: 900,
@@ -1216,7 +1243,7 @@ const useStyles$j = createStyles((theme) => ({
1216
1243
  }
1217
1244
  }));
1218
1245
  const Classes = (props) => {
1219
- const { classes } = useStyles$j();
1246
+ const { classes } = useStyles$f();
1220
1247
  const form = useForm({
1221
1248
  initialValues: {
1222
1249
  classId: "",
@@ -1246,19 +1273,19 @@ const Classes = (props) => {
1246
1273
  props.onCreateClass && props.onCreateClass(values);
1247
1274
  }) }, /* @__PURE__ */ React.createElement(Stack$5, null, /* @__PURE__ */ React.createElement(
1248
1275
  TextInput,
1249
- __spreadValues$a({
1276
+ __spreadValues$b({
1250
1277
  withAsterisk: true,
1251
1278
  label: "Name",
1252
1279
  placeholder: "Class name"
1253
1280
  }, form.getInputProps("name"))
1254
1281
  ), /* @__PURE__ */ React.createElement(
1255
1282
  TextInput,
1256
- __spreadValues$a({
1283
+ __spreadValues$b({
1257
1284
  label: "Description",
1258
1285
  placeholder: "A class for my first period English students"
1259
1286
  }, form.getInputProps("description"))
1260
1287
  )), /* @__PURE__ */ React.createElement(Button, { type: "submit", fullWidth: true, mt: "md" }, "Submit"))
1261
- ), /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(Badge$1, { variant: "filled", size: "lg" }, "Classes"), /* @__PURE__ */ React.createElement(Title, { order: 2, className: classes.title, mt: "md" }, "Organize people into classes"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", className: classes.description, mt: "sm" }, "Create classes, cohorts, or custom subgroups")), /* @__PURE__ */ React.createElement(Grid.Col, { sm: "content" }, !props.loading && /* @__PURE__ */ React.createElement(
1288
+ ), /* @__PURE__ */ React.createElement(Container, { fluid: true, py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(Badge$1, { variant: "filled", size: "lg" }, "Classes"), /* @__PURE__ */ React.createElement(Title, { order: 2, className: classes.title, mt: "md" }, "Organize people into classes"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", className: classes.description, mt: "sm" }, "Create classes, cohorts, or custom subgroups")), /* @__PURE__ */ React.createElement(Grid.Col, { sm: "content" }, !props.loading && /* @__PURE__ */ React.createElement(
1262
1289
  Button,
1263
1290
  {
1264
1291
  onClick: () => setOpened(true),
@@ -1287,24 +1314,6 @@ const Classes = (props) => {
1287
1314
  ))))));
1288
1315
  };
1289
1316
 
1290
- const useStyles$i = createStyles((theme) => ({
1291
- title: {
1292
- fontSize: 34,
1293
- fontWeight: 900,
1294
- marginTop: 16,
1295
- [theme.fn.smallerThan("sm")]: {
1296
- fontSize: 24
1297
- }
1298
- },
1299
- description: {
1300
- maxWidth: 600
1301
- }
1302
- }));
1303
- const UserInfo = (props) => {
1304
- const { classes } = useStyles$i();
1305
- 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));
1306
- };
1307
-
1308
1317
  function Table$a(props) {
1309
1318
  if (props.items.length === 0) {
1310
1319
  return /* @__PURE__ */ React.createElement(
@@ -1317,28 +1326,15 @@ function Table$a(props) {
1317
1326
  }
1318
1327
  );
1319
1328
  }
1320
- return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(
1321
- DataTable,
1329
+ return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm" }, props.items.map((row, i) => /* @__PURE__ */ React.createElement(
1330
+ "div",
1322
1331
  {
1323
- verticalSpacing: "sm",
1324
- sx: { minWidth: 700 },
1325
- withBorder: false,
1326
- borderRadius: "sm",
1327
- withColumnBorders: true,
1328
- striped: true,
1329
- highlightOnHover: true,
1330
- records: props.items,
1331
- idAccessor: "badgeId",
1332
- columns: [{
1333
- accessor: "name",
1334
- title: "Badge Name",
1335
- render: (row) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Text, null, row.badgeName))
1336
- }, {
1337
- accessor: "status",
1338
- 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"))
1339
- }]
1340
- }
1341
- ));
1332
+ key: row.badgeId || row.badgeName,
1333
+ className: `flex items-center justify-between gap-4 px-5 py-4 ${i < props.items.length - 1 ? "border-b border-slate-100" : ""}`
1334
+ },
1335
+ /* @__PURE__ */ React.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, row.badgeName),
1336
+ /* @__PURE__ */ React.createElement("span", { className: `shrink-0 rounded-full px-2.5 py-1 text-[10px] font-bold uppercase tracking-wide ${row.isComplete ? "bg-mint-100 text-dark-blue-400" : "bg-slate-100 text-slate-500"}` }, row.isComplete ? "Complete" : "Incomplete")
1337
+ )));
1342
1338
  }
1343
1339
 
1344
1340
  function Table$9(props) {
@@ -1353,8 +1349,26 @@ function Table$9(props) {
1353
1349
  }
1354
1350
  );
1355
1351
  }
1356
- const rows = props.items.map((row) => /* @__PURE__ */ React.createElement("tr", { key: row.questionName }, /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Text, { component: Link, to: row.href }, row.lessonName)), /* @__PURE__ */ React.createElement("td", null, row.questionName), /* @__PURE__ */ React.createElement("td", null, row.answer.join(","))));
1357
- return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$l, { 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, "Question"), /* @__PURE__ */ React.createElement("th", null, "Answer"))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
1352
+ const groups = [];
1353
+ const groupByLessonId = {};
1354
+ props.items.forEach((row) => {
1355
+ let group = groupByLessonId[row.lessonId];
1356
+ if (!group) {
1357
+ group = { lessonId: row.lessonId, lessonName: row.lessonName, badgeName: row.badgeName, href: row.href, items: [] };
1358
+ groupByLessonId[row.lessonId] = group;
1359
+ groups.push(group);
1360
+ }
1361
+ group.items.push(row);
1362
+ });
1363
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, groups.map((group) => /* @__PURE__ */ React.createElement("div", { key: group.lessonId, className: "overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "border-b border-slate-100 px-5 py-4" }, /* @__PURE__ */ React.createElement(Link, { to: group.href, className: "text-sm font-bold text-dark-blue-400 no-underline hover:underline" }, group.lessonName), group.badgeName && /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-xs text-slate-500" }, group.badgeName)), group.items.map((row, i) => /* @__PURE__ */ React.createElement(
1364
+ "div",
1365
+ {
1366
+ key: row.questionName,
1367
+ className: `px-5 py-4 ${i < group.items.length - 1 ? "border-b border-slate-100" : ""}`
1368
+ },
1369
+ /* @__PURE__ */ React.createElement("div", { className: "text-xs font-semibold text-slate-500" }, row.questionName),
1370
+ /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-xs text-slate-600" }, row.answer.join(", "))
1371
+ )))));
1358
1372
  }
1359
1373
 
1360
1374
  function Table$8(props) {
@@ -1369,299 +1383,142 @@ function Table$8(props) {
1369
1383
  }
1370
1384
  );
1371
1385
  }
1372
- const rows = props.items.map((row) => /* @__PURE__ */ React.createElement("tr", { key: row.lessonName }, /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(Text, { component: Link, to: row.href }, row.lessonName)), /* @__PURE__ */ React.createElement("td", null, row.reflection), /* @__PURE__ */ React.createElement("td", null, row.rating.toLocaleString())));
1373
- return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$l, { 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, "Reflection"), /* @__PURE__ */ React.createElement("th", null, "Rating"))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
1386
+ return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm" }, props.items.map((row, i) => /* @__PURE__ */ React.createElement(
1387
+ "div",
1388
+ {
1389
+ key: row.lessonId || row.lessonName,
1390
+ className: `flex items-start justify-between gap-4 px-5 py-4 ${i < props.items.length - 1 ? "border-b border-slate-100" : ""}`
1391
+ },
1392
+ /* @__PURE__ */ React.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React.createElement(Link, { to: row.href, className: "text-sm font-bold text-dark-blue-400 no-underline hover:underline" }, row.lessonName), row.badgeName && /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-xs text-slate-500" }, row.badgeName), /* @__PURE__ */ React.createElement("div", { className: "mt-1.5 text-xs text-slate-600" }, row.reflection)),
1393
+ /* @__PURE__ */ React.createElement("div", { className: "shrink-0 rounded-full bg-gold-100 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, row.rating.toLocaleString())
1394
+ )));
1374
1395
  }
1375
1396
 
1397
+ const TABS$1 = [
1398
+ { label: "My badges", value: "badges" },
1399
+ { label: "My answers", value: "answers" },
1400
+ { label: "My reflections", value: "reflections" }
1401
+ ];
1376
1402
  const Student = (props) => {
1377
1403
  const [tab, setTab] = useState("badges");
1378
1404
  const numberOfBadgesCompleted = props.badges.length > 0 ? props.badges.filter((b) => b.isComplete).length : 0;
1379
- const TEMPORARY_numberOfLessonsCompleted = props.lessons.filter((l) => l.isComplete).length;
1380
- return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, { gutter: "md" }, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
1381
- Badge$1,
1382
- {
1383
- variant: "filled",
1384
- leftSection: /* @__PURE__ */ React.createElement(ActionIcon, { color: "blue", size: "xs", radius: "xl", variant: "filled" }, /* @__PURE__ */ React.createElement(IconArrowLeft, { size: 14 })),
1385
- size: "lg"
1386
- },
1387
- "Back"
1388
- )), /* @__PURE__ */ React.createElement(
1389
- UserInfo,
1390
- {
1391
- variant: "compact",
1392
- name: props.name,
1393
- impactStatement: props.impactStatement
1394
- }
1395
- ))), /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(LoadingOverlay, { visible: props.loading, overlayBlur: 2 }), /* @__PURE__ */ React.createElement(Stack$5, { spacing: "lg" }, /* @__PURE__ */ React.createElement(StatsGroup, { data: [
1405
+ const numberOfLessonsCompleted = props.lessons.filter((l) => l.isComplete).length;
1406
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React.createElement("div", { onClick: props.onBackClick, className: "flex w-max cursor-pointer items-center gap-1 text-xs font-bold text-sky-blue-400" }, /* @__PURE__ */ React.createElement(IconArrowLeft, { size: 13, stroke: 2.5 }), "Back"), /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, props.name || "Student"), props.impactStatement && /* @__PURE__ */ React.createElement("p", { className: "max-w-xl text-sm text-slate-500" }, props.impactStatement)), /* @__PURE__ */ React.createElement(StatsGroup, { data: [
1396
1407
  {
1397
1408
  title: "PROBLEMS SOLVED",
1398
1409
  value: props.numberOfProblemsSolved
1399
1410
  },
1400
1411
  {
1401
1412
  title: "LESSON COMPLETION",
1402
- value: TEMPORARY_numberOfLessonsCompleted,
1403
- unit: ""
1413
+ value: numberOfLessonsCompleted
1404
1414
  },
1405
1415
  {
1406
1416
  title: "BADGE COMPLETION",
1407
- value: numberOfBadgesCompleted,
1408
- unit: ""
1417
+ value: numberOfBadgesCompleted
1409
1418
  }
1410
- ] }), /* @__PURE__ */ React.createElement(Stack$5, { spacing: 0 }, /* @__PURE__ */ React.createElement(
1411
- Tabs,
1419
+ ] }), /* @__PURE__ */ React.createElement("div", { className: "flex w-fit gap-1 rounded-xl border border-slate-200 bg-white p-1" }, TABS$1.map((t) => /* @__PURE__ */ React.createElement(
1420
+ "button",
1412
1421
  {
1413
- value: tab,
1414
- data: [
1415
- { label: "My badges", value: "badges" },
1416
- { label: "My answers", value: "answers" },
1417
- { label: "My reflections", value: "reflections" }
1418
- ],
1419
- onChange: setTab
1422
+ key: t.value,
1423
+ onClick: () => setTab(t.value),
1424
+ className: `rounded-lg px-4 py-2 text-xs font-bold ${tab === t.value ? "bg-sky-blue-400/20 text-dark-blue-400" : "text-slate-400 hover:text-slate-600"}`
1425
+ },
1426
+ t.label
1427
+ ))), tab === "badges" && /* @__PURE__ */ React.createElement(Table$a, { loading: props.loading, items: props.badges }), tab === "answers" && /* @__PURE__ */ React.createElement(Table$9, { loading: props.loading, items: props.answers }), tab === "reflections" && /* @__PURE__ */ React.createElement(Table$8, { loading: props.loading, items: props.reflections }));
1428
+ };
1429
+
1430
+ const ACCENT_BORDER = {
1431
+ cyan: "border-l-sky-blue-400",
1432
+ mint: "border-l-mint-400",
1433
+ gold: "border-l-gold-400"
1434
+ };
1435
+ const ACCENT_GRADIENT = {
1436
+ cyan: "from-sky-blue-400",
1437
+ mint: "from-mint-400",
1438
+ gold: "from-gold-400"
1439
+ };
1440
+ function CardGradient(props) {
1441
+ const accent = props.accent || "cyan";
1442
+ return /* @__PURE__ */ React.createElement(
1443
+ "div",
1444
+ {
1445
+ onClick: props.onClick,
1446
+ className: `flex cursor-pointer items-center gap-[18px] rounded-2xl border border-l-4 border-slate-200 bg-white px-[22px] py-[18px] transition-transform hover:scale-[1.02] hover:shadow-md ${ACCENT_BORDER[accent]}`
1447
+ },
1448
+ /* @__PURE__ */ React.createElement("div", { className: `flex h-10 w-10 shrink-0 items-center justify-center rounded-[10px] bg-gradient-to-br ${ACCENT_GRADIENT[accent]} to-dark-blue-400 text-white` }, props.icon),
1449
+ /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-[15.5px] font-extrabold text-dark-blue-400" }, props.title), /* @__PURE__ */ React.createElement("div", { className: "mt-0.5 text-xs text-slate-500" }, props.description))
1450
+ );
1451
+ }
1452
+
1453
+ const Home = (props) => {
1454
+ const accessCode = props.organization.accessCode;
1455
+ const onCopyAccessCode = async () => {
1456
+ if (!accessCode)
1457
+ return;
1458
+ try {
1459
+ await navigator.clipboard.writeText(accessCode);
1460
+ showNotification({
1461
+ title: "Copied!",
1462
+ message: "Community code copied to clipboard.",
1463
+ autoClose: 3e3
1464
+ });
1465
+ } catch (err) {
1466
+ console.error("Failed to copy code", err);
1420
1467
  }
1421
- ), tab === "badges" && /* @__PURE__ */ React.createElement(
1422
- Table$a,
1468
+ };
1469
+ return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-5" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-stretch gap-5" }, /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "text-[28px] font-extrabold text-dark-blue-400" }, props.name), /* @__PURE__ */ React.createElement("div", { className: "mt-1.5 text-[12.5px] text-slate-400" }, props.impactStatement)), /* @__PURE__ */ React.createElement("div", { className: "flex w-[440px] shrink-0 flex-col justify-between gap-3 rounded-2xl bg-gradient-to-br from-dark-blue-600 via-dark-blue-400 to-sky-blue-400 p-5" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-base font-extrabold text-white" }, props.organization.name), /* @__PURE__ */ React.createElement("div", { className: "mt-1.5 text-[11.5px] leading-relaxed text-white/70" }, props.organization.description)), accessCode && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement("span", { className: "text-[11px] text-white/70" }, "Community code: ", accessCode), /* @__PURE__ */ React.createElement(
1470
+ "button",
1423
1471
  {
1424
- loading: props.loading,
1425
- items: props.badges
1472
+ onClick: onCopyAccessCode,
1473
+ className: "rounded-md bg-white/90 px-2.5 py-1 text-[10.5px] font-bold text-dark-blue-400 hover:bg-white"
1474
+ },
1475
+ "Copy"
1476
+ )))), /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement(
1477
+ CardGradient,
1478
+ {
1479
+ title: "Dashboard",
1480
+ description: "Track your students\u2019 pathway progress",
1481
+ accent: "mint",
1482
+ icon: /* @__PURE__ */ React.createElement(IconGauge, { size: 18, stroke: 1.75 }),
1483
+ onClick: props.onDashboardClick
1426
1484
  }
1427
- ), tab === "answers" && /* @__PURE__ */ React.createElement(
1428
- Table$9,
1485
+ ), /* @__PURE__ */ React.createElement(
1486
+ CardGradient,
1429
1487
  {
1430
- loading: props.loading,
1431
- items: props.answers
1488
+ title: "Classes",
1489
+ description: "Create classes, cohorts, or custom subgroups",
1490
+ accent: "gold",
1491
+ icon: /* @__PURE__ */ React.createElement(IconCategory2, { size: 18, stroke: 1.75 }),
1492
+ onClick: props.onClassesClick
1432
1493
  }
1433
- ), tab === "reflections" && /* @__PURE__ */ React.createElement(
1434
- Table$8,
1494
+ ), /* @__PURE__ */ React.createElement(
1495
+ CardGradient,
1435
1496
  {
1436
- loading: props.loading,
1437
- items: props.reflections
1497
+ title: "Pathways",
1498
+ description: "Explore all your unique pathway requirements in one clear space",
1499
+ accent: "cyan",
1500
+ icon: /* @__PURE__ */ React.createElement(IconRoute, { size: 18, stroke: 1.75 }),
1501
+ onClick: props.onPathwaysClick
1438
1502
  }
1439
- ))))));
1440
- };
1441
-
1442
- const useStyles$h = createStyles((theme, props) => {
1443
- const from = props.from || "blue";
1444
- const to = props.to || "green";
1445
- return {
1446
- card: {
1447
- position: "relative",
1448
- cursor: "pointer",
1449
- overflow: "hidden",
1450
- transition: "transform 150ms ease, box-shadow 100ms ease",
1451
- padding: theme.spacing.xl,
1452
- paddingLeft: theme.spacing.xl * 2,
1453
- "&:hover": {
1454
- boxShadow: theme.shadows.md,
1455
- transform: "scale(1.02)"
1456
- },
1457
- "&::before": {
1458
- content: '""',
1459
- position: "absolute",
1460
- top: 0,
1461
- bottom: 0,
1462
- left: 0,
1463
- width: 6,
1464
- backgroundImage: theme.fn.linearGradient(0, theme.colors[from][6], theme.colors[to][6])
1465
- }
1466
- }
1467
- };
1468
- });
1469
- function CardGradient(props) {
1470
- const { classes } = useStyles$h(props);
1471
- const from = props.from || "blue";
1472
- const to = props.to || "green";
1473
- const icon = props.icon || /* @__PURE__ */ React.createElement(IconColorSwatch, { size: 28, stroke: 1.5 });
1474
- return /* @__PURE__ */ React.createElement(Paper, { withBorder: true, radius: "md", className: classes.card, onClick: props.onClick }, /* @__PURE__ */ React.createElement(
1475
- ThemeIcon,
1476
- {
1477
- size: "xl",
1478
- radius: "md",
1479
- variant: "gradient",
1480
- gradient: { deg: 0, from, to }
1481
- },
1482
- icon
1483
- ), /* @__PURE__ */ React.createElement(Text, { size: "xl", weight: 500, mt: "md" }, props.title), /* @__PURE__ */ React.createElement(Text, { size: "sm", mt: "sm", color: "dimmed" }, props.description));
1484
- }
1485
-
1486
- var __defProp$9 = Object.defineProperty;
1487
- var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
1488
- var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
1489
- var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
1490
- var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1491
- var __spreadValues$9 = (a, b) => {
1492
- for (var prop in b || (b = {}))
1493
- if (__hasOwnProp$9.call(b, prop))
1494
- __defNormalProp$9(a, prop, b[prop]);
1495
- if (__getOwnPropSymbols$9)
1496
- for (var prop of __getOwnPropSymbols$9(b)) {
1497
- if (__propIsEnum$9.call(b, prop))
1498
- __defNormalProp$9(a, prop, b[prop]);
1499
- }
1500
- return a;
1501
- };
1502
- var __objRest$1 = (source, exclude) => {
1503
- var target = {};
1504
- for (var prop in source)
1505
- if (__hasOwnProp$9.call(source, prop) && exclude.indexOf(prop) < 0)
1506
- target[prop] = source[prop];
1507
- if (source != null && __getOwnPropSymbols$9)
1508
- for (var prop of __getOwnPropSymbols$9(source)) {
1509
- if (exclude.indexOf(prop) < 0 && __propIsEnum$9.call(source, prop))
1510
- target[prop] = source[prop];
1511
- }
1512
- return target;
1513
- };
1514
- const useStyles$g = createStyles((theme) => ({
1515
- card: {
1516
- height: 240,
1517
- backgroundSize: "cover",
1518
- backgroundPosition: "center",
1519
- whiteSpace: "pre-line"
1520
- },
1521
- content: {
1522
- position: "absolute",
1523
- padding: theme.spacing.xl,
1524
- zIndex: 1,
1525
- top: 0,
1526
- bottom: 0,
1527
- right: 0,
1528
- left: 0
1529
- },
1530
- title: {
1531
- color: theme.white,
1532
- marginBottom: theme.spacing.xs / 2
1533
- },
1534
- description: {
1535
- color: theme.white,
1536
- maxWidth: 220
1537
- },
1538
- code: {
1539
- color: theme.white,
1540
- maxWidth: 220
1541
- }
1542
- }));
1543
- const TenantBanner = (_a) => {
1544
- var _b = _a, {
1545
- title,
1546
- description,
1547
- image,
1548
- style,
1549
- className,
1550
- code
1551
- } = _b, others = __objRest$1(_b, [
1552
- "title",
1553
- "description",
1554
- "image",
1555
- "style",
1556
- "className",
1557
- "code"
1558
- ]);
1559
- const { classes, cx, theme } = useStyles$g();
1560
- const handleCopy = async () => {
1561
- if (!code)
1562
- return;
1563
- try {
1564
- await navigator.clipboard.writeText(code);
1565
- showNotification({
1566
- title: "Copied!",
1567
- message: "Community code copied to clipboard.",
1568
- autoClose: 3e3
1569
- });
1570
- } catch (err) {
1571
- console.error("Failed to copy code", err);
1572
- }
1573
- };
1574
- return /* @__PURE__ */ React.createElement(
1575
- Card,
1576
- __spreadValues$9({
1577
- radius: "md",
1578
- style: __spreadValues$9({ backgroundImage: `url(${image})` }, style),
1579
- className: cx(classes.card, className)
1580
- }, others),
1581
- /* @__PURE__ */ React.createElement(
1582
- Overlay,
1583
- {
1584
- gradient: `linear-gradient(105deg, ${theme.black} 20%, #312f2f 50%, ${theme.colors.gray[6]} 100%)`,
1585
- opacity: 0.55,
1586
- zIndex: 0
1587
- }
1588
- ),
1589
- /* @__PURE__ */ React.createElement("div", { className: classes.content }, /* @__PURE__ */ React.createElement(Text, { size: "lg", weight: 700, className: classes.title }, title), /* @__PURE__ */ React.createElement(Text, { size: "sm", className: classes.description }, description), /* @__PURE__ */ React.createElement(Group, { mt: "sm", spacing: "xs" }, /* @__PURE__ */ React.createElement(Text, { size: "sm", className: classes.code }, "Community Code: ", code || "\u2014"), code && /* @__PURE__ */ React.createElement(
1590
- Button,
1591
- {
1592
- size: "xs",
1593
- variant: "white",
1594
- onClick: handleCopy,
1595
- styles: {
1596
- root: {
1597
- backgroundColor: "rgba(255,255,255,0.9)"
1598
- }
1599
- }
1600
- },
1601
- "Copy"
1602
- )))
1603
- );
1604
- };
1605
-
1606
- const Home = (props) => {
1607
- return /* @__PURE__ */ React.createElement(Container, { size: "lg" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "lg" }, /* @__PURE__ */ React.createElement(Grid, { gutter: "md" }, /* @__PURE__ */ React.createElement(Grid.Col, { md: 6 }, /* @__PURE__ */ React.createElement(
1608
- UserInfo,
1609
- {
1610
- variant: "compact",
1611
- name: props.name,
1612
- impactStatement: props.impactStatement
1613
- }
1614
- )), /* @__PURE__ */ React.createElement(Grid.Col, { md: 6 }, /* @__PURE__ */ React.createElement(
1615
- TenantBanner,
1616
- {
1617
- title: props.organization.name,
1618
- description: props.organization.description,
1619
- image: props.organization.image,
1620
- code: props.organization.accessCode
1621
- }
1622
- ))), /* @__PURE__ */ React.createElement(Grid, { gutter: "md" }, /* @__PURE__ */ React.createElement(Grid.Col, null, /* @__PURE__ */ React.createElement(
1623
- CardGradient,
1624
- {
1625
- title: "Dashboard",
1626
- description: "Track your students\u2019 pathway progress",
1627
- onClick: props.onDashboardClick
1628
- }
1629
- )), /* @__PURE__ */ React.createElement(Grid.Col, null, /* @__PURE__ */ React.createElement(
1630
- CardGradient,
1631
- {
1632
- title: "Classes",
1633
- description: "Create classes, cohorts, or custom subgroups",
1634
- onClick: props.onClassesClick
1635
- }
1636
- )), /* @__PURE__ */ React.createElement(Grid.Col, null, /* @__PURE__ */ React.createElement(
1637
- CardGradient,
1638
- {
1639
- title: "Pathways",
1640
- description: "Explore all your unique pathway requirements in one clear space",
1641
- onClick: props.onPathwaysClick
1642
- }
1643
- )), /* @__PURE__ */ React.createElement(Grid.Col, null, /* @__PURE__ */ React.createElement(
1644
- CardGradient,
1645
- {
1646
- title: "Badges",
1647
- description: "Key milestones that reflect skill development, micro-credentials, or academic progress",
1648
- onClick: props.onBadgesClick
1649
- }
1650
- )), /* @__PURE__ */ React.createElement(Grid.Col, null, /* @__PURE__ */ React.createElement(
1651
- CardGradient,
1652
- {
1653
- title: "Lessons",
1654
- description: "Bite-sized activities and learning experiences accelerating students achievement",
1655
- onClick: props.onLessonsClick
1656
- }
1657
- )), /* @__PURE__ */ React.createElement(Grid.Col, null, /* @__PURE__ */ React.createElement(
1658
- CardGradient,
1659
- {
1660
- title: "File Locker",
1661
- description: "A secure space to view student-submitted work and provide feedback",
1662
- onClick: props.onFileLockerClick
1663
- }
1664
- )))));
1503
+ ), /* @__PURE__ */ React.createElement(
1504
+ CardGradient,
1505
+ {
1506
+ title: "Badges",
1507
+ description: "Key milestones that reflect skill development, micro-credentials, or academic progress",
1508
+ accent: "mint",
1509
+ icon: /* @__PURE__ */ React.createElement(IconAlbum, { size: 18, stroke: 1.75 }),
1510
+ onClick: props.onBadgesClick
1511
+ }
1512
+ ), /* @__PURE__ */ React.createElement(
1513
+ CardGradient,
1514
+ {
1515
+ title: "File Locker",
1516
+ description: "A secure space to view student-submitted work and provide feedback",
1517
+ accent: "cyan",
1518
+ icon: /* @__PURE__ */ React.createElement(IconClipboard, { size: 18, stroke: 1.75 }),
1519
+ onClick: props.onFileLockerClick
1520
+ }
1521
+ )));
1665
1522
  };
1666
1523
 
1667
1524
  function Table$7(props) {
@@ -1696,7 +1553,7 @@ function Table$7(props) {
1696
1553
  ));
1697
1554
  }
1698
1555
 
1699
- const useStyles$f = createStyles((theme) => ({
1556
+ const useStyles$e = createStyles((theme) => ({
1700
1557
  button: {
1701
1558
  borderTopRightRadius: 0,
1702
1559
  borderBottomRightRadius: 0,
@@ -1711,7 +1568,7 @@ const useStyles$f = createStyles((theme) => ({
1711
1568
  }
1712
1569
  }));
1713
1570
  const SplitButton$3 = (props) => {
1714
- const { classes, theme } = useStyles$f();
1571
+ const { classes, theme } = useStyles$e();
1715
1572
  theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
1716
1573
  return /* @__PURE__ */ React.createElement(Stack$5, { spacing: "sm" }, /* @__PURE__ */ React.createElement(
1717
1574
  Button,
@@ -1748,28 +1605,28 @@ function Stack$3(props) {
1748
1605
  return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(UnstyledButton, { component: Link, to: props.href }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: 24, sx: { padding: 20, minWidth: 700 } }, rows)));
1749
1606
  }
1750
1607
 
1751
- var __defProp$8 = Object.defineProperty;
1752
- var __defProps$6 = Object.defineProperties;
1753
- var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
1754
- var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
1755
- var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
1756
- var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
1757
- var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1758
- var __spreadValues$8 = (a, b) => {
1608
+ var __defProp$a = Object.defineProperty;
1609
+ var __defProps$7 = Object.defineProperties;
1610
+ var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
1611
+ var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
1612
+ var __hasOwnProp$a = Object.prototype.hasOwnProperty;
1613
+ var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
1614
+ var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1615
+ var __spreadValues$a = (a, b) => {
1759
1616
  for (var prop in b || (b = {}))
1760
- if (__hasOwnProp$8.call(b, prop))
1761
- __defNormalProp$8(a, prop, b[prop]);
1762
- if (__getOwnPropSymbols$8)
1763
- for (var prop of __getOwnPropSymbols$8(b)) {
1764
- if (__propIsEnum$8.call(b, prop))
1765
- __defNormalProp$8(a, prop, b[prop]);
1617
+ if (__hasOwnProp$a.call(b, prop))
1618
+ __defNormalProp$a(a, prop, b[prop]);
1619
+ if (__getOwnPropSymbols$a)
1620
+ for (var prop of __getOwnPropSymbols$a(b)) {
1621
+ if (__propIsEnum$a.call(b, prop))
1622
+ __defNormalProp$a(a, prop, b[prop]);
1766
1623
  }
1767
1624
  return a;
1768
1625
  };
1769
- var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
1626
+ var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
1770
1627
  function Table$6(props) {
1771
1628
  const preparedItems = React.useMemo(() => {
1772
- return props.items.map((item) => __spreadProps$6(__spreadValues$8({}, item), {
1629
+ return props.items.map((item) => __spreadProps$7(__spreadValues$a({}, item), {
1773
1630
  status: item.isComplete ? 2 : item.isStarted ? 1 : 0
1774
1631
  }));
1775
1632
  }, [props.items]);
@@ -1889,7 +1746,7 @@ function Stack$2(props) {
1889
1746
  }
1890
1747
  const truncateWithEllipses = (text, max) => text.substr(0, max - 1) + (text.length > max ? "&hellip;" : "");
1891
1748
 
1892
- const useStyles$e = createStyles((theme) => ({
1749
+ const useStyles$d = createStyles((theme) => ({
1893
1750
  title: {
1894
1751
  fontSize: 34,
1895
1752
  fontWeight: 900,
@@ -1902,7 +1759,7 @@ const useStyles$e = createStyles((theme) => ({
1902
1759
  }
1903
1760
  }));
1904
1761
  const Lesson = (props) => {
1905
- const { classes } = useStyles$e();
1762
+ const { classes } = useStyles$d();
1906
1763
  const [tab, setTab] = useState("question");
1907
1764
  const numberOfStudents = props.students.length;
1908
1765
  const numberOfLessons = numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length : 0;
@@ -1944,7 +1801,7 @@ const Lesson = (props) => {
1944
1801
  { label: "By student", value: "students" },
1945
1802
  { label: "By reflection", value: "reflections" }
1946
1803
  ];
1947
- return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
1804
+ return /* @__PURE__ */ React.createElement(Container, { fluid: true, py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
1948
1805
  Badge$1,
1949
1806
  {
1950
1807
  variant: "filled",
@@ -2015,65 +1872,35 @@ const Lesson = (props) => {
2015
1872
  };
2016
1873
 
2017
1874
  function Table$5(props) {
1875
+ if (props.loading) {
1876
+ return /* @__PURE__ */ React.createElement("div", { className: "text-sm text-slate-400" }, "Loading\u2026");
1877
+ }
2018
1878
  if (props.items.length === 0) {
2019
- return /* @__PURE__ */ React.createElement(
2020
- PlaceholderBanner,
2021
- {
2022
- title: "No lessons to display",
2023
- description: "We don't have any lessons to show you just yet.",
2024
- loading: props.loading,
2025
- icon: "lessons"
2026
- }
2027
- );
1879
+ return /* @__PURE__ */ React.createElement("div", { className: "rounded-xl border border-slate-200 bg-white p-8 text-center text-sm text-slate-400 shadow-sm" }, "No lessons to display.");
2028
1880
  }
2029
- const rows = props.items.map((row) => /* @__PURE__ */ React.createElement("tr", { key: row.lessonId }, /* @__PURE__ */ React.createElement("td", null, /* @__PURE__ */ React.createElement(
2030
- UnstyledButton,
1881
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex gap-4 px-4 text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, "Lesson"), /* @__PURE__ */ React.createElement("div", { className: "w-40 shrink-0" }, "Pathway"), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), props.items.map((row) => /* @__PURE__ */ React.createElement(
1882
+ Link,
2031
1883
  {
2032
- component: Link,
1884
+ key: row.lessonId,
2033
1885
  to: row.href,
2034
- sx: (theme) => ({
2035
- display: "block",
2036
- width: "100%",
2037
- padding: theme.spacing.md,
2038
- color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.black,
2039
- "&:hover": {
2040
- backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[8] : theme.colors.gray[1]
2041
- }
2042
- })
1886
+ className: "flex items-center gap-4 rounded-xl border border-slate-200 bg-white p-4 no-underline shadow-sm hover:bg-slate-50"
2043
1887
  },
2044
- /* @__PURE__ */ React.createElement(Group, null, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Text, { size: "sm", weight: 500 }, row.name), /* @__PURE__ */ React.createElement(Text, { size: "xs", color: "dimmed" }, row.description)))
2045
- ))));
2046
- return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(Table$l, { horizontalSpacing: 0, verticalSpacing: 0, sx: { minWidth: 700 } }, /* @__PURE__ */ React.createElement("tbody", null, rows)));
1888
+ /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, row.name), row.description && /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-xs leading-relaxed text-slate-500" }, row.description)),
1889
+ /* @__PURE__ */ React.createElement("div", { className: "w-40 shrink-0 text-xs text-slate-500" }, row.pathway || "\u2014"),
1890
+ /* @__PURE__ */ React.createElement(IconChevronRight, { size: 16, stroke: 2, className: "w-4 shrink-0 text-slate-300" })
1891
+ )));
2047
1892
  }
2048
1893
 
2049
- const useStyles$d = createStyles((theme) => ({
2050
- title: {
2051
- fontSize: 34,
2052
- fontWeight: 900,
2053
- [theme.fn.smallerThan("sm")]: {
2054
- fontSize: 24
2055
- }
2056
- },
2057
- description: {
2058
- maxWidth: 600
2059
- }
2060
- }));
2061
1894
  const Lessons = (props) => {
2062
- const { classes } = useStyles$d();
2063
- return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { 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(
2064
- Autocomplete,
1895
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, "Lessons"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-500" }, "Bite-sized activities and learning experiences accelerating students achievement")), /* @__PURE__ */ React.createElement("div", { className: "relative" }, /* @__PURE__ */ React.createElement(IconSearch, { size: 16, stroke: 2, className: "pointer-events-none absolute left-3.5 top-1/2 -translate-y-1/2 text-slate-400" }), /* @__PURE__ */ React.createElement(
1896
+ "input",
2065
1897
  {
1898
+ type: "text",
2066
1899
  placeholder: "Search for a lesson that fits your needs",
2067
- data: props.lessons.map((item) => item.name),
2068
- onChange: props.onAutocompleteChange
2069
- }
2070
- ), /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(LoadingOverlay, { visible: props.loading, overlayBlur: 2 }), /* @__PURE__ */ React.createElement(
2071
- Table$5,
2072
- {
2073
- loading: props.loading,
2074
- items: props.lessons
1900
+ onChange: (e) => props.onAutocompleteChange(e.target.value),
1901
+ className: "w-full rounded-xl border border-slate-200 bg-white py-2.5 pl-10 pr-4 text-sm text-dark-blue-400 placeholder:text-slate-400 focus:border-sky-blue-400 focus:outline-none"
2075
1902
  }
2076
- ))));
1903
+ )), /* @__PURE__ */ React.createElement(Table$5, { loading: props.loading, items: props.lessons }));
2077
1904
  };
2078
1905
 
2079
1906
  const useStyles$c = createStyles((theme) => ({
@@ -2154,7 +1981,7 @@ const useStyles$b = createStyles((theme) => ({
2154
1981
  }));
2155
1982
  const Organization = (props) => {
2156
1983
  const { classes } = useStyles$b();
2157
- return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
1984
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Container, { fluid: true, py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
2158
1985
  Badge$1,
2159
1986
  {
2160
1987
  variant: "filled",
@@ -2256,25 +2083,25 @@ function Table$4(props) {
2256
2083
  return /* @__PURE__ */ React.createElement(ScrollArea, null, /* @__PURE__ */ React.createElement(Table$l, { 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))), /* @__PURE__ */ React.createElement("tbody", null, rows)));
2257
2084
  }
2258
2085
 
2259
- var __defProp$7 = Object.defineProperty;
2260
- var __defProps$5 = Object.defineProperties;
2261
- var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
2262
- var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
2263
- var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
2264
- var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
2265
- var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2266
- var __spreadValues$7 = (a, b) => {
2267
- for (var prop in b || (b = {}))
2268
- if (__hasOwnProp$7.call(b, prop))
2269
- __defNormalProp$7(a, prop, b[prop]);
2270
- if (__getOwnPropSymbols$7)
2271
- for (var prop of __getOwnPropSymbols$7(b)) {
2272
- if (__propIsEnum$7.call(b, prop))
2273
- __defNormalProp$7(a, prop, b[prop]);
2086
+ var __defProp$9 = Object.defineProperty;
2087
+ var __defProps$6 = Object.defineProperties;
2088
+ var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
2089
+ var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
2090
+ var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
2091
+ var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
2092
+ var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2093
+ var __spreadValues$9 = (a, b) => {
2094
+ for (var prop in b || (b = {}))
2095
+ if (__hasOwnProp$9.call(b, prop))
2096
+ __defNormalProp$9(a, prop, b[prop]);
2097
+ if (__getOwnPropSymbols$9)
2098
+ for (var prop of __getOwnPropSymbols$9(b)) {
2099
+ if (__propIsEnum$9.call(b, prop))
2100
+ __defNormalProp$9(a, prop, b[prop]);
2274
2101
  }
2275
2102
  return a;
2276
2103
  };
2277
- var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
2104
+ var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
2278
2105
  const useStyles$9 = createStyles((theme) => ({
2279
2106
  title: {
2280
2107
  fontSize: 34,
@@ -2336,32 +2163,32 @@ const People = (props) => {
2336
2163
  padding: "xl",
2337
2164
  size: "xl"
2338
2165
  },
2339
- /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(DropzoneButton, __spreadProps$5(__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(() => {
2166
+ /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(DropzoneButton, __spreadProps$6(__spreadValues$9({}, props), { close: () => setOpened(false) })), /* @__PURE__ */ React.createElement(Divider, { label: "or", labelPosition: "center", my: "md", variant: "dashed" }), /* @__PURE__ */ React.createElement("form", { onSubmit: form.onSubmit(() => {
2340
2167
  const values = form.values;
2341
2168
  form.reset();
2342
2169
  setOpened(false);
2343
2170
  props.onCreateUsers && props.onCreateUsers([values]);
2344
2171
  }) }, /* @__PURE__ */ React.createElement(Stack$5, null, /* @__PURE__ */ React.createElement(
2345
2172
  TextInput,
2346
- __spreadValues$7({
2173
+ __spreadValues$9({
2347
2174
  withAsterisk: true,
2348
2175
  label: "Email",
2349
2176
  placeholder: "Email"
2350
2177
  }, form.getInputProps("email"))
2351
2178
  ), /* @__PURE__ */ React.createElement(Group, { grow: true }, /* @__PURE__ */ React.createElement(
2352
2179
  TextInput,
2353
- __spreadValues$7({
2180
+ __spreadValues$9({
2354
2181
  label: "Given name",
2355
2182
  placeholder: "Given name"
2356
2183
  }, form.getInputProps("givenName"))
2357
2184
  ), /* @__PURE__ */ React.createElement(
2358
2185
  TextInput,
2359
- __spreadValues$7({
2186
+ __spreadValues$9({
2360
2187
  label: "Family name",
2361
2188
  placeholder: "Family name"
2362
2189
  }, form.getInputProps("familyName"))
2363
2190
  )), /* @__PURE__ */ React.createElement(Button, { type: "submit", fullWidth: true, mt: "md" }, "Submit"))))
2364
- ), /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
2191
+ ), /* @__PURE__ */ React.createElement(Container, { fluid: true, py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
2365
2192
  Badge$1,
2366
2193
  {
2367
2194
  variant: "filled",
@@ -2542,24 +2369,24 @@ const StartAnonymousLesson = (props) => {
2542
2369
  ))))));
2543
2370
  };
2544
2371
 
2545
- var __defProp$6 = Object.defineProperty;
2546
- var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
2547
- var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
2548
- var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
2549
- var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2550
- var __spreadValues$6 = (a, b) => {
2372
+ var __defProp$8 = Object.defineProperty;
2373
+ var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
2374
+ var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
2375
+ var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
2376
+ var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2377
+ var __spreadValues$8 = (a, b) => {
2551
2378
  for (var prop in b || (b = {}))
2552
- if (__hasOwnProp$6.call(b, prop))
2553
- __defNormalProp$6(a, prop, b[prop]);
2554
- if (__getOwnPropSymbols$6)
2555
- for (var prop of __getOwnPropSymbols$6(b)) {
2556
- if (__propIsEnum$6.call(b, prop))
2557
- __defNormalProp$6(a, prop, b[prop]);
2379
+ if (__hasOwnProp$8.call(b, prop))
2380
+ __defNormalProp$8(a, prop, b[prop]);
2381
+ if (__getOwnPropSymbols$8)
2382
+ for (var prop of __getOwnPropSymbols$8(b)) {
2383
+ if (__propIsEnum$8.call(b, prop))
2384
+ __defNormalProp$8(a, prop, b[prop]);
2558
2385
  }
2559
2386
  return a;
2560
2387
  };
2561
2388
  const BadgeGrid = (props) => {
2562
- const badges = props.badges.map((b) => /* @__PURE__ */ React.createElement(TaskCard, __spreadValues$6({ key: b.title }, b)));
2389
+ const badges = props.badges.map((b) => /* @__PURE__ */ React.createElement(TaskCard, __spreadValues$8({ key: b.title }, b)));
2563
2390
  return /* @__PURE__ */ React.createElement(SimpleGrid, { cols: 4, breakpoints: [{ maxWidth: "sm", cols: 1 }, { maxWidth: "md", cols: 3 }] }, badges);
2564
2391
  };
2565
2392
  function TaskCard(props) {
@@ -2576,6 +2403,144 @@ function TaskCard(props) {
2576
2403
  }
2577
2404
 
2578
2405
  const useStyles$7 = createStyles((theme) => ({
2406
+ title: {
2407
+ fontSize: 34,
2408
+ fontWeight: 900,
2409
+ marginTop: 16,
2410
+ [theme.fn.smallerThan("sm")]: {
2411
+ fontSize: 24
2412
+ }
2413
+ },
2414
+ description: {
2415
+ maxWidth: 600
2416
+ }
2417
+ }));
2418
+ const UserInfo = (props) => {
2419
+ const { classes } = useStyles$7();
2420
+ 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));
2421
+ };
2422
+
2423
+ var __defProp$7 = Object.defineProperty;
2424
+ var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
2425
+ var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
2426
+ var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
2427
+ var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2428
+ var __spreadValues$7 = (a, b) => {
2429
+ for (var prop in b || (b = {}))
2430
+ if (__hasOwnProp$7.call(b, prop))
2431
+ __defNormalProp$7(a, prop, b[prop]);
2432
+ if (__getOwnPropSymbols$7)
2433
+ for (var prop of __getOwnPropSymbols$7(b)) {
2434
+ if (__propIsEnum$7.call(b, prop))
2435
+ __defNormalProp$7(a, prop, b[prop]);
2436
+ }
2437
+ return a;
2438
+ };
2439
+ var __objRest$1 = (source, exclude) => {
2440
+ var target = {};
2441
+ for (var prop in source)
2442
+ if (__hasOwnProp$7.call(source, prop) && exclude.indexOf(prop) < 0)
2443
+ target[prop] = source[prop];
2444
+ if (source != null && __getOwnPropSymbols$7)
2445
+ for (var prop of __getOwnPropSymbols$7(source)) {
2446
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$7.call(source, prop))
2447
+ target[prop] = source[prop];
2448
+ }
2449
+ return target;
2450
+ };
2451
+ const useStyles$6 = createStyles((theme) => ({
2452
+ card: {
2453
+ height: 240,
2454
+ backgroundSize: "cover",
2455
+ backgroundPosition: "center",
2456
+ whiteSpace: "pre-line"
2457
+ },
2458
+ content: {
2459
+ position: "absolute",
2460
+ padding: theme.spacing.xl,
2461
+ zIndex: 1,
2462
+ top: 0,
2463
+ bottom: 0,
2464
+ right: 0,
2465
+ left: 0
2466
+ },
2467
+ title: {
2468
+ color: theme.white,
2469
+ marginBottom: theme.spacing.xs / 2
2470
+ },
2471
+ description: {
2472
+ color: theme.white,
2473
+ maxWidth: 220
2474
+ },
2475
+ code: {
2476
+ color: theme.white,
2477
+ maxWidth: 220
2478
+ }
2479
+ }));
2480
+ const TenantBanner = (_a) => {
2481
+ var _b = _a, {
2482
+ title,
2483
+ description,
2484
+ image,
2485
+ style,
2486
+ className,
2487
+ code
2488
+ } = _b, others = __objRest$1(_b, [
2489
+ "title",
2490
+ "description",
2491
+ "image",
2492
+ "style",
2493
+ "className",
2494
+ "code"
2495
+ ]);
2496
+ const { classes, cx, theme } = useStyles$6();
2497
+ const handleCopy = async () => {
2498
+ if (!code)
2499
+ return;
2500
+ try {
2501
+ await navigator.clipboard.writeText(code);
2502
+ showNotification({
2503
+ title: "Copied!",
2504
+ message: "Community code copied to clipboard.",
2505
+ autoClose: 3e3
2506
+ });
2507
+ } catch (err) {
2508
+ console.error("Failed to copy code", err);
2509
+ }
2510
+ };
2511
+ return /* @__PURE__ */ React.createElement(
2512
+ Card,
2513
+ __spreadValues$7({
2514
+ radius: "md",
2515
+ style: __spreadValues$7({ backgroundImage: `url(${image})` }, style),
2516
+ className: cx(classes.card, className)
2517
+ }, others),
2518
+ /* @__PURE__ */ React.createElement(
2519
+ Overlay,
2520
+ {
2521
+ gradient: `linear-gradient(105deg, ${theme.black} 20%, #312f2f 50%, ${theme.colors.gray[6]} 100%)`,
2522
+ opacity: 0.55,
2523
+ zIndex: 0
2524
+ }
2525
+ ),
2526
+ /* @__PURE__ */ React.createElement("div", { className: classes.content }, /* @__PURE__ */ React.createElement(Text, { size: "lg", weight: 700, className: classes.title }, title), /* @__PURE__ */ React.createElement(Text, { size: "sm", className: classes.description }, description), /* @__PURE__ */ React.createElement(Group, { mt: "sm", spacing: "xs" }, /* @__PURE__ */ React.createElement(Text, { size: "sm", className: classes.code }, "Community Code: ", code || "\u2014"), code && /* @__PURE__ */ React.createElement(
2527
+ Button,
2528
+ {
2529
+ size: "xs",
2530
+ variant: "white",
2531
+ onClick: handleCopy,
2532
+ styles: {
2533
+ root: {
2534
+ backgroundColor: "rgba(255,255,255,0.9)"
2535
+ }
2536
+ }
2537
+ },
2538
+ "Copy"
2539
+ )))
2540
+ );
2541
+ };
2542
+
2543
+ const useStyles$5 = createStyles((theme) => ({
2579
2544
  action: {
2580
2545
  backgroundColor: "inherit",
2581
2546
  ":hover": {
@@ -2594,8 +2559,8 @@ const useStyles$7 = createStyles((theme) => ({
2594
2559
  }
2595
2560
  }));
2596
2561
  const TrialHome = (props) => {
2597
- const { classes } = useStyles$7();
2598
- return /* @__PURE__ */ React.createElement(Container, { size: "lg" }, /* @__PURE__ */ React.createElement(Badge$1, null, props.daysRemaining, " day", props.daysRemaining !== 1 ? "s" : "", " left"), /* @__PURE__ */ React.createElement(
2562
+ const { classes } = useStyles$5();
2563
+ return /* @__PURE__ */ React.createElement(Container, { fluid: true }, /* @__PURE__ */ React.createElement(Badge$1, null, props.daysRemaining, " day", props.daysRemaining !== 1 ? "s" : "", " left"), /* @__PURE__ */ React.createElement(
2599
2564
  Button,
2600
2565
  {
2601
2566
  className: classes.action,
@@ -2623,38 +2588,38 @@ const TrialHome = (props) => {
2623
2588
  )), /* @__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 })));
2624
2589
  };
2625
2590
 
2626
- var __defProp$5 = Object.defineProperty;
2627
- var __defProps$4 = Object.defineProperties;
2628
- var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
2629
- var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
2630
- var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
2631
- var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
2632
- var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2633
- var __spreadValues$5 = (a, b) => {
2591
+ var __defProp$6 = Object.defineProperty;
2592
+ var __defProps$5 = Object.defineProperties;
2593
+ var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
2594
+ var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
2595
+ var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
2596
+ var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
2597
+ var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2598
+ var __spreadValues$6 = (a, b) => {
2634
2599
  for (var prop in b || (b = {}))
2635
- if (__hasOwnProp$5.call(b, prop))
2636
- __defNormalProp$5(a, prop, b[prop]);
2637
- if (__getOwnPropSymbols$5)
2638
- for (var prop of __getOwnPropSymbols$5(b)) {
2639
- if (__propIsEnum$5.call(b, prop))
2640
- __defNormalProp$5(a, prop, b[prop]);
2600
+ if (__hasOwnProp$6.call(b, prop))
2601
+ __defNormalProp$6(a, prop, b[prop]);
2602
+ if (__getOwnPropSymbols$6)
2603
+ for (var prop of __getOwnPropSymbols$6(b)) {
2604
+ if (__propIsEnum$6.call(b, prop))
2605
+ __defNormalProp$6(a, prop, b[prop]);
2641
2606
  }
2642
2607
  return a;
2643
2608
  };
2644
- var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
2609
+ var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
2645
2610
  var __objRest = (source, exclude) => {
2646
2611
  var target = {};
2647
2612
  for (var prop in source)
2648
- if (__hasOwnProp$5.call(source, prop) && exclude.indexOf(prop) < 0)
2613
+ if (__hasOwnProp$6.call(source, prop) && exclude.indexOf(prop) < 0)
2649
2614
  target[prop] = source[prop];
2650
- if (source != null && __getOwnPropSymbols$5)
2651
- for (var prop of __getOwnPropSymbols$5(source)) {
2652
- if (exclude.indexOf(prop) < 0 && __propIsEnum$5.call(source, prop))
2615
+ if (source != null && __getOwnPropSymbols$6)
2616
+ for (var prop of __getOwnPropSymbols$6(source)) {
2617
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$6.call(source, prop))
2653
2618
  target[prop] = source[prop];
2654
2619
  }
2655
2620
  return target;
2656
2621
  };
2657
- const useStyles$6 = createStyles((theme, { checked }) => ({
2622
+ const useStyles$4 = createStyles((theme, { checked }) => ({
2658
2623
  button: {
2659
2624
  display: "flex",
2660
2625
  alignItems: "center",
@@ -2696,10 +2661,10 @@ function ImageCheckbox(_a) {
2696
2661
  finalValue: false,
2697
2662
  onChange
2698
2663
  });
2699
- const { classes, cx } = useStyles$6({ checked: value });
2664
+ const { classes, cx } = useStyles$4({ checked: value });
2700
2665
  return /* @__PURE__ */ React.createElement(
2701
2666
  UnstyledButton,
2702
- __spreadProps$4(__spreadValues$5({}, others), {
2667
+ __spreadProps$5(__spreadValues$6({}, others), {
2703
2668
  onClick: () => handleChange(!value),
2704
2669
  className: cx(classes.button, className)
2705
2670
  }),
@@ -2720,7 +2685,7 @@ function ImageCheckbox(_a) {
2720
2685
  function SelectGrid(props) {
2721
2686
  const items = props.items.map((item) => /* @__PURE__ */ React.createElement(
2722
2687
  ImageCheckbox,
2723
- __spreadProps$4(__spreadValues$5({}, item), {
2688
+ __spreadProps$5(__spreadValues$6({}, item), {
2724
2689
  key: item.title,
2725
2690
  onChange: (checked) => props.onChange(item.title, checked)
2726
2691
  })
@@ -2738,26 +2703,26 @@ function SelectGrid(props) {
2738
2703
  );
2739
2704
  }
2740
2705
 
2741
- var __defProp$4 = Object.defineProperty;
2742
- var __defProps$3 = Object.defineProperties;
2743
- var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
2744
- var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
2745
- var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
2746
- var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
2747
- var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2748
- var __spreadValues$4 = (a, b) => {
2706
+ var __defProp$5 = Object.defineProperty;
2707
+ var __defProps$4 = Object.defineProperties;
2708
+ var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
2709
+ var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
2710
+ var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
2711
+ var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
2712
+ var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2713
+ var __spreadValues$5 = (a, b) => {
2749
2714
  for (var prop in b || (b = {}))
2750
- if (__hasOwnProp$4.call(b, prop))
2751
- __defNormalProp$4(a, prop, b[prop]);
2752
- if (__getOwnPropSymbols$4)
2753
- for (var prop of __getOwnPropSymbols$4(b)) {
2754
- if (__propIsEnum$4.call(b, prop))
2755
- __defNormalProp$4(a, prop, b[prop]);
2715
+ if (__hasOwnProp$5.call(b, prop))
2716
+ __defNormalProp$5(a, prop, b[prop]);
2717
+ if (__getOwnPropSymbols$5)
2718
+ for (var prop of __getOwnPropSymbols$5(b)) {
2719
+ if (__propIsEnum$5.call(b, prop))
2720
+ __defNormalProp$5(a, prop, b[prop]);
2756
2721
  }
2757
2722
  return a;
2758
2723
  };
2759
- var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
2760
- const useStyles$5 = createStyles((theme) => ({
2724
+ var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
2725
+ const useStyles$3 = createStyles((theme) => ({
2761
2726
  wrapper: {
2762
2727
  minHeight: "100%",
2763
2728
  boxSizing: "border-box",
@@ -2820,7 +2785,7 @@ const OPTIONS = [
2820
2785
  { description: "project-based learning", title: "Project-Based Learning", icon: IconTools }
2821
2786
  ];
2822
2787
  const TrialRegistration = (props) => {
2823
- const { classes } = useStyles$5();
2788
+ const { classes } = useStyles$3();
2824
2789
  const [firstName, setFirstName] = React.useState("");
2825
2790
  const [lastName, setLastName] = React.useState("");
2826
2791
  const [organization, setOrganization] = React.useState({ organizationId: "", displayName: "" });
@@ -2866,7 +2831,7 @@ const TrialRegistration = (props) => {
2866
2831
  label: "School/Organization Name",
2867
2832
  placeholder: "What's the name of your school?",
2868
2833
  data: props.organizations.map((o) => {
2869
- return __spreadProps$3(__spreadValues$4({}, o), { value: o.displayName });
2834
+ return __spreadProps$4(__spreadValues$5({}, o), { value: o.displayName });
2870
2835
  }),
2871
2836
  onItemSubmit: (item) => setOrganization({ organizationId: item.organizationId, displayName: item.displayName }),
2872
2837
  onChange: (next) => {
@@ -2878,7 +2843,7 @@ const TrialRegistration = (props) => {
2878
2843
  SelectGrid,
2879
2844
  {
2880
2845
  items: OPTIONS,
2881
- onChange: (e, checked) => setInterests(__spreadProps$3(__spreadValues$4({}, interests), { [e]: checked }))
2846
+ onChange: (e, checked) => setInterests(__spreadProps$4(__spreadValues$5({}, interests), { [e]: checked }))
2882
2847
  }
2883
2848
  ), /* @__PURE__ */ React.createElement(Group, { position: "right", mt: "md" }, /* @__PURE__ */ React.createElement(
2884
2849
  Button,
@@ -2916,26 +2881,26 @@ const AdminProvider = (props) => {
2916
2881
  );
2917
2882
  };
2918
2883
 
2919
- var __defProp$3 = Object.defineProperty;
2920
- var __defProps$2 = Object.defineProperties;
2921
- var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
2922
- var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
2923
- var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
2924
- var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
2925
- var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2926
- var __spreadValues$3 = (a, b) => {
2884
+ var __defProp$4 = Object.defineProperty;
2885
+ var __defProps$3 = Object.defineProperties;
2886
+ var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
2887
+ var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
2888
+ var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
2889
+ var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
2890
+ var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
2891
+ var __spreadValues$4 = (a, b) => {
2927
2892
  for (var prop in b || (b = {}))
2928
- if (__hasOwnProp$3.call(b, prop))
2929
- __defNormalProp$3(a, prop, b[prop]);
2930
- if (__getOwnPropSymbols$3)
2931
- for (var prop of __getOwnPropSymbols$3(b)) {
2932
- if (__propIsEnum$3.call(b, prop))
2933
- __defNormalProp$3(a, prop, b[prop]);
2893
+ if (__hasOwnProp$4.call(b, prop))
2894
+ __defNormalProp$4(a, prop, b[prop]);
2895
+ if (__getOwnPropSymbols$4)
2896
+ for (var prop of __getOwnPropSymbols$4(b)) {
2897
+ if (__propIsEnum$4.call(b, prop))
2898
+ __defNormalProp$4(a, prop, b[prop]);
2934
2899
  }
2935
2900
  return a;
2936
2901
  };
2937
- var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
2938
- const useStyles$4 = createStyles((theme, props) => ({
2902
+ var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
2903
+ const useStyles$2 = createStyles((theme, props) => ({
2939
2904
  footer: {
2940
2905
  paddingTop: theme.spacing.md,
2941
2906
  paddingBottom: theme.spacing.md,
@@ -3022,7 +2987,7 @@ const useStyles$4 = createStyles((theme, props) => ({
3022
2987
  }
3023
2988
  }));
3024
2989
  const App = (props) => {
3025
- const { classes } = useStyles$4(props);
2990
+ const { classes } = useStyles$2(props);
3026
2991
  const account = useAccount(props.account, props.accounts, props.onAccountChange);
3027
2992
  return /* @__PURE__ */ React.createElement(
3028
2993
  AppShell,
@@ -3030,7 +2995,7 @@ const App = (props) => {
3030
2995
  padding: "xs",
3031
2996
  navbar: props.navbar && /* @__PURE__ */ React.createElement(
3032
2997
  Navbar,
3033
- __spreadProps$2(__spreadValues$3({}, props.navbar.props), {
2998
+ __spreadProps$3(__spreadValues$4({}, props.navbar.props), {
3034
2999
  onSwitchAccounts: account.accounts && account.accounts.length > 1 ? () => account.setChangeModalOpen(true) : void 0
3035
3000
  })
3036
3001
  ),
@@ -3137,10 +3102,10 @@ function Table$3(props) {
3137
3102
  }
3138
3103
 
3139
3104
  const Pathways = (props) => {
3140
- return /* @__PURE__ */ React.createElement("div", { className: "mx-auto flex max-w-4xl flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, "Pathways"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-500" }, "Explore all your unique pathway requirements in one clear space")), /* @__PURE__ */ React.createElement(Table$3, { loading: props.loading, items: props.pathways }));
3105
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React.createElement("h1", { className: "text-2xl font-extrabold tracking-tight text-dark-blue-400" }, "Pathways"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-500" }, "Explore all your unique pathway requirements in one clear space")), /* @__PURE__ */ React.createElement(Table$3, { loading: props.loading, items: props.pathways }));
3141
3106
  };
3142
3107
 
3143
- const useStyles$3 = createStyles((theme) => ({
3108
+ const useStyles$1 = createStyles((theme) => ({
3144
3109
  button: {
3145
3110
  borderTopRightRadius: 0,
3146
3111
  borderBottomRightRadius: 0,
@@ -3155,7 +3120,7 @@ const useStyles$3 = createStyles((theme) => ({
3155
3120
  }
3156
3121
  }));
3157
3122
  const SplitButton$1 = (props) => {
3158
- const { classes, theme } = useStyles$3();
3123
+ const { classes, theme } = useStyles$1();
3159
3124
  theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
3160
3125
  return /* @__PURE__ */ React.createElement(Stack$5, { spacing: "sm" }, /* @__PURE__ */ React.createElement(
3161
3126
  Button,
@@ -3191,25 +3156,25 @@ function Stack$1(props) {
3191
3156
  return /* @__PURE__ */ React.createElement(Grid, { grow: true, gutter: "lg", sx: { padding: 20, minWidth: 700 } }, rows);
3192
3157
  }
3193
3158
 
3194
- var __defProp$2 = Object.defineProperty;
3195
- var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
3196
- var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
3197
- var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
3198
- var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3199
- var __spreadValues$2 = (a, b) => {
3159
+ var __defProp$3 = Object.defineProperty;
3160
+ var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
3161
+ var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
3162
+ var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
3163
+ var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3164
+ var __spreadValues$3 = (a, b) => {
3200
3165
  for (var prop in b || (b = {}))
3201
- if (__hasOwnProp$2.call(b, prop))
3202
- __defNormalProp$2(a, prop, b[prop]);
3203
- if (__getOwnPropSymbols$2)
3204
- for (var prop of __getOwnPropSymbols$2(b)) {
3205
- if (__propIsEnum$2.call(b, prop))
3206
- __defNormalProp$2(a, prop, b[prop]);
3166
+ if (__hasOwnProp$3.call(b, prop))
3167
+ __defNormalProp$3(a, prop, b[prop]);
3168
+ if (__getOwnPropSymbols$3)
3169
+ for (var prop of __getOwnPropSymbols$3(b)) {
3170
+ if (__propIsEnum$3.call(b, prop))
3171
+ __defNormalProp$3(a, prop, b[prop]);
3207
3172
  }
3208
3173
  return a;
3209
3174
  };
3210
3175
  function Table$2(props) {
3211
3176
  const preparedItems = React.useMemo(() => {
3212
- return (props.items || []).map((item) => __spreadValues$2(__spreadValues$2({}, item), item.categoryPoints));
3177
+ return (props.items || []).map((item) => __spreadValues$3(__spreadValues$3({}, item), item.categoryPoints));
3213
3178
  }, [props.items]);
3214
3179
  const { items: sortedItems, requestSort, sortConfig } = useSortableData(preparedItems);
3215
3180
  if (props.loading && props.items.length === 0) {
@@ -3341,7 +3306,7 @@ function Table$1(props) {
3341
3306
  ));
3342
3307
  }
3343
3308
 
3344
- const useStyles$2 = createStyles((theme) => ({
3309
+ const useStyles = createStyles((theme) => ({
3345
3310
  title: {
3346
3311
  fontSize: 34,
3347
3312
  fontWeight: 900,
@@ -3354,12 +3319,12 @@ const useStyles$2 = createStyles((theme) => ({
3354
3319
  }
3355
3320
  }));
3356
3321
  const Pathway = (props) => {
3357
- const { classes } = useStyles$2();
3322
+ const { classes } = useStyles();
3358
3323
  const [tab, setTab] = useState("badges");
3359
3324
  const numberOfStudents = props.students.length;
3360
3325
  numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length / numberOfStudents : 0;
3361
3326
  const numberOfBadgesEarned = numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length : 0;
3362
- return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
3327
+ return /* @__PURE__ */ React.createElement(Container, { fluid: true, py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
3363
3328
  Badge$1,
3364
3329
  {
3365
3330
  variant: "filled",
@@ -3421,82 +3386,84 @@ const Pathway = (props) => {
3421
3386
  )))))));
3422
3387
  };
3423
3388
 
3424
- const useStyles$1 = createStyles((theme) => ({
3425
- button: {
3426
- borderTopRightRadius: 0,
3427
- borderBottomRightRadius: 0,
3428
- marginLeft: 0,
3429
- marginRight: 0
3430
- },
3431
- menuControl: {
3432
- borderTopLeftRadius: 0,
3433
- borderBottomLeftRadius: 0,
3434
- border: 0,
3435
- borderLeft: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.white}`
3436
- }
3437
- }));
3438
3389
  const SplitButton = (props) => {
3439
- const { classes, theme } = useStyles$1();
3440
- theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 5 : 6];
3441
- return /* @__PURE__ */ React.createElement(Stack$5, { spacing: "sm" }, /* @__PURE__ */ React.createElement(
3442
- Button,
3390
+ return /* @__PURE__ */ React.createElement(
3391
+ "button",
3443
3392
  {
3444
- leftIcon: /* @__PURE__ */ React.createElement(IconTableExport, { size: 14 }),
3445
- onClick: props.onExportDataClick
3393
+ onClick: props.onExportDataClick,
3394
+ className: "flex items-center gap-2 rounded-xl bg-gradient-to-r from-gold-400 to-[#f5c300] px-4 py-2.5 text-xs font-extrabold text-dark-blue-400"
3446
3395
  },
3396
+ /* @__PURE__ */ React.createElement(IconTableExport, { size: 14, stroke: 2 }),
3447
3397
  "Export data (.csv)"
3448
- ));
3398
+ );
3449
3399
  };
3450
3400
 
3451
3401
  function Stack(props) {
3452
- const { items, hideBadge, hideLesson } = props;
3402
+ const { items, hideBadge, hideLesson, hidePathway } = props;
3453
3403
  if (!items.length)
3454
3404
  return null;
3455
- const visibleColumns = [
3456
- true,
3457
- !hideBadge,
3458
- !hideLesson,
3459
- true
3460
- ].filter(Boolean).length;
3461
- const span = 12 / visibleColumns;
3462
- return /* @__PURE__ */ React.createElement(Grid, { gutter: "md", sx: { padding: 20, minWidth: 700 } }, /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(Text, { weight: "bold" }, "Link")), !hideBadge && /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(Text, { weight: "bold" }, "Badge")), !hideLesson && /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(Text, { weight: "bold" }, "Lesson")), /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(Text, { weight: "bold" }, "Question")), items.map((row, i) => /* @__PURE__ */ React.createElement(React.Fragment, { key: i }, /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(
3463
- Button,
3464
- {
3465
- component: "a",
3466
- href: row.link,
3467
- target: "_blank",
3468
- rel: "noopener noreferrer",
3469
- size: "xs",
3470
- variant: "light"
3471
- },
3472
- "View File"
3473
- )), !hideBadge && /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(Text, null, row.badgeName)), !hideLesson && /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(Text, null, row.lessonName)), /* @__PURE__ */ React.createElement(Grid.Col, { span }, /* @__PURE__ */ React.createElement(Text, null, row.question)))));
3405
+ const columns = [
3406
+ "minmax(0,2fr)",
3407
+ !hidePathway && "minmax(0,1.3fr)",
3408
+ !hideLesson && "minmax(0,1.3fr)",
3409
+ !hideBadge && "minmax(0,1.3fr)",
3410
+ "auto"
3411
+ ].filter(Boolean).join(" ");
3412
+ const headerCell = "border-b border-slate-100 pb-2 text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400";
3413
+ const dataCell = "py-3";
3414
+ return /* @__PURE__ */ React.createElement("div", { className: "grid items-center gap-x-3", style: { gridTemplateColumns: columns } }, /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Question"), !hidePathway && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Pathway"), !hideLesson && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Lesson"), !hideBadge && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Badge"), /* @__PURE__ */ React.createElement("div", { className: headerCell }), items.map((row, i) => {
3415
+ const rowBorder = i > 0 ? "border-t border-slate-100" : "";
3416
+ return /* @__PURE__ */ React.createElement(React.Fragment, { key: i }, /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} text-xs font-semibold text-dark-blue-400` }, row.question), !hidePathway && /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.pathwayName || "\u2014"), !hideLesson && /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.lessonName), !hideBadge && /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.badgeName), /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} flex shrink-0 gap-2` }, /* @__PURE__ */ React.createElement(
3417
+ "a",
3418
+ {
3419
+ href: row.link,
3420
+ target: "_blank",
3421
+ rel: "noopener noreferrer",
3422
+ className: "flex items-center gap-1 rounded-md border border-slate-200 px-2.5 py-1.5 text-[11px] font-bold text-slate-600 no-underline hover:bg-slate-50"
3423
+ },
3424
+ /* @__PURE__ */ React.createElement(IconExternalLink, { size: 12, stroke: 2 }),
3425
+ "Preview"
3426
+ ), /* @__PURE__ */ React.createElement(
3427
+ "a",
3428
+ {
3429
+ href: row.link,
3430
+ download: true,
3431
+ target: "_blank",
3432
+ rel: "noopener noreferrer",
3433
+ className: "flex items-center gap-1 rounded-md border border-slate-200 px-2.5 py-1.5 text-[11px] font-bold text-slate-600 no-underline hover:bg-slate-50"
3434
+ },
3435
+ /* @__PURE__ */ React.createElement(IconDownload, { size: 12, stroke: 2 }),
3436
+ "Download"
3437
+ )));
3438
+ }));
3474
3439
  }
3475
3440
 
3476
- var __defProp$1 = Object.defineProperty;
3477
- var __defProps$1 = Object.defineProperties;
3478
- var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
3479
- var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
3480
- var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
3481
- var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
3482
- var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3483
- var __spreadValues$1 = (a, b) => {
3441
+ var __defProp$2 = Object.defineProperty;
3442
+ var __defProps$2 = Object.defineProperties;
3443
+ var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
3444
+ var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
3445
+ var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
3446
+ var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
3447
+ var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3448
+ var __spreadValues$2 = (a, b) => {
3484
3449
  for (var prop in b || (b = {}))
3485
- if (__hasOwnProp$1.call(b, prop))
3486
- __defNormalProp$1(a, prop, b[prop]);
3487
- if (__getOwnPropSymbols$1)
3488
- for (var prop of __getOwnPropSymbols$1(b)) {
3489
- if (__propIsEnum$1.call(b, prop))
3490
- __defNormalProp$1(a, prop, b[prop]);
3450
+ if (__hasOwnProp$2.call(b, prop))
3451
+ __defNormalProp$2(a, prop, b[prop]);
3452
+ if (__getOwnPropSymbols$2)
3453
+ for (var prop of __getOwnPropSymbols$2(b)) {
3454
+ if (__propIsEnum$2.call(b, prop))
3455
+ __defNormalProp$2(a, prop, b[prop]);
3491
3456
  }
3492
3457
  return a;
3493
3458
  };
3494
- var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
3459
+ var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
3460
+ const initials$1 = (name) => name.split(" ").map((w) => w[0]).filter(Boolean).slice(0, 2).join("").toUpperCase();
3495
3461
  function Table(props) {
3462
+ const [expanded, setExpanded] = React.useState({});
3496
3463
  const preparedItems = React.useMemo(() => {
3497
3464
  return props.items.map((item) => {
3498
3465
  var _a;
3499
- return __spreadProps$1(__spreadValues$1({}, item), {
3466
+ return __spreadProps$2(__spreadValues$2({}, item), {
3500
3467
  submissionCount: ((_a = item.submissions) == null ? void 0 : _a.length) || 0
3501
3468
  });
3502
3469
  });
@@ -3513,76 +3480,82 @@ function Table(props) {
3513
3480
  }
3514
3481
  );
3515
3482
  }
3516
- const sortStatus = {
3517
- columnAccessor: sortConfig.key,
3518
- direction: sortConfig.direction === "desc" ? "desc" : "asc"
3519
- };
3520
- return /* @__PURE__ */ React.createElement(ScrollArea.Autosize, { maxHeight: 600 }, /* @__PURE__ */ React.createElement(
3521
- DataTable,
3483
+ const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
3484
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 px-4 text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("name"), className: "flex-1 text-left hover:text-slate-600" }, "Student Name", indicator("name")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("submissionCount"), className: "w-16 shrink-0 text-left hover:text-slate-600" }, "Files", indicator("submissionCount")), props.onReview && /* @__PURE__ */ React.createElement("div", { className: "w-36 shrink-0" }), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
3485
+ const isOpen = !!expanded[row.userId];
3486
+ return /* @__PURE__ */ React.createElement("div", { key: row.userId, className: "rounded-xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement(
3487
+ "div",
3488
+ {
3489
+ onClick: () => setExpanded(__spreadProps$2(__spreadValues$2({}, expanded), { [row.userId]: !isOpen })),
3490
+ className: "flex cursor-pointer items-center gap-4 p-4"
3491
+ },
3492
+ /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 flex-1 items-center gap-3" }, row.avatar ? /* @__PURE__ */ React.createElement("img", { src: row.avatar, className: "h-9 w-9 shrink-0 rounded-full object-cover", alt: "" }) : /* @__PURE__ */ React.createElement("div", { className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-gradient-to-br from-mint-400 to-dark-blue-400 text-xs font-bold text-white" }, initials$1(row.name)), /* @__PURE__ */ React.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React.createElement("div", { className: "truncate text-sm font-bold text-dark-blue-400" }, row.name), /* @__PURE__ */ React.createElement("div", { className: "truncate text-xs text-slate-400" }, row.email))),
3493
+ /* @__PURE__ */ React.createElement("div", { className: "w-16 shrink-0 text-sm font-bold text-dark-blue-400" }, row.submissions.length),
3494
+ props.onReview && /* @__PURE__ */ React.createElement("div", { className: "w-36 shrink-0" }, /* @__PURE__ */ React.createElement(
3495
+ "button",
3496
+ {
3497
+ onClick: (e) => {
3498
+ e.stopPropagation();
3499
+ props.onReview(row);
3500
+ },
3501
+ className: "rounded-lg bg-gradient-to-r from-gold-400 to-[#f5c300] px-3 py-1.5 text-[11px] font-extrabold text-dark-blue-400"
3502
+ },
3503
+ "Review Submission"
3504
+ )),
3505
+ /* @__PURE__ */ React.createElement(IconChevronRight, { size: 16, stroke: 2, className: `w-4 shrink-0 text-slate-300 transition-transform ${isOpen ? "rotate-90" : ""}` })
3506
+ ), isOpen && /* @__PURE__ */ React.createElement("div", { className: "border-t border-slate-100 px-4 py-3" }, /* @__PURE__ */ React.createElement(Stack, { items: row.submissions, hideBadge: props.hideBadge, hideLesson: props.hideLesson, hidePathway: props.hidePathway })));
3507
+ }));
3508
+ }
3509
+
3510
+ const initials = (name) => name.split(" ").map((w) => w[0]).filter(Boolean).slice(0, 2).join("").toUpperCase();
3511
+ function SubmissionDetail(props) {
3512
+ const { student } = props;
3513
+ return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-4 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 text-xs text-slate-400" }, /* @__PURE__ */ React.createElement("button", { onClick: props.onBack, className: "font-bold text-sky-blue-400 hover:underline" }, "File Locker"), /* @__PURE__ */ React.createElement("span", null, "/"), /* @__PURE__ */ React.createElement("span", { className: "font-bold text-dark-blue-400" }, student.name)), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 rounded-2xl border border-slate-200 bg-white p-5 shadow-sm" }, student.avatar ? /* @__PURE__ */ React.createElement("img", { src: student.avatar, className: "h-12 w-12 shrink-0 rounded-full object-cover", alt: "" }) : /* @__PURE__ */ React.createElement("div", { className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-gradient-to-br from-mint-400 to-dark-blue-400 text-sm font-bold text-white" }, initials(student.name)), /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold text-dark-blue-400" }, student.name), /* @__PURE__ */ React.createElement("div", { className: "mt-0.5 text-xs text-slate-400" }, student.email, props.context ? ` \xB7 ${props.context}` : "")), /* @__PURE__ */ React.createElement("div", { className: "shrink-0 rounded-full bg-slate-100 px-3 py-1 text-xs font-bold text-slate-500" }, student.submissions.length, " file", student.submissions.length === 1 ? "" : "s")), /* @__PURE__ */ React.createElement("div", { className: "rounded-2xl border border-slate-200 bg-white p-5 shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-extrabold text-dark-blue-400" }, "Files"), /* @__PURE__ */ React.createElement("div", { className: "mt-2" }, /* @__PURE__ */ React.createElement(Stack, { items: student.submissions }))), /* @__PURE__ */ React.createElement("div", { className: "flex gap-3" }, /* @__PURE__ */ React.createElement(
3514
+ "button",
3522
3515
  {
3523
- verticalSpacing: "sm",
3524
- sx: { minWidth: 700 },
3525
- withBorder: false,
3526
- borderRadius: "sm",
3527
- withColumnBorders: true,
3528
- striped: true,
3529
- highlightOnHover: true,
3530
- records: sortedItems,
3531
- sortStatus,
3532
- onSortStatusChange: (status) => requestSort(status.columnAccessor),
3533
- idAccessor: "userId",
3534
- columns: [{
3535
- accessor: "name",
3536
- title: "Student Name",
3537
- sortable: true,
3538
- 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)))
3539
- }, {
3540
- accessor: "submissionCount",
3541
- title: "Files",
3542
- sortable: true,
3543
- render: (row) => row.submissions.length
3544
- }],
3545
- rowExpansion: {
3546
- content: ({ record }) => /* @__PURE__ */ React.createElement(
3547
- Stack,
3548
- {
3549
- items: record.submissions,
3550
- hideBadge: props.hideBadge,
3551
- hideLesson: props.hideLesson
3552
- }
3553
- )
3554
- }
3555
- }
3556
- ));
3516
+ onClick: () => props.onNav(-1),
3517
+ className: "flex flex-1 items-center justify-center gap-1.5 rounded-xl border border-slate-200 bg-white py-2.5 text-xs font-bold text-slate-600 hover:bg-slate-50"
3518
+ },
3519
+ /* @__PURE__ */ React.createElement(IconChevronLeft, { size: 14, stroke: 2 }),
3520
+ "Previous Submission"
3521
+ ), /* @__PURE__ */ React.createElement(
3522
+ "button",
3523
+ {
3524
+ onClick: () => props.onNav(1),
3525
+ className: "flex flex-1 items-center justify-center gap-1.5 rounded-xl border border-slate-200 bg-white py-2.5 text-xs font-bold text-slate-600 hover:bg-slate-50"
3526
+ },
3527
+ "Next Submission",
3528
+ /* @__PURE__ */ React.createElement(IconChevronRight, { size: 14, stroke: 2 })
3529
+ )));
3557
3530
  }
3558
3531
 
3559
- var __defProp = Object.defineProperty;
3560
- var __defProps = Object.defineProperties;
3561
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
3562
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3563
- var __hasOwnProp = Object.prototype.hasOwnProperty;
3564
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
3565
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3566
- var __spreadValues = (a, b) => {
3532
+ var __defProp$1 = Object.defineProperty;
3533
+ var __defProps$1 = Object.defineProperties;
3534
+ var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
3535
+ var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
3536
+ var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
3537
+ var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
3538
+ var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3539
+ var __spreadValues$1 = (a, b) => {
3567
3540
  for (var prop in b || (b = {}))
3568
- if (__hasOwnProp.call(b, prop))
3569
- __defNormalProp(a, prop, b[prop]);
3570
- if (__getOwnPropSymbols)
3571
- for (var prop of __getOwnPropSymbols(b)) {
3572
- if (__propIsEnum.call(b, prop))
3573
- __defNormalProp(a, prop, b[prop]);
3541
+ if (__hasOwnProp$1.call(b, prop))
3542
+ __defNormalProp$1(a, prop, b[prop]);
3543
+ if (__getOwnPropSymbols$1)
3544
+ for (var prop of __getOwnPropSymbols$1(b)) {
3545
+ if (__propIsEnum$1.call(b, prop))
3546
+ __defNormalProp$1(a, prop, b[prop]);
3574
3547
  }
3575
3548
  return a;
3576
3549
  };
3577
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
3550
+ var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
3578
3551
  const useFilteredStudents = (students) => {
3579
3552
  return React.useMemo(() => {
3580
- const byBadge = (badgeId) => students.map((s) => __spreadProps(__spreadValues({}, s), {
3553
+ const byBadge = (badgeId) => students.map((s) => __spreadProps$1(__spreadValues$1({}, s), {
3581
3554
  submissions: (s.submissions || []).filter(
3582
3555
  (sub) => sub.badgeId === badgeId
3583
3556
  )
3584
3557
  })).filter((s) => s.submissions.length);
3585
- const byLesson = (lessonName) => students.map((s) => __spreadProps(__spreadValues({}, s), {
3558
+ const byLesson = (lessonName) => students.map((s) => __spreadProps$1(__spreadValues$1({}, s), {
3586
3559
  submissions: (s.submissions || []).filter(
3587
3560
  (sub) => sub.lessonName === lessonName
3588
3561
  )
@@ -3593,7 +3566,7 @@ const useFilteredStudents = (students) => {
3593
3566
  (c) => c.startsWith(pathwayId)
3594
3567
  )
3595
3568
  ).map((b) => b.badgeId);
3596
- return students.map((s) => __spreadProps(__spreadValues({}, s), {
3569
+ return students.map((s) => __spreadProps$1(__spreadValues$1({}, s), {
3597
3570
  submissions: (s.submissions || []).filter(
3598
3571
  (sub) => validBadgeIds.includes(sub.badgeId)
3599
3572
  )
@@ -3603,168 +3576,167 @@ const useFilteredStudents = (students) => {
3603
3576
  }, [students]);
3604
3577
  };
3605
3578
 
3606
- const useStyles = createStyles((theme) => ({
3607
- title: {
3608
- fontSize: 34,
3609
- fontWeight: 900,
3610
- [theme.fn.smallerThan("sm")]: {
3611
- fontSize: 24
3579
+ var __defProp = Object.defineProperty;
3580
+ var __defProps = Object.defineProperties;
3581
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
3582
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3583
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
3584
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
3585
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3586
+ var __spreadValues = (a, b) => {
3587
+ for (var prop in b || (b = {}))
3588
+ if (__hasOwnProp.call(b, prop))
3589
+ __defNormalProp(a, prop, b[prop]);
3590
+ if (__getOwnPropSymbols)
3591
+ for (var prop of __getOwnPropSymbols(b)) {
3592
+ if (__propIsEnum.call(b, prop))
3593
+ __defNormalProp(a, prop, b[prop]);
3612
3594
  }
3613
- },
3614
- description: {
3615
- maxWidth: 600
3616
- }
3617
- }));
3618
- const BadgeTable = ({ badges, students, loading }) => {
3619
- const { byBadge } = useFilteredStudents(students);
3620
- const countFiles = (students2) => students2.reduce((acc, s) => {
3621
- var _a;
3622
- return acc + (((_a = s.submissions) == null ? void 0 : _a.length) || 0);
3623
- }, 0);
3624
- return /* @__PURE__ */ React.createElement(Accordion, null, badges.map((b) => {
3625
- const studentsForBadge = byBadge(b.badgeId);
3626
- const fileCount = countFiles(studentsForBadge);
3627
- return /* @__PURE__ */ React.createElement(Accordion.Item, { key: b.badgeId, value: b.badgeId }, /* @__PURE__ */ React.createElement(Accordion.Control, null, /* @__PURE__ */ React.createElement(Group, { position: "apart", w: "100%" }, /* @__PURE__ */ React.createElement(Text, null, b.displayName), /* @__PURE__ */ React.createElement(Badge$1, { size: "sm" }, fileCount))), /* @__PURE__ */ React.createElement(Accordion.Panel, null, /* @__PURE__ */ React.createElement(
3628
- Table,
3629
- {
3630
- loading,
3631
- items: studentsForBadge,
3632
- hideBadge: true
3633
- }
3634
- )));
3595
+ return a;
3596
+ };
3597
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
3598
+ const TABS = [
3599
+ { value: "students", label: "By student" },
3600
+ { value: "pathways", label: "By pathway" },
3601
+ { value: "badges", label: "By badge" },
3602
+ { value: "lessons", label: "By lesson" }
3603
+ ];
3604
+ const countFiles = (students) => students.reduce((acc, s) => {
3605
+ var _a;
3606
+ return acc + (((_a = s.submissions) == null ? void 0 : _a.length) || 0);
3607
+ }, 0);
3608
+ const GroupCard = (props) => {
3609
+ const [open, setOpen] = React.useState(false);
3610
+ return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement("div", { onClick: () => setOpen(!open), className: "flex cursor-pointer items-center gap-3.5 p-4" }, /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-extrabold text-dark-blue-400" }, props.title), props.description && /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-xs leading-relaxed text-slate-500" }, props.description)), /* @__PURE__ */ React.createElement("div", { className: "shrink-0 rounded-full bg-mint-100 px-2.5 py-1 text-xs font-bold text-dark-blue-400" }, props.count), /* @__PURE__ */ React.createElement(IconChevronDown, { size: 15, stroke: 2.3, className: `shrink-0 text-slate-400 transition-transform ${open ? "rotate-180" : ""}` })), open && /* @__PURE__ */ React.createElement("div", { className: "border-t border-slate-100 p-4" }, props.children));
3611
+ };
3612
+ const PathwayGroups = (props) => {
3613
+ const { byPathway } = useFilteredStudents(props.students);
3614
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, props.pathways.map((p) => {
3615
+ const filtered = byPathway(p.pathwayId, props.badges);
3616
+ return /* @__PURE__ */ React.createElement(GroupCard, { key: p.pathwayId, title: p.title, description: p.description, count: countFiles(filtered) }, /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: filtered, hidePathway: true, onReview: (item) => props.onReview(item, filtered, p.title) }));
3635
3617
  }));
3636
3618
  };
3637
- const LessonTableWrapper = ({ lessons, students, loading }) => {
3638
- const { byLesson } = useFilteredStudents(students);
3639
- const countFiles = (students2) => students2.reduce((acc, s) => {
3640
- var _a;
3641
- return acc + (((_a = s.submissions) == null ? void 0 : _a.length) || 0);
3642
- }, 0);
3643
- return /* @__PURE__ */ React.createElement(Accordion, null, lessons.map((l) => {
3644
- const studentsForLesson = byLesson(l.lessonName);
3645
- const fileCount = countFiles(studentsForLesson);
3646
- return /* @__PURE__ */ React.createElement(Accordion.Item, { key: l.lessonId, value: l.lessonId }, /* @__PURE__ */ React.createElement(Accordion.Control, null, /* @__PURE__ */ React.createElement(Group, { position: "apart", w: "100%" }, /* @__PURE__ */ React.createElement(Text, null, l.lessonName), /* @__PURE__ */ React.createElement(Badge$1, { size: "sm" }, fileCount))), /* @__PURE__ */ React.createElement(Accordion.Panel, null, /* @__PURE__ */ React.createElement(
3647
- Table,
3648
- {
3649
- loading,
3650
- items: studentsForLesson,
3651
- hideLesson: true
3652
- }
3653
- )));
3619
+ const BadgeGroups = (props) => {
3620
+ const { byBadge } = useFilteredStudents(props.students);
3621
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, props.badges.map((b) => {
3622
+ const filtered = byBadge(b.badgeId);
3623
+ const pathwayTitle = props.pathwayNameForBadge[b.badgeId];
3624
+ return /* @__PURE__ */ React.createElement(GroupCard, { key: b.badgeId, title: b.displayName, description: pathwayTitle ? `${pathwayTitle} pathway` : void 0, count: countFiles(filtered) }, /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: filtered, hideBadge: true, hidePathway: true, onReview: (item) => props.onReview(item, filtered, b.displayName) }));
3654
3625
  }));
3655
3626
  };
3656
- const PathwayTable = ({
3657
- pathways,
3658
- badges,
3659
- students,
3660
- loading
3661
- }) => {
3662
- const { byPathway } = useFilteredStudents(students);
3663
- const countFiles = (students2) => students2.reduce((acc, s) => {
3664
- var _a;
3665
- return acc + (((_a = s.submissions) == null ? void 0 : _a.length) || 0);
3666
- }, 0);
3667
- return /* @__PURE__ */ React.createElement(Accordion, null, pathways.map((p) => {
3668
- const studentsForPathway = byPathway(p.pathwayId, badges);
3669
- const fileCount = countFiles(studentsForPathway);
3670
- return /* @__PURE__ */ React.createElement(Accordion.Item, { key: p.pathwayId, value: p.pathwayId }, /* @__PURE__ */ React.createElement(Accordion.Control, null, /* @__PURE__ */ React.createElement(Group, { position: "apart", w: "100%" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("strong", null, p.title), /* @__PURE__ */ React.createElement("div", null, p.description)), /* @__PURE__ */ React.createElement(Badge$1, { size: "sm" }, fileCount))), /* @__PURE__ */ React.createElement(Accordion.Panel, null, /* @__PURE__ */ React.createElement(
3671
- Table,
3672
- {
3673
- loading,
3674
- items: studentsForPathway
3675
- }
3676
- )));
3627
+ const LessonGroups = (props) => {
3628
+ const { byLesson } = useFilteredStudents(props.students);
3629
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, props.lessons.map((l) => {
3630
+ const filtered = byLesson(l.lessonName);
3631
+ const badge = props.badgeForLesson[l.lessonId];
3632
+ const pathwayTitle = badge ? props.pathwayNameForBadge[badge.badgeId] : void 0;
3633
+ const description = badge ? pathwayTitle ? `${badge.displayName} \xB7 ${pathwayTitle} pathway` : badge.displayName : void 0;
3634
+ return /* @__PURE__ */ React.createElement(GroupCard, { key: l.lessonId, title: l.lessonName, description, count: countFiles(filtered) }, /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: filtered, hideBadge: true, hideLesson: true, hidePathway: true, onReview: (item) => props.onReview(item, filtered, l.lessonName) }));
3677
3635
  }));
3678
3636
  };
3679
3637
  const FileLocker = (props) => {
3680
- const { classes } = useStyles();
3681
- const [tab, setTab] = useState("students");
3682
- props.students.length;
3683
- const numberOfFiles = props.students.reduce(
3684
- (acc, s) => {
3685
- var _a;
3686
- return acc + (((_a = s.submissions) == null ? void 0 : _a.length) || 0);
3687
- },
3688
- 0
3689
- );
3690
- return /* @__PURE__ */ React.createElement(Container, { size: "lg", py: "xl" }, /* @__PURE__ */ React.createElement(Stack$5, { spacing: "md" }, /* @__PURE__ */ React.createElement(Grid, null, /* @__PURE__ */ React.createElement(Grid.Col, { sm: "auto" }, /* @__PURE__ */ React.createElement(UnstyledButton, { onClick: props.onBackClick }, /* @__PURE__ */ React.createElement(
3691
- Badge$1,
3692
- {
3693
- variant: "filled",
3694
- leftSection: /* @__PURE__ */ React.createElement(ActionIcon, { color: "blue", size: "xs", radius: "xl", variant: "filled" }, /* @__PURE__ */ React.createElement(IconArrowLeft, { size: 14 })),
3695
- size: "lg"
3696
- },
3697
- "Back"
3698
- )), /* @__PURE__ */ React.createElement(Group, null, /* @__PURE__ */ React.createElement(Stack$5, { spacing: 0 }, /* @__PURE__ */ React.createElement(Title, { order: 2, className: classes.title, mt: "md" }, props.displayName || "File"), /* @__PURE__ */ React.createElement(Text, { color: "dimmed", className: classes.description, mt: "sm" }, props.description || "No description")), !props.trial && /* @__PURE__ */ React.createElement(Stack$5, { ml: "auto" }, /* @__PURE__ */ React.createElement(
3699
- SplitButton,
3700
- {
3701
- href: props.href,
3702
- onCopyLinkClick: props.onCopyLinkClick,
3703
- onExportDataClick: props.onExportDataClick
3704
- }
3705
- ))))), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ React.createElement(LoadingOverlay, { visible: props.loading, overlayBlur: 2 }), /* @__PURE__ */ React.createElement(Stack$5, null, /* @__PURE__ */ React.createElement(StatsGroup, { data: [
3706
- {
3707
- title: props.trial ? "LESSONS SUBMITTED" : "FILES",
3708
- value: props.trial ? props.lessonsCompleted || 0 : numberOfFiles,
3709
- unit: props.trial ? "" : ""
3710
- }
3711
- ] }), !props.trial && /* @__PURE__ */ React.createElement(
3712
- Select,
3638
+ const [tab, setTab] = React.useState("students");
3639
+ const [reviewing, setReviewing] = React.useState(null);
3640
+ const numberOfFiles = countFiles(props.students);
3641
+ const { thisWeek, thisMonth } = React.useMemo(() => {
3642
+ const now = new Date();
3643
+ const weekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1e3);
3644
+ const fom = new Date(now.getFullYear(), now.getMonth(), 1);
3645
+ let week = 0, month = 0;
3646
+ props.students.forEach((s) => {
3647
+ (s.submissions || []).forEach((sub) => {
3648
+ if (!sub.updatedAt)
3649
+ return;
3650
+ const d = new Date(sub.updatedAt);
3651
+ if (d >= weekAgo)
3652
+ week += 1;
3653
+ if (d >= fom)
3654
+ month += 1;
3655
+ });
3656
+ });
3657
+ return { thisWeek: week, thisMonth: month };
3658
+ }, [props.students]);
3659
+ const pathwayNameForBadge = React.useMemo(() => {
3660
+ const map = {};
3661
+ (props.badges || []).forEach((b) => {
3662
+ if (!Array.isArray(b.categories))
3663
+ return;
3664
+ const pathway = (props.pathways || []).find((p) => b.categories.some((c) => c.startsWith(p.pathwayId)));
3665
+ if (pathway)
3666
+ map[b.badgeId] = pathway.title;
3667
+ });
3668
+ return map;
3669
+ }, [props.badges, props.pathways]);
3670
+ const badgeForLesson = React.useMemo(() => {
3671
+ const map = {};
3672
+ (props.badges || []).forEach((b) => {
3673
+ if (!Array.isArray(b.lessonIds))
3674
+ return;
3675
+ b.lessonIds.forEach((lessonId) => {
3676
+ if (!(lessonId in map))
3677
+ map[lessonId] = { displayName: b.displayName, badgeId: b.badgeId };
3678
+ });
3679
+ });
3680
+ return map;
3681
+ }, [props.badges]);
3682
+ const enrichedStudents = React.useMemo(() => {
3683
+ return props.students.map((s) => __spreadProps(__spreadValues({}, s), {
3684
+ submissions: (s.submissions || []).map((sub) => __spreadProps(__spreadValues({}, sub), { pathwayName: pathwayNameForBadge[sub.badgeId] || "" }))
3685
+ }));
3686
+ }, [props.students, pathwayNameForBadge]);
3687
+ const { byPathway } = useFilteredStudents(enrichedStudents);
3688
+ const mostActivePathway = React.useMemo(() => {
3689
+ return (props.pathways || []).reduce((best, p) => {
3690
+ const count = countFiles(byPathway(p.pathwayId, props.badges || []));
3691
+ return count > 0 && (!best || count > best.count) ? { title: p.title, count } : best;
3692
+ }, null);
3693
+ }, [props.pathways, props.badges, byPathway]);
3694
+ const onReview = (item, list, context) => setReviewing({ student: item, list, context });
3695
+ const onNav = (dir) => {
3696
+ if (!reviewing)
3697
+ return;
3698
+ const idx = reviewing.list.findIndex((s) => s.userId === reviewing.student.userId);
3699
+ if (idx === -1)
3700
+ return;
3701
+ const next = reviewing.list[(idx + dir + reviewing.list.length) % reviewing.list.length];
3702
+ setReviewing(__spreadProps(__spreadValues({}, reviewing), { student: next }));
3703
+ };
3704
+ if (reviewing) {
3705
+ return /* @__PURE__ */ React.createElement(
3706
+ SubmissionDetail,
3707
+ {
3708
+ student: reviewing.student,
3709
+ context: reviewing.context,
3710
+ onBack: () => setReviewing(null),
3711
+ onNav
3712
+ }
3713
+ );
3714
+ }
3715
+ return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-5 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("button", { onClick: props.onBackClick, className: "flex items-center gap-1 text-xs font-bold text-sky-blue-400 hover:underline" }, /* @__PURE__ */ React.createElement(IconChevronLeft, { size: 13, stroke: 2.5 }), "Back"), /* @__PURE__ */ React.createElement("h1", { className: "mt-1.5 text-2xl font-extrabold tracking-tight text-dark-blue-400" }, props.displayName || "File Locker"), /* @__PURE__ */ React.createElement("p", { className: "mt-1 text-sm text-slate-500" }, props.description || "No description")), !props.trial && /* @__PURE__ */ React.createElement(SplitButton, { href: props.href, onCopyLinkClick: props.onCopyLinkClick, onExportDataClick: props.onExportDataClick })), /* @__PURE__ */ React.createElement(StatsGroup, { data: props.trial ? [
3716
+ { title: "LESSONS SUBMITTED", value: props.lessonsCompleted || 0 }
3717
+ ] : [
3718
+ { title: "FILES", value: numberOfFiles },
3719
+ { title: "THIS WEEK", value: thisWeek },
3720
+ { title: "THIS MONTH", value: thisMonth }
3721
+ ] }), !props.trial && mostActivePathway && /* @__PURE__ */ React.createElement("div", { className: "text-xs text-slate-500" }, "Most active pathway: ", /* @__PURE__ */ React.createElement("span", { className: "font-bold text-dark-blue-400" }, mostActivePathway.title), " (", mostActivePathway.count, " submission", mostActivePathway.count === 1 ? "" : "s", ")"), !props.trial && /* @__PURE__ */ React.createElement(
3722
+ "select",
3713
3723
  {
3714
- clearable: true,
3715
- clearButtonLabel: "Clear class selection",
3716
- size: "sm",
3717
- placeholder: "Select a class",
3718
- nothingFound: "No options",
3719
3724
  value: props.classId,
3720
- onChange: props.onClassChange,
3721
- icon: /* @__PURE__ */ React.createElement(IconCategory2, null),
3722
- data: props.classes.map((g) => {
3723
- return { value: g.classId, label: g.name };
3724
- })
3725
- }
3726
- ), /* @__PURE__ */ React.createElement(Stack$5, { spacing: 0 }, !props.trial && /* @__PURE__ */ React.createElement(
3727
- Tabs,
3728
- {
3729
- value: tab,
3730
- data: [
3731
- { label: "By student", value: "students" },
3732
- { label: "By pathway", value: "pathways" },
3733
- { label: "By badge", value: "badges" },
3734
- { label: "By lesson", value: "lessons" }
3735
- ],
3736
- onChange: setTab
3737
- }
3738
- ), !props.trial && tab === "students" && /* @__PURE__ */ React.createElement(
3739
- Table,
3740
- {
3741
- loading: props.loading,
3742
- items: props.students
3743
- }
3744
- ), tab === "pathways" && /* @__PURE__ */ React.createElement(
3745
- PathwayTable,
3746
- {
3747
- pathways: props.pathways || [],
3748
- badges: props.badges || [],
3749
- students: props.students,
3750
- loading: props.loading
3751
- }
3752
- ), tab === "badges" && /* @__PURE__ */ React.createElement(
3753
- BadgeTable,
3754
- {
3755
- badges: props.badges || [],
3756
- students: props.students,
3757
- loading: props.loading
3758
- }
3759
- ), tab === "lessons" && /* @__PURE__ */ React.createElement(
3760
- LessonTableWrapper,
3725
+ onChange: (e) => props.onClassChange(e.target.value),
3726
+ className: "w-64 rounded-xl border border-slate-200 bg-white px-3.5 py-2.5 text-sm text-dark-blue-400 focus:border-sky-blue-400 focus:outline-none"
3727
+ },
3728
+ /* @__PURE__ */ React.createElement("option", { value: "" }, "Select a class"),
3729
+ props.classes.map((g) => /* @__PURE__ */ React.createElement("option", { key: g.classId, value: g.classId }, g.name))
3730
+ ), !props.trial && /* @__PURE__ */ React.createElement("div", { className: "flex w-fit gap-1 rounded-xl border border-slate-200 bg-white p-1" }, TABS.map((t) => /* @__PURE__ */ React.createElement(
3731
+ "button",
3761
3732
  {
3762
- lessons: props.lessons,
3763
- students: props.students,
3764
- loading: props.loading
3765
- }
3766
- )))))));
3733
+ key: t.value,
3734
+ onClick: () => setTab(t.value),
3735
+ className: `rounded-lg px-4 py-2 text-xs font-bold ${tab === t.value ? "bg-sky-blue-400/20 text-dark-blue-400" : "text-slate-400 hover:text-slate-600"}`
3736
+ },
3737
+ t.label
3738
+ ))), !props.trial && tab === "students" && /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: enrichedStudents, onReview: (item) => onReview(item, enrichedStudents) }), !props.trial && tab === "pathways" && /* @__PURE__ */ React.createElement(PathwayGroups, { students: enrichedStudents, loading: props.loading, pathways: props.pathways || [], badges: props.badges || [], onReview }), !props.trial && tab === "badges" && /* @__PURE__ */ React.createElement(BadgeGroups, { students: enrichedStudents, loading: props.loading, badges: props.badges || [], pathwayNameForBadge, onReview }), !props.trial && tab === "lessons" && /* @__PURE__ */ React.createElement(LessonGroups, { students: enrichedStudents, loading: props.loading, lessons: props.lessons, badgeForLesson, pathwayNameForBadge, onReview }));
3767
3739
  };
3768
3740
 
3769
- export { AdminProvider, App, Badge, Badges, Class, Classes, Dashboard, FileLocker, GettingStarted, Home, Lesson, Lessons, Navbar, Organization, Pathway, PathwayTable, Pathways, People, StartAnonymousLesson, Student, SwitchAccount, TrialHome, TrialRegistration };
3741
+ export { AdminProvider, App, Badge, Badges, Class, Classes, Dashboard, FileLocker, GettingStarted, Home, Lesson, Lessons, Navbar, Organization, Pathway, Pathways, People, StartAnonymousLesson, Student, SwitchAccount, TrialHome, TrialRegistration };
3770
3742
  //# sourceMappingURL=index.mjs.map