@local-civics/mgmt-ui 0.1.222 → 0.1.224

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,6 +1,6 @@
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, IconBooks, IconBackpack, IconClipboardCopy, IconTableExport, IconChevronDown, IconArrowLeft, IconSearch, IconCheck, IconTrash, IconPlus, IconLink, IconDownload, IconCloudUpload, IconInfoCircle, IconPlaylistAdd, IconPointer, IconX, IconScribble, IconSchool, IconPodium, IconBriefcase, IconPresentation, IconNews, IconTools, IconBrandInstagram, IconBrandLinkedin, IconBrandFacebook, IconExternalLink, IconChevronLeft } from '@tabler/icons';
3
+ import { IconChevronRight, IconVideo, IconSwitchHorizontal, IconLogout, IconHome2, IconGauge, IconCategory2, IconRoute, IconAlbum, IconLambda, IconClipboard, IconBuilding, IconBooks, IconBackpack, IconClipboardCopy, IconTableExport, IconCaretDown, IconCaretUp, IconChevronDown, IconArrowLeft, IconSearch, IconCheck, IconTrash, IconPlus, IconLink, IconDownload, IconCloudUpload, IconInfoCircle, IconPlaylistAdd, IconPointer, IconX, IconScribble, IconSchool, IconPodium, IconBriefcase, IconPresentation, IconNews, IconTools, IconBrandInstagram, IconBrandLinkedin, IconBrandFacebook, IconExternalLink, IconChevronLeft } from '@tabler/icons';
4
4
  import { Avatar, createStyles, Modal, Center, Loader, Container, Group, Button, Title, Text, Image, Drawer, Divider, TextInput, Tooltip, ActionIcon, SimpleGrid, Badge as Badge$1, Card, UnstyledButton, Overlay, Stack as Stack$5, ThemeIcon, Checkbox, Autocomplete, createEmotionCache, MantineProvider, AppShell } from '@mantine/core';
5
5
  import { Link } from 'react-router-dom';
6
6
  import 'external-svg-loader';
@@ -40,7 +40,7 @@ function styleInject(css, ref) {
40
40
  }
41
41
  }
42
42
 
43
- 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{left:.75rem}.top-1\\/2{top:50%}.left-3\\.5{left:.875rem}.bottom-\\[-20px\\]{bottom:-20px}.left-1\\/2{left:50%}.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-2{margin-left:-.5rem}.mt-4{margin-top:1rem}.mt-3{margin-top:.75rem}.mb-8{margin-bottom:2rem}.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-9{height:2.25rem}.h-8{height:2rem}.h-7{height:1.75rem}.h-12{height:3rem}.h-\\[300px\\]{height:300px}.h-screen{height:100vh}.h-11{height:2.75rem}.h-16{height:4rem}.h-\\[30px\\]{height:30px}.h-\\[400px\\]{height:400px}.max-h-\\[70vh\\]{max-height:70vh}.w-10{width:2.5rem}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-fit{width:-moz-fit-content;width:fit-content}.w-36{width:9rem}.w-28{width:7rem}.w-4{width:1rem}.w-9{width:2.25rem}.w-40{width:10rem}.w-8{width:2rem}.w-7{width:1.75rem}.w-64{width:16rem}.w-12{width:3rem}.w-16{width:4rem}.w-\\[440px\\]{width:440px}.w-20{width:5rem}.w-24{width:6rem}.w-\\[250px\\]{width:250px}.w-screen{width:100vw}.w-11{width:2.75rem}.w-\\[230px\\]{width:230px}.w-\\[30px\\]{width:30px}.min-w-0{min-width:0}.max-w-xl{max-width:36rem}.max-w-xs{max-width:20rem}.max-w-\\[460px\\]{max-width:460px}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.-translate-y-1\\/2{--tw-translate-y:-50%}.-translate-x-1\\/2,.-translate-y-1\\/2{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))}.-translate-x-1\\/2{--tw-translate-x:-50%}.rotate-180{--tw-rotate:180deg}.rotate-180,.rotate-90{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-90{--tw-rotate:90deg}.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}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-\\[2\\.2fr_1\\.2fr_1fr_1\\.2fr_1fr_0\\.6fr\\]{grid-template-columns:2.2fr 1.2fr 1fr 1.2fr 1fr .6fr}.grid-cols-\\[1\\.5fr_2fr_1fr_0\\.6fr\\]{grid-template-columns:1.5fr 2fr 1fr .6fr}.grid-cols-\\[1\\.5fr_2fr_0\\.8fr\\]{grid-template-columns:1.5fr 2fr .8fr}.grid-cols-\\[1fr_3fr\\]{grid-template-columns:1fr 3fr}.grid-cols-\\[1fr_1fr_2fr_0\\.8fr\\]{grid-template-columns:1fr 1fr 2fr .8fr}.grid-cols-\\[2fr_1fr\\]{grid-template-columns:2fr 1fr}.grid-cols-\\[2\\.2fr_1\\.2fr_1fr_1fr_0\\.6fr\\]{grid-template-columns:2.2fr 1.2fr 1fr 1fr .6fr}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.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-4{gap:1rem}.gap-1{gap:.25rem}.gap-3{gap:.75rem}.gap-2{gap:.5rem}.gap-1\\.5{gap:.375rem}.gap-2\\.5{gap:.625rem}.gap-3\\.5{gap:.875rem}.gap-6{gap:1.5rem}.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\\.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)))}.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)))}.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-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-full{border-radius:9999px}.rounded-md{border-radius:.375rem}.rounded{border-radius:.25rem}.rounded-\\[8px\\]{border-radius:8px}.border{border-width:1px}.border-2{border-width:2px}.border-l-4{border-left-width:4px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}.border-l-2{border-left-width:2px}.border-r{border-right-width:1px}.border-l{border-left-width:1px}.border-dashed{border-style:dashed}.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-white{--tw-border-opacity:1;border-color:rgb(255 255 255/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-sky-blue-400\\/40{border-color:rgba(59,208,242,.4)}.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-sky-blue-400\\/20{background-color:rgba(59,208,242,.2)}.bg-mint-100{--tw-bg-opacity:1;background-color:rgb(208 251 240/var(--tw-bg-opacity))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity))}.bg-gold-100{--tw-bg-opacity:1;background-color:rgb(255 248 214/var(--tw-bg-opacity))}.bg-mint-400\\/20{background-color:rgba(30,226,175,.2)}.bg-transparent{background-color:transparent}.bg-dark-blue-400{--tw-bg-opacity:1;background-color:rgb(35 42 58/var(--tw-bg-opacity))}.bg-white\\/90{background-color:hsla(0,0%,100%,.9)}.bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.bg-slate-50\\/60{background-color:rgba(248,250,252,.6)}.bg-sky-blue-400\\/15{background-color:rgba(59,208,242,.15)}.bg-gold-400\\/15{background-color:rgba(255,212,77,.15)}.bg-mint-400\\/15{background-color:rgba(30,226,175,.15)}.bg-sky-blue-400\\/25{background-color:rgba(59,208,242,.25)}.bg-mint-400\\/25{background-color:rgba(30,226,175,.25)}.bg-gold-400\\/25{background-color:rgba(255,212,77,.25)}.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-1{padding:.25rem}.p-4{padding:1rem}.p-8{padding:2rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-3{padding:.75rem}.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-2{padding-bottom:.5rem;padding-top:.5rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.px-2\\.5{padding-left:.625rem;padding-right:.625rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3\\.5{padding-left:.875rem;padding-right:.875rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2\\.5{padding-bottom:.625rem;padding-top:.625rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-3\\.5{padding-bottom:.875rem;padding-top:.875rem}.px-1{padding-left:.25rem;padding-right:.25rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-0{padding-bottom:0;padding-top:0}.py-4{padding-bottom:1rem;padding-top:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-6{padding-bottom:1.5rem;padding-top:1.5rem}.pl-9{padding-left:2.25rem}.pr-4{padding-right:1rem}.pl-10{padding-left:2.5rem}.pb-2{padding-bottom:.5rem}.pr-1{padding-right:.25rem}.pl-4{padding-left:1rem}.pt-0\\.5{padding-top:.125rem}.pt-0{padding-top:0}.pb-12{padding-bottom:3rem}.pl-2\\.5{padding-left:.625rem}.pl-2{padding-left:.5rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.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-\\[10px\\]{font-size:10px}.text-\\[10\\.5px\\]{font-size:10.5px}.text-lg{font-size:1.125rem;line-height:1.75rem}.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-sky-blue-400{--tw-text-opacity:1;color:rgb(59 208 242/var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity))}.text-mint-400{--tw-text-opacity:1;color:rgb(30 226 175/var(--tw-text-opacity))}.text-white\\/70{color:hsla(0,0%,100%,.7)}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.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-\\[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);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.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))}.first\\:ml-0:first-child{margin-left:0}.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-600:hover{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-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-sky-blue-400:hover{--tw-text-opacity:1;color:rgb(59 208 242/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}@media (min-width:640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:768px){.md\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}";
43
+ 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{left:.75rem}.top-1\\/2{top:50%}.left-3\\.5{left:.875rem}.bottom-\\[-20px\\]{bottom:-20px}.left-1\\/2{left:50%}.m-3{margin:.75rem}.mt-0\\.5{margin-top:.125rem}.mt-0{margin-top:0}.mt-6{margin-top:1.5rem}.mt-2{margin-top:.5rem}.mt-1{margin-top:.25rem}.mt-1\\.5{margin-top:.375rem}.-ml-2{margin-left:-.5rem}.mt-4{margin-top:1rem}.mt-3{margin-top:.75rem}.mb-8{margin-bottom:2rem}.ml-\\[29px\\]{margin-left:29px}.block{display:block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-10{height:2.5rem}.h-full{height:100%}.h-9{height:2.25rem}.h-8{height:2rem}.h-7{height:1.75rem}.h-12{height:3rem}.h-\\[300px\\]{height:300px}.h-screen{height:100vh}.h-14{height:3.5rem}.h-16{height:4rem}.h-28{height:7rem}.h-\\[30px\\]{height:30px}.h-\\[400px\\]{height:400px}.max-h-\\[70vh\\]{max-height:70vh}.w-10{width:2.5rem}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-fit{width:-moz-fit-content;width:fit-content}.w-36{width:9rem}.w-28{width:7rem}.w-4{width:1rem}.w-9{width:2.25rem}.w-14{width:3.5rem}.w-56{width:14rem}.w-40{width:10rem}.w-24{width:6rem}.w-8{width:2rem}.w-7{width:1.75rem}.w-64{width:16rem}.w-12{width:3rem}.w-16{width:4rem}.w-\\[440px\\]{width:440px}.w-20{width:5rem}.w-\\[250px\\]{width:250px}.w-screen{width:100vw}.w-\\[500px\\]{width:500px}.w-\\[230px\\]{width:230px}.w-\\[30px\\]{width:30px}.min-w-0{min-width:0}.max-w-xl{max-width:36rem}.max-w-xs{max-width:20rem}.max-w-\\[460px\\]{max-width:460px}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.-translate-y-1\\/2{--tw-translate-y:-50%}.-translate-x-1\\/2,.-translate-y-1\\/2{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))}.-translate-x-1\\/2{--tw-translate-x:-50%}.rotate-180{--tw-rotate:180deg}.rotate-180,.rotate-90{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-90{--tw-rotate:90deg}.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}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-\\[2\\.2fr_1\\.2fr_1fr_1\\.2fr_1fr_0\\.6fr\\]{grid-template-columns:2.2fr 1.2fr 1fr 1.2fr 1fr .6fr}.grid-cols-\\[1\\.5fr_2fr_1fr_0\\.6fr\\]{grid-template-columns:1.5fr 2fr 1fr .6fr}.grid-cols-\\[1\\.5fr_2fr_0\\.8fr\\]{grid-template-columns:1.5fr 2fr .8fr}.grid-cols-\\[1fr_3fr\\]{grid-template-columns:1fr 3fr}.grid-cols-\\[1fr_1fr_2fr_0\\.8fr\\]{grid-template-columns:1fr 1fr 2fr .8fr}.grid-cols-\\[2fr_1fr\\]{grid-template-columns:2fr 1fr}.grid-cols-\\[2\\.2fr_1\\.2fr_1fr_1fr_0\\.6fr\\]{grid-template-columns:2.2fr 1.2fr 1fr 1fr .6fr}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.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-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-\\[18px\\]{gap:18px}.gap-5{gap:1.25rem}.gap-4{gap:1rem}.gap-1{gap:.25rem}.gap-3{gap:.75rem}.gap-2{gap:.5rem}.gap-1\\.5{gap:.375rem}.gap-2\\.5{gap:.625rem}.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\\.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)))}.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-\\[3px\\]>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(-3px*var(--tw-space-y-reverse));margin-top:calc(-3px*(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-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-full{border-radius:9999px}.rounded-md{border-radius:.375rem}.rounded{border-radius:.25rem}.rounded-3xl{border-radius:1.5rem}.rounded-\\[8px\\]{border-radius:8px}.border{border-width:1px}.border-2{border-width:2px}.border-l-4{border-left-width:4px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}.border-l-2{border-left-width:2px}.border-r{border-right-width:1px}.border-l{border-left-width:1px}.border-dashed{border-style:dashed}.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-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity))}.border-sky-blue-400\\/40{border-color:rgba(59,208,242,.4)}.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-sky-blue-400\\/20{background-color:rgba(59,208,242,.2)}.bg-mint-100{--tw-bg-opacity:1;background-color:rgb(208 251 240/var(--tw-bg-opacity))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity))}.bg-gold-100{--tw-bg-opacity:1;background-color:rgb(255 248 214/var(--tw-bg-opacity))}.bg-mint-400\\/20{background-color:rgba(30,226,175,.2)}.bg-transparent{background-color:transparent}.bg-dark-blue-400{--tw-bg-opacity:1;background-color:rgb(35 42 58/var(--tw-bg-opacity))}.bg-white\\/90{background-color:hsla(0,0%,100%,.9)}.bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity))}.bg-slate-50\\/60{background-color:rgba(248,250,252,.6)}.bg-sky-blue-400\\/15{background-color:rgba(59,208,242,.15)}.bg-gold-400\\/15{background-color:rgba(255,212,77,.15)}.bg-mint-400\\/15{background-color:rgba(30,226,175,.15)}.bg-sky-blue-400\\/25{background-color:rgba(59,208,242,.25)}.bg-mint-400\\/25{background-color:rgba(30,226,175,.25)}.bg-gold-400\\/25{background-color:rgba(255,212,77,.25)}.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-1{padding:.25rem}.p-4{padding:1rem}.p-8{padding:2rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-3{padding:.75rem}.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-2{padding-bottom:.5rem;padding-top:.5rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.px-2\\.5{padding-left:.625rem;padding-right:.625rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3\\.5{padding-left:.875rem;padding-right:.875rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2\\.5{padding-bottom:.625rem;padding-top:.625rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-3\\.5{padding-bottom:.875rem;padding-top:.875rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-0{padding-bottom:0;padding-top:0}.py-4{padding-bottom:1rem;padding-top:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-6{padding-bottom:1.5rem;padding-top:1.5rem}.pl-9{padding-left:2.25rem}.pr-4{padding-right:1rem}.pl-10{padding-left:2.5rem}.pb-2{padding-bottom:.5rem}.pr-1{padding-right:.25rem}.pl-4{padding-left:1rem}.pt-0\\.5{padding-top:.125rem}.pt-0{padding-top:0}.pb-12{padding-bottom:3rem}.pl-2\\.5{padding-left:.625rem}.pl-2{padding-left:.5rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.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-\\[10px\\]{font-size:10px}.text-\\[10\\.5px\\]{font-size:10.5px}.text-lg{font-size:1.125rem;line-height:1.75rem}.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-sky-blue-400{--tw-text-opacity:1;color:rgb(59 208 242/var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity))}.text-mint-400{--tw-text-opacity:1;color:rgb(30 226 175/var(--tw-text-opacity))}.text-white\\/70{color:hsla(0,0%,100%,.7)}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity))}.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-\\[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);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.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)}.line-clamp-2{-webkit-box-orient:vertical;-webkit-line-clamp:2;display:-webkit-box;overflow:hidden}*,: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))}.first\\:ml-0:first-child{margin-left:0}.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-600:hover{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity))}.hover\\:text-red-500:hover{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity))}.hover\\:text-sky-blue-400:hover{--tw-text-opacity:1;color:rgb(59 208 242/var(--tw-text-opacity))}.hover\\:text-slate-700:hover{--tw-text-opacity:1;color:rgb(51 65 85/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}@media (min-width:640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:768px){.md\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}";
44
44
  styleInject(css_248z);
45
45
 
46
46
  function UserButton({ image, name, email }) {
@@ -124,25 +124,25 @@ function LinksGroup({ icon: Icon, href, label, accent = "cyan", initiallyOpened,
124
124
  ), 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));
125
125
  }
126
126
 
127
- var __defProp$h = Object.defineProperty;
128
- var __defProps$e = Object.defineProperties;
129
- var __getOwnPropDescs$e = Object.getOwnPropertyDescriptors;
130
- var __getOwnPropSymbols$h = Object.getOwnPropertySymbols;
131
- var __hasOwnProp$h = Object.prototype.hasOwnProperty;
132
- var __propIsEnum$h = Object.prototype.propertyIsEnumerable;
133
- var __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
134
- var __spreadValues$h = (a, b) => {
127
+ var __defProp$i = Object.defineProperty;
128
+ var __defProps$f = Object.defineProperties;
129
+ var __getOwnPropDescs$f = Object.getOwnPropertyDescriptors;
130
+ var __getOwnPropSymbols$i = Object.getOwnPropertySymbols;
131
+ var __hasOwnProp$i = Object.prototype.hasOwnProperty;
132
+ var __propIsEnum$i = Object.prototype.propertyIsEnumerable;
133
+ var __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$i(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
134
+ var __spreadValues$i = (a, b) => {
135
135
  for (var prop in b || (b = {}))
136
- if (__hasOwnProp$h.call(b, prop))
137
- __defNormalProp$h(a, prop, b[prop]);
138
- if (__getOwnPropSymbols$h)
139
- for (var prop of __getOwnPropSymbols$h(b)) {
140
- if (__propIsEnum$h.call(b, prop))
141
- __defNormalProp$h(a, prop, b[prop]);
136
+ if (__hasOwnProp$i.call(b, prop))
137
+ __defNormalProp$i(a, prop, b[prop]);
138
+ if (__getOwnPropSymbols$i)
139
+ for (var prop of __getOwnPropSymbols$i(b)) {
140
+ if (__propIsEnum$i.call(b, prop))
141
+ __defNormalProp$i(a, prop, b[prop]);
142
142
  }
143
143
  return a;
144
144
  };
145
- var __spreadProps$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
145
+ var __spreadProps$f = (a, b) => __defProps$f(a, __getOwnPropDescs$f(b));
146
146
  const data = [
147
147
  { label: "Home", icon: IconHome2, accent: "cyan" },
148
148
  { label: "Dashboard", icon: IconGauge, accent: "mint" },
@@ -169,12 +169,12 @@ function Navbar(props) {
169
169
  }
170
170
  return /* @__PURE__ */ React.createElement(
171
171
  LinksGroup,
172
- __spreadProps$e(__spreadValues$h(__spreadValues$h({
172
+ __spreadProps$f(__spreadValues$i(__spreadValues$i({
173
173
  key: item.label,
174
174
  active: props.active
175
175
  }, item), context), {
176
176
  links: (item.links || []).map((link) => {
177
- return __spreadValues$h(__spreadValues$h({}, link), props.links[`${item.label}/${link.label}`] || { notifications: 0, href: "" });
177
+ return __spreadValues$i(__spreadValues$i({}, link), props.links[`${item.label}/${link.label}`] || { notifications: 0, href: "" });
178
178
  })
179
179
  })
180
180
  );
@@ -245,8 +245,9 @@ const GettingStarted = (props) => {
245
245
  };
246
246
 
247
247
  const SIZE = {
248
- sm: { box: "h-11 w-11", rounded: "rounded-xl", icon: 20 },
249
- lg: { box: "h-16 w-16", rounded: "rounded-2xl", icon: 28 }
248
+ sm: { box: "h-14 w-14", rounded: "rounded-xl", icon: 24 },
249
+ lg: { box: "h-16 w-16", rounded: "rounded-2xl", icon: 28 },
250
+ xl: { box: "h-28 w-28", rounded: "rounded-3xl", icon: 48 }
250
251
  };
251
252
  const ACCENT = {
252
253
  cyan: { bg: "bg-sky-blue-400/15", text: "text-sky-blue-400" },
@@ -282,6 +283,8 @@ function Emblem(props) {
282
283
  "svg",
283
284
  {
284
285
  ref,
286
+ role: "img",
287
+ "aria-label": props.alt,
285
288
  "data-cache": "disabled",
286
289
  "data-src": props.imageURL,
287
290
  className: `${s.box} shrink-0 ${s.rounded} object-cover`,
@@ -293,7 +296,7 @@ function Emblem(props) {
293
296
  }
294
297
  );
295
298
  }
296
- return /* @__PURE__ */ React.createElement("div", { className: `flex ${s.box} shrink-0 items-center justify-center ${s.rounded} ${a.bg}` }, /* @__PURE__ */ React.createElement(Icon, { size: s.icon, stroke: 1.75, className: a.text }));
299
+ return /* @__PURE__ */ React.createElement("div", { role: "img", "aria-label": props.alt, className: `flex ${s.box} shrink-0 items-center justify-center ${s.rounded} ${a.bg}` }, /* @__PURE__ */ React.createElement(Icon, { size: s.icon, stroke: 1.75, className: a.text, "aria-hidden": "true" }));
297
300
  }
298
301
 
299
302
  const ROLE = {
@@ -426,6 +429,22 @@ const PlaceholderBanner = (props) => {
426
429
  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 }));
427
430
  };
428
431
 
432
+ function SortableHeader(props) {
433
+ const active = props.sortConfig.key === props.sortKey;
434
+ const direction = active ? props.sortConfig.direction : null;
435
+ const justify = props.align === "right" ? "justify-end" : props.align === "center" ? "justify-center" : "";
436
+ return /* @__PURE__ */ React.createElement(
437
+ "button",
438
+ {
439
+ type: "button",
440
+ onClick: () => props.onSort(props.sortKey),
441
+ className: `inline-flex items-center gap-1 text-[10px] font-bold uppercase tracking-wide text-slate-500 hover:text-slate-700 ${justify} ${props.className || ""}`
442
+ },
443
+ /* @__PURE__ */ React.createElement("span", null, props.label),
444
+ active ? direction === "desc" ? /* @__PURE__ */ React.createElement(IconCaretDown, { size: 12, stroke: 2.5, className: "shrink-0 text-sky-blue-400" }) : /* @__PURE__ */ React.createElement(IconCaretUp, { size: 12, stroke: 2.5, className: "shrink-0 text-sky-blue-400" }) : /* @__PURE__ */ React.createElement("span", { className: "flex shrink-0 flex-col -space-y-[3px]" }, /* @__PURE__ */ React.createElement(IconCaretUp, { size: 10, stroke: 2.5 }), /* @__PURE__ */ React.createElement(IconCaretDown, { size: 10, stroke: 2.5 }))
445
+ );
446
+ }
447
+
429
448
  function Stack$4(props) {
430
449
  if (props.items.length === 0) {
431
450
  return null;
@@ -471,29 +490,29 @@ function useSortableData(items, config = { key: "", direction: null }) {
471
490
  return { items: sortedItems, requestSort, sortConfig };
472
491
  }
473
492
 
474
- var __defProp$g = Object.defineProperty;
475
- var __defProps$d = Object.defineProperties;
476
- var __getOwnPropDescs$d = Object.getOwnPropertyDescriptors;
477
- var __getOwnPropSymbols$g = Object.getOwnPropertySymbols;
478
- var __hasOwnProp$g = Object.prototype.hasOwnProperty;
479
- var __propIsEnum$g = Object.prototype.propertyIsEnumerable;
480
- var __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$g(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
481
- var __spreadValues$g = (a, b) => {
493
+ var __defProp$h = Object.defineProperty;
494
+ var __defProps$e = Object.defineProperties;
495
+ var __getOwnPropDescs$e = Object.getOwnPropertyDescriptors;
496
+ var __getOwnPropSymbols$h = Object.getOwnPropertySymbols;
497
+ var __hasOwnProp$h = Object.prototype.hasOwnProperty;
498
+ var __propIsEnum$h = Object.prototype.propertyIsEnumerable;
499
+ var __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
500
+ var __spreadValues$h = (a, b) => {
482
501
  for (var prop in b || (b = {}))
483
- if (__hasOwnProp$g.call(b, prop))
484
- __defNormalProp$g(a, prop, b[prop]);
485
- if (__getOwnPropSymbols$g)
486
- for (var prop of __getOwnPropSymbols$g(b)) {
487
- if (__propIsEnum$g.call(b, prop))
488
- __defNormalProp$g(a, prop, b[prop]);
502
+ if (__hasOwnProp$h.call(b, prop))
503
+ __defNormalProp$h(a, prop, b[prop]);
504
+ if (__getOwnPropSymbols$h)
505
+ for (var prop of __getOwnPropSymbols$h(b)) {
506
+ if (__propIsEnum$h.call(b, prop))
507
+ __defNormalProp$h(a, prop, b[prop]);
489
508
  }
490
509
  return a;
491
510
  };
492
- var __spreadProps$d = (a, b) => __defProps$d(a, __getOwnPropDescs$d(b));
511
+ var __spreadProps$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
493
512
  function Table$k(props) {
494
513
  const [expanded, setExpanded] = React.useState({});
495
514
  const preparedItems = React.useMemo(() => {
496
- return props.items.map((item) => __spreadProps$d(__spreadValues$g({}, item), {
515
+ return props.items.map((item) => __spreadProps$e(__spreadValues$h({}, item), {
497
516
  status: item.isComplete ? 1 : 0
498
517
  }));
499
518
  }, [props.items]);
@@ -509,15 +528,14 @@ function Table$k(props) {
509
528
  }
510
529
  );
511
530
  }
512
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
513
- 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("status"), className: "w-28 shrink-0 text-center hover:text-slate-600" }, "Status", indicator("status")), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
531
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 px-4" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Student Name", sortKey: "name", sortConfig, onSort: requestSort, className: "flex-1" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Status", sortKey: "status", sortConfig, onSort: requestSort, align: "center", className: "w-28 shrink-0" }), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
514
532
  var _a;
515
533
  const isOpen = !!expanded[row.userId];
516
534
  const initials = (((_a = row.name) == null ? void 0 : _a[0]) || row.email[0] || "?").toUpperCase();
517
535
  return /* @__PURE__ */ React.createElement("div", { key: row.userId, className: "rounded-xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement(
518
536
  "div",
519
537
  {
520
- onClick: () => setExpanded(__spreadProps$d(__spreadValues$g({}, expanded), { [row.userId]: !isOpen })),
538
+ onClick: () => setExpanded(__spreadProps$e(__spreadValues$h({}, expanded), { [row.userId]: !isOpen })),
521
539
  className: "flex cursor-pointer items-center gap-4 p-4"
522
540
  },
523
541
  /* @__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-mint-400/20 text-xs font-bold text-dark-blue-400" }, initials), /* @__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))),
@@ -540,8 +558,7 @@ function Table$j(props) {
540
558
  }
541
559
  );
542
560
  }
543
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
544
- 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("button", { onClick: () => requestSort("lessonName"), className: "flex-1 text-left hover:text-slate-600" }, "Lesson Name", indicator("lessonName")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("percentageCompletion"), className: "w-36 shrink-0 text-right hover:text-slate-600" }, "Lesson Completion", indicator("percentageCompletion"))), sortedItems.map((row) => /* @__PURE__ */ React.createElement(
561
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex gap-4 px-4" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Lesson Name", sortKey: "lessonName", sortConfig, onSort: requestSort, className: "flex-1" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Lesson Completion", sortKey: "percentageCompletion", sortConfig, onSort: requestSort, align: "right", className: "w-36 shrink-0" })), sortedItems.map((row) => /* @__PURE__ */ React.createElement(
545
562
  Link,
546
563
  {
547
564
  key: row.lessonId,
@@ -561,7 +578,7 @@ const Badge = (props) => {
561
578
  const [tab, setTab] = useState("lessons");
562
579
  const numberOfStudents = props.students.length;
563
580
  const numberOfBadges = numberOfStudents > 0 ? props.students.filter((u) => u.isComplete).length : 0;
564
- return /* @__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: "flex items-start gap-4" }, /* @__PURE__ */ React.createElement(Emblem, { imageURL: props.imageURL, alt: props.displayName, size: "lg", icon: IconAlbum, accent: "mint" }), /* @__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 || "Badge"), /* @__PURE__ */ React.createElement("p", { className: "max-w-xl text-sm text-slate-500" }, props.description || "No description"))), !props.trial && /* @__PURE__ */ React.createElement(
581
+ return /* @__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: "flex items-start gap-4" }, /* @__PURE__ */ React.createElement(Emblem, { imageURL: props.imageURL, alt: props.displayName, size: "xl", icon: IconAlbum, accent: "mint" }), /* @__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 || "Badge"), /* @__PURE__ */ React.createElement("p", { className: "max-w-xl text-sm text-slate-500" }, props.description || "No description"))), !props.trial && /* @__PURE__ */ React.createElement(
565
582
  SplitButton$4,
566
583
  {
567
584
  href: props.href,
@@ -604,7 +621,7 @@ function Table$i(props) {
604
621
  if (props.items.length === 0) {
605
622
  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 badges to display.");
606
623
  }
607
- 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" }, "Badge"), /* @__PURE__ */ React.createElement("div", { className: "w-40 shrink-0" }, "Pathway"), /* @__PURE__ */ React.createElement("div", { className: "w-28 shrink-0" }, "Lessons"), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), props.items.map((row) => /* @__PURE__ */ React.createElement(
624
+ 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: "w-14 shrink-0" }), /* @__PURE__ */ React.createElement("div", { className: "w-56 shrink-0" }, "Badge"), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, "Description"), /* @__PURE__ */ React.createElement("div", { className: "w-40 shrink-0" }, "Pathway"), /* @__PURE__ */ React.createElement("div", { className: "w-28 shrink-0" }, "Lessons"), /* @__PURE__ */ React.createElement("div", { className: "w-24 shrink-0 text-right" }, "Point Value"), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), props.items.map((row) => /* @__PURE__ */ React.createElement(
608
625
  Link,
609
626
  {
610
627
  key: row.badgeId,
@@ -612,9 +629,11 @@ function Table$i(props) {
612
629
  className: "flex items-center gap-4 rounded-xl border border-slate-200 bg-white p-4 no-underline shadow-sm hover:bg-slate-50"
613
630
  },
614
631
  /* @__PURE__ */ React.createElement(Emblem, { imageURL: row.imageURL, alt: row.name, size: "sm", icon: IconAlbum, accent: "mint" }),
615
- /* @__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)),
632
+ /* @__PURE__ */ React.createElement("div", { title: row.name, className: "w-56 shrink-0 truncate text-sm font-bold text-dark-blue-400" }, row.name),
633
+ /* @__PURE__ */ React.createElement("div", { title: row.description, className: "line-clamp-2 min-w-0 flex-1 text-xs leading-relaxed text-slate-500" }, row.description || "\u2014"),
616
634
  /* @__PURE__ */ React.createElement("div", { className: "w-40 shrink-0 text-xs text-slate-500" }, row.pathway || "\u2014"),
617
635
  /* @__PURE__ */ React.createElement("div", { className: "w-28 shrink-0 text-xs text-slate-500" }, row.numberOfLessons ? `${row.numberOfLessons} lesson${row.numberOfLessons === 1 ? "" : "s"}` : "\u2014"),
636
+ /* @__PURE__ */ React.createElement("div", { className: "w-24 shrink-0 text-right text-xs text-slate-500" }, row.weight ? `${row.weight} pts` : "\u2014"),
618
637
  /* @__PURE__ */ React.createElement(IconChevronRight, { size: 16, stroke: 2, className: "w-4 shrink-0 text-slate-300" })
619
638
  )));
620
639
  }
@@ -661,8 +680,7 @@ function Table$h(props) {
661
680
  }
662
681
  );
663
682
  }
664
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
665
- 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-[2fr_1fr] 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("studentName"), className: "flex items-center text-left hover:text-slate-700" }, "Student Name", indicator("studentName")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("className"), className: "flex items-center text-left hover:text-slate-700" }, "Class Name", indicator("className"))), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
683
+ 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-[2fr_1fr] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Student Name", sortKey: "studentName", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Class Name", sortKey: "className", sortConfig, onSort: requestSort })), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
666
684
  "div",
667
685
  {
668
686
  key: row.studentId,
@@ -705,28 +723,28 @@ function relativeTimeFromElapsed(elapsed) {
705
723
  return "";
706
724
  }
707
725
 
708
- var __defProp$f = Object.defineProperty;
709
- var __defProps$c = Object.defineProperties;
710
- var __getOwnPropDescs$c = Object.getOwnPropertyDescriptors;
711
- var __getOwnPropSymbols$f = Object.getOwnPropertySymbols;
712
- var __hasOwnProp$f = Object.prototype.hasOwnProperty;
713
- var __propIsEnum$f = Object.prototype.propertyIsEnumerable;
714
- var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
715
- var __spreadValues$f = (a, b) => {
726
+ var __defProp$g = Object.defineProperty;
727
+ var __defProps$d = Object.defineProperties;
728
+ var __getOwnPropDescs$d = Object.getOwnPropertyDescriptors;
729
+ var __getOwnPropSymbols$g = Object.getOwnPropertySymbols;
730
+ var __hasOwnProp$g = Object.prototype.hasOwnProperty;
731
+ var __propIsEnum$g = Object.prototype.propertyIsEnumerable;
732
+ var __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$g(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
733
+ var __spreadValues$g = (a, b) => {
716
734
  for (var prop in b || (b = {}))
717
- if (__hasOwnProp$f.call(b, prop))
718
- __defNormalProp$f(a, prop, b[prop]);
719
- if (__getOwnPropSymbols$f)
720
- for (var prop of __getOwnPropSymbols$f(b)) {
721
- if (__propIsEnum$f.call(b, prop))
722
- __defNormalProp$f(a, prop, b[prop]);
735
+ if (__hasOwnProp$g.call(b, prop))
736
+ __defNormalProp$g(a, prop, b[prop]);
737
+ if (__getOwnPropSymbols$g)
738
+ for (var prop of __getOwnPropSymbols$g(b)) {
739
+ if (__propIsEnum$g.call(b, prop))
740
+ __defNormalProp$g(a, prop, b[prop]);
723
741
  }
724
742
  return a;
725
743
  };
726
- var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
744
+ var __spreadProps$d = (a, b) => __defProps$d(a, __getOwnPropDescs$d(b));
727
745
  function Table$g(props) {
728
746
  const preparedItems = React.useMemo(() => {
729
- return props.items.map((item) => __spreadProps$c(__spreadValues$f({}, item), {
747
+ return props.items.map((item) => __spreadProps$d(__spreadValues$g({}, item), {
730
748
  updatedAtDate: new Date(item.updatedAt)
731
749
  }));
732
750
  }, [props.items]);
@@ -742,8 +760,7 @@ function Table$g(props) {
742
760
  }
743
761
  );
744
762
  }
745
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
746
- 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-[1fr_1fr_2fr_0.8fr] 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("studentName"), className: "flex items-center text-left hover:text-slate-700" }, "Student Name", indicator("studentName")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("lessonName"), className: "flex items-center text-left hover:text-slate-700" }, "Lesson Name", indicator("lessonName")), /* @__PURE__ */ React.createElement("div", null, "Reflection"), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("updatedAtDate"), className: "flex items-center text-left hover:text-slate-700" }, "Updated At", indicator("updatedAtDate"))), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
763
+ 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-[1fr_1fr_2fr_0.8fr] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Student Name", sortKey: "studentName", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Lesson Name", sortKey: "lessonName", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement("div", { className: "text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, "Reflection"), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Updated At", sortKey: "updatedAtDate", sortConfig, onSort: requestSort })), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
747
764
  "div",
748
765
  {
749
766
  key: row.studentName + row.lessonName,
@@ -769,8 +786,7 @@ function Table$f(props) {
769
786
  }
770
787
  );
771
788
  }
772
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
773
- 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-[1fr_3fr] 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("studentName"), className: "flex items-center text-left hover:text-slate-700" }, "Student Name", indicator("studentName")), /* @__PURE__ */ React.createElement("div", null, "Impact Statement")), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
789
+ 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-[1fr_3fr] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Student Name", sortKey: "studentName", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement("div", { className: "text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, "Impact Statement")), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
774
790
  "div",
775
791
  {
776
792
  key: row.studentName,
@@ -794,8 +810,7 @@ function Table$e(props) {
794
810
  }
795
811
  );
796
812
  }
797
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
798
- 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-[1.5fr_2fr_0.8fr] 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("name"), className: "flex items-center text-left hover:text-slate-700" }, "Badge Name", indicator("name")), /* @__PURE__ */ React.createElement("div", null, "Description"), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("percentageCompletion"), className: "flex items-center justify-center text-center hover:text-slate-700" }, "Completion", indicator("percentageCompletion"))), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
813
+ 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-[1.5fr_2fr_0.8fr] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Badge Name", sortKey: "name", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement("div", { className: "text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, "Description"), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Completion", sortKey: "percentageCompletion", sortConfig, onSort: requestSort, align: "center" })), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
799
814
  "div",
800
815
  {
801
816
  key: row.badgeId,
@@ -828,8 +843,7 @@ function Table$d(props) {
828
843
  }
829
844
  );
830
845
  }
831
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
832
- 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-[1.5fr_2fr_0.8fr] 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("name"), className: "flex items-center text-left hover:text-slate-700" }, "Lesson Name", indicator("name")), /* @__PURE__ */ React.createElement("div", null, "Description"), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("percentageCompletion"), className: "flex items-center justify-center text-center hover:text-slate-700" }, "Completion", indicator("percentageCompletion"))), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
846
+ 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-[1.5fr_2fr_0.8fr] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Lesson Name", sortKey: "name", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement("div", { className: "text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, "Description"), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Completion", sortKey: "percentageCompletion", sortConfig, onSort: requestSort, align: "center" })), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
833
847
  "div",
834
848
  {
835
849
  key: row.lessonId,
@@ -929,25 +943,25 @@ const Dashboard = (props) => {
929
943
  )));
930
944
  };
931
945
 
932
- var __defProp$e = Object.defineProperty;
933
- var __defProps$b = Object.defineProperties;
934
- var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
935
- var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
936
- var __hasOwnProp$e = Object.prototype.hasOwnProperty;
937
- var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
938
- var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
939
- var __spreadValues$e = (a, b) => {
946
+ var __defProp$f = Object.defineProperty;
947
+ var __defProps$c = Object.defineProperties;
948
+ var __getOwnPropDescs$c = Object.getOwnPropertyDescriptors;
949
+ var __getOwnPropSymbols$f = Object.getOwnPropertySymbols;
950
+ var __hasOwnProp$f = Object.prototype.hasOwnProperty;
951
+ var __propIsEnum$f = Object.prototype.propertyIsEnumerable;
952
+ var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
953
+ var __spreadValues$f = (a, b) => {
940
954
  for (var prop in b || (b = {}))
941
- if (__hasOwnProp$e.call(b, prop))
942
- __defNormalProp$e(a, prop, b[prop]);
943
- if (__getOwnPropSymbols$e)
944
- for (var prop of __getOwnPropSymbols$e(b)) {
945
- if (__propIsEnum$e.call(b, prop))
946
- __defNormalProp$e(a, prop, b[prop]);
955
+ if (__hasOwnProp$f.call(b, prop))
956
+ __defNormalProp$f(a, prop, b[prop]);
957
+ if (__getOwnPropSymbols$f)
958
+ for (var prop of __getOwnPropSymbols$f(b)) {
959
+ if (__propIsEnum$f.call(b, prop))
960
+ __defNormalProp$f(a, prop, b[prop]);
947
961
  }
948
962
  return a;
949
963
  };
950
- var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
964
+ var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
951
965
  const openDeleteModal$2 = (student, onDelete) => openConfirmModal({
952
966
  title: `Remove "${student.givenName && student.familyName ? `${student.givenName} ${student.familyName}` : student.email}" from this class?`,
953
967
  centered: true,
@@ -958,7 +972,7 @@ const openDeleteModal$2 = (student, onDelete) => openConfirmModal({
958
972
  });
959
973
  function Table$c(props) {
960
974
  const preparedItems = React.useMemo(() => {
961
- return props.items.map((item) => __spreadProps$b(__spreadValues$e({}, item), {
975
+ return props.items.map((item) => __spreadProps$c(__spreadValues$f({}, item), {
962
976
  fullName: item.givenName && item.familyName ? `${item.givenName} ${item.familyName}`.toLowerCase() : item.email.toLowerCase()
963
977
  }));
964
978
  }, [props.items]);
@@ -969,8 +983,7 @@ function Table$c(props) {
969
983
  if (props.items.length === 0) {
970
984
  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.");
971
985
  }
972
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
973
- 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) => {
986
+ 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] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Name", sortKey: "fullName", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Role", sortKey: "isAdmin", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Badges Earned", sortKey: "badgesEarned", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Lessons Completed", sortKey: "lessonsCompleted", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Account Created?", sortKey: "hasAccount", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement("div", null)), sortedItems.map((row, i) => {
974
987
  var _a, _b;
975
988
  const name = row.givenName && row.familyName ? `${row.givenName} ${row.familyName}` : row.email;
976
989
  const initials = (((_a = row.givenName) == null ? void 0 : _a[0]) || row.email[0] || "?") + (((_b = row.familyName) == null ? void 0 : _b[0]) || "");
@@ -1009,25 +1022,25 @@ function Table$c(props) {
1009
1022
  }));
1010
1023
  }
1011
1024
 
1012
- var __defProp$d = Object.defineProperty;
1013
- var __defProps$a = Object.defineProperties;
1014
- var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
1015
- var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
1016
- var __hasOwnProp$d = Object.prototype.hasOwnProperty;
1017
- var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
1018
- var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1019
- var __spreadValues$d = (a, b) => {
1025
+ var __defProp$e = Object.defineProperty;
1026
+ var __defProps$b = Object.defineProperties;
1027
+ var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
1028
+ var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
1029
+ var __hasOwnProp$e = Object.prototype.hasOwnProperty;
1030
+ var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
1031
+ var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1032
+ var __spreadValues$e = (a, b) => {
1020
1033
  for (var prop in b || (b = {}))
1021
- if (__hasOwnProp$d.call(b, prop))
1022
- __defNormalProp$d(a, prop, b[prop]);
1023
- if (__getOwnPropSymbols$d)
1024
- for (var prop of __getOwnPropSymbols$d(b)) {
1025
- if (__propIsEnum$d.call(b, prop))
1026
- __defNormalProp$d(a, prop, b[prop]);
1034
+ if (__hasOwnProp$e.call(b, prop))
1035
+ __defNormalProp$e(a, prop, b[prop]);
1036
+ if (__getOwnPropSymbols$e)
1037
+ for (var prop of __getOwnPropSymbols$e(b)) {
1038
+ if (__propIsEnum$e.call(b, prop))
1039
+ __defNormalProp$e(a, prop, b[prop]);
1027
1040
  }
1028
1041
  return a;
1029
1042
  };
1030
- var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
1043
+ var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
1031
1044
  const Class = (props) => {
1032
1045
  const [opened, setOpened] = useState(false);
1033
1046
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
@@ -1039,7 +1052,7 @@ const Class = (props) => {
1039
1052
  padding: "xl",
1040
1053
  size: "xl"
1041
1054
  },
1042
- /* @__PURE__ */ React.createElement(DropzoneButton$1, __spreadProps$a(__spreadValues$d({}, props), { close: () => setOpened(false) }))
1055
+ /* @__PURE__ */ React.createElement(DropzoneButton$1, __spreadProps$b(__spreadValues$e({}, props), { close: () => setOpened(false) }))
1043
1056
  ), /* @__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(
1044
1057
  "button",
1045
1058
  {
@@ -1165,20 +1178,20 @@ const DropzoneButton$1 = (props) => {
1165
1178
  props.onCreateMembers && props.onCreateMembers([values]);
1166
1179
  }) }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement(
1167
1180
  TextInput,
1168
- __spreadValues$d({
1181
+ __spreadValues$e({
1169
1182
  withAsterisk: true,
1170
1183
  label: "Email",
1171
1184
  placeholder: "Email"
1172
1185
  }, form.getInputProps("email"))
1173
1186
  ), /* @__PURE__ */ React.createElement(Group, { grow: true }, /* @__PURE__ */ React.createElement(
1174
1187
  TextInput,
1175
- __spreadValues$d({
1188
+ __spreadValues$e({
1176
1189
  label: "Given name",
1177
1190
  placeholder: "Given name"
1178
1191
  }, form.getInputProps("givenName"))
1179
1192
  ), /* @__PURE__ */ React.createElement(
1180
1193
  TextInput,
1181
- __spreadValues$d({
1194
+ __spreadValues$e({
1182
1195
  label: "Family name",
1183
1196
  placeholder: "Family name"
1184
1197
  }, form.getInputProps("familyName"))
@@ -1213,8 +1226,7 @@ function Table$b(props) {
1213
1226
  }
1214
1227
  );
1215
1228
  }
1216
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
1217
- 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-[1.5fr_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("name"), className: "flex items-center text-left hover:text-slate-700" }, "Class Name", indicator("name")), /* @__PURE__ */ React.createElement("div", null, "Description"), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("numberOfStudents"), className: "flex items-center justify-center text-center hover:text-slate-700" }, "# of Students", indicator("numberOfStudents")), /* @__PURE__ */ React.createElement("div", null)), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
1229
+ 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-[1.5fr_2fr_1fr_0.6fr] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Class Name", sortKey: "name", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement("div", { className: "text-[10px] font-bold uppercase tracking-wide text-slate-500" }, "Description"), /* @__PURE__ */ React.createElement(SortableHeader, { label: "# of Students", sortKey: "numberOfStudents", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement("div", null)), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement(
1218
1230
  "div",
1219
1231
  {
1220
1232
  key: row.classId,
@@ -1235,19 +1247,19 @@ function Table$b(props) {
1235
1247
  )));
1236
1248
  }
1237
1249
 
1238
- var __defProp$c = Object.defineProperty;
1239
- var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
1240
- var __hasOwnProp$c = Object.prototype.hasOwnProperty;
1241
- var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
1242
- var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1243
- var __spreadValues$c = (a, b) => {
1250
+ var __defProp$d = Object.defineProperty;
1251
+ var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
1252
+ var __hasOwnProp$d = Object.prototype.hasOwnProperty;
1253
+ var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
1254
+ var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1255
+ var __spreadValues$d = (a, b) => {
1244
1256
  for (var prop in b || (b = {}))
1245
- if (__hasOwnProp$c.call(b, prop))
1246
- __defNormalProp$c(a, prop, b[prop]);
1247
- if (__getOwnPropSymbols$c)
1248
- for (var prop of __getOwnPropSymbols$c(b)) {
1249
- if (__propIsEnum$c.call(b, prop))
1250
- __defNormalProp$c(a, prop, b[prop]);
1257
+ if (__hasOwnProp$d.call(b, prop))
1258
+ __defNormalProp$d(a, prop, b[prop]);
1259
+ if (__getOwnPropSymbols$d)
1260
+ for (var prop of __getOwnPropSymbols$d(b)) {
1261
+ if (__propIsEnum$d.call(b, prop))
1262
+ __defNormalProp$d(a, prop, b[prop]);
1251
1263
  }
1252
1264
  return a;
1253
1265
  };
@@ -1281,14 +1293,14 @@ const Classes = (props) => {
1281
1293
  props.onCreateClass && props.onCreateClass(values);
1282
1294
  }) }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement(
1283
1295
  TextInput,
1284
- __spreadValues$c({
1296
+ __spreadValues$d({
1285
1297
  withAsterisk: true,
1286
1298
  label: "Name",
1287
1299
  placeholder: "Class name"
1288
1300
  }, form.getInputProps("name"))
1289
1301
  ), /* @__PURE__ */ React.createElement(
1290
1302
  TextInput,
1291
- __spreadValues$c({
1303
+ __spreadValues$d({
1292
1304
  label: "Description",
1293
1305
  placeholder: "A class for my first period English students"
1294
1306
  }, form.getInputProps("description"))
@@ -1552,8 +1564,7 @@ function Table$7(props) {
1552
1564
  }
1553
1565
  );
1554
1566
  }
1555
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
1556
- 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("button", { onClick: () => requestSort("studentName"), className: "w-40 shrink-0 text-left hover:text-slate-600" }, "Student Name", indicator("studentName")), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, "Reflection"), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("rating"), className: "w-20 shrink-0 text-right hover:text-slate-600" }, "Rating", indicator("rating"))), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement("div", { key: `${row.studentName}-${i}`, className: "rounded-xl border border-slate-200 bg-white p-4 shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-start gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "w-40 shrink-0 text-sm font-bold text-dark-blue-400" }, row.studentName), /* @__PURE__ */ React.createElement("div", { className: "flex-1 text-sm text-slate-600" }, row.reflection), /* @__PURE__ */ React.createElement("div", { className: "w-20 shrink-0 text-right text-sm text-slate-500" }, row.rating)))));
1567
+ 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(SortableHeader, { label: "Student Name", sortKey: "studentName", sortConfig, onSort: requestSort, className: "w-40 shrink-0" }), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, "Reflection"), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Rating", sortKey: "rating", sortConfig, onSort: requestSort, align: "right", className: "w-20 shrink-0" })), sortedItems.map((row, i) => /* @__PURE__ */ React.createElement("div", { key: `${row.studentName}-${i}`, className: "rounded-xl border border-slate-200 bg-white p-4 shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-start gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "w-40 shrink-0 text-sm font-bold text-dark-blue-400" }, row.studentName), /* @__PURE__ */ React.createElement("div", { className: "flex-1 text-sm text-slate-600" }, row.reflection), /* @__PURE__ */ React.createElement("div", { className: "w-20 shrink-0 text-right text-sm text-slate-500" }, row.rating)))));
1557
1568
  }
1558
1569
 
1559
1570
  const SplitButton$3 = (props) => {
@@ -1592,29 +1603,29 @@ function Stack$3(props) {
1592
1603
  return /* @__PURE__ */ React.createElement(Link, { to: props.href, className: "flex flex-col gap-4 no-underline" }, props.items.map((row) => /* @__PURE__ */ React.createElement("div", { key: row.questionName }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-bold text-dark-blue-400" }, row.questionName), /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-sm text-slate-600" }, row.answer.join(", ") || "No answer."))));
1593
1604
  }
1594
1605
 
1595
- var __defProp$b = Object.defineProperty;
1596
- var __defProps$9 = Object.defineProperties;
1597
- var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
1598
- var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
1599
- var __hasOwnProp$b = Object.prototype.hasOwnProperty;
1600
- var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
1601
- var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1602
- var __spreadValues$b = (a, b) => {
1606
+ var __defProp$c = Object.defineProperty;
1607
+ var __defProps$a = Object.defineProperties;
1608
+ var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
1609
+ var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
1610
+ var __hasOwnProp$c = Object.prototype.hasOwnProperty;
1611
+ var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
1612
+ var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1613
+ var __spreadValues$c = (a, b) => {
1603
1614
  for (var prop in b || (b = {}))
1604
- if (__hasOwnProp$b.call(b, prop))
1605
- __defNormalProp$b(a, prop, b[prop]);
1606
- if (__getOwnPropSymbols$b)
1607
- for (var prop of __getOwnPropSymbols$b(b)) {
1608
- if (__propIsEnum$b.call(b, prop))
1609
- __defNormalProp$b(a, prop, b[prop]);
1615
+ if (__hasOwnProp$c.call(b, prop))
1616
+ __defNormalProp$c(a, prop, b[prop]);
1617
+ if (__getOwnPropSymbols$c)
1618
+ for (var prop of __getOwnPropSymbols$c(b)) {
1619
+ if (__propIsEnum$c.call(b, prop))
1620
+ __defNormalProp$c(a, prop, b[prop]);
1610
1621
  }
1611
1622
  return a;
1612
1623
  };
1613
- var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
1624
+ var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
1614
1625
  function Table$6(props) {
1615
1626
  const [expanded, setExpanded] = React.useState({});
1616
1627
  const preparedItems = React.useMemo(() => {
1617
- return props.items.map((item) => __spreadProps$9(__spreadValues$b({}, item), {
1628
+ return props.items.map((item) => __spreadProps$a(__spreadValues$c({}, item), {
1618
1629
  status: item.isComplete ? 2 : item.isStarted ? 1 : 0
1619
1630
  }));
1620
1631
  }, [props.items]);
@@ -1630,15 +1641,14 @@ function Table$6(props) {
1630
1641
  }
1631
1642
  );
1632
1643
  }
1633
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
1634
- 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("status"), className: "w-28 shrink-0 text-center hover:text-slate-600" }, "Status", indicator("status")), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
1644
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 px-4" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Student Name", sortKey: "name", sortConfig, onSort: requestSort, className: "flex-1" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Status", sortKey: "status", sortConfig, onSort: requestSort, align: "center", className: "w-28 shrink-0" }), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
1635
1645
  var _a;
1636
1646
  const isOpen = !!expanded[row.userId];
1637
1647
  const initials = (((_a = row.name) == null ? void 0 : _a[0]) || row.email[0] || "?").toUpperCase();
1638
1648
  return /* @__PURE__ */ React.createElement("div", { key: row.userId, className: "rounded-xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement(
1639
1649
  "div",
1640
1650
  {
1641
- onClick: () => setExpanded(__spreadProps$9(__spreadValues$b({}, expanded), { [row.userId]: !isOpen })),
1651
+ onClick: () => setExpanded(__spreadProps$a(__spreadValues$c({}, expanded), { [row.userId]: !isOpen })),
1642
1652
  className: "flex cursor-pointer items-center gap-4 p-4"
1643
1653
  },
1644
1654
  /* @__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-mint-400/20 text-xs font-bold text-dark-blue-400" }, initials), /* @__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))),
@@ -1877,6 +1887,25 @@ const SplitButton$2 = (props) => {
1877
1887
  ));
1878
1888
  };
1879
1889
 
1890
+ var __defProp$b = Object.defineProperty;
1891
+ var __defProps$9 = Object.defineProperties;
1892
+ var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
1893
+ var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
1894
+ var __hasOwnProp$b = Object.prototype.hasOwnProperty;
1895
+ var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
1896
+ var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1897
+ var __spreadValues$b = (a, b) => {
1898
+ for (var prop in b || (b = {}))
1899
+ if (__hasOwnProp$b.call(b, prop))
1900
+ __defNormalProp$b(a, prop, b[prop]);
1901
+ if (__getOwnPropSymbols$b)
1902
+ for (var prop of __getOwnPropSymbols$b(b)) {
1903
+ if (__propIsEnum$b.call(b, prop))
1904
+ __defNormalProp$b(a, prop, b[prop]);
1905
+ }
1906
+ return a;
1907
+ };
1908
+ var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
1880
1909
  const openDeleteModal = (person, onDelete) => openConfirmModal({
1881
1910
  title: `Remove "${person.givenName && person.familyName ? `${person.givenName} ${person.familyName}` : person.email}" from your organization?`,
1882
1911
  centered: true,
@@ -1886,6 +1915,13 @@ const openDeleteModal = (person, onDelete) => openConfirmModal({
1886
1915
  onConfirm: () => onDelete(person)
1887
1916
  });
1888
1917
  function Table$4(props) {
1918
+ const preparedItems = React.useMemo(() => {
1919
+ return props.items.map((item) => __spreadProps$9(__spreadValues$b({}, item), {
1920
+ fullName: item.givenName && item.familyName ? `${item.givenName} ${item.familyName}`.toLowerCase() : item.email.toLowerCase(),
1921
+ roleRank: item.isAdmin ? 2 : item.isGroupAdmin ? 1 : 0
1922
+ }));
1923
+ }, [props.items]);
1924
+ const { items: sortedItems, requestSort, sortConfig } = useSortableData(preparedItems);
1889
1925
  if (props.loading) {
1890
1926
  return /* @__PURE__ */ React.createElement("div", { className: "text-sm text-slate-400" }, "Loading\u2026");
1891
1927
  }
@@ -1900,7 +1936,7 @@ function Table$4(props) {
1900
1936
  }
1901
1937
  );
1902
1938
  }
1903
- 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_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("div", null, "Name"), /* @__PURE__ */ React.createElement("div", { className: "text-center" }, "Role"), /* @__PURE__ */ React.createElement("div", { className: "text-center" }, "Account Created?"), /* @__PURE__ */ React.createElement("div", { className: "text-center" }, "# of Classes"), /* @__PURE__ */ React.createElement("div", null)), props.items.map((row, i) => {
1939
+ 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_1fr_0.6fr] items-center gap-3 border-b border-slate-100 px-5 py-3" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Name", sortKey: "fullName", sortConfig, onSort: requestSort }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Role", sortKey: "roleRank", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Account Created?", sortKey: "hasAccount", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "# of Classes", sortKey: "numberOfClasses", sortConfig, onSort: requestSort, align: "center" }), /* @__PURE__ */ React.createElement("div", null)), sortedItems.map((row, i) => {
1904
1940
  var _a, _b;
1905
1941
  const name = row.givenName && row.familyName ? `${row.givenName} ${row.familyName}` : row.email;
1906
1942
  const initials = (((_a = row.givenName) == null ? void 0 : _a[0]) || row.email[0] || "?") + (((_b = row.familyName) == null ? void 0 : _b[0]) || "");
@@ -1909,7 +1945,7 @@ function Table$4(props) {
1909
1945
  "div",
1910
1946
  {
1911
1947
  key: row.email,
1912
- className: `grid grid-cols-[2.2fr_1.2fr_1fr_1fr_0.6fr] items-center gap-3 px-5 py-3.5 ${i < props.items.length - 1 ? "border-b border-slate-100" : ""}`
1948
+ className: `grid grid-cols-[2.2fr_1.2fr_1fr_1fr_0.6fr] items-center gap-3 px-5 py-3.5 ${i < sortedItems.length - 1 ? "border-b border-slate-100" : ""}`
1913
1949
  },
1914
1950
  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),
1915
1951
  /* @__PURE__ */ React.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React.createElement(
@@ -3009,8 +3045,7 @@ function Table$2(props) {
3009
3045
  }
3010
3046
  );
3011
3047
  }
3012
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
3013
- 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("isComplete"), className: "w-28 shrink-0 text-center hover:text-slate-600" }, "Status", indicator("isComplete")), categories.map((category) => /* @__PURE__ */ React.createElement("button", { key: category.categoryId, onClick: () => requestSort(category.categoryId), className: "w-24 shrink-0 text-center hover:text-slate-600" }, category.name, indicator(category.categoryId))), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
3048
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 px-4" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Student Name", sortKey: "name", sortConfig, onSort: requestSort, className: "flex-1" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Status", sortKey: "isComplete", sortConfig, onSort: requestSort, align: "center", className: "w-28 shrink-0" }), categories.map((category) => /* @__PURE__ */ React.createElement(SortableHeader, { key: category.categoryId, label: category.name, sortKey: category.categoryId, sortConfig, onSort: requestSort, align: "center", className: "w-24 shrink-0" })), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
3014
3049
  var _a;
3015
3050
  const isOpen = !!expanded[row.userId];
3016
3051
  const initials = (((_a = row.name) == null ? void 0 : _a[0]) || row.email[0] || "?").toUpperCase();
@@ -3031,8 +3066,10 @@ function Table$2(props) {
3031
3066
  }));
3032
3067
  }
3033
3068
 
3069
+ const OTHER_FILTER = "__other__";
3034
3070
  function Table$1(props) {
3035
3071
  const { items: sortedBadges, requestSort, sortConfig } = useSortableData(props.badges);
3072
+ const [categoryFilter, setCategoryFilter] = React.useState("");
3036
3073
  if (props.badges.length === 0) {
3037
3074
  return /* @__PURE__ */ React.createElement(
3038
3075
  PlaceholderBanner,
@@ -3044,29 +3081,44 @@ function Table$1(props) {
3044
3081
  }
3045
3082
  );
3046
3083
  }
3047
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
3048
3084
  const groupedIds = new Set(props.categories.map((c) => c.categoryId));
3049
- const forCategory = (categoryId) => sortedBadges.filter((b) => {
3050
- var _a;
3051
- return (_a = b.categories) == null ? void 0 : _a.includes(categoryId);
3052
- });
3053
3085
  const other = sortedBadges.filter((b) => {
3054
3086
  var _a;
3055
3087
  return !((_a = b.categories) == null ? void 0 : _a.some((id) => groupedIds.has(id)));
3056
3088
  });
3057
- return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React.createElement("div", { className: "flex gap-4 px-4 text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("badgeName"), className: "flex-1 text-left hover:text-slate-600" }, "Badge Name", indicator("badgeName")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("weight"), className: "w-24 shrink-0 text-right hover:text-slate-600" }, "Point Value", indicator("weight")), /* @__PURE__ */ React.createElement("button", { onClick: () => requestSort("percentageCompletion"), className: "w-36 shrink-0 text-right hover:text-slate-600" }, "Badge Completion", indicator("percentageCompletion"))), props.categories.map((category) => /* @__PURE__ */ React.createElement(CategorySection, { key: category.categoryId, name: category.name, badges: forCategory(category.categoryId) })), other.length > 0 && /* @__PURE__ */ React.createElement(CategorySection, { name: "Other badges", badges: other }));
3089
+ const visibleBadges = !categoryFilter ? sortedBadges : categoryFilter === OTHER_FILTER ? other : sortedBadges.filter((b) => {
3090
+ var _a;
3091
+ return (_a = b.categories) == null ? void 0 : _a.includes(categoryFilter);
3092
+ });
3093
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-2" }, /* @__PURE__ */ React.createElement(CategoryPill, { label: "All", active: !categoryFilter, onClick: () => setCategoryFilter("") }), props.categories.map((category) => /* @__PURE__ */ React.createElement(
3094
+ CategoryPill,
3095
+ {
3096
+ key: category.categoryId,
3097
+ label: category.name,
3098
+ active: categoryFilter === category.categoryId,
3099
+ onClick: () => setCategoryFilter(category.categoryId)
3100
+ }
3101
+ )), other.length > 0 && /* @__PURE__ */ React.createElement(CategoryPill, { label: "Other", active: categoryFilter === OTHER_FILTER, onClick: () => setCategoryFilter(OTHER_FILTER) })), /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React.createElement("div", { className: "flex gap-4 px-4" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Badge Name", sortKey: "badgeName", sortConfig, onSort: requestSort, className: "flex-1" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Point Value", sortKey: "weight", sortConfig, onSort: requestSort, align: "right", className: "w-24 shrink-0" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Badge Completion", sortKey: "percentageCompletion", sortConfig, onSort: requestSort, align: "right", className: "w-36 shrink-0" })), visibleBadges.length === 0 && /* @__PURE__ */ React.createElement("div", { className: "rounded-xl border border-dashed border-slate-200 px-4 py-3 text-xs text-slate-400" }, categoryFilter ? "No badges in this category yet." : "No badges yet."), visibleBadges.map((row) => /* @__PURE__ */ React.createElement(
3102
+ Link,
3103
+ {
3104
+ key: row.badgeId,
3105
+ to: row.href,
3106
+ className: "flex items-center gap-4 rounded-xl border border-slate-200 bg-white p-4 no-underline shadow-sm hover:bg-slate-50"
3107
+ },
3108
+ /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1 text-sm font-bold text-dark-blue-400" }, row.badgeName),
3109
+ /* @__PURE__ */ React.createElement("div", { className: "w-24 shrink-0 text-right text-xs font-black text-mint-400" }, row.weight, " pts"),
3110
+ /* @__PURE__ */ React.createElement("div", { className: "w-36 shrink-0 text-right text-xs text-slate-500" }, Math.round((row.percentageCompletion + Number.EPSILON) * 100), "%")
3111
+ ))));
3058
3112
  }
3059
- const CategorySection = (props) => /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React.createElement("div", { className: "px-1 text-sm font-extrabold tracking-tight text-dark-blue-400" }, props.name), props.badges.length === 0 && /* @__PURE__ */ React.createElement("div", { className: "rounded-xl border border-dashed border-slate-200 px-4 py-3 text-xs text-slate-400" }, "No badges yet."), props.badges.map((row) => /* @__PURE__ */ React.createElement(
3060
- Link,
3113
+ const CategoryPill = (props) => /* @__PURE__ */ React.createElement(
3114
+ "button",
3061
3115
  {
3062
- key: row.badgeId,
3063
- to: row.href,
3064
- className: "flex items-center gap-4 rounded-xl border border-slate-200 bg-white p-4 no-underline shadow-sm hover:bg-slate-50"
3116
+ type: "button",
3117
+ onClick: props.onClick,
3118
+ className: `rounded-full border px-3.5 py-1.5 text-xs font-bold ${props.active ? "border-sky-blue-400/40 bg-sky-blue-400/20 text-dark-blue-400" : "border-slate-200 bg-white text-slate-500 hover:bg-slate-50"}`
3065
3119
  },
3066
- /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1 text-sm font-bold text-dark-blue-400" }, row.badgeName),
3067
- /* @__PURE__ */ React.createElement("div", { className: "w-24 shrink-0 text-right text-xs font-black text-mint-400" }, row.weight, " pts"),
3068
- /* @__PURE__ */ React.createElement("div", { className: "w-36 shrink-0 text-right text-xs text-slate-500" }, Math.round((row.percentageCompletion + Number.EPSILON) * 100), "%")
3069
- )));
3120
+ props.label
3121
+ );
3070
3122
 
3071
3123
  var __defProp$3 = Object.defineProperty;
3072
3124
  var __defProps$3 = Object.defineProperties;
@@ -3146,7 +3198,7 @@ const Pathway = (props) => {
3146
3198
  (props.allCategories || []).filter((c) => !c.parentCategoryId).map((c) => c.categoryId)
3147
3199
  );
3148
3200
  const badgeGroupCategories = criteriaCategories.filter((c) => !rootCategoryIds.has(c.categoryId));
3149
- return /* @__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: "flex items-start gap-4" }, /* @__PURE__ */ React.createElement(Emblem, { imageURL: props.imageURL, alt: props.title, size: "lg", icon: IconRoute, accent: "cyan" }), /* @__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.title || "Pathway"), !!((_a = props.displayTags) == null ? void 0 : _a.length) && /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-1.5" }, props.displayTags.map((tag) => /* @__PURE__ */ React.createElement("span", { key: tag, className: "rounded-full bg-slate-100 px-2.5 py-1 text-[10px] font-bold text-slate-500" }, tag))), /* @__PURE__ */ React.createElement("p", { className: "max-w-xl text-sm text-slate-500" }, props.description || "No description"), (criteriaCategories.length > 0 || !!((_b = props.allCategories) == null ? void 0 : _b.length)) && /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center gap-1.5 pt-0.5" }, criteriaCategories.length > 0 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { className: "text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, "Criteria"), criteriaCategories.map((c) => /* @__PURE__ */ React.createElement("span", { key: c.categoryId, className: "rounded-full bg-sky-blue-400/15 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, c.name, ": ", criteria[c.categoryId], "+", c.maxPoints ? ` of ${c.maxPoints}` : "", " pts"))), !!((_c = props.allCategories) == null ? void 0 : _c.length) && /* @__PURE__ */ React.createElement(
3201
+ return /* @__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: "flex items-start gap-4" }, /* @__PURE__ */ React.createElement(Emblem, { imageURL: props.imageURL, alt: props.title, size: "xl", icon: IconRoute, accent: "cyan" }), /* @__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.title || "Pathway"), !!((_a = props.displayTags) == null ? void 0 : _a.length) && /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-1.5" }, props.displayTags.map((tag) => /* @__PURE__ */ React.createElement("span", { key: tag, className: "rounded-full bg-slate-100 px-2.5 py-1 text-[10px] font-bold text-slate-500" }, tag))), /* @__PURE__ */ React.createElement("p", { className: "max-w-xl text-sm text-slate-500" }, props.description || "No description"), (criteriaCategories.length > 0 || !!((_b = props.allCategories) == null ? void 0 : _b.length)) && /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center gap-1.5 pt-0.5" }, criteriaCategories.length > 0 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { className: "text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400" }, "Criteria"), criteriaCategories.map((c) => /* @__PURE__ */ React.createElement("span", { key: c.categoryId, className: "rounded-full bg-sky-blue-400/15 px-2.5 py-1 text-[10px] font-bold text-dark-blue-400" }, c.name, ": ", criteria[c.categoryId], "+", c.maxPoints ? ` of ${c.maxPoints}` : "", " pts"))), !!((_c = props.allCategories) == null ? void 0 : _c.length) && /* @__PURE__ */ React.createElement(
3150
3202
  "button",
3151
3203
  {
3152
3204
  onClick: () => setCategoriesOpen(true),
@@ -3288,8 +3340,7 @@ function Table(props) {
3288
3340
  }
3289
3341
  );
3290
3342
  }
3291
- const indicator = (key) => sortConfig.key !== key ? "" : sortConfig.direction === "desc" ? " \u25BE" : " \u25B4";
3292
- 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) => {
3343
+ return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 px-4" }, /* @__PURE__ */ React.createElement(SortableHeader, { label: "Student Name", sortKey: "name", sortConfig, onSort: requestSort, className: "flex-1" }), /* @__PURE__ */ React.createElement(SortableHeader, { label: "Files", sortKey: "submissionCount", sortConfig, onSort: requestSort, className: "w-16 shrink-0" }), props.onReview && /* @__PURE__ */ React.createElement("div", { className: "w-36 shrink-0" }), /* @__PURE__ */ React.createElement("div", { className: "w-4 shrink-0" })), sortedItems.map((row) => {
3293
3344
  const isOpen = !!expanded[row.userId];
3294
3345
  return /* @__PURE__ */ React.createElement("div", { key: row.userId, className: "rounded-xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement(
3295
3346
  "div",