@datalayer/agent-runtimes 0.0.2

package/lib/renderers/a2ui/hooks/useA2UI.js

@@ -0,0 +1,62 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/*
+ Copyright 2025 Google LLC
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+import { useCallback } from 'react';
+import { useA2UIContext } from '../context/A2UIContext.js';
+/**
+ * Main hook for interacting with A2UI.
+ * Provides access to surfaces, message processing, and action sending.
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { surfaces, processMessages, sendAction } = useA2UI();
+ *
+ *   // Process messages from server
+ *   useEffect(() => {
+ *     fetch('/api/a2ui').then(res => res.json()).then(processMessages);
+ *   }, []);
+ *
+ *   // Render surfaces
+ *   return <A2UIRenderer surfaceId="main" />;
+ * }
+ * ```
+ */
+export function useA2UI() {
+    const { processor, surfaces, processMessages, sendAction, refresh } = useA2UIContext();
+    const getSurface = useCallback((surfaceId) => {
+        return surfaces.get(surfaceId);
+    }, [surfaces]);
+    const getComponentTree = useCallback((surfaceId) => {
+        const surface = surfaces.get(surfaceId);
+        return surface?.componentTree ?? null;
+    }, [surfaces]);
+    const clearSurfaces = useCallback(() => {
+        processor.clearSurfaces();
+        refresh();
+    }, [processor, refresh]);
+    return {
+        surfaces,
+        getSurface,
+        processMessages,
+        sendAction,
+        getComponentTree,
+        clearSurfaces,
+    };
+}

package/lib/renderers/a2ui/hooks/useDataBinding.d.ts

@@ -0,0 +1,8 @@
+import { Types, Primitives } from '@a2ui/lit/0.8';
+export declare function useDataBinding(node: Types.AnyComponentNode, surfaceId: string): {
+    resolveString: (value: Primitives.StringValue | null | undefined) => string | null;
+    resolveNumber: (value: Primitives.NumberValue | null | undefined) => number | null;
+    resolveBoolean: (value: Primitives.BooleanValue | null | undefined) => boolean | null;
+    setValue: (path: string, value: Types.DataValue) => void;
+    getValue: (path: string) => Types.DataValue | null;
+};

package/lib/renderers/a2ui/hooks/useDataBinding.js

@@ -0,0 +1,83 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/*
+ Copyright 2025 Google LLC
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+import { useCallback } from 'react';
+import { useA2UIContext } from '../context/A2UIContext.js';
+export function useDataBinding(node, surfaceId) {
+    const { processor, refresh } = useA2UIContext();
+    const resolveString = useCallback((value) => {
+        if (!value)
+            return null;
+        if (value.literalString !== undefined) {
+            if (value.path) {
+                processor.setData(node, value.path, value.literalString, surfaceId);
+            }
+            return value.literalString;
+        }
+        if (value.path) {
+            const data = processor.getData(node, value.path, surfaceId);
+            return data !== null ? String(data) : null;
+        }
+        return null;
+    }, [processor, node, surfaceId]);
+    const resolveNumber = useCallback((value) => {
+        if (!value)
+            return null;
+        if (value.literalNumber !== undefined) {
+            if (value.path) {
+                processor.setData(node, value.path, value.literalNumber, surfaceId);
+            }
+            return value.literalNumber;
+        }
+        if (value.path) {
+            const data = processor.getData(node, value.path, surfaceId);
+            return data !== null ? Number(data) : null;
+        }
+        return null;
+    }, [processor, node, surfaceId]);
+    const resolveBoolean = useCallback((value) => {
+        if (!value)
+            return null;
+        if (value.literalBoolean !== undefined) {
+            if (value.path) {
+                processor.setData(node, value.path, value.literalBoolean, surfaceId);
+            }
+            return value.literalBoolean;
+        }
+        if (value.path) {
+            const data = processor.getData(node, value.path, surfaceId);
+            return data !== null ? Boolean(data) : null;
+        }
+        return null;
+    }, [processor, node, surfaceId]);
+    const setValue = useCallback((path, value) => {
+        processor.setData(node, path, value, surfaceId);
+        refresh();
+    }, [processor, node, surfaceId, refresh]);
+    const getValue = useCallback((path) => {
+        return processor.getData(node, path, surfaceId);
+    }, [processor, node, surfaceId]);
+    return {
+        resolveString,
+        resolveNumber,
+        resolveBoolean,
+        setValue,
+        getValue,
+    };
+}

package/lib/renderers/a2ui/index.d.ts

@@ -0,0 +1,9 @@
+export { A2UIProvider, useA2UIContext } from './context/A2UIContext.js';
+export { ThemeProvider, useTheme, defaultTheme, } from './context/ThemeContext.js';
+export { useA2UI } from './hooks/useA2UI.js';
+export { useDataBinding } from './hooks/useDataBinding.js';
+export { A2UIRenderer } from './components/A2UIRenderer.js';
+export * from './components/index.js';
+export * from './types/index.js';
+export { cn, classMapToString } from './lib/utils.js';
+export { Data, Types, Primitives } from '@a2ui/lit/0.8';

package/lib/renderers/a2ui/index.js

@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/*
+ Copyright 2025 Google LLC
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+export { A2UIProvider, useA2UIContext } from './context/A2UIContext.js';
+export { ThemeProvider, useTheme, defaultTheme, } from './context/ThemeContext.js';
+export { useA2UI } from './hooks/useA2UI.js';
+export { useDataBinding } from './hooks/useDataBinding.js';
+export { A2UIRenderer } from './components/A2UIRenderer.js';
+export * from './components/index.js';
+export * from './types/index.js';
+export { cn, classMapToString } from './lib/utils.js';
+export { Data, Types, Primitives } from '@a2ui/lit/0.8';

package/lib/renderers/a2ui/lib/utils.d.ts

@@ -0,0 +1,11 @@
+import { type ClassValue } from "clsx";
+/**
+ * Utility function to merge Tailwind CSS classes.
+ * Combines clsx for conditional classes with tailwind-merge to handle conflicts.
+ */
+export declare function cn(...inputs: ClassValue[]): string;
+/**
+ * Converts a Record<string, boolean> (class map) to a className string.
+ * This is used to convert Lit-style class maps to React className strings.
+ */
+export declare function classMapToString(classMap: Record<string, boolean>): string;

package/lib/renderers/a2ui/lib/utils.js

@@ -0,0 +1,38 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/*
+ Copyright 2025 Google LLC
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+/**
+ * Utility function to merge Tailwind CSS classes.
+ * Combines clsx for conditional classes with tailwind-merge to handle conflicts.
+ */
+export function cn(...inputs) {
+    return twMerge(clsx(inputs));
+}
+/**
+ * Converts a Record<string, boolean> (class map) to a className string.
+ * This is used to convert Lit-style class maps to React className strings.
+ */
+export function classMapToString(classMap) {
+    return Object.entries(classMap)
+        .filter(([, enabled]) => enabled)
+        .map(([className]) => className)
+        .join(" ");
+}

package/lib/renderers/a2ui/types/index.d.ts

@@ -0,0 +1,17 @@
+import { Types } from '@a2ui/lit/0.8';
+export type MessageProcessor = Types.MessageProcessor;
+export type Theme = Types.Theme;
+export type Surface = Types.Surface;
+export type AnyComponentNode = Types.AnyComponentNode;
+export type ServerToClientMessage = Types.ServerToClientMessage;
+export type DataValue = Types.DataValue;
+export interface A2UIComponentProps {
+    node: Types.AnyComponentNode;
+    surfaceId: string;
+}
+export interface A2UIActionEvent {
+    type: 'a2ui.action';
+    actionId: string;
+    context: Record<string, unknown>;
+}
+export type SendActionCallback = (action: A2UIActionEvent) => void;

package/lib/renderers/a2ui/types/index.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export {};

package/lib/renderers/index.d.ts

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

package/lib/renderers/index.js

@@ -0,0 +1,5 @@
+export {};
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */

package/lib/state/index.d.ts

@@ -0,0 +1 @@
+export * from './substates';

package/lib/state/index.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './substates';

package/lib/state/substates/AIAgentState.d.ts

@@ -0,0 +1,11 @@
+import type { IAIAgent } from '../../models';
+export type AIAgentState = {
+    aiAgents: readonly IAIAgent[];
+    addAIAgent: (aiAgent: IAIAgent) => void;
+    deleteAIAgent: (documentId: string) => void;
+    updateAIAgent: (documentId: string, runtimeId?: string) => void;
+};
+export declare const aiAgentStore: import("zustand").StoreApi<AIAgentState>;
+export declare function useAIAgentStore(): AIAgentState;
+export declare function useAIAgentStore<T>(selector: (state: AIAgentState) => T): T;
+export default useAIAgentStore;

package/lib/state/substates/AIAgentState.js

@@ -0,0 +1,42 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { createStore } from 'zustand/vanilla';
+import { useStore } from 'zustand';
+export const aiAgentStore = createStore(set => ({
+    aiAgents: [],
+    addAIAgent: (aiAgent) => {
+        set((state) => {
+            if (!state.aiAgents.includes(aiAgent)) {
+                return { aiAgents: state.aiAgents.concat([aiAgent]) };
+            }
+            else {
+                return {};
+            }
+        });
+    },
+    deleteAIAgent: (documentId) => {
+        set((state) => {
+            return {
+                aiAgents: state.aiAgents.filter(a => a.documentId === documentId),
+            };
+        });
+    },
+    updateAIAgent: (documentId, runtimeId) => {
+        set((state) => {
+            const index = state.aiAgents.findIndex(aiAgent => aiAgent.documentId === documentId);
+            if (index >= 0) {
+                state.aiAgents[index].runtimeId = runtimeId;
+                return { aiAgents: [...state.aiAgents] };
+            }
+            else {
+                return {};
+            }
+        });
+    },
+}));
+export function useAIAgentStore(selector) {
+    return useStore(aiAgentStore, selector);
+}
+export default useAIAgentStore;

package/lib/state/substates/index.d.ts

@@ -0,0 +1 @@
+export * from './AIAgentState';

package/lib/state/substates/index.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './AIAgentState';

package/lib/stories/Button.d.ts

@@ -0,0 +1,15 @@
+import './button.css';
+export interface ButtonProps {
+    /** Is this the principal call to action on the page? */
+    primary?: boolean;
+    /** What background color to use */
+    backgroundColor?: string;
+    /** How large should the button be? */
+    size?: 'small' | 'medium' | 'large';
+    /** Button contents */
+    label: string;
+    /** Optional click handler */
+    onClick?: () => void;
+}
+/** Primary UI component for user interaction */
+export declare const Button: ({ primary, size, backgroundColor, label, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/lib/stories/Button.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import './button.css';
+/** Primary UI component for user interaction */
+export const Button = ({ primary = false, size = 'medium', backgroundColor, label, ...props }) => {
+    const mode = primary
+        ? 'storybook-button--primary'
+        : 'storybook-button--secondary';
+    return (_jsx("button", { type: "button", className: ['storybook-button', `storybook-button--${size}`, mode].join(' '), style: { backgroundColor }, ...props, children: label }));
+};

package/lib/stories/Button.stories.d.ts

@@ -0,0 +1,23 @@
+import type { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: ({ primary, size, backgroundColor, label, ...props }: import("./Button").ButtonProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        backgroundColor: {
+            control: "color";
+        };
+    };
+    args: {
+        onClick: import("vitest").Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Large: Story;
+export declare const Small: Story;

package/lib/stories/Button.stories.js

@@ -0,0 +1,48 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { fn } from 'storybook/test';
+import { Button } from './Button';
+// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
+const meta = {
+    title: 'Example/Button',
+    component: Button,
+    parameters: {
+        // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/configure/story-layout
+        layout: 'centered',
+    },
+    // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
+    tags: ['autodocs'],
+    // More on argTypes: https://storybook.js.org/docs/api/argtypes
+    argTypes: {
+        backgroundColor: { control: 'color' },
+    },
+    // Use `fn` to spy on the onClick arg, which will appear in the actions panel once invoked: https://storybook.js.org/docs/essentials/actions#action-args
+    args: { onClick: fn() },
+};
+export default meta;
+// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
+export const Primary = {
+    args: {
+        primary: true,
+        label: 'Button',
+    },
+};
+export const Secondary = {
+    args: {
+        label: 'Button',
+    },
+};
+export const Large = {
+    args: {
+        size: 'large',
+        label: 'Button',
+    },
+};
+export const Small = {
+    args: {
+        size: 'small',
+        label: 'Button',
+    },
+};

package/lib/stories/Cell.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { JupyterReactTheme, Cell } from '@datalayer/jupyter-react';
+declare const meta: Meta<typeof Cell>;
+export default meta;
+type Story = StoryObj<typeof Cell | typeof JupyterReactTheme | {
+    lite: string;
+}>;
+export declare const Default: Story;
+export declare const Confettis: Story;
+export declare const Playground: Story;
+export declare const LitePython: Story;
+export declare const WithInitialization: Story;

package/lib/stories/Cell.stories.js

@@ -0,0 +1,123 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { JupyterReactTheme, Cell } from '@datalayer/jupyter-react';
+const meta = {
+    title: 'Datalayer/JupyterCell',
+    component: Cell,
+    argTypes: {
+        lite: {
+            control: 'radio',
+            options: ['true', 'false', '@jupyterlite/javascript-kernel-extension'],
+            table: {
+                // Switching live does not work
+                disable: true,
+            },
+        },
+        initCode: {
+            control: 'text',
+        },
+        source: {
+            control: 'text',
+        },
+        autoStart: {
+            control: 'boolean',
+        },
+    },
+};
+export default meta;
+const Template = (args) => {
+    const { browser, initCode, ...others } = args;
+    // Avoid dynamic import in test environment to prevent CI failures
+    /*
+    const isTestEnvironment =
+      typeof process !== 'undefined' &&
+      (process.env.NODE_ENV === 'test' ||
+        (globalThis as any).vi !== undefined ||
+        (globalThis as any).__vitest__ !== undefined);
+  
+    const lite = (() => {
+      if (args.browser === 'true') return true;
+      if (args.browser === 'false') return false;
+      if (
+        args.browser ===
+        '@datalayer/jupyter-react/lib/jupyter/lite/javascript-kernel-extension'
+      ) {
+        return isTestEnvironment
+          ? false
+          : (import('@jupyterlite/javascript-kernel-extension') as any);
+      }
+      return undefined;
+    })();
+  
+    const kernelName =
+      args.browser === '@jupyterlite/javascript-kernel-extension'
+        ? 'javascript'
+        : undefined;
+  */
+    return (_jsx(JupyterReactTheme, { children: _jsx(Cell, { ...others }) }));
+};
+export const Default = Template.bind({});
+Default.args = {
+    lite: 'false',
+    //  initCode: '',
+    source: '',
+    autoStart: false,
+};
+export const Confettis = Template.bind({});
+Confettis.args = {
+    lite: 'false',
+    source: `import ipyreact
+class ConfettiWidget(ipyreact.ReactWidget):
+  _esm = """
+    import confetti from "canvas-confetti";
+    import * as React from "react";
+    export default function({value, set_value, debug}) {
+        return (
+        <>
+          <h1>Ask anything to Datalayer</h1>
+          <button onClick={() => confetti() && set_value(value + 1)}>
+            CLICK here for some CONFETTIS
+          </button>
+          <h2>You have {value || 0} wishe{ (value > 1) && 's' } so far...</h2>
+          <quote>Powered by Ξ Datalayer</quote>
+        </>
+      )
+    };"""
+ConfettiWidget()`,
+    autoStart: true,
+};
+export const Playground = Template.bind({});
+Playground.args = {
+    ...Default.args,
+    source: `import numpy as np
+import matplotlib.pyplot as plt
+x1 = np.linspace(0.0, 5.0)
+x2 = np.linspace(0.0, 2.0)
+y1 = np.cos(2 * np.pi * x1) * np.exp(-x1)
+y2 = np.cos(2 * np.pi * x2)
+fig, (ax1, ax2) = plt.subplots(2, 1)
+fig.suptitle('A tale of 2 subplots')
+ax1.plot(x1, y1, 'o-')
+ax1.set_ylabel('Damped oscillation')
+ax2.plot(x2, y2, '.-')
+ax2.set_xlabel('time (s)')
+ax2.set_ylabel('Undamped')
+plt.show()`,
+    autoStart: true,
+};
+export const LitePython = Template.bind({});
+LitePython.args = {
+    ...Playground.args,
+    lite: 'true',
+    source: `import sys
+print(f"{sys.platform=}")
+
+${Playground.args.source ?? ''}`,
+};
+export const WithInitialization = Template.bind({});
+WithInitialization.args = {
+    ...Default.args,
+    lite: 'true',
+    //  initCode: 'import micropip\nawait micropip.install("ipywidgets")',
+    source: '# ipywidgets is imported at initialization\nimport ipywidgets',
+    autoStart: true,
+};

package/lib/stories/Header.d.ts

@@ -0,0 +1,12 @@
+import './header.css';
+type User = {
+    name: string;
+};
+export interface HeaderProps {
+    user?: User;
+    onLogin?: () => void;
+    onLogout?: () => void;
+    onCreateAccount?: () => void;
+}
+export declare const Header: ({ user, onLogin, onLogout, onCreateAccount, }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/stories/Header.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { Button } from './Button';
+import './header.css';
+export const Header = ({ user, onLogin, onLogout, onCreateAccount, }) => (_jsx("header", { children: _jsxs("div", { className: "storybook-header", children: [_jsxs("div", { children: [_jsx("svg", { width: "32", height: "32", viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", children: _jsxs("g", { fill: "none", fillRule: "evenodd", children: [_jsx("path", { d: "M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z", fill: "#FFF" }), _jsx("path", { d: "M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z", fill: "#555AB9" }), _jsx("path", { d: "M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z", fill: "#91BAF8" })] }) }), _jsx("h1", { children: "Acme" })] }), _jsx("div", { children: user ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: "welcome", children: ["Welcome, ", _jsx("b", { children: user.name }), "!"] }), _jsx(Button, { size: "small", onClick: onLogout, label: "Log out" })] })) : (_jsxs(_Fragment, { children: [_jsx(Button, { size: "small", onClick: onLogin, label: "Log in" }), _jsx(Button, { primary: true, size: "small", onClick: onCreateAccount, label: "Sign up" })] })) })] }) }));

package/lib/stories/Header.stories.d.ts

@@ -0,0 +1,18 @@
+import type { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: ({ user, onLogin, onLogout, onCreateAccount, }: import("./Header").HeaderProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {
+        onLogin: import("vitest").Mock<(...args: any[]) => any>;
+        onLogout: import("vitest").Mock<(...args: any[]) => any>;
+        onCreateAccount: import("vitest").Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const LoggedIn: Story;
+export declare const LoggedOut: Story;