@the-portland-company/shell 0.32.2 → 0.34.0
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/app-chrome.cjs +535 -68
- package/dist/app-chrome.cjs.map +1 -1
- package/dist/app-chrome.d.cts +0 -1
- package/dist/app-chrome.d.ts +0 -1
- package/dist/app-chrome.js +2 -3
- package/dist/app-chrome.js.map +1 -1
- package/dist/{chunk-PWBYDQCO.js → chunk-CVBEBCID.js} +584 -71
- package/dist/chunk-CVBEBCID.js.map +1 -0
- package/dist/index.cjs +4 -1927
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -295
- package/dist/index.d.ts +2 -295
- package/dist/index.js +11 -1809
- package/dist/index.js.map +1 -1
- package/dist/native.cjs +536 -67
- package/dist/native.cjs.map +1 -1
- package/dist/native.d.cts +56 -5
- package/dist/native.d.ts +56 -5
- package/dist/native.js +1 -2
- package/package.json +1 -1
- package/dist/chunk-NV6WHTEZ.js +0 -54
- package/dist/chunk-NV6WHTEZ.js.map +0 -1
- package/dist/chunk-PWBYDQCO.js.map +0 -1
- package/dist/topbarIconSlot-FunwEKO9.d.cts +0 -10
- package/dist/topbarIconSlot-FunwEKO9.d.ts +0 -10
package/dist/index.d.cts
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import { ReactNode, CSSProperties
|
|
3
|
+
import { ReactNode, CSSProperties } from 'react';
|
|
4
4
|
import { User, Session, SupabaseClient } from '@supabase/supabase-js';
|
|
5
|
-
import { IconButtonProps } from '@chakra-ui/react';
|
|
6
|
-
import { T as TopBarIconSlot } from './topbarIconSlot-FunwEKO9.cjs';
|
|
7
5
|
|
|
8
6
|
declare const politogyTheme: Record<string, any>;
|
|
9
7
|
|
|
@@ -463,151 +461,6 @@ declare function useShellRole(): ShellRoleValue | null;
|
|
|
463
461
|
*/
|
|
464
462
|
declare function useShellFooter(): ShellFooterValue | null;
|
|
465
463
|
|
|
466
|
-
interface AppLayoutProps extends ShellSlots {
|
|
467
|
-
children: ReactNode;
|
|
468
|
-
buildInfo?: string;
|
|
469
|
-
}
|
|
470
|
-
/**
|
|
471
|
-
* Authenticated app shell composition: <Sidebar> on the left, <Header> on
|
|
472
|
-
* top, <main> for routed children, optional <Footer>, plus modal + overlay
|
|
473
|
-
* slots. All chrome data flows through ShellProvider/ShellChrome contexts —
|
|
474
|
-
* AppLayout itself takes only optional slots for modals/overlays/notifs.
|
|
475
|
-
*/
|
|
476
|
-
declare function AppLayout({ children, buildInfo, modalsSlot, notificationsSlot, overlaySlot, }: AppLayoutProps): react_jsx_runtime.JSX.Element;
|
|
477
|
-
|
|
478
|
-
interface HeaderProps {
|
|
479
|
-
/** Mobile menu open handler (renders the hamburger icon on mobile). */
|
|
480
|
-
onOpen?: () => void;
|
|
481
|
-
/** DOM id (defaults to 'mobile-nav-container'). */
|
|
482
|
-
id?: string;
|
|
483
|
-
}
|
|
484
|
-
/**
|
|
485
|
-
* Politogy header (top bar). Ported from
|
|
486
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 2545–2924 (2026-05-13).
|
|
487
|
-
*
|
|
488
|
-
* Composition (left → right):
|
|
489
|
-
* 1. Hamburger (mobile only) + small brand logo (mobile only) + title +
|
|
490
|
-
* breadcrumbs.
|
|
491
|
-
* 2. headerActions (app-supplied React node, e.g., page action buttons).
|
|
492
|
-
* 3. headerIconsSlot (app-supplied React node, e.g., FuelPopover,
|
|
493
|
-
* NewTextBellPopup, SystemAlertsMenu, NavigationToggleMenu,
|
|
494
|
-
* ImportProgressIndicator, DevNotesMenu, SupportRequestAction).
|
|
495
|
-
* 4. UserMenu (avatar + name/email VStack + chevron).
|
|
496
|
-
*
|
|
497
|
-
* NOTE: app-specific widgets stay in the app. The shell only renders
|
|
498
|
-
* what the app passes through `headerActions` + `headerIconsSlot`. As of
|
|
499
|
-
* v0.3.1, the shell no longer renders a separate `devNotesMenu` slot
|
|
500
|
-
* after `headerIconsSlot` — apps must inline DevNotesMenu inside
|
|
501
|
-
* `headerIconsSlot` so they have full control of icon ordering. The
|
|
502
|
-
* `devNotesMenu` prop on <ShellChrome> is still accepted for backward
|
|
503
|
-
* compat but is ignored.
|
|
504
|
-
*/
|
|
505
|
-
declare function Header({ onOpen, id }: HeaderProps): react_jsx_runtime.JSX.Element;
|
|
506
|
-
|
|
507
|
-
interface SidebarProps {
|
|
508
|
-
/** Mobile close handler (renders the X button on mobile when set). */
|
|
509
|
-
onClose?: () => void;
|
|
510
|
-
/** DOM id for the sidebar root (defaults to 'sidebar-container'). */
|
|
511
|
-
id?: string;
|
|
512
|
-
}
|
|
513
|
-
/**
|
|
514
|
-
* Politogy sidebar. Ported from
|
|
515
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 3289–4192 (2026-05-13)
|
|
516
|
-
* but stripped of the AI-sidebar block (moved to app's navItems pipeline).
|
|
517
|
-
*
|
|
518
|
-
* Renders, top to bottom:
|
|
519
|
-
* - Brand logo + (mobile) close button
|
|
520
|
-
* - Org logo (large) if present
|
|
521
|
-
* - <OrgPill /> — organization switcher
|
|
522
|
-
* - <ModePill /> — mode switcher
|
|
523
|
-
* - Nav items (from useShellNavItems)
|
|
524
|
-
* - Footer (Privacy / Terms / Subscriptions links + commit/version display)
|
|
525
|
-
*/
|
|
526
|
-
declare function Sidebar({ onClose, id }: SidebarProps): react_jsx_runtime.JSX.Element;
|
|
527
|
-
|
|
528
|
-
interface FooterProps {
|
|
529
|
-
buildInfo?: string;
|
|
530
|
-
}
|
|
531
|
-
declare function Footer({ buildInfo }: FooterProps): react_jsx_runtime.JSX.Element;
|
|
532
|
-
|
|
533
|
-
/**
|
|
534
|
-
* Avatar dropdown rendered on the right of the header. Ported to match the
|
|
535
|
-
* legacy menu in react/app/src/layouts/AuthenticatedLayout.tsx lines
|
|
536
|
-
* 2680–2898 (2026-05-13).
|
|
537
|
-
*
|
|
538
|
-
* Sections (in order):
|
|
539
|
-
* 1. Trigger — avatar + name/email VStack + chevron (md+ only).
|
|
540
|
-
* 2. My Profile / Continue Onboarding (gated) / Organization Settings.
|
|
541
|
-
* 3. ROLES & ORGANIZATIONS — current-org role Badge OR activeRoleConfig.
|
|
542
|
-
* 4. ACCOUNTS — current account indicator + linkedAccounts list with
|
|
543
|
-
* inline FiTrash2 remove + "Add Account" item.
|
|
544
|
-
* 5. Sign out.
|
|
545
|
-
*/
|
|
546
|
-
declare function UserMenu(): react_jsx_runtime.JSX.Element | null;
|
|
547
|
-
|
|
548
|
-
/**
|
|
549
|
-
* Sidebar organization switcher pill. Ported from
|
|
550
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 3795–3957 (2026-05-13).
|
|
551
|
-
*
|
|
552
|
-
* Reads useShellOrganization + useShellAuth. Renders nothing when there's
|
|
553
|
-
* no organization context.
|
|
554
|
-
*/
|
|
555
|
-
declare function OrgPill(): react_jsx_runtime.JSX.Element | null;
|
|
556
|
-
|
|
557
|
-
/**
|
|
558
|
-
* Sidebar mode selector pill. Ported from
|
|
559
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 3959–4006 (2026-05-13).
|
|
560
|
-
*
|
|
561
|
-
* Reads useShellMode. Renders nothing when no mode context is supplied or
|
|
562
|
-
* when the app has only one mode available.
|
|
563
|
-
*/
|
|
564
|
-
declare function ModePill(): react_jsx_runtime.JSX.Element | null;
|
|
565
|
-
|
|
566
|
-
interface NavItemSubItem {
|
|
567
|
-
name: string;
|
|
568
|
-
icon?: unknown;
|
|
569
|
-
brandIcon?: string;
|
|
570
|
-
href?: string;
|
|
571
|
-
badge?: string;
|
|
572
|
-
subLabel?: string;
|
|
573
|
-
disabled?: boolean;
|
|
574
|
-
/**
|
|
575
|
-
* Depth-3 support (Reference/UI-Platform: sub-sub items, e.g. Organization
|
|
576
|
-
* Settings → Subscription & Billing → Wallet). A sub-item carrying its own
|
|
577
|
-
* subItems renders as a nested collapsible group. Three levels is the
|
|
578
|
-
* platform maximum.
|
|
579
|
-
*/
|
|
580
|
-
subItems?: NavItemSubItem[];
|
|
581
|
-
}
|
|
582
|
-
interface NavItemProps {
|
|
583
|
-
icon?: unknown;
|
|
584
|
-
brandIcon?: string;
|
|
585
|
-
children: ReactNode;
|
|
586
|
-
href?: string;
|
|
587
|
-
action?: () => void;
|
|
588
|
-
subItems?: NavItemSubItem[];
|
|
589
|
-
badge?: string;
|
|
590
|
-
subLabel?: string;
|
|
591
|
-
isSubItem?: boolean;
|
|
592
|
-
isExpanded?: boolean;
|
|
593
|
-
onToggle?: (menuKey?: string | null) => void;
|
|
594
|
-
menuKey?: string;
|
|
595
|
-
isDisabled?: boolean;
|
|
596
|
-
disabled?: boolean;
|
|
597
|
-
/** Catch-all for one-off Chakra Box overrides passed by callers. */
|
|
598
|
-
[key: string]: unknown;
|
|
599
|
-
}
|
|
600
|
-
/**
|
|
601
|
-
* Single sidebar nav row. Reconciled with main-app source of truth:
|
|
602
|
-
* `react/app/src/layouts/AuthenticatedLayout.tsx` NavItem (2026-07).
|
|
603
|
-
*
|
|
604
|
-
* Shell additions retained: `brandIcon`, `safeHref`, shell context hooks.
|
|
605
|
-
* Main-app behavior restored: gray hover (no gradient sweep), parent active
|
|
606
|
-
* when any child matches even in tabs-only mode, split effectiveHref vs
|
|
607
|
-
* href-less accordion headers.
|
|
608
|
-
*/
|
|
609
|
-
declare function NavItem({ icon, brandIcon, children, href, action, subItems, badge, subLabel, isSubItem, isExpanded, onToggle, menuKey, isDisabled: navIsDisabled, disabled, ...rest }: NavItemProps): react_jsx_runtime.JSX.Element;
|
|
610
|
-
|
|
611
464
|
interface BrandLogoProps {
|
|
612
465
|
src?: string;
|
|
613
466
|
alt?: string;
|
|
@@ -642,152 +495,6 @@ interface BrandIconProps {
|
|
|
642
495
|
*/
|
|
643
496
|
declare function BrandIcon({ name, size, className, style, alt, basePath, }: BrandIconProps): react_jsx_runtime.JSX.Element;
|
|
644
497
|
|
|
645
|
-
/**
|
|
646
|
-
* The single count badge used by EVERY top-bar slot. Exported so a slot that
|
|
647
|
-
* has to render its own trigger (a popover/menu button) still gets an
|
|
648
|
-
* identical badge instead of hand-rolling one — mismatched badge sizes and
|
|
649
|
-
* radii across slots are the most visible form of chrome drift.
|
|
650
|
-
*/
|
|
651
|
-
declare function TopBarBadge({ count }: {
|
|
652
|
-
count: number;
|
|
653
|
-
}): react_jsx_runtime.JSX.Element | null;
|
|
654
|
-
interface TopBarIconProps extends Omit<IconButtonProps, 'icon' | 'aria-label'> {
|
|
655
|
-
slot: TopBarIconSlot;
|
|
656
|
-
'aria-label': string;
|
|
657
|
-
/**
|
|
658
|
-
* Rendered when the Brand API has no glyph name for this slot (token unset,
|
|
659
|
-
* stylesheet not yet loaded, or SSR). Keeps the top bar populated instead of
|
|
660
|
-
* flashing an empty button.
|
|
661
|
-
*/
|
|
662
|
-
fallbackIcon: ReactElement;
|
|
663
|
-
/** Marks the slot active — resolves the universal selected-state tokens. */
|
|
664
|
-
isSelected?: boolean;
|
|
665
|
-
/** Unread/pending count. Rendered with the shared <TopBarBadge>. */
|
|
666
|
-
badgeCount?: number;
|
|
667
|
-
/** Extra overlay (rare). Positioned in the same relative wrapper as the badge. */
|
|
668
|
-
children?: ReactNode;
|
|
669
|
-
}
|
|
670
|
-
/**
|
|
671
|
-
* A single top-bar action icon. Use this for EVERY top-bar slot so the icons
|
|
672
|
-
* share one universal treatment — never give one slot a bespoke size, spacing,
|
|
673
|
-
* hover, selected style, or badge.
|
|
674
|
-
*
|
|
675
|
-
* Sizing is deliberately enforced on the rendered <svg> as well as the button:
|
|
676
|
-
* react-icons emit their own width/height attributes, and Feather glyphs differ
|
|
677
|
-
* in visual weight, so relying on the button box alone lets slots drift apart.
|
|
678
|
-
*/
|
|
679
|
-
declare const TopBarIcon: react.ForwardRefExoticComponent<TopBarIconProps & react.RefAttributes<HTMLButtonElement>>;
|
|
680
|
-
|
|
681
|
-
/**
|
|
682
|
-
* Support icon + modal rendered in the header. Reads auth, org, and support
|
|
683
|
-
* handler from ShellProvider. Renders nothing when the host app didn't supply
|
|
684
|
-
* a `support` prop.
|
|
685
|
-
*/
|
|
686
|
-
declare function SupportRequestButton(): react_jsx_runtime.JSX.Element | null;
|
|
687
|
-
|
|
688
|
-
interface CommitCopyButtonProps {
|
|
689
|
-
/**
|
|
690
|
-
* Pre-rendered environment chip (e.g., the app's own `EnvironmentBanner`).
|
|
691
|
-
* Takes precedence over `environmentLabel`. Click anywhere on the chip
|
|
692
|
-
* copies the full commit SHA.
|
|
693
|
-
*/
|
|
694
|
-
envNode?: ReactNode;
|
|
695
|
-
/**
|
|
696
|
-
* Environment label (e.g., 'staging', 'production', 'local'). When
|
|
697
|
-
* `envNode` is not supplied, the component renders a default chip
|
|
698
|
-
* keyed off this label with appropriate background/border color.
|
|
699
|
-
*/
|
|
700
|
-
environmentLabel?: string;
|
|
701
|
-
/** Full git commit SHA. Last 4 characters are rendered; click copies the full SHA. */
|
|
702
|
-
commit?: string;
|
|
703
|
-
/** App version, e.g., '2.34.1'. Renders as `v{version}`. */
|
|
704
|
-
version?: string;
|
|
705
|
-
/** ISO date string of the commit. Formatted as 'Mon D'. */
|
|
706
|
-
commitDate?: string;
|
|
707
|
-
/** Commit author name (e.g., 'Leland Smith'). First name is shown. */
|
|
708
|
-
commitAuthor?: string;
|
|
709
|
-
/** Full commit message body — shown as a tooltip over the env chip. */
|
|
710
|
-
commitLog?: string;
|
|
711
|
-
/**
|
|
712
|
-
* Optional click handler for the diagnostics icon. When unset, the
|
|
713
|
-
* icon is not rendered.
|
|
714
|
-
*/
|
|
715
|
-
onDiagnosticsClick?: () => void;
|
|
716
|
-
}
|
|
717
|
-
/**
|
|
718
|
-
* Footer commit info pill. Ported from
|
|
719
|
-
* `react/app/src/layouts/AuthenticatedLayout.tsx::CommitCopyButton`
|
|
720
|
-
* (lines 3017–3284, 2026-05-13).
|
|
721
|
-
*
|
|
722
|
-
* Visual: two stacked rows.
|
|
723
|
-
* Row 1: [env chip] | {last4 SHA} | v{version} | [diagnostics icon]
|
|
724
|
-
* Row 2: | {Mon D} | {firstName} | (only when date or author present)
|
|
725
|
-
*
|
|
726
|
-
* Clicking the env chip copies the full SHA via `useClipboard`, with a
|
|
727
|
-
* brief "Copied" toast that fades up. Hovering the env chip shows the
|
|
728
|
-
* full commit log in a tooltip.
|
|
729
|
-
*/
|
|
730
|
-
declare function CommitCopyButton({ envNode, environmentLabel, commit, version, commitDate, commitAuthor, commitLog, onDiagnosticsClick, }: CommitCopyButtonProps): react_jsx_runtime.JSX.Element;
|
|
731
|
-
|
|
732
|
-
interface ShellChromeProps {
|
|
733
|
-
children: ReactNode;
|
|
734
|
-
/** Drives <OrgPill /> in the sidebar. */
|
|
735
|
-
organization?: ShellOrganizationValue | null;
|
|
736
|
-
/** Drives the UserMenu Switch-account section. */
|
|
737
|
-
linkedAccounts?: ShellLinkedAccountsValue | null;
|
|
738
|
-
/** Drives <SupportRequestButton /> and modal submission. */
|
|
739
|
-
support?: ShellSupportValue | null;
|
|
740
|
-
/** Rendered in the header (typically <DevNotesMenu />). */
|
|
741
|
-
devNotesMenu?: ReactNode;
|
|
742
|
-
/** UserMenu profile link target. Defaults to '/my-profile'. */
|
|
743
|
-
myProfileHref?: string;
|
|
744
|
-
/** Drives <ModePill /> + active row colors. */
|
|
745
|
-
mode?: ShellModeValue | null;
|
|
746
|
-
/** The sidebar nav rows. */
|
|
747
|
-
navItems?: ShellNavItem[];
|
|
748
|
-
/** User's nav-rendering preference. */
|
|
749
|
-
navigationPreference?: ShellNavigationPreferenceValue | null;
|
|
750
|
-
/** Active-role display info for the UserMenu role badge. */
|
|
751
|
-
role?: ShellRoleValue | null;
|
|
752
|
-
/** Footer data for the sidebar bottom row. */
|
|
753
|
-
footer?: ShellFooterValue | null;
|
|
754
|
-
/** Image src for the sidebar BrandLogo (top-left). */
|
|
755
|
-
brandLogoSrc?: string;
|
|
756
|
-
/** Header right-side icon stack (Fuel, NewTextBell, Alerts, Toggle, ImportProgress, etc). */
|
|
757
|
-
headerIconsSlot?: ReactNode;
|
|
758
|
-
/** href used by the UserMenu "Organization Settings" item. */
|
|
759
|
-
organizationSettingsHref?: string;
|
|
760
|
-
/** When true, UserMenu shows "Continue Onboarding" item. */
|
|
761
|
-
showContinueOnboarding?: boolean;
|
|
762
|
-
/** Click handler for UserMenu "Continue Onboarding". */
|
|
763
|
-
onContinueOnboarding?: () => void;
|
|
764
|
-
/** Header page title text. */
|
|
765
|
-
pageTitle?: string;
|
|
766
|
-
/** Header breadcrumb chips. */
|
|
767
|
-
breadcrumbs?: Array<{
|
|
768
|
-
label: string;
|
|
769
|
-
href?: string;
|
|
770
|
-
}>;
|
|
771
|
-
/** Header right-side action buttons (rendered before the icon row). */
|
|
772
|
-
headerActions?: ReactNode;
|
|
773
|
-
/** Avatar URL override for UserMenu. Pass a value computed from the app's
|
|
774
|
-
* profile.avatar_url / localStorage / default fallback chain. */
|
|
775
|
-
userAvatarUrl?: string;
|
|
776
|
-
}
|
|
777
|
-
/**
|
|
778
|
-
* Drop-in chrome binding for apps where the org/linked-account/support data
|
|
779
|
-
* lives in React contexts nested BELOW <ShellProvider> (e.g., an
|
|
780
|
-
* <OrganizationProvider> that itself depends on <AuthProvider>).
|
|
781
|
-
*
|
|
782
|
-
* Use this component inside those providers to feed the values into the
|
|
783
|
-
* shell's chrome contexts. Nested <Context.Provider> overrides the empty
|
|
784
|
-
* defaults set by <ShellProvider> at the top of the tree.
|
|
785
|
-
*
|
|
786
|
-
* Apps that have all the data available at the ShellProvider construction
|
|
787
|
-
* site can pass the same props to <ShellProvider> directly instead.
|
|
788
|
-
*/
|
|
789
|
-
declare function ShellChrome({ children, organization, linkedAccounts, support, devNotesMenu, myProfileHref, mode, navItems, navigationPreference, role, footer, brandLogoSrc, headerIconsSlot, organizationSettingsHref, showContinueOnboarding, onContinueOnboarding, pageTitle, breadcrumbs, headerActions, userAvatarUrl, }: ShellChromeProps): react_jsx_runtime.JSX.Element;
|
|
790
|
-
|
|
791
498
|
/** Returns a normalized 7-char hex color, or null if the input isn't valid. */
|
|
792
499
|
declare function normalizeHexColor(value?: string | null): string | null;
|
|
793
500
|
/**
|
|
@@ -863,4 +570,4 @@ declare function registerShellPrecache(opts?: RegisterShellPrecacheOptions): Pro
|
|
|
863
570
|
*/
|
|
864
571
|
declare function buildSpeculationRules(currentApp: string, registry: AppRegistryEntry[]): string | null;
|
|
865
572
|
|
|
866
|
-
export {
|
|
573
|
+
export { type AppRegistryEntry, BrandIcon, BrandLogo, BreadcrumbBar, Card, GlobalUiIdProvider, HeaderTabBar, type HeaderTabBarItem, PageContainer, PageHeader, type ShellActiveRoleConfig, type ShellAuthStatus, type ShellAuthValue, ShellChromeContext, type ShellChromeValue, ShellFooterContext, type ShellFooterLink, type ShellFooterValue, type ShellInjectedAuth, type ShellLinkedAccount, ShellLinkedAccountsContext, type ShellLinkedAccountsValue, type ShellModeConfig, ShellModeContext, type ShellModeValue, type ShellNavItem, ShellNavItemsContext, type ShellNavItemsValue, ShellNavigationPreferenceContext, type ShellNavigationPreferenceValue, ShellOrgContext, type ShellOrganization, type ShellOrganizationValue, ShellProvider, type ShellProviderProps, ShellRoleContext, type ShellRoleValue, type ShellSlots, type ShellSupportContext, ShellSupportProviderContext, type ShellSupportValue, type ShellUser, buildSpeculationRules, getOrganizationBadgeLetters, getOrganizationBrandColor, getUserDisplayName, hexToRgba, lightenHexColor, normalizeHexColor, politogyTheme, registerShellPrecache, useAppRegistry, useCurrentApp, useShellAuth, useShellChrome, useShellFooter, useShellLinkedAccounts, useShellMode, useShellNavItems, useShellNavigationPreference, useShellOrganization, useShellRole, useShellSupport };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import { ReactNode, CSSProperties
|
|
3
|
+
import { ReactNode, CSSProperties } from 'react';
|
|
4
4
|
import { User, Session, SupabaseClient } from '@supabase/supabase-js';
|
|
5
|
-
import { IconButtonProps } from '@chakra-ui/react';
|
|
6
|
-
import { T as TopBarIconSlot } from './topbarIconSlot-FunwEKO9.js';
|
|
7
5
|
|
|
8
6
|
declare const politogyTheme: Record<string, any>;
|
|
9
7
|
|
|
@@ -463,151 +461,6 @@ declare function useShellRole(): ShellRoleValue | null;
|
|
|
463
461
|
*/
|
|
464
462
|
declare function useShellFooter(): ShellFooterValue | null;
|
|
465
463
|
|
|
466
|
-
interface AppLayoutProps extends ShellSlots {
|
|
467
|
-
children: ReactNode;
|
|
468
|
-
buildInfo?: string;
|
|
469
|
-
}
|
|
470
|
-
/**
|
|
471
|
-
* Authenticated app shell composition: <Sidebar> on the left, <Header> on
|
|
472
|
-
* top, <main> for routed children, optional <Footer>, plus modal + overlay
|
|
473
|
-
* slots. All chrome data flows through ShellProvider/ShellChrome contexts —
|
|
474
|
-
* AppLayout itself takes only optional slots for modals/overlays/notifs.
|
|
475
|
-
*/
|
|
476
|
-
declare function AppLayout({ children, buildInfo, modalsSlot, notificationsSlot, overlaySlot, }: AppLayoutProps): react_jsx_runtime.JSX.Element;
|
|
477
|
-
|
|
478
|
-
interface HeaderProps {
|
|
479
|
-
/** Mobile menu open handler (renders the hamburger icon on mobile). */
|
|
480
|
-
onOpen?: () => void;
|
|
481
|
-
/** DOM id (defaults to 'mobile-nav-container'). */
|
|
482
|
-
id?: string;
|
|
483
|
-
}
|
|
484
|
-
/**
|
|
485
|
-
* Politogy header (top bar). Ported from
|
|
486
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 2545–2924 (2026-05-13).
|
|
487
|
-
*
|
|
488
|
-
* Composition (left → right):
|
|
489
|
-
* 1. Hamburger (mobile only) + small brand logo (mobile only) + title +
|
|
490
|
-
* breadcrumbs.
|
|
491
|
-
* 2. headerActions (app-supplied React node, e.g., page action buttons).
|
|
492
|
-
* 3. headerIconsSlot (app-supplied React node, e.g., FuelPopover,
|
|
493
|
-
* NewTextBellPopup, SystemAlertsMenu, NavigationToggleMenu,
|
|
494
|
-
* ImportProgressIndicator, DevNotesMenu, SupportRequestAction).
|
|
495
|
-
* 4. UserMenu (avatar + name/email VStack + chevron).
|
|
496
|
-
*
|
|
497
|
-
* NOTE: app-specific widgets stay in the app. The shell only renders
|
|
498
|
-
* what the app passes through `headerActions` + `headerIconsSlot`. As of
|
|
499
|
-
* v0.3.1, the shell no longer renders a separate `devNotesMenu` slot
|
|
500
|
-
* after `headerIconsSlot` — apps must inline DevNotesMenu inside
|
|
501
|
-
* `headerIconsSlot` so they have full control of icon ordering. The
|
|
502
|
-
* `devNotesMenu` prop on <ShellChrome> is still accepted for backward
|
|
503
|
-
* compat but is ignored.
|
|
504
|
-
*/
|
|
505
|
-
declare function Header({ onOpen, id }: HeaderProps): react_jsx_runtime.JSX.Element;
|
|
506
|
-
|
|
507
|
-
interface SidebarProps {
|
|
508
|
-
/** Mobile close handler (renders the X button on mobile when set). */
|
|
509
|
-
onClose?: () => void;
|
|
510
|
-
/** DOM id for the sidebar root (defaults to 'sidebar-container'). */
|
|
511
|
-
id?: string;
|
|
512
|
-
}
|
|
513
|
-
/**
|
|
514
|
-
* Politogy sidebar. Ported from
|
|
515
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 3289–4192 (2026-05-13)
|
|
516
|
-
* but stripped of the AI-sidebar block (moved to app's navItems pipeline).
|
|
517
|
-
*
|
|
518
|
-
* Renders, top to bottom:
|
|
519
|
-
* - Brand logo + (mobile) close button
|
|
520
|
-
* - Org logo (large) if present
|
|
521
|
-
* - <OrgPill /> — organization switcher
|
|
522
|
-
* - <ModePill /> — mode switcher
|
|
523
|
-
* - Nav items (from useShellNavItems)
|
|
524
|
-
* - Footer (Privacy / Terms / Subscriptions links + commit/version display)
|
|
525
|
-
*/
|
|
526
|
-
declare function Sidebar({ onClose, id }: SidebarProps): react_jsx_runtime.JSX.Element;
|
|
527
|
-
|
|
528
|
-
interface FooterProps {
|
|
529
|
-
buildInfo?: string;
|
|
530
|
-
}
|
|
531
|
-
declare function Footer({ buildInfo }: FooterProps): react_jsx_runtime.JSX.Element;
|
|
532
|
-
|
|
533
|
-
/**
|
|
534
|
-
* Avatar dropdown rendered on the right of the header. Ported to match the
|
|
535
|
-
* legacy menu in react/app/src/layouts/AuthenticatedLayout.tsx lines
|
|
536
|
-
* 2680–2898 (2026-05-13).
|
|
537
|
-
*
|
|
538
|
-
* Sections (in order):
|
|
539
|
-
* 1. Trigger — avatar + name/email VStack + chevron (md+ only).
|
|
540
|
-
* 2. My Profile / Continue Onboarding (gated) / Organization Settings.
|
|
541
|
-
* 3. ROLES & ORGANIZATIONS — current-org role Badge OR activeRoleConfig.
|
|
542
|
-
* 4. ACCOUNTS — current account indicator + linkedAccounts list with
|
|
543
|
-
* inline FiTrash2 remove + "Add Account" item.
|
|
544
|
-
* 5. Sign out.
|
|
545
|
-
*/
|
|
546
|
-
declare function UserMenu(): react_jsx_runtime.JSX.Element | null;
|
|
547
|
-
|
|
548
|
-
/**
|
|
549
|
-
* Sidebar organization switcher pill. Ported from
|
|
550
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 3795–3957 (2026-05-13).
|
|
551
|
-
*
|
|
552
|
-
* Reads useShellOrganization + useShellAuth. Renders nothing when there's
|
|
553
|
-
* no organization context.
|
|
554
|
-
*/
|
|
555
|
-
declare function OrgPill(): react_jsx_runtime.JSX.Element | null;
|
|
556
|
-
|
|
557
|
-
/**
|
|
558
|
-
* Sidebar mode selector pill. Ported from
|
|
559
|
-
* react/app/src/layouts/AuthenticatedLayout.tsx lines 3959–4006 (2026-05-13).
|
|
560
|
-
*
|
|
561
|
-
* Reads useShellMode. Renders nothing when no mode context is supplied or
|
|
562
|
-
* when the app has only one mode available.
|
|
563
|
-
*/
|
|
564
|
-
declare function ModePill(): react_jsx_runtime.JSX.Element | null;
|
|
565
|
-
|
|
566
|
-
interface NavItemSubItem {
|
|
567
|
-
name: string;
|
|
568
|
-
icon?: unknown;
|
|
569
|
-
brandIcon?: string;
|
|
570
|
-
href?: string;
|
|
571
|
-
badge?: string;
|
|
572
|
-
subLabel?: string;
|
|
573
|
-
disabled?: boolean;
|
|
574
|
-
/**
|
|
575
|
-
* Depth-3 support (Reference/UI-Platform: sub-sub items, e.g. Organization
|
|
576
|
-
* Settings → Subscription & Billing → Wallet). A sub-item carrying its own
|
|
577
|
-
* subItems renders as a nested collapsible group. Three levels is the
|
|
578
|
-
* platform maximum.
|
|
579
|
-
*/
|
|
580
|
-
subItems?: NavItemSubItem[];
|
|
581
|
-
}
|
|
582
|
-
interface NavItemProps {
|
|
583
|
-
icon?: unknown;
|
|
584
|
-
brandIcon?: string;
|
|
585
|
-
children: ReactNode;
|
|
586
|
-
href?: string;
|
|
587
|
-
action?: () => void;
|
|
588
|
-
subItems?: NavItemSubItem[];
|
|
589
|
-
badge?: string;
|
|
590
|
-
subLabel?: string;
|
|
591
|
-
isSubItem?: boolean;
|
|
592
|
-
isExpanded?: boolean;
|
|
593
|
-
onToggle?: (menuKey?: string | null) => void;
|
|
594
|
-
menuKey?: string;
|
|
595
|
-
isDisabled?: boolean;
|
|
596
|
-
disabled?: boolean;
|
|
597
|
-
/** Catch-all for one-off Chakra Box overrides passed by callers. */
|
|
598
|
-
[key: string]: unknown;
|
|
599
|
-
}
|
|
600
|
-
/**
|
|
601
|
-
* Single sidebar nav row. Reconciled with main-app source of truth:
|
|
602
|
-
* `react/app/src/layouts/AuthenticatedLayout.tsx` NavItem (2026-07).
|
|
603
|
-
*
|
|
604
|
-
* Shell additions retained: `brandIcon`, `safeHref`, shell context hooks.
|
|
605
|
-
* Main-app behavior restored: gray hover (no gradient sweep), parent active
|
|
606
|
-
* when any child matches even in tabs-only mode, split effectiveHref vs
|
|
607
|
-
* href-less accordion headers.
|
|
608
|
-
*/
|
|
609
|
-
declare function NavItem({ icon, brandIcon, children, href, action, subItems, badge, subLabel, isSubItem, isExpanded, onToggle, menuKey, isDisabled: navIsDisabled, disabled, ...rest }: NavItemProps): react_jsx_runtime.JSX.Element;
|
|
610
|
-
|
|
611
464
|
interface BrandLogoProps {
|
|
612
465
|
src?: string;
|
|
613
466
|
alt?: string;
|
|
@@ -642,152 +495,6 @@ interface BrandIconProps {
|
|
|
642
495
|
*/
|
|
643
496
|
declare function BrandIcon({ name, size, className, style, alt, basePath, }: BrandIconProps): react_jsx_runtime.JSX.Element;
|
|
644
497
|
|
|
645
|
-
/**
|
|
646
|
-
* The single count badge used by EVERY top-bar slot. Exported so a slot that
|
|
647
|
-
* has to render its own trigger (a popover/menu button) still gets an
|
|
648
|
-
* identical badge instead of hand-rolling one — mismatched badge sizes and
|
|
649
|
-
* radii across slots are the most visible form of chrome drift.
|
|
650
|
-
*/
|
|
651
|
-
declare function TopBarBadge({ count }: {
|
|
652
|
-
count: number;
|
|
653
|
-
}): react_jsx_runtime.JSX.Element | null;
|
|
654
|
-
interface TopBarIconProps extends Omit<IconButtonProps, 'icon' | 'aria-label'> {
|
|
655
|
-
slot: TopBarIconSlot;
|
|
656
|
-
'aria-label': string;
|
|
657
|
-
/**
|
|
658
|
-
* Rendered when the Brand API has no glyph name for this slot (token unset,
|
|
659
|
-
* stylesheet not yet loaded, or SSR). Keeps the top bar populated instead of
|
|
660
|
-
* flashing an empty button.
|
|
661
|
-
*/
|
|
662
|
-
fallbackIcon: ReactElement;
|
|
663
|
-
/** Marks the slot active — resolves the universal selected-state tokens. */
|
|
664
|
-
isSelected?: boolean;
|
|
665
|
-
/** Unread/pending count. Rendered with the shared <TopBarBadge>. */
|
|
666
|
-
badgeCount?: number;
|
|
667
|
-
/** Extra overlay (rare). Positioned in the same relative wrapper as the badge. */
|
|
668
|
-
children?: ReactNode;
|
|
669
|
-
}
|
|
670
|
-
/**
|
|
671
|
-
* A single top-bar action icon. Use this for EVERY top-bar slot so the icons
|
|
672
|
-
* share one universal treatment — never give one slot a bespoke size, spacing,
|
|
673
|
-
* hover, selected style, or badge.
|
|
674
|
-
*
|
|
675
|
-
* Sizing is deliberately enforced on the rendered <svg> as well as the button:
|
|
676
|
-
* react-icons emit their own width/height attributes, and Feather glyphs differ
|
|
677
|
-
* in visual weight, so relying on the button box alone lets slots drift apart.
|
|
678
|
-
*/
|
|
679
|
-
declare const TopBarIcon: react.ForwardRefExoticComponent<TopBarIconProps & react.RefAttributes<HTMLButtonElement>>;
|
|
680
|
-
|
|
681
|
-
/**
|
|
682
|
-
* Support icon + modal rendered in the header. Reads auth, org, and support
|
|
683
|
-
* handler from ShellProvider. Renders nothing when the host app didn't supply
|
|
684
|
-
* a `support` prop.
|
|
685
|
-
*/
|
|
686
|
-
declare function SupportRequestButton(): react_jsx_runtime.JSX.Element | null;
|
|
687
|
-
|
|
688
|
-
interface CommitCopyButtonProps {
|
|
689
|
-
/**
|
|
690
|
-
* Pre-rendered environment chip (e.g., the app's own `EnvironmentBanner`).
|
|
691
|
-
* Takes precedence over `environmentLabel`. Click anywhere on the chip
|
|
692
|
-
* copies the full commit SHA.
|
|
693
|
-
*/
|
|
694
|
-
envNode?: ReactNode;
|
|
695
|
-
/**
|
|
696
|
-
* Environment label (e.g., 'staging', 'production', 'local'). When
|
|
697
|
-
* `envNode` is not supplied, the component renders a default chip
|
|
698
|
-
* keyed off this label with appropriate background/border color.
|
|
699
|
-
*/
|
|
700
|
-
environmentLabel?: string;
|
|
701
|
-
/** Full git commit SHA. Last 4 characters are rendered; click copies the full SHA. */
|
|
702
|
-
commit?: string;
|
|
703
|
-
/** App version, e.g., '2.34.1'. Renders as `v{version}`. */
|
|
704
|
-
version?: string;
|
|
705
|
-
/** ISO date string of the commit. Formatted as 'Mon D'. */
|
|
706
|
-
commitDate?: string;
|
|
707
|
-
/** Commit author name (e.g., 'Leland Smith'). First name is shown. */
|
|
708
|
-
commitAuthor?: string;
|
|
709
|
-
/** Full commit message body — shown as a tooltip over the env chip. */
|
|
710
|
-
commitLog?: string;
|
|
711
|
-
/**
|
|
712
|
-
* Optional click handler for the diagnostics icon. When unset, the
|
|
713
|
-
* icon is not rendered.
|
|
714
|
-
*/
|
|
715
|
-
onDiagnosticsClick?: () => void;
|
|
716
|
-
}
|
|
717
|
-
/**
|
|
718
|
-
* Footer commit info pill. Ported from
|
|
719
|
-
* `react/app/src/layouts/AuthenticatedLayout.tsx::CommitCopyButton`
|
|
720
|
-
* (lines 3017–3284, 2026-05-13).
|
|
721
|
-
*
|
|
722
|
-
* Visual: two stacked rows.
|
|
723
|
-
* Row 1: [env chip] | {last4 SHA} | v{version} | [diagnostics icon]
|
|
724
|
-
* Row 2: | {Mon D} | {firstName} | (only when date or author present)
|
|
725
|
-
*
|
|
726
|
-
* Clicking the env chip copies the full SHA via `useClipboard`, with a
|
|
727
|
-
* brief "Copied" toast that fades up. Hovering the env chip shows the
|
|
728
|
-
* full commit log in a tooltip.
|
|
729
|
-
*/
|
|
730
|
-
declare function CommitCopyButton({ envNode, environmentLabel, commit, version, commitDate, commitAuthor, commitLog, onDiagnosticsClick, }: CommitCopyButtonProps): react_jsx_runtime.JSX.Element;
|
|
731
|
-
|
|
732
|
-
interface ShellChromeProps {
|
|
733
|
-
children: ReactNode;
|
|
734
|
-
/** Drives <OrgPill /> in the sidebar. */
|
|
735
|
-
organization?: ShellOrganizationValue | null;
|
|
736
|
-
/** Drives the UserMenu Switch-account section. */
|
|
737
|
-
linkedAccounts?: ShellLinkedAccountsValue | null;
|
|
738
|
-
/** Drives <SupportRequestButton /> and modal submission. */
|
|
739
|
-
support?: ShellSupportValue | null;
|
|
740
|
-
/** Rendered in the header (typically <DevNotesMenu />). */
|
|
741
|
-
devNotesMenu?: ReactNode;
|
|
742
|
-
/** UserMenu profile link target. Defaults to '/my-profile'. */
|
|
743
|
-
myProfileHref?: string;
|
|
744
|
-
/** Drives <ModePill /> + active row colors. */
|
|
745
|
-
mode?: ShellModeValue | null;
|
|
746
|
-
/** The sidebar nav rows. */
|
|
747
|
-
navItems?: ShellNavItem[];
|
|
748
|
-
/** User's nav-rendering preference. */
|
|
749
|
-
navigationPreference?: ShellNavigationPreferenceValue | null;
|
|
750
|
-
/** Active-role display info for the UserMenu role badge. */
|
|
751
|
-
role?: ShellRoleValue | null;
|
|
752
|
-
/** Footer data for the sidebar bottom row. */
|
|
753
|
-
footer?: ShellFooterValue | null;
|
|
754
|
-
/** Image src for the sidebar BrandLogo (top-left). */
|
|
755
|
-
brandLogoSrc?: string;
|
|
756
|
-
/** Header right-side icon stack (Fuel, NewTextBell, Alerts, Toggle, ImportProgress, etc). */
|
|
757
|
-
headerIconsSlot?: ReactNode;
|
|
758
|
-
/** href used by the UserMenu "Organization Settings" item. */
|
|
759
|
-
organizationSettingsHref?: string;
|
|
760
|
-
/** When true, UserMenu shows "Continue Onboarding" item. */
|
|
761
|
-
showContinueOnboarding?: boolean;
|
|
762
|
-
/** Click handler for UserMenu "Continue Onboarding". */
|
|
763
|
-
onContinueOnboarding?: () => void;
|
|
764
|
-
/** Header page title text. */
|
|
765
|
-
pageTitle?: string;
|
|
766
|
-
/** Header breadcrumb chips. */
|
|
767
|
-
breadcrumbs?: Array<{
|
|
768
|
-
label: string;
|
|
769
|
-
href?: string;
|
|
770
|
-
}>;
|
|
771
|
-
/** Header right-side action buttons (rendered before the icon row). */
|
|
772
|
-
headerActions?: ReactNode;
|
|
773
|
-
/** Avatar URL override for UserMenu. Pass a value computed from the app's
|
|
774
|
-
* profile.avatar_url / localStorage / default fallback chain. */
|
|
775
|
-
userAvatarUrl?: string;
|
|
776
|
-
}
|
|
777
|
-
/**
|
|
778
|
-
* Drop-in chrome binding for apps where the org/linked-account/support data
|
|
779
|
-
* lives in React contexts nested BELOW <ShellProvider> (e.g., an
|
|
780
|
-
* <OrganizationProvider> that itself depends on <AuthProvider>).
|
|
781
|
-
*
|
|
782
|
-
* Use this component inside those providers to feed the values into the
|
|
783
|
-
* shell's chrome contexts. Nested <Context.Provider> overrides the empty
|
|
784
|
-
* defaults set by <ShellProvider> at the top of the tree.
|
|
785
|
-
*
|
|
786
|
-
* Apps that have all the data available at the ShellProvider construction
|
|
787
|
-
* site can pass the same props to <ShellProvider> directly instead.
|
|
788
|
-
*/
|
|
789
|
-
declare function ShellChrome({ children, organization, linkedAccounts, support, devNotesMenu, myProfileHref, mode, navItems, navigationPreference, role, footer, brandLogoSrc, headerIconsSlot, organizationSettingsHref, showContinueOnboarding, onContinueOnboarding, pageTitle, breadcrumbs, headerActions, userAvatarUrl, }: ShellChromeProps): react_jsx_runtime.JSX.Element;
|
|
790
|
-
|
|
791
498
|
/** Returns a normalized 7-char hex color, or null if the input isn't valid. */
|
|
792
499
|
declare function normalizeHexColor(value?: string | null): string | null;
|
|
793
500
|
/**
|
|
@@ -863,4 +570,4 @@ declare function registerShellPrecache(opts?: RegisterShellPrecacheOptions): Pro
|
|
|
863
570
|
*/
|
|
864
571
|
declare function buildSpeculationRules(currentApp: string, registry: AppRegistryEntry[]): string | null;
|
|
865
572
|
|
|
866
|
-
export {
|
|
573
|
+
export { type AppRegistryEntry, BrandIcon, BrandLogo, BreadcrumbBar, Card, GlobalUiIdProvider, HeaderTabBar, type HeaderTabBarItem, PageContainer, PageHeader, type ShellActiveRoleConfig, type ShellAuthStatus, type ShellAuthValue, ShellChromeContext, type ShellChromeValue, ShellFooterContext, type ShellFooterLink, type ShellFooterValue, type ShellInjectedAuth, type ShellLinkedAccount, ShellLinkedAccountsContext, type ShellLinkedAccountsValue, type ShellModeConfig, ShellModeContext, type ShellModeValue, type ShellNavItem, ShellNavItemsContext, type ShellNavItemsValue, ShellNavigationPreferenceContext, type ShellNavigationPreferenceValue, ShellOrgContext, type ShellOrganization, type ShellOrganizationValue, ShellProvider, type ShellProviderProps, ShellRoleContext, type ShellRoleValue, type ShellSlots, type ShellSupportContext, ShellSupportProviderContext, type ShellSupportValue, type ShellUser, buildSpeculationRules, getOrganizationBadgeLetters, getOrganizationBrandColor, getUserDisplayName, hexToRgba, lightenHexColor, normalizeHexColor, politogyTheme, registerShellPrecache, useAppRegistry, useCurrentApp, useShellAuth, useShellChrome, useShellFooter, useShellLinkedAccounts, useShellMode, useShellNavItems, useShellNavigationPreference, useShellOrganization, useShellRole, useShellSupport };
|