@the-portland-company/shell 0.1.0

package/CHANGELOG.md

@@ -0,0 +1,16 @@
+# Changelog
+
+## 0.1.0 — 2026-05-12
+
+Initial public release.
+
+### Added
+- `ShellProvider`, `useShellAuth`, `useAppRegistry`, `useCurrentApp`
+- `AppLayout` with optional slot props (`headerExtrasSlot`, `modalsSlot`, `notificationsSlot`, `sidebarFooterSlot`, `overlaySlot`)
+- `Header`, `Sidebar`, `Footer` chrome primitives
+- Pure layout components: `Card`, `PageContainer`, `PageHeader`, `BreadcrumbBar`, `HeaderTabBar`, `GlobalUiIdProvider`
+- `politogyTheme` (Chakra theme)
+- `registerShellPrecache()` and bundled service worker (exported at `@the-portland-company/shell/sw`)
+- `buildSpeculationRules()` for cross-app prerendering
+- View transitions CSS at `@the-portland-company/shell/css`
+- Public TypeScript types: `ShellUser`, `ShellAuthStatus`, `AppRegistryEntry`, `ShellSlots`, `ShellProviderProps`, `ShellAuthValue`, `HeaderTabBarItem`

package/README.md

@@ -0,0 +1,72 @@
+# @the-portland-company/shell
+
+Shared chrome for politogy apps. One install, one wrapper, identical look.
+
+## Install
+
+```
+npm install @the-portland-company/shell @chakra-ui/react @emotion/react @emotion/styled @supabase/supabase-js react react-dom
+```
+
+## Quick start
+
+```tsx
+import { ShellProvider, AppLayout, registerShellPrecache } from '@the-portland-company/shell'
+import '@the-portland-company/shell/css'
+
+registerShellPrecache().catch(() => {})
+
+const APPS = [
+  { id: 'crm', label: 'CRM', path: '/' },
+  { id: 'messaging', label: 'Messaging', path: '/messaging' },
+]
+
+export default function App() {
+  return (
+    <ShellProvider currentApp="crm" supabaseClient={supabase} appRegistry={APPS}>
+      <AppLayout>{/* your routes */}</AppLayout>
+    </ShellProvider>
+  )
+}
+```
+
+## Slot props on `<AppLayout>`
+
+| Prop | Position | Use for |
+|---|---|---|
+| `headerExtrasSlot` | Right of header, before user menu | App-specific header widgets |
+| `modalsSlot` | Above main content, position absolute | Modal dialogs |
+| `notificationsSlot` | Inside main, top-right | Toasts, badges |
+| `sidebarFooterSlot` | Bottom of sidebar | Org switcher, status |
+| `overlaySlot` | Top of everything | Always-on-top indicators |
+
+## Service worker
+
+The package ships a precache SW. Copy it into your `public/` dir during postinstall:
+
+```js
+// scripts/copy-shell-sw.mjs
+import { copyFile } from 'node:fs/promises'
+await copyFile(
+  'node_modules/@the-portland-company/shell/dist/shell-precache.worker.js',
+  'public/sw-shell.js',
+)
+```
+
+Then call `registerShellPrecache()` at the top of your app.
+
+## Speculation Rules
+
+Emit cross-app prerendering hints:
+
+```tsx
+import { useAppRegistry, useCurrentApp, buildSpeculationRules } from '@the-portland-company/shell'
+
+function SpeculationRules() {
+  const registry = useAppRegistry()
+  const current = useCurrentApp()
+  const json = buildSpeculationRules(current, registry)
+  if (!json) return null
+  return <script type="speculationrules" dangerouslySetInnerHTML={{ __html: json }} />
+}
+```