@s3pweb/shell-ui 0.1.0

package/dist/components/realtime-pulse.d.ts

@@ -0,0 +1,51 @@
+import { ReactNode } from 'react';
+/**
+ * Realtime / MQTT status indicator. Composes a `Radio` glyph with a small
+ * coloured presence dot at the icon's bottom-right corner — same shape the
+ * Stencil app's `mqttErrorStatus` widget used, ported to React.
+ *
+ * Plug it into a pinnable `ShellAction`'s `icon` slot so it renders the
+ * same way the framework renders mobile / fullscreen / support — a 38 px
+ * ghost icon button when pinned, a 16 px row icon when listed in the
+ * puzzle / "Plus" menus, a 32 px chip in the collapsed sidebar fallback.
+ *
+ * Pair with `<RealtimePulseHoverContent>` on the action's `hoverContent`
+ * so every surface (top-bar, compact "Plus" rows, puzzle menu, collapsed
+ * sidebar) shows the status detail on hover.
+ */
+export type RealtimeStatus = 'connected' | 'connecting' | 'error' | 'closed' | 'offline';
+export interface RealtimePulseStrings {
+    connected: string;
+    connecting: string;
+    error: string;
+    closed: string;
+    offline: string;
+    lastUpdate: string;
+}
+/**
+ * French strings — built on top of the Stencil app's `mqttErrorStatusOk` /
+ * `mqttErrorStatus` wording (`assets/i18n/fr.json`) but specialized per
+ * state. The legacy SaaS only had two messages because its MQTT class
+ * exposed binary OK/error; the React port keeps the full five-state
+ * lifecycle so users see what's actually happening (in-flight reconnect
+ * vs. broker error vs. clean close vs. no network).
+ */
+export declare const DEFAULT_REALTIME_STRINGS_FR: RealtimePulseStrings;
+/**
+ * English equivalents.
+ */
+export declare const DEFAULT_REALTIME_STRINGS_EN: RealtimePulseStrings;
+export declare function RealtimePulseIcon({ status, className }: {
+    status: RealtimeStatus;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Hover-info content rendered in a HoverCard. Pair with the icon via
+ * `ShellAction.hoverContent` so the framework wraps every surface in a
+ * HoverCard automatically.
+ */
+export declare function RealtimePulseHoverContent({ status, lastUpdate, strings, }: {
+    status: RealtimeStatus;
+    lastUpdate?: string;
+    strings?: RealtimePulseStrings;
+}): ReactNode;

package/dist/components/tooltip.d.ts

@@ -0,0 +1,14 @@
+import { Tooltip as TooltipPrimitive } from 'radix-ui';
+import * as React from 'react';
+/**
+ * Tooltip — shadcn/ui (added via `npx shadcn@latest add tooltip`),
+ * customized for the s3pweb shell to match the SaaS app's tooltip:
+ *   - light popover surface (bg-popover / text-popover-foreground / border)
+ *     instead of shadcn's default dark inverted tooltip
+ *   - no arrow
+ */
+declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>): import("react/jsx-runtime").JSX.Element;
+declare function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/dist/components/user-menu.d.ts

@@ -0,0 +1,36 @@
+import { ReactNode } from 'react';
+/**
+ * UserMenu — list-of-items menu intended to live inside the click-Popover
+ * anchored on the avatar (via `Shell.userMenu`). Each row uses
+ * `<PopoverClose asChild>` so a click both dismisses the menu AND runs the
+ * row's action (or follows its `href`).
+ *
+ * Items adopt the brand theme automatically via `text-muted-foreground
+ * hover:bg-primary/10 hover:text-primary` — the same palette the collapsed-
+ * group fly-out items use, so the UserMenu reads as part of the same family.
+ *
+ * Items with `tone: 'danger'` paint in the destructive palette
+ * (`text-destructive hover:bg-destructive/10`). Items with `dividerBefore`
+ * render a 1px separator above them — handy to set off the logout row.
+ */
+export interface UserMenuItem {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    /** Click handler. Fires alongside any `href` navigation. */
+    onClick?: () => void;
+    /** When set, the row renders as `<a target='_blank' href>` so the link opens in a new tab. */
+    href?: string;
+    /** Visual tone: 'default' (muted-foreground + primary hover) | 'danger' (destructive). Default 'default'. */
+    tone?: 'default' | 'danger';
+    /** Draw a 1px separator above this row. */
+    dividerBefore?: boolean;
+    /** Disable the row (cursor:not-allowed, no hover, onClick ignored). */
+    disabled?: boolean;
+}
+export interface UserMenuProps {
+    items: UserMenuItem[];
+    /** Extra Tailwind classes on the menu root — override width/padding as needed. */
+    className?: string;
+}
+export declare function UserMenu({ items, className }: UserMenuProps): import("react/jsx-runtime").JSX.Element;

package/dist/i18n.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Built-in translations for shell-ui's chrome (sidebar collapse, theme toggle,
+ * nav-mode toggle, logout). Consumers pass a `locale` prop to <Shell> and the
+ * component picks the right strings — no need to wire up an external i18n
+ * library just to label four buttons.
+ */
+export type ShellLocale = 'fr' | 'en';
+export interface ShellStrings {
+    collapse: string;
+    expand: string;
+    logout: string;
+    themeDarkMode: string;
+    themeLightMode: string;
+    navUseTop: string;
+    navUseSidebar: string;
+    moreLabel: string;
+}
+export declare function getShellStrings(locale?: ShellLocale): ShellStrings;

package/dist/index.d.ts

@@ -0,0 +1,14 @@
+export { Shell, type ShellProps } from './shell';
+export { Sidebar, SidebarItems, type SidebarProps, type SidebarItemsProps, type SidebarUser, type RenderCollapsedTooltip } from './sidebar';
+export { type ShellLocale, type ShellStrings } from './i18n';
+export { isNavGroup, type NavItem, type NavGroup, type NavEntry, type ShellAction } from './types';
+export { HoverCard, HoverCardTrigger, HoverCardContent } from './components/hover-card';
+export { Popover, PopoverTrigger, PopoverAnchor, PopoverClose, PopoverContent } from './components/popover';
+export { PartnerCluster, PartnerTile, tintColor, svgMark, type Partner, type PartnerClusterProps, type PartnerTileProps } from './components/partner-cluster';
+export { EcosystemMegaPanel, type EcosystemMegaPanelProps } from './components/ecosystem-mega-panel';
+export { UserMenu, type UserMenuItem, type UserMenuProps } from './components/user-menu';
+export { LayoutSwitcher, LayoutNumberIcon, type LayoutSwitcherProps } from './components/layout-switcher';
+export { useActionsMenu, ActionsMenuPanel, type UseActionsMenuOptions, type UseActionsMenuReturn, type ActionsMenuPanelProps } from './components/actions-menu';
+export { RealtimePulseIcon, RealtimePulseHoverContent, DEFAULT_REALTIME_STRINGS_FR, DEFAULT_REALTIME_STRINGS_EN, type RealtimeStatus, type RealtimePulseStrings, } from './components/realtime-pulse';
+export { POPOVER_GAP, SIDEBAR_OFFSET, TOPBAR_OFFSET } from './lib/popover-offsets';
+export { useMediaQuery } from './lib/use-media-query';