@local-civics/hub-ui 0.1.208 → 0.1.210

package/dist/index.d.ts

@@ -456,6 +456,11 @@ type CardProps = {
  */
 declare const Card: (props: CardProps) => JSX.Element;
 
+/**
+ * A component for the page footer.
+ */
+declare const Footer: () => JSX.Element;
+
 /**
  * Home
  * @constructor
@@ -1085,14 +1090,217 @@ type PathwayButtonProps = {
 };
 declare const PathwayButton: (props: PathwayButtonProps) => JSX.Element;
 
+/**
+ * The accent cycled across dashboard pills.
+ */
+type PillAccent = "cyan" | "mint" | "gold" | "slate";
+/**
+ * PillProps
+ */
+type PillProps = {
+    label: string;
+    accent?: PillAccent;
+};
+/**
+ * A small accent-tinted label used for level/XP style tags across the student dashboard.
+ * @param props
+ * @constructor
+ */
+declare const Pill: (props: PillProps) => JSX.Element;
+
+/**
+ * The accent cycled across dashboard stat tiles.
+ */
+type StatTileAccent = "cyan" | "mint" | "gold" | "slate";
+/**
+ * StatTileProps
+ */
+type StatTileProps = {
+    icon: IconName;
+    value: string | number;
+    label: string;
+    accent?: StatTileAccent;
+};
+/**
+ * A single icon + number + label stat tile, meant to appear in a StatTileRow.
+ * @param props
+ * @constructor
+ */
+declare const StatTile: (props: StatTileProps) => JSX.Element;
+/**
+ * StatTileRowProps
+ */
+type StatTileRowProps = {
+    children: React.ReactNode;
+};
+/**
+ * A row layout for a set of StatTiles.
+ * @param props
+ * @constructor
+ */
+declare const StatTileRow: (props: StatTileRowProps) => JSX.Element;
+
+/**
+ * ProfileHeroCardProps
+ */
+type ProfileHeroCardProps = {
+    isLoading?: boolean;
+    avatarURL?: string;
+    givenName?: string;
+    familyName?: string;
+    createdAt?: string;
+    online?: boolean;
+    impactStatement?: string;
+    placeName?: string;
+    communityName?: string;
+    level?: number;
+    xp?: number;
+    nextXP?: number;
+    onEdit?: () => void;
+};
+/**
+ * The student dashboard's profile summary: avatar/name/meta (formerly `ProfileWidget`), bio and
+ * place/community (formerly `AboutWidget`), and level/XP progress (formerly `ImpactWidget`)
+ * consolidated into a single card, matching Mockup I's layout and color treatment.
+ * @param props
+ * @constructor
+ */
+declare const ProfileHeroCard: (props: ProfileHeroCardProps) => JSX.Element;
+
+/**
+ * A single pathway as rendered by the dashboard - the same shape `PathwaySection` already
+ * consumes (see `usePathways` in the hub app), so this is a drop-in replacement for the data.
+ */
+type PathwayItem = PathwayCardProps & {
+    pathwayId?: string;
+    onClick?: () => void;
+};
+/**
+ * PathwaysCardProps
+ */
+type PathwaysCardProps = {
+    pathways: PathwayItem[];
+    isLoading?: boolean;
+    list?: boolean;
+    onToggleLayout?: (next: boolean) => void;
+};
+/**
+ * The student dashboard's "My Pathways & Seals" card - a presentational replacement for
+ * `PathwaySection` scoped to the Home page. Keeps the same list/grid-toggle behavior; the
+ * in-progress/completed/available/locked grouping isn't reproduced because `PathwaySection`'s
+ * own grouping is currently stubbed (everything lands in "in progress"), so a flat grid is
+ * behaviorally equivalent to what ships today.
+ * @param props
+ * @constructor
+ */
+declare const PathwaysCard: (props: PathwaysCardProps) => JSX.Element;
+
+/**
+ * BadgesCardProps
+ */
+type BadgesCardProps = {
+    badges: BadgeProps[];
+    isLoading?: boolean;
+    list?: boolean;
+    onToggleLayout?: (next: boolean) => void;
+};
+/**
+ * The student dashboard's "Badges" card - a presentational replacement for `BadgeSection`
+ * scoped to the Home page. Ports `BadgeSection`'s real state classification (in
+ * progress/completed/available/locked, driven by `finishedAt`/`isLocked`/`startedAt`) and its
+ * grid/list toggle, but shows one state at a time via a single-select tab strip
+ * (`Board`'s `Tab` `secondary` variant) to match the mockup's tab look, rather than
+ * `BadgeSection`'s original multi-select filter pills.
+ * @param props
+ * @constructor
+ */
+declare const BadgesCard: (props: BadgesCardProps) => JSX.Element;
+
+/**
+ * DashboardShellProps
+ */
+type DashboardShellProps = {
+    sidebar: React.ReactNode;
+    topBar?: React.ReactNode;
+    isLoading?: boolean;
+    children?: React.ReactNode;
+};
+/**
+ * The student-facing app's page shell: a full-height row with the sidebar and content pane as
+ * siblings, so the content pane (with its own top bar) can scroll independently of the sidebar.
+ * Used across the student side of the app (Home, Pathway/Badge detail pages, etc.) in place of
+ * bare `AuthLayout` usage — `AuthLayout` itself is untouched, still used for non-student surfaces.
+ * Renders the shared `Footer` at the bottom of the scrollable content, pinned to the viewport
+ * bottom on short pages and pushed below content on long ones (standard sticky-footer behavior).
+ * @param props
+ * @constructor
+ */
+declare const DashboardShell: (props: DashboardShellProps) => JSX.Element;
+
+/**
+ * The name of a dashboard sidebar tab.
+ */
+type DashboardSidebarTabName = "profile" | "pathways" | "badges" | "file-locker" | "transcript" | "portfolio" | "comments";
+/**
+ * A tab's live destination. Tabs with no entry here render disabled.
+ */
+type DashboardSidebarLinks = Partial<Record<DashboardSidebarTabName, {
+    href: string;
+}>>;
+/**
+ * The signed-in student shown above the nav.
+ */
+type DashboardSidebarIdentity = {
+    avatarURL?: string;
+    name: string;
+    subtitle?: string;
+    online?: boolean;
+};
+/**
+ * The properties for the dashboard sidebar.
+ */
+type DashboardSidebarProps = {
+    active?: DashboardSidebarTabName;
+    links: DashboardSidebarLinks;
+    identity?: DashboardSidebarIdentity;
+    disabled?: boolean;
+    onSwitchAccount?: () => void;
+    onLogout?: () => void;
+};
+/**
+ * The single left nav used across the whole student side of the app (Home, Pathway/Badge detail
+ * pages, and any future page that adopts `DashboardShell`) — never render a page-specific copy of
+ * this. Tabs with no matching `links` entry render disabled, which is how not-yet-built
+ * destinations (File Locker, Transcript, Portfolio, Comments) show up today.
+ */
+declare const DashboardSidebar: (props: DashboardSidebarProps) => JSX.Element;
+
+/**
+ * DashboardTopBarProps
+ */
+type DashboardTopBarProps = {
+    eyebrow?: string;
+    title: string;
+    children?: React.ReactNode;
+    onNotifications?: () => void;
+};
+/**
+ * The persistent bar above the dashboard's scrollable content: a page heading on the left,
+ * notifications and a primary action slot (e.g. LogServiceButton) on the right.
+ * @param props
+ * @constructor
+ */
+declare const DashboardTopBar: (props: DashboardTopBarProps) => JSX.Element;
+
 /**
  * AuthLayoutProps
  */
 type AuthLayoutProps = {
     isLoading?: boolean;
     pathname?: string;
-    page?: "profile" | "explore" | "calendar";
+    page?: "profile";
     disabled?: boolean;
+    topNav?: boolean;
     header?: React__default.ReactNode;
     subheader?: React__default.ReactNode;
     sidebar?: React__default.ReactNode;
@@ -1101,12 +1309,7 @@ type AuthLayoutProps = {
     children?: React__default.ReactNode;
     onHome?: () => void;
     onProfile?: () => void;
-    onExplore?: () => void;
-    onCalendar?: () => void;
     onLogout?: () => void;
-    onFAQ?: () => void;
-    onPrivacy?: () => void;
-    onTerms?: () => void;
     onSwitchAccount?: () => void;
 };
 /**
@@ -1136,4 +1339,4 @@ type HomeLayoutProps = {
  */
 declare const HomeLayout: (props: HomeLayoutProps) => JSX.Element;
 
-export { AboutWidget, AboutWidgetProps, AchievementWidget, AchievementWidgetProps, ActivityCard, ActivityCardProps, ActivityItem, ActivityItemProps, ActivityList, ActivityListProps, ActivityReflection, ActivityReflectionProps, AuthLayout, AuthLayoutProps, Badge, BadgeActivityMenu, BadgeActivityMenuProps, BadgeFilterOption, BadgeProps, BadgeSection, BadgeSectionProps, BadgeSuccessDialog, BadgeSuccessDialogProps, Board, BoardProps, Button, ButtonBorder, ButtonColor, ButtonFilter, ButtonJustify, ButtonProps, ButtonSize, ButtonSpacing, ButtonTheme, Card, CardProps, CtaListProps, DateSelection, DateSelectionProps, DaySelectionOptionProps, EventItem, EventItemProps, EventList, EventListProps, Home, HomeLayout, HomeLayoutProps, Icon, IconName, IconProps, ImpactWidget, ImpactWidgetProps, LearningForm, LearningFormProps, Loader, LoaderProps, LogServiceButton, LogServiceButtonProps, Logo, Modal, ModalProps, NavBar, NavBarProps, NavLink, NavLinkName, NavLinkProps, NotFound, NotFoundProps, Onboarding, OnboardingProps, Overlay, OverlayProps, Pathway, PathwayButton, PathwayButtonProps, PathwayFilter, PathwayFilterOption, PathwayFilterProps, PathwayProgress, PathwayProgressHeight, PathwayProgressProps, PathwayProps, PathwaySection, PathwaySectionProps, PathwayWidget, PathwayWidgetProps, ProfileWidget, Progress, ProgressProps, ResidentWidgetProps, Search, SearchButton, SearchButtonProps, SearchProps, SearchResult, SearchResultProps, SettingsCard, SettingsCardProps, Stopwatch, StopwatchProps, Tab, TabProps, TagFilter, TagFilterProps, TaskItem, TaskItemProps, TaskList, TaskListProps, Widget, WidgetBody, WidgetBodyProps, WidgetHeader, WidgetHeaderLink, WidgetHeaderLinkProps, WidgetHeaderProps, WidgetProps, WidgetTitle, WidgetTitleProps };
+export { AboutWidget, AboutWidgetProps, AchievementWidget, AchievementWidgetProps, ActivityCard, ActivityCardProps, ActivityItem, ActivityItemProps, ActivityList, ActivityListProps, ActivityReflection, ActivityReflectionProps, AuthLayout, AuthLayoutProps, Badge, BadgeActivityMenu, BadgeActivityMenuProps, BadgeFilterOption, BadgeProps, BadgeSection, BadgeSectionProps, BadgeSuccessDialog, BadgeSuccessDialogProps, BadgesCard, BadgesCardProps, Board, BoardProps, Button, ButtonBorder, ButtonColor, ButtonFilter, ButtonJustify, ButtonProps, ButtonSize, ButtonSpacing, ButtonTheme, Card, CardProps, CtaListProps, DashboardShell, DashboardShellProps, DashboardSidebar, DashboardSidebarIdentity, DashboardSidebarLinks, DashboardSidebarProps, DashboardSidebarTabName, DashboardTopBar, DashboardTopBarProps, DateSelection, DateSelectionProps, DaySelectionOptionProps, EventItem, EventItemProps, EventList, EventListProps, Footer, Home, HomeLayout, HomeLayoutProps, Icon, IconName, IconProps, ImpactWidget, ImpactWidgetProps, LearningForm, LearningFormProps, Loader, LoaderProps, LogServiceButton, LogServiceButtonProps, Logo, Modal, ModalProps, NavBar, NavBarProps, NavLink, NavLinkName, NavLinkProps, NotFound, NotFoundProps, Onboarding, OnboardingProps, Overlay, OverlayProps, Pathway, PathwayButton, PathwayButtonProps, PathwayFilter, PathwayFilterOption, PathwayFilterProps, PathwayItem, PathwayProgress, PathwayProgressHeight, PathwayProgressProps, PathwayProps, PathwaySection, PathwaySectionProps, PathwayWidget, PathwayWidgetProps, PathwaysCard, PathwaysCardProps, Pill, PillAccent, PillProps, ProfileHeroCard, ProfileHeroCardProps, ProfileWidget, Progress, ProgressProps, ResidentWidgetProps, Search, SearchButton, SearchButtonProps, SearchProps, SearchResult, SearchResultProps, SettingsCard, SettingsCardProps, StatTile, StatTileAccent, StatTileProps, StatTileRow, StatTileRowProps, Stopwatch, StopwatchProps, Tab, TabProps, TagFilter, TagFilterProps, TaskItem, TaskItemProps, TaskList, TaskListProps, Widget, WidgetBody, WidgetBodyProps, WidgetHeader, WidgetHeaderLink, WidgetHeaderLinkProps, WidgetHeaderProps, WidgetProps, WidgetTitle, WidgetTitleProps };