@robosystems/core 0.3.0

package/theme/index.d.ts

@@ -0,0 +1 @@
+export { customTheme } from './flowbite-theme';

package/theme/index.js

@@ -0,0 +1 @@
+export { customTheme } from './flowbite-theme';

package/types/entity.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Entity interface - represents an Entity node in the graph
+ * Entity is a base node type that can represent companies, subsidiaries, or other business entities
+ */
+export interface Entity {
+  identifier: string
+  name: string
+  entityType?: string // Entity type: 'corporation', 'llc', 'partnership', etc.
+  parentEntityId?: string | null
+  isParent?: boolean | null
+  [key: string]: any
+}
+
+/**
+ * Collection of entities
+ */
+export interface Entities {
+  entities: Entity[]
+}

package/types/index.d.ts

@@ -0,0 +1,2 @@
+export type { Entities, Entity } from './entity.d';
+export type { User } from './user.d';

package/types/index.js

@@ -0,0 +1 @@
+export {};

package/types/user.d.ts

@@ -0,0 +1,6 @@
+export interface User {
+  id: string
+  name: string
+  email: string
+  emailVerified?: boolean
+}

package/ui-components/ConfirmModal.d.ts

@@ -0,0 +1,41 @@
+import type { ComponentType, ReactNode } from 'react';
+interface ConfirmModalProps {
+    /** Whether the modal is open. */
+    show: boolean;
+    /** Dismiss handler (Cancel button + backdrop/close). Ignored while `loading`. */
+    onClose: () => void;
+    /** Invoked when the confirm button is pressed. */
+    onConfirm: () => void;
+    /** Header title, e.g. "Delete Document". */
+    title: string;
+    /** Body content — the warning copy and/or item details. */
+    children?: ReactNode;
+    /** Confirm button label (default "Delete"). */
+    confirmLabel?: string;
+    /** Confirm button label shown while `loading` (default "Deleting…"). */
+    loadingLabel?: string;
+    /** Optional icon on the confirm button, e.g. `HiTrash`. */
+    confirmIcon?: ComponentType<{
+        className?: string;
+        'aria-hidden'?: boolean | 'true';
+    }>;
+    /** Confirm button color (default "failure"). */
+    confirmColor?: string;
+    /** Cancel button label (default "Cancel"). */
+    cancelLabel?: string;
+    /** When true, disables both buttons and shows a spinner in the confirm button. */
+    loading?: boolean;
+    /** Modal size (default "md"). */
+    size?: string;
+}
+/**
+ * A confirmation dialog for a single irreversible action (delete, etc.). Owns
+ * the modal chrome and the Cancel / Confirm buttons — including the
+ * disabled-while-pending and confirm-button-spinner behavior — while the caller
+ * supplies the warning copy and any item details as `children`.
+ *
+ * The caller drives the async flow: pass `loading` while the action runs (the
+ * dialog can't be dismissed during it), and close the modal in your handler.
+ */
+export declare function ConfirmModal({ show, onClose, onConfirm, title, children, confirmLabel, loadingLabel, confirmIcon: ConfirmIcon, confirmColor, cancelLabel, loading, size, }: ConfirmModalProps): import("react").JSX.Element;
+export {};

package/ui-components/ConfirmModal.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Modal, ModalBody, ModalFooter, ModalHeader, } from 'flowbite-react';
+import { Spinner } from './Spinner';
+/**
+ * A confirmation dialog for a single irreversible action (delete, etc.). Owns
+ * the modal chrome and the Cancel / Confirm buttons — including the
+ * disabled-while-pending and confirm-button-spinner behavior — while the caller
+ * supplies the warning copy and any item details as `children`.
+ *
+ * The caller drives the async flow: pass `loading` while the action runs (the
+ * dialog can't be dismissed during it), and close the modal in your handler.
+ */
+export function ConfirmModal({ show, onClose, onConfirm, title, children, confirmLabel = 'Delete', loadingLabel = 'Deleting…', confirmIcon: ConfirmIcon, confirmColor = 'failure', cancelLabel = 'Cancel', loading = false, size = 'md', }) {
+    const handleClose = () => {
+        if (!loading)
+            onClose();
+    };
+    return (_jsxs(Modal, { show: show, onClose: handleClose, size: size, children: [_jsx(ModalHeader, { children: title }), _jsx(ModalBody, { children: children }), _jsxs(ModalFooter, { children: [_jsx(Button, { color: confirmColor, onClick: onConfirm, disabled: loading, children: loading ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { size: "sm", className: "mr-2 text-white" }), loadingLabel] })) : (_jsxs(_Fragment, { children: [ConfirmIcon && (_jsx(ConfirmIcon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" })), confirmLabel] })) }), _jsx(Button, { color: "gray", onClick: handleClose, disabled: loading, children: cancelLabel })] })] }));
+}

package/ui-components/EmptyState.d.ts

@@ -0,0 +1,22 @@
+import type { ComponentType, ReactNode } from 'react';
+interface EmptyStateProps {
+    /** Icon shown above the title — typically a react-icons `Hi*` component. */
+    icon: ComponentType<{
+        className?: string;
+        'aria-hidden'?: boolean | 'true';
+    }>;
+    title: string;
+    /** Supporting copy below the title. Inline content only (rendered in a block). */
+    description?: ReactNode;
+    /** Optional call-to-action (e.g. a "Create…" button) shown below. */
+    action?: ReactNode;
+    /** Override the container spacing (default `py-12`). */
+    className?: string;
+}
+/**
+ * The shared empty state: a muted icon, a title, an optional description, and an
+ * optional action — centered. Render it inside whatever container the page uses
+ * (often a `<Card>`); this component is just the centered inner block.
+ */
+export declare function EmptyState({ icon: Icon, title, description, action, className, }: EmptyStateProps): import("react").JSX.Element;
+export {};

package/ui-components/EmptyState.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { twMerge } from 'tailwind-merge';
+/**
+ * The shared empty state: a muted icon, a title, an optional description, and an
+ * optional action — centered. Render it inside whatever container the page uses
+ * (often a `<Card>`); this component is just the centered inner block.
+ */
+export function EmptyState({ icon: Icon, title, description, action, className, }) {
+    return (_jsxs("div", { className: twMerge('py-12 text-center', className), children: [_jsx(Icon, { className: "mx-auto h-12 w-12 text-gray-400", "aria-hidden": "true" }), _jsx("h3", { className: "mt-2 text-sm font-medium text-gray-900 dark:text-white", children: title }), description && (_jsx("div", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: description })), action && _jsx("div", { className: "mt-6", children: action })] }));
+}

package/ui-components/LoadingState.d.ts

@@ -0,0 +1,27 @@
+import type { ComponentProps } from 'react';
+import { Spinner } from './Spinner';
+interface LoadingStateProps {
+    /** Optional message shown below the spinner, e.g. "Loading dashboard…". */
+    message?: string;
+    /** Spinner size. Defaults to `lg`. */
+    size?: ComponentProps<typeof Spinner>['size'];
+    /**
+     * Override the container's spacing/height. The default is `py-12` (a compact
+     * in-content load); pass e.g. `className="h-64"` for a taller reserved area
+     * or `className="min-h-screen"` to fill the viewport.
+     */
+    className?: string;
+    /**
+     * Accessible label for screen readers. Defaults to `message` (or "Loading"
+     * when neither is provided).
+     */
+    'aria-label'?: string;
+}
+/**
+ * The shared content-area loader: a spinner with an optional message below,
+ * centered with vertical padding. Use for section / page-content loads. For a
+ * full-page shell use `<Spinner fullScreen>` / `<BrandSpinner fullScreen>`; for
+ * inline button loading use a bare `<Spinner size="sm">`.
+ */
+export declare function LoadingState({ message, size, className, 'aria-label': ariaLabel, }: LoadingStateProps): import("react").JSX.Element;
+export {};

package/ui-components/LoadingState.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { twMerge } from 'tailwind-merge';
+import { Spinner } from './Spinner';
+/**
+ * The shared content-area loader: a spinner with an optional message below,
+ * centered with vertical padding. Use for section / page-content loads. For a
+ * full-page shell use `<Spinner fullScreen>` / `<BrandSpinner fullScreen>`; for
+ * inline button loading use a bare `<Spinner size="sm">`.
+ */
+export function LoadingState({ message, size = 'lg', className, 'aria-label': ariaLabel, }) {
+    return (_jsxs("div", { className: twMerge('flex flex-col items-center justify-center gap-3 py-12', className), children: [_jsx(Spinner, { size: size, "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : message }), message && (_jsx("p", { className: "text-sm text-gray-500 dark:text-gray-400", children: message }))] }));
+}

package/ui-components/Logo.d.ts

@@ -0,0 +1,28 @@
+import type { AppName } from '../auth-core/types';
+export interface AnimatedLogoProps {
+    className?: string;
+    animate?: 'once' | 'loop';
+    app?: AppName;
+    /**
+     * Render the mark in the app's brand color instead of the inherited text
+     * color. Use for cross-app identity (e.g. the AppSwitcher, foreign-app marks)
+     * and branded auth screens. Defaults to false so existing monochrome usages
+     * (navbar, spinner, search) are unaffected.
+     */
+    brand?: boolean;
+}
+export declare function AnimatedLogo({ className, animate, app, brand, }: AnimatedLogoProps): import("react").JSX.Element;
+export interface LogoBadgeProps {
+    app?: AppName;
+    animate?: 'once' | 'loop';
+    /** Sizing/utility classes for the chip, e.g. `h-10 w-10`. */
+    className?: string;
+}
+/**
+ * The mark rendered as an app-icon: a white AnimatedLogo on the app's
+ * brand-gradient rounded chip. At small/icon sizes this reads far crisper than
+ * a brand-colored mark on a dark background, and it surfaces the brand color as
+ * a background element. Cross-app safe — renders the correct gradient for any
+ * `app` from inside any app, so the AppSwitcher shows three distinct chips.
+ */
+export declare function LogoBadge({ app, animate, className, }: LogoBadgeProps): import("react").JSX.Element;

package/ui-components/Logo.js

@@ -0,0 +1,95 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useId } from 'react';
+import { twMerge } from 'tailwind-merge';
+import { BRAND_COLORS, BRAND_GRADIENTS, CURRENT_APP } from '../auth-core/config';
+/* Graph nodes (shared across all three logos) */
+function GraphNodes() {
+    return (_jsxs("g", { transform: "matrix(2.49868,0,0,2.59811,-747.255,-135.521)", children: [_jsx("g", { transform: "matrix(0.517664,0.499902,-1.04482,1.08194,387.843,-253.483)", children: _jsx("rect", { x: "451.017", y: "150.798", width: "53.143", height: "13.689" }) }), _jsx("g", { transform: "matrix(-5.28647e-17,-0.5334,1.60446,-4.68862e-17,255.339,491.11)", children: _jsx("rect", { x: "451.017", y: "150.798", width: "53.143", height: "13.689" }) }), _jsx("g", { transform: "matrix(0.549336,-0.58909,1.13654,1.05985,100.455,264.271)", children: _jsx("rect", { x: "451.017", y: "150.798", width: "53.143", height: "13.689" }) }), _jsx("g", { transform: "matrix(1,0,0,1.05096,177.322,-5.45629)", children: _jsx("path", { d: "M250.672,80.255C272.88,80.255 290.91,97.31 290.91,118.316C290.91,139.322 272.88,156.376 250.672,156.376C228.464,156.376 210.433,139.322 210.433,118.316C210.433,97.31 228.464,80.255 250.672,80.255ZM250.672,99.286C261.776,99.286 270.791,107.813 270.791,118.316C270.791,128.819 261.776,137.346 250.672,137.346C239.568,137.346 230.553,128.819 230.553,118.316C230.553,107.813 239.568,99.286 250.672,99.286Z" }) }), _jsx("g", { transform: "matrix(0.869818,0,0,0.919587,289.117,82.161)", children: _jsx("path", { d: "M250.672,80.255C272.88,80.255 290.91,97.31 290.91,118.316C290.91,139.322 272.88,156.376 250.672,156.376C228.464,156.376 210.433,139.322 210.433,118.316C210.433,97.31 228.464,80.255 250.672,80.255ZM250.672,99.286C261.776,99.286 270.791,107.813 270.791,118.316C270.791,128.819 261.776,137.346 250.672,137.346C239.568,137.346 230.553,128.819 230.553,118.316C230.553,107.813 239.568,99.286 250.672,99.286Z" }) }), _jsx("g", { transform: "matrix(1,0,0,1.05096,331.465,-18.1536)", children: _jsx("path", { d: "M250.672,80.255C272.88,80.255 290.91,97.31 290.91,118.316C290.91,139.322 272.88,156.376 250.672,156.376C228.464,156.376 210.433,139.322 210.433,118.316C210.433,97.31 228.464,80.255 250.672,80.255ZM250.672,99.286C261.776,99.286 270.791,107.813 270.791,118.316C270.791,128.819 261.776,137.346 250.672,137.346C239.568,137.346 230.553,128.819 230.553,118.316C230.553,107.813 239.568,99.286 250.672,99.286Z" }) })] }));
+}
+/* Shared book structure elements */
+function BookBase() {
+    return (_jsxs(_Fragment, { children: [_jsx("g", { transform: "matrix(1.11678,0.257829,-0.100241,0.43419,24.5867,227.367)", children: _jsx("path", { d: "M494.703,576.843L494.703,600.541C494.703,613.235 490.553,623.542 485.443,623.542L347.276,623.542C342.165,623.542 338.016,613.235 338.016,600.541L338.016,576.843C338.016,564.149 342.165,553.843 347.276,553.843L485.443,553.843C490.553,553.843 494.703,564.149 494.703,576.843Z" }) }), _jsx("g", { transform: "matrix(6.90144e-17,-1.14962,0.464321,-2.15344e-17,77.8997,1125.4)", children: _jsx("path", { d: "M494.703,588.692C494.703,607.926 488.637,623.542 481.166,623.542L351.553,623.542C344.082,623.542 338.016,607.926 338.016,588.692C338.016,569.458 344.082,553.843 351.553,553.843L481.166,553.843C488.637,553.843 494.703,569.458 494.703,588.692Z" }) }), _jsx("g", { transform: "matrix(6.88291e-17,-1.14663,0.464321,-2.14054e-17,388.521,1125.53)", children: _jsx("path", { d: "M494.703,588.692C494.703,607.926 488.621,623.542 481.131,623.542L351.588,623.542C344.098,623.542 338.016,607.926 338.016,588.692C338.016,569.458 344.098,553.843 351.588,553.843L481.131,553.843C488.621,553.843 494.703,569.458 494.703,588.692Z" }) }), _jsx("g", { transform: "matrix(1.12437,0.301274,-0.118553,0.442447,31.5589,355.851)", children: _jsx("path", { d: "M494.703,571.267L494.703,606.117C494.703,615.734 491.525,623.542 487.612,623.542L345.107,623.542C341.193,623.542 338.016,615.734 338.016,606.117L338.016,571.267C338.016,561.65 341.193,553.843 345.107,553.843L487.612,553.843C491.525,553.843 494.703,561.65 494.703,571.267Z" }) }), _jsx("g", { transform: "matrix(1.08457,-0.29061,0.117114,0.437076,64.1786,606.532)", children: _jsx("path", { d: "M494.703,571.267L494.703,606.117C494.703,615.734 491.449,623.542 487.441,623.542L345.278,623.542C341.27,623.542 338.016,615.734 338.016,606.117L338.016,571.267C338.016,561.65 341.27,553.843 345.278,553.843L487.441,553.843C491.449,553.843 494.703,561.65 494.703,571.267Z" }) }), _jsx("g", { transform: "matrix(1.11035,-0.256345,0.0986939,0.42749,65.4073,446.414)", children: _jsx("path", { d: "M494.703,585.207L494.703,592.177C494.703,609.488 489.1,623.542 482.198,623.542L350.521,623.542C343.619,623.542 338.016,609.488 338.016,592.177L338.016,585.207C338.016,567.897 343.619,553.843 350.521,553.843L482.198,553.843C489.1,553.843 494.703,567.897 494.703,585.207Z" }) })] }));
+}
+/* RoboInvestor: bar chart animation */
+function InvestorBook({ animate }) {
+    const isOnce = animate === 'once';
+    const animName = isOnce ? 'barIntro' : 'barWave';
+    const iteration = isOnce ? '1' : 'infinite';
+    const fillMode = isOnce ? 'forwards' : 'none';
+    return (_jsxs(_Fragment, { children: [_jsx("style", { children: `
+        .ri-bar {
+          transform-box: fill-box;
+          transform-origin: 0% 50%;
+          animation: ${animName} 1.4s ease-in-out ${iteration} ${fillMode};
+        }
+        .ri-bar-1 { animation-delay: 0s; }
+        .ri-bar-2 { animation-delay: 0.15s; }
+        .ri-bar-3 { animation-delay: 0.3s; }
+        @keyframes barWave {
+          0%, 100% { transform: scaleX(0.3); }
+          50% { transform: scaleX(1); }
+        }
+        @keyframes barIntro {
+          0% { transform: scaleX(0.3); }
+          60% { transform: scaleX(1.1); }
+          100% { transform: scaleX(1); }
+        }
+      ` }), _jsxs("g", { transform: "matrix(2.49868,0,0,2.59811,-751.016,-1032.21)", children: [_jsx(BookBase, {}), _jsx("g", { transform: "matrix(-1.05969e-17,-0.395984,0.462394,-0.00760872,191.313,902.146)", children: _jsx("g", { className: "ri-bar ri-bar-1", children: _jsx("path", { d: "M494.703,576.843L494.703,600.541C494.703,613.235 483.129,623.542 468.873,623.542L363.846,623.542C349.59,623.542 338.016,613.235 338.016,600.541L338.016,576.843C338.016,564.149 349.59,553.843 363.846,553.843L468.873,553.843C483.129,553.843 494.703,564.149 494.703,576.843Z" }) }) }), _jsx("g", { transform: "matrix(-4.01651e-17,-0.572815,0.462394,-0.00760872,236.173,953.952)", children: _jsx("g", { className: "ri-bar ri-bar-2", children: _jsx("path", { d: "M494.703,576.843L494.703,600.541C494.703,613.235 486.702,623.542 476.846,623.542L355.872,623.542C346.017,623.542 338.016,613.235 338.016,600.541L338.016,576.843C338.016,564.149 346.017,553.843 355.872,553.843L476.846,553.843C486.702,553.843 494.703,564.149 494.703,576.843Z" }) }) }), _jsx("g", { transform: "matrix(-8.47906e-17,-0.839696,0.462394,-0.00760872,281.533,1053.03)", children: _jsx("g", { className: "ri-bar ri-bar-3", children: _jsx("path", { d: "M494.703,576.843L494.703,600.541C494.703,613.235 489.245,623.542 482.522,623.542L350.197,623.542C343.474,623.542 338.016,613.235 338.016,600.541L338.016,576.843C338.016,564.149 343.474,553.843 350.197,553.843L482.522,553.843C489.245,553.843 494.703,564.149 494.703,576.843Z" }) }) }), _jsx("g", { transform: "matrix(-1.89816e-17,-0.22431,0.431709,1.61811e-17,255.945,699.671)", children: _jsx("path", { d: "M494.703,588.692C494.703,607.926 465.799,623.542 430.198,623.542L402.521,623.542C366.92,623.542 338.016,607.926 338.016,588.692C338.016,569.458 366.92,553.843 402.521,553.843L430.198,553.843C465.799,553.843 494.703,569.458 494.703,588.692Z" }) })] })] }));
+}
+/* RoboLedger: T-account eyes wink */
+function LedgerBook({ animate }) {
+    const isOnce = animate === 'once';
+    const iteration = isOnce ? '1' : 'infinite';
+    const fillMode = isOnce ? 'forwards' : 'none';
+    return (_jsxs(_Fragment, { children: [_jsx("style", { children: `
+        .rl-eye-l {
+          animation: ${isOnce ? 'winkIntroL' : 'winkL'} ${isOnce ? '1.2s' : '2s'} ease-in-out ${iteration} ${fillMode};
+        }
+        .rl-eye-r {
+          animation: ${isOnce ? 'winkIntroR' : 'winkR'} ${isOnce ? '1.2s' : '2s'} ease-in-out ${iteration} ${fillMode};
+        }
+        @keyframes winkL {
+          0%, 15%, 30%, 100% { opacity: 1; }
+          5%, 12% { opacity: 0; }
+        }
+        @keyframes winkR {
+          0%, 45%, 65%, 100% { opacity: 1; }
+          50%, 60% { opacity: 0; }
+        }
+        @keyframes winkIntroL {
+          0% { opacity: 0; }
+          30% { opacity: 1; }
+          45% { opacity: 0; }
+          60%, 100% { opacity: 1; }
+        }
+        @keyframes winkIntroR {
+          0% { opacity: 0; }
+          50% { opacity: 1; }
+          65% { opacity: 0; }
+          80%, 100% { opacity: 1; }
+        }
+      ` }), _jsxs("g", { transform: "matrix(2.49868,0,0,2.59811,-751.016,-1032.21)", children: [_jsx(BookBase, {}), _jsx("g", { transform: "matrix(4.36382e-17,-1.20783,0.431709,-2.43413e-17,255.145,1185.07)", children: _jsx("path", { d: "M494.703,576.843L494.703,600.541C494.703,613.235 491.16,623.542 486.796,623.542L345.922,623.542C341.559,623.542 338.016,613.235 338.016,600.541L338.016,576.843C338.016,564.149 341.559,553.843 345.922,553.843L486.796,553.843C491.16,553.843 494.703,564.149 494.703,576.843Z" }) }), _jsx("g", { transform: "matrix(0.555228,-0.128184,0.0544276,0.235752,324.508,560.439)", children: _jsx("g", { className: "rl-eye-l", children: _jsx("path", { d: "M494.703,588.218L494.703,589.166C494.703,608.138 487.93,623.542 479.588,623.542L353.131,623.542C344.789,623.542 338.016,608.138 338.016,589.166L338.016,588.218C338.016,569.246 344.789,553.843 353.131,553.843L479.588,553.843C487.93,553.843 494.703,569.246 494.703,588.218Z" }) }) }), _jsx("g", { transform: "matrix(0.555228,0.128184,-0.0544276,0.235752,231.691,453.111)", children: _jsx("g", { className: "rl-eye-r", children: _jsx("path", { d: "M494.703,588.218L494.703,589.166C494.703,608.138 487.93,623.542 479.588,623.542L353.131,623.542C344.789,623.542 338.016,608.138 338.016,589.166L338.016,588.218C338.016,569.246 344.789,553.843 353.131,553.843L479.588,553.843C487.93,553.843 494.703,569.246 494.703,588.218Z" }) }) })] })] }));
+}
+/* RoboSystems: infinity S with segment tracing the figure-8 */
+function SystemsBook({ animate }) {
+    const isOnce = animate === 'once';
+    // Unique per instance so two RoboSystems logos on one page don't share a
+    // global mask id (which would break the second logo's trace animation).
+    const maskId = `rs-trace-${useId().replace(/:/g, '')}`;
+    const motionPath = 'M 16,16 C 22,8 32,10 30,16 C 28,22 22,24 16,16 C 10,8 0,10 2,16 C 4,22 10,24 16,16';
+    const infinityPath = 'M0,16C0,17.664 0.405,19.2 1.216,20.608C2.027,22.016 3.136,23.125 4.544,23.936C5.952,24.747 7.488,25.152 9.152,25.152C10.155,25.152 11.179,24.96 12.224,24.576C11.243,23.36 10.485,22.005 9.952,20.512C9.589,20.555 9.323,20.576 9.152,20.576C7.893,20.576 6.816,20.128 5.92,19.232C5.024,18.336 4.576,17.259 4.576,16C4.576,14.741 5.024,13.664 5.92,12.768C6.816,11.872 7.893,11.424 9.152,11.424C10.411,11.424 11.488,11.872 12.384,12.768C13.28,13.664 13.728,14.741 13.728,16C13.728,17.664 14.133,19.2 14.944,20.608C15.755,22.016 16.864,23.125 18.272,23.936C19.68,24.747 21.205,25.152 22.848,25.152C24.491,25.152 26.027,24.747 27.456,23.936C28.885,23.125 29.995,22.016 30.784,20.608C31.573,19.2 31.979,17.664 32,16C32.021,14.336 31.616,12.811 30.784,11.424C29.952,10.037 28.843,8.928 27.456,8.096C26.069,7.264 24.533,6.859 22.848,6.88C21.845,6.88 20.821,7.061 19.776,7.424C20.757,8.64 21.515,10.005 22.048,11.52C22.411,11.456 22.677,11.424 22.848,11.424C24.107,11.424 25.184,11.872 26.08,12.768C26.976,13.664 27.424,14.741 27.424,16C27.424,17.28 26.976,18.368 26.08,19.264C25.184,20.16 24.107,20.597 22.848,20.576C21.589,20.576 20.512,20.139 19.616,19.264C18.72,18.389 18.272,17.301 18.272,16C18.272,14.357 17.867,12.832 17.056,11.424C16.245,10.016 15.136,8.907 13.728,8.096C12.32,7.285 10.795,6.88 9.152,6.88C7.509,6.88 5.973,7.285 4.544,8.096C3.115,8.907 2.005,10.016 1.216,11.424C0.427,12.832 0.021,14.357 -0,16Z';
+    return (_jsxs(_Fragment, { children: [_jsxs("g", { transform: "matrix(2.49868,0,0,2.59811,-751.016,-1032.21)", children: [_jsx(BookBase, {}), _jsx("g", { transform: "matrix(-1.89816e-17,-0.22431,0.431709,1.61811e-17,255.945,699.671)", children: _jsx("path", { d: "M494.703,588.692C494.703,607.926 465.799,623.542 430.198,623.542L402.521,623.542C366.92,623.542 338.016,607.926 338.016,588.692C338.016,569.458 366.92,553.843 402.521,553.843L430.198,553.843C465.799,553.843 494.703,569.458 494.703,588.692Z" }) })] }), _jsxs("g", { transform: "matrix(12.8263,0,0,13.3096,313.735,516.868)", children: [_jsx("path", { d: infinityPath, fillRule: "nonzero", children: isOnce ? (_jsx("animate", { attributeName: "opacity", values: "1;0.15;0.15;1", keyTimes: "0;0.1;0.8;1", dur: "1.4s", fill: "freeze" })) : (_jsx("animate", { attributeName: "opacity", values: "1;0.15", dur: "0.3s", fill: "freeze" })) }), _jsx("defs", { children: _jsxs("mask", { id: maskId, maskUnits: "userSpaceOnUse", x: "-2", y: "5", width: "36", height: "22", children: [_jsx("rect", { x: "-2", y: "5", width: "36", height: "22", fill: "black" }), _jsx("circle", { r: "8", fill: "white", children: _jsx("animateMotion", { dur: isOnce ? '1.4s' : '1.2s', repeatCount: isOnce ? '1' : 'indefinite', fill: "freeze", path: motionPath }) })] }) }), _jsx("path", { d: infinityPath, mask: `url(#${maskId})`, fillRule: "nonzero" })] })] }));
+}
+export function AnimatedLogo({ className, animate = 'loop', app = CURRENT_APP, brand = false, }) {
+    return (_jsxs("svg", { viewBox: "0 0 1024 1024", fill: "currentColor", className: className, style: brand ? { color: BRAND_COLORS[app] } : undefined, role: "img", "aria-label": "Loading", fillRule: "evenodd", clipRule: "evenodd", shapeRendering: "geometricPrecision", children: [app === 'roboinvestor' && _jsx(InvestorBook, { animate: animate }), app === 'roboledger' && _jsx(LedgerBook, { animate: animate }), app === 'robosystems' && _jsx(SystemsBook, { animate: animate }), _jsx(GraphNodes, {})] }));
+}
+/**
+ * The mark rendered as an app-icon: a white AnimatedLogo on the app's
+ * brand-gradient rounded chip. At small/icon sizes this reads far crisper than
+ * a brand-colored mark on a dark background, and it surfaces the brand color as
+ * a background element. Cross-app safe — renders the correct gradient for any
+ * `app` from inside any app, so the AppSwitcher shows three distinct chips.
+ */
+export function LogoBadge({ app = CURRENT_APP, animate = 'once', className, }) {
+    return (_jsx("span", { className: twMerge('inline-flex shrink-0 items-center justify-center rounded-xl', className), style: { background: BRAND_GRADIENTS[app] }, children: _jsx(AnimatedLogo, { app: app, animate: animate, className: "h-[68%] w-[68%] text-white" }) }));
+}

package/ui-components/Spinner.d.ts

@@ -0,0 +1,37 @@
+import type { AppName } from '../auth-core/types';
+type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+interface SpinnerProps {
+    size?: SpinnerSize;
+    className?: string;
+    fullScreen?: boolean;
+    /** Accessible label for screen readers. Defaults to "Loading". */
+    'aria-label'?: string;
+}
+/**
+ * The default app-wide loading indicator: a clean, brand-colored spinning ring.
+ *
+ * The ring color follows `currentColor` (defaults to the brand `primary`), so
+ * on a brand-filled surface like a `Button` you override it with the text
+ * color, e.g. `className="text-white"`. For high-impact, brand-centric loads
+ * (full-page shells, auth, major transitions) use `BrandSpinner` instead.
+ */
+export declare function Spinner({ size, className, fullScreen, 'aria-label': ariaLabel, }: SpinnerProps): import("react").JSX.Element;
+interface BrandSpinnerProps {
+    size?: SpinnerSize;
+    className?: string;
+    fullScreen?: boolean;
+    app?: AppName;
+    /** Accessible label for screen readers. Defaults to "Loading". */
+    'aria-label'?: string;
+}
+/**
+ * High-impact, brand-centric loader: the app's animated logo, looping. Use
+ * sparingly — full-page initial loads, auth screens, major transitions — where
+ * the brand moment earns its keep. For routine button / inline / page loading,
+ * use the plain `Spinner`.
+ *
+ * Note: a given `size` renders LARGER here than on `Spinner` (the logo needs
+ * more visual weight to read) — e.g. `lg` is 80px vs the ring's 48px.
+ */
+export declare function BrandSpinner({ size, className, fullScreen, app, 'aria-label': ariaLabel, }: BrandSpinnerProps): import("react").JSX.Element;
+export {};

package/ui-components/Spinner.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { twMerge } from 'tailwind-merge';
+import { CURRENT_APP } from '../auth-core/config';
+import { AnimatedLogo } from './Logo';
+// Border width scales with diameter so the ring stays visually proportional.
+const ringSizeClasses = {
+    xs: 'h-3.5 w-3.5 border-2',
+    sm: 'h-5 w-5 border-2',
+    md: 'h-8 w-8 border-[3px]',
+    lg: 'h-12 w-12 border-4',
+    xl: 'h-16 w-16 border-4',
+};
+/**
+ * The default app-wide loading indicator: a clean, brand-colored spinning ring.
+ *
+ * The ring color follows `currentColor` (defaults to the brand `primary`), so
+ * on a brand-filled surface like a `Button` you override it with the text
+ * color, e.g. `className="text-white"`. For high-impact, brand-centric loads
+ * (full-page shells, auth, major transitions) use `BrandSpinner` instead.
+ */
+export function Spinner({ size = 'md', className = '', fullScreen = false, 'aria-label': ariaLabel = 'Loading', }) {
+    const ring = (_jsx("span", { role: "status", "aria-label": ariaLabel, className: twMerge('text-primary-600 dark:text-primary-500 inline-block animate-spin rounded-full border-current border-t-transparent', ringSizeClasses[size], className) }));
+    if (!fullScreen)
+        return ring;
+    return (_jsx("div", { className: "flex min-h-screen items-center justify-center bg-zinc-50 dark:bg-black", children: ring }));
+}
+const logoSizeClasses = {
+    xs: 'h-6 w-6',
+    sm: 'h-8 w-8',
+    md: 'h-12 w-12',
+    lg: 'h-20 w-20',
+    xl: 'h-32 w-32',
+};
+/**
+ * High-impact, brand-centric loader: the app's animated logo, looping. Use
+ * sparingly — full-page initial loads, auth screens, major transitions — where
+ * the brand moment earns its keep. For routine button / inline / page loading,
+ * use the plain `Spinner`.
+ *
+ * Note: a given `size` renders LARGER here than on `Spinner` (the logo needs
+ * more visual weight to read) — e.g. `lg` is 80px vs the ring's 48px.
+ */
+export function BrandSpinner({ size = 'lg', className = '', fullScreen = false, app = CURRENT_APP, 'aria-label': ariaLabel = 'Loading', }) {
+    const logo = (_jsx("span", { role: "status", "aria-label": ariaLabel, children: _jsx(AnimatedLogo, { animate: "loop", app: app, className: twMerge('text-black dark:text-white', logoSizeClasses[size], className) }) }));
+    if (!fullScreen)
+        return logo;
+    return (_jsx("div", { className: "flex min-h-screen items-center justify-center bg-zinc-50 dark:bg-black", children: logo }));
+}

package/ui-components/StatCard.d.ts

@@ -0,0 +1,21 @@
+import type { ComponentType, ReactNode } from 'react';
+interface StatCardProps {
+    /** Short muted label above the value, e.g. "Total Graphs". */
+    label: string;
+    /** The metric value — a formatted string/number (include any unit, e.g. "1.2 GB"). */
+    value: ReactNode;
+    /** Optional icon, rendered muted and right-aligned. */
+    icon?: ComponentType<{
+        className?: string;
+        'aria-hidden'?: boolean | 'true';
+    }>;
+    /** Extra classes forwarded to the Card wrapper (e.g. a column span). */
+    className?: string;
+}
+/**
+ * A dashboard stat tile: a muted label over a large bold value, in a Card.
+ * Drop several into a `grid` to form a metrics row. Pass an `icon` to get the
+ * value-left / icon-right layout.
+ */
+export declare function StatCard({ label, value, icon: Icon, className, }: StatCardProps): import("react").JSX.Element;
+export {};

package/ui-components/StatCard.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card } from 'flowbite-react';
+/**
+ * A dashboard stat tile: a muted label over a large bold value, in a Card.
+ * Drop several into a `grid` to form a metrics row. Pass an `icon` to get the
+ * value-left / icon-right layout.
+ */
+export function StatCard({ label, value, icon: Icon, className, }) {
+    return (_jsx(Card, { className: className, children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "text-sm font-medium text-gray-500 dark:text-gray-400", children: label }), _jsx("div", { className: "text-2xl font-bold text-gray-900 dark:text-white", children: value })] }), Icon && (_jsx(Icon, { className: "h-10 w-10 shrink-0 text-gray-300 dark:text-gray-600", "aria-hidden": "true" }))] }) }));
+}

package/ui-components/api-keys/ApiKeyDisplay.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface ApiKeyDisplayProps {
+    label: string;
+    value: string;
+    keyId?: string;
+    colorScheme?: 'blue' | 'green';
+    theme?: any;
+    className?: string;
+    onCopy?: () => void;
+    onReveal?: () => void;
+    onDownload?: () => void;
+}
+export declare const ApiKeyDisplay: React.FC<ApiKeyDisplayProps>;

package/ui-components/api-keys/ApiKeyDisplay.js

@@ -0,0 +1,7 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Label } from 'flowbite-react';
+import { SecureApiKeyField } from './SecureApiKeyField';
+export const ApiKeyDisplay = ({ label, value, keyId = 'api-key', theme, className = '', onCopy, onReveal, onDownload, }) => {
+    return (_jsxs("div", { className: className, children: [_jsx(Label, { theme: theme === null || theme === void 0 ? void 0 : theme.label, htmlFor: `display-${label}`, className: "text-base font-bold", children: label }), _jsx("div", { className: "mt-2", children: _jsx(SecureApiKeyField, { apiKey: value, keyId: keyId, keyName: label, onCopy: onCopy, onReveal: onReveal, onDownload: onDownload }) })] }));
+};

package/ui-components/api-keys/ApiKeyTable.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { ApiKey } from '../types';
+export interface ApiKeyTableProps {
+    apiKeys: ApiKey[];
+    onRevokeKey: (keyId: string) => void;
+    theme?: any;
+    formatDate?: (date: Date | string | null | undefined) => string;
+}
+export declare const ApiKeyTable: React.FC<ApiKeyTableProps>;

package/ui-components/api-keys/ApiKeyTable.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Dropdown, DropdownItem, Table, TableBody, TableCell, TableHead, TableHeadCell, TableRow, } from 'flowbite-react';
+import { HiCheckCircle, HiDotsVertical, HiExclamationCircle, HiKey, HiTrash, } from 'react-icons/hi';
+const defaultFormatDate = (date) => {
+    if (!date)
+        return 'Never';
+    return new Date(date).toLocaleDateString('en-US', {
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
+    });
+};
+export const ApiKeyTable = ({ apiKeys = [], onRevokeKey, theme, formatDate = defaultFormatDate, }) => {
+    // Defensive check to ensure apiKeys is always an array
+    const safeApiKeys = Array.isArray(apiKeys) ? apiKeys : [];
+    return (_jsx("div", { className: "overflow-x-auto", children: _jsxs(Table, { className: "table-fixed", children: [_jsxs(TableHead, { children: [_jsx(TableHeadCell, { className: "w-[40%]", children: "Name" }), _jsx(TableHeadCell, { className: "w-[15%] whitespace-nowrap", children: "Created" }), _jsx(TableHeadCell, { className: "w-[15%] whitespace-nowrap", children: "Last Used" }), _jsx(TableHeadCell, { className: "w-[15%] whitespace-nowrap", children: "Status" }), _jsx(TableHeadCell, { className: "w-[15%] text-right", children: "Actions" })] }), _jsx(TableBody, { className: "divide-y", children: safeApiKeys.map((key) => (_jsxs(TableRow, { className: "dark:border-zinc-700", children: [_jsx(TableCell, { className: "font-medium text-zinc-900 dark:text-zinc-100", children: _jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx(HiKey, { className: "h-5 w-5 shrink-0 text-zinc-600 dark:text-zinc-400" }), _jsx("span", { className: "truncate", title: key.name, children: key.name }), key.isSystem && (_jsx("span", { className: "bg-primary-100 text-primary-800 dark:bg-primary-900 dark:text-primary-300 shrink-0 rounded-full px-2.5 py-0.5 text-xs font-medium", children: "System" }))] }) }), _jsx(TableCell, { className: "whitespace-nowrap text-zinc-600 dark:text-zinc-400", children: formatDate(key.createdAt) }), _jsx(TableCell, { className: "whitespace-nowrap text-zinc-600 dark:text-zinc-400", children: formatDate(key.lastUsedAt) }), _jsx(TableCell, { className: "whitespace-nowrap", children: key.isActive ? (_jsxs("div", { className: "inline-flex items-center rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800 dark:bg-green-800 dark:text-green-100", children: [_jsx(HiCheckCircle, { className: "mr-1 h-3 w-3" }), "Active"] })) : (_jsxs("div", { className: "inline-flex items-center rounded-full bg-red-100 px-2 py-0.5 text-xs font-medium text-red-800 dark:bg-red-800 dark:text-red-100", children: [_jsx(HiExclamationCircle, { className: "mr-1 h-3 w-3" }), "Revoked"] })) }), _jsx(TableCell, { className: "text-right", children: _jsx("div", { className: "inline-flex justify-end", children: _jsx(Dropdown, { theme: theme === null || theme === void 0 ? void 0 : theme.dropdown, label: "", dismissOnClick: true, renderTrigger: () => (_jsx(Button, { theme: theme === null || theme === void 0 ? void 0 : theme.button, size: "sm", pill: true, className: "bg-zinc-100 text-zinc-900 hover:bg-zinc-200 dark:bg-zinc-700 dark:text-zinc-100 dark:hover:bg-zinc-600", children: _jsx(HiDotsVertical, { className: "h-4 w-4" }) })), children: _jsx(DropdownItem, { onClick: () => onRevokeKey(key.id), disabled: !key.isActive || key.isSystem, icon: HiTrash, className: "hover:bg-zinc-100 dark:hover:bg-zinc-700", children: "Revoke" }) }) }) })] }, key.id))) })] }) }));
+};

package/ui-components/api-keys/ApiKeysCard.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface ApiKeysCardProps {
+    theme?: any;
+    className?: string;
+}
+export declare const ApiKeysCard: React.FC<ApiKeysCardProps>;

package/ui-components/api-keys/ApiKeysCard.js

@@ -0,0 +1,97 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as SDK from '@robosystems/client';
+import { Button } from 'flowbite-react';
+import { useEffect, useState } from 'react';
+import { HiKey, HiPlusCircle } from 'react-icons/hi';
+import { Spinner } from '../Spinner';
+import { SettingsCard } from '../forms/SettingsCard';
+import { StatusAlert } from '../forms/StatusAlert';
+import { ApiKeyTable } from './ApiKeyTable';
+import { CreateApiKeyModal } from './CreateApiKeyModal';
+export const ApiKeysCard = ({ theme, className = '', }) => {
+    const [apiKeys, setApiKeys] = useState([]);
+    const [isLoading, setIsLoading] = useState(false);
+    const [isOpenCreateModal, setIsOpenCreateModal] = useState(false);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        fetchApiKeys();
+    }, []);
+    const fetchApiKeys = async () => {
+        var _a;
+        setIsLoading(true);
+        setError(null);
+        try {
+            // Always use SDK
+            const response = await SDK.listUserApiKeys();
+            const sdkKeys = ((_a = response.data) === null || _a === void 0 ? void 0 : _a.api_keys) || [];
+            // Map SDK response to component format
+            const keys = sdkKeys.map((key) => {
+                var _a, _b;
+                return ({
+                    id: key.id,
+                    name: key.name,
+                    graphId: key.graph_id,
+                    createdAt: key.created_at,
+                    lastUsedAt: key.last_used_at,
+                    expiresAt: key.expires_at,
+                    isActive: (_a = key.is_active) !== null && _a !== void 0 ? _a : true,
+                    isSystem: (_b = key.is_system) !== null && _b !== void 0 ? _b : false,
+                });
+            });
+            setApiKeys(keys);
+        }
+        catch (err) {
+            setError('Failed to load API keys. Please try again.');
+        }
+        finally {
+            setIsLoading(false);
+        }
+    };
+    const handleCreateKey = async (data) => {
+        var _a;
+        // Always use SDK to create key
+        const response = await SDK.createUserApiKey({
+            body: {
+                name: data.name,
+                description: `API key for ${data.name}`,
+            },
+        });
+        await fetchApiKeys(); // Refresh the list
+        // Map SDK response to component format
+        const responseData = response.data;
+        const apiKeyInfo = responseData === null || responseData === void 0 ? void 0 : responseData.api_key;
+        return {
+            id: (apiKeyInfo === null || apiKeyInfo === void 0 ? void 0 : apiKeyInfo.id) || '',
+            name: (apiKeyInfo === null || apiKeyInfo === void 0 ? void 0 : apiKeyInfo.name) || data.name,
+            key: (responseData === null || responseData === void 0 ? void 0 : responseData.key) || '', // The actual API key value
+            createdAt: (apiKeyInfo === null || apiKeyInfo === void 0 ? void 0 : apiKeyInfo.created_at) || new Date().toISOString(),
+            lastUsedAt: (apiKeyInfo === null || apiKeyInfo === void 0 ? void 0 : apiKeyInfo.last_used_at) || null,
+            expiresAt: null,
+            isActive: (_a = apiKeyInfo === null || apiKeyInfo === void 0 ? void 0 : apiKeyInfo.is_active) !== null && _a !== void 0 ? _a : true,
+            isSystem: false,
+        };
+    };
+    const handleRevokeKey = async (keyId) => {
+        try {
+            // Always use SDK to revoke key
+            await SDK.revokeUserApiKey({
+                path: { api_key_id: keyId },
+            });
+            await fetchApiKeys(); // Refresh the list
+        }
+        catch (err) {
+            setError('Failed to revoke API key. Please try again.');
+        }
+    };
+    const formatDate = (date) => {
+        if (!date)
+            return 'Never';
+        return new Date(date).toLocaleDateString('en-US', {
+            year: 'numeric',
+            month: 'short',
+            day: 'numeric',
+        });
+    };
+    return (_jsxs(SettingsCard, { title: "API Keys", description: "Manage your API keys for programmatic access", icon: HiKey, theme: theme === null || theme === void 0 ? void 0 : theme.card, className: className, children: [_jsx("div", { className: "mb-4 flex items-center justify-end", children: _jsxs(Button, { theme: theme === null || theme === void 0 ? void 0 : theme.button, color: "blue", onClick: () => setIsOpenCreateModal(true), children: [_jsx(HiPlusCircle, { className: "mr-2 h-5 w-5" }), "Create API Key"] }) }), error && (_jsx(StatusAlert, { type: "error", message: error, theme: theme === null || theme === void 0 ? void 0 : theme.alert })), isLoading ? (_jsx("div", { className: "flex justify-center py-4", children: _jsx(Spinner, { size: "lg" }) })) : !Array.isArray(apiKeys) || apiKeys.length === 0 ? (_jsxs("div", { className: "rounded-lg border border-zinc-200 bg-zinc-50 p-8 text-center dark:border-zinc-700 dark:bg-zinc-800", children: [_jsx(HiKey, { className: "mx-auto mb-3 h-12 w-12 text-zinc-400" }), _jsx("h3", { className: "mb-2 text-lg font-semibold text-zinc-900 dark:text-zinc-100", children: "No API keys yet" }), _jsx("p", { className: "text-sm text-zinc-500 dark:text-zinc-400", children: "Create an API key to access your graphs programmatically" })] })) : (_jsx(ApiKeyTable, { apiKeys: apiKeys, onRevokeKey: handleRevokeKey, theme: theme, formatDate: formatDate })), _jsx(CreateApiKeyModal, { isOpen: isOpenCreateModal, onClose: () => setIsOpenCreateModal(false), onCreateKey: handleCreateKey, theme: theme })] }));
+};

package/ui-components/api-keys/CreateApiKeyModal.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { ApiKeyWithValue } from '../types';
+export interface CreateApiKeyModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onCreateKey: (data: {
+        name: string;
+    }) => Promise<ApiKeyWithValue>;
+    theme?: any;
+}
+export declare const CreateApiKeyModal: React.FC<CreateApiKeyModalProps>;