@tangle-network/sandbox-ui 0.3.7 → 0.3.11

package/dist/chunk-Q56BYXQF.js

@@ -0,0 +1,61 @@
+import {
+  cn
+} from "./chunk-RQHJBTEU.js";
+
+// src/primitives/tabs.tsx
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+var Tabs = TabsPrimitive.Root;
+var TabsList = React.forwardRef(({ className, variant = "default", ...props }, ref) => {
+  const variants = {
+    default: "inline-flex h-10 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
+    pills: "inline-flex items-center gap-2",
+    underline: "inline-flex items-center gap-4 border-b border-border"
+  };
+  return /* @__PURE__ */ jsx(
+    TabsPrimitive.List,
+    {
+      ref,
+      className: cn(variants[variant], className),
+      ...props
+    }
+  );
+});
+TabsList.displayName = TabsPrimitive.List.displayName;
+var TabsTrigger = React.forwardRef(({ className, variant = "default", ...props }, ref) => {
+  const variants = {
+    default: "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
+    pills: "inline-flex items-center justify-center whitespace-nowrap rounded-full px-4 py-2 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=inactive]:text-muted-foreground data-[state=inactive]:hover:bg-muted",
+    underline: "inline-flex items-center justify-center whitespace-nowrap pb-3 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border-b-2 border-transparent data-[state=active]:border-primary data-[state=active]:text-foreground data-[state=inactive]:text-muted-foreground"
+  };
+  return /* @__PURE__ */ jsx(
+    TabsPrimitive.Trigger,
+    {
+      ref,
+      className: cn(variants[variant], className),
+      ...props
+    }
+  );
+});
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+var TabsContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "mt-4 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      "data-[state=active]:fade-in-0 data-[state=active]:slide-in-from-bottom-2 data-[state=active]:animate-in",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+export {
+  Tabs,
+  TabsList,
+  TabsTrigger,
+  TabsContent
+};

package/dist/{chunk-PDV7W4NY.js → chunk-SULQQJPB.js}

@@ -110,57 +110,6 @@ var DialogDescription = React.forwardRef(({ className, ...props }, ref) => /* @_
 ));
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
-// src/primitives/tabs.tsx
-import * as TabsPrimitive from "@radix-ui/react-tabs";
-import * as React2 from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var Tabs = TabsPrimitive.Root;
-var TabsList = React2.forwardRef(({ className, variant = "default", ...props }, ref) => {
-  const variants = {
-    default: "inline-flex h-10 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
-    pills: "inline-flex items-center gap-2",
-    underline: "inline-flex items-center gap-4 border-b border-border"
-  };
-  return /* @__PURE__ */ jsx2(
-    TabsPrimitive.List,
-    {
-      ref,
-      className: cn(variants[variant], className),
-      ...props
-    }
-  );
-});
-TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React2.forwardRef(({ className, variant = "default", ...props }, ref) => {
-  const variants = {
-    default: "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
-    pills: "inline-flex items-center justify-center whitespace-nowrap rounded-full px-4 py-2 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=inactive]:text-muted-foreground data-[state=inactive]:hover:bg-muted",
-    underline: "inline-flex items-center justify-center whitespace-nowrap pb-3 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border-b-2 border-transparent data-[state=active]:border-primary data-[state=active]:text-foreground data-[state=inactive]:text-muted-foreground"
-  };
-  return /* @__PURE__ */ jsx2(
-    TabsPrimitive.Trigger,
-    {
-      ref,
-      className: cn(variants[variant], className),
-      ...props
-    }
-  );
-});
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
-  TabsPrimitive.Content,
-  {
-    ref,
-    className: cn(
-      "mt-4 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-      "data-[state=active]:fade-in-0 data-[state=active]:slide-in-from-bottom-2 data-[state=active]:animate-in",
-      className
-    ),
-    ...props
-  }
-));
-TabsContent.displayName = TabsPrimitive.Content.displayName;
-
 export {
   Dialog,
   DialogTrigger,
@@ -171,9 +120,5 @@ export {
   DialogHeader,
   DialogFooter,
   DialogTitle,
-  DialogDescription,
-  Tabs,
-  TabsList,
-  TabsTrigger,
-  TabsContent
+  DialogDescription
 };

package/dist/chunk-W4LM3QYZ.js

@@ -0,0 +1,54 @@
+import {
+  cn
+} from "./chunk-RQHJBTEU.js";
+
+// src/workspace/artifact-pane.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function ArtifactPane({
+  eyebrow,
+  title,
+  subtitle,
+  meta,
+  headerActions,
+  tabs,
+  toolbar,
+  footer,
+  emptyState,
+  children,
+  className,
+  contentClassName
+}) {
+  const hasContent = children !== void 0 && children !== null;
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: cn(
+        "flex h-full min-h-0 flex-col overflow-hidden rounded-[var(--radius-xl)] bg-[linear-gradient(180deg,rgba(255,255,255,0.02),transparent_18%),var(--bg-dark)] text-[var(--text-primary)]",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "border-b border-[var(--border-subtle)] bg-[radial-gradient(circle_at_top_left,rgba(98,114,243,0.12),transparent_34%),linear-gradient(180deg,rgba(255,255,255,0.04),transparent)]", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3 px-4 py-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+              eyebrow && /* @__PURE__ */ jsx("div", { className: "mb-1 inline-flex max-w-full items-center rounded-full border border-[var(--border-accent)] bg-[var(--brand-cool)]/10 px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-[var(--brand-cool)]", children: eyebrow }),
+              /* @__PURE__ */ jsx("div", { className: "min-w-0 text-[15px] font-semibold text-[var(--text-primary)]", children: title }),
+              (subtitle || meta) && /* @__PURE__ */ jsxs("div", { className: "mt-1 flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 text-xs leading-relaxed text-[var(--text-muted)]", children: [
+                subtitle && /* @__PURE__ */ jsx("span", { className: "truncate", children: subtitle }),
+                meta && /* @__PURE__ */ jsx("span", { className: "flex items-center gap-2", children: meta })
+              ] })
+            ] }),
+            headerActions && /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-1.5", children: headerActions })
+          ] }),
+          tabs,
+          toolbar && /* @__PURE__ */ jsx("div", { className: "border-t border-[var(--border-subtle)] px-3 py-2", children: toolbar })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: cn("min-h-0 flex-1 overflow-auto", contentClassName), children: hasContent ? children : emptyState ? /* @__PURE__ */ jsx("div", { className: "flex h-full items-center justify-center p-6", children: emptyState }) : null }),
+        footer && /* @__PURE__ */ jsx("footer", { className: "shrink-0 border-t border-[var(--border-subtle)] bg-[var(--bg-card)] px-3 py-2", children: footer })
+      ]
+    }
+  );
+}
+
+export {
+  ArtifactPane
+};

package/dist/document-editor-pane-AFBP2KFT.js

@@ -0,0 +1,11 @@
+"use client";
+import {
+  DocumentEditorPane
+} from "./chunk-BOBXH6CH.js";
+import "./chunk-Q56BYXQF.js";
+import "./chunk-W4LM3QYZ.js";
+import "./chunk-LTFK464G.js";
+import "./chunk-RQHJBTEU.js";
+export {
+  DocumentEditorPane
+};

package/dist/document-editor-pane-Xnl8SmA7.d.ts

@@ -0,0 +1,124 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+import { A as ArtifactPaneProps } from './artifact-pane-Bh45Ssco.js';
+import { HocuspocusProvider } from '@hocuspocus/provider';
+import * as Y from 'yjs';
+
+/**
+ * Connection state for the Hocuspocus provider.
+ */
+type ConnectionState = "disconnected" | "connecting" | "connected" | "synced";
+/**
+ * Collaborator information from awareness.
+ */
+interface Collaborator {
+    clientId: number;
+    user: {
+        name: string;
+        color: string;
+        userId?: string;
+    };
+}
+/**
+ * Editor context value exposed to children.
+ */
+interface EditorContextValue {
+    /** The Y.Doc instance for collaboration */
+    doc: Y.Doc;
+    /** The Hocuspocus provider instance */
+    provider: HocuspocusProvider | null;
+    /** Current connection state */
+    connectionState: ConnectionState;
+    /** List of active collaborators */
+    collaborators: Collaborator[];
+    /** Whether the document is synced with the server */
+    isSynced: boolean;
+    /** Connect to the collaboration server */
+    connect: () => void;
+    /** Disconnect from the collaboration server */
+    disconnect: () => void;
+}
+/**
+ * User information for presence/awareness.
+ */
+interface EditorUser {
+    name: string;
+    color?: string;
+    userId?: string;
+}
+interface EditorTokenRefreshResult {
+    token: string;
+    expiresAt?: number;
+}
+/**
+ * Props for EditorProvider.
+ */
+interface EditorProviderProps {
+    /** WebSocket URL for the Hocuspocus server */
+    websocketUrl: string;
+    /** Document name (e.g., "doc:my-document") */
+    documentName: string;
+    /** JWT token for authentication */
+    token: string;
+    /** Unix timestamp (seconds) when the current token expires */
+    tokenExpiresAt?: number;
+    /** Current user information for awareness */
+    user: EditorUser;
+    /** Auto-connect on mount (default: true) */
+    autoConnect?: boolean;
+    /** Reconnect on disconnect (default: true) */
+    autoReconnect?: boolean;
+    /** Max reconnect attempts (default: 5) */
+    maxReconnectAttempts?: number;
+    /** Callback when connection state changes */
+    onConnectionChange?: (state: ConnectionState) => void;
+    /** Callback when sync completes */
+    onSync?: () => void;
+    /** Callback on authentication error */
+    onAuthError?: (error: Error) => void;
+    /** Optional token refresh callback used before reconnect/auth retry */
+    onRefreshToken?: () => Promise<EditorTokenRefreshResult | string>;
+    /** Children components */
+    children: ReactNode;
+}
+/**
+ * EditorProvider wraps children with Hocuspocus collaboration context.
+ * Manages WebSocket connection, Y.Doc, and awareness state.
+ */
+declare function EditorProvider({ websocketUrl, documentName, token, tokenExpiresAt, user, autoConnect, autoReconnect, maxReconnectAttempts, onConnectionChange, onSync, onAuthError, onRefreshToken, children, }: EditorProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access the editor context.
+ * Must be used within an EditorProvider.
+ */
+declare function useEditorContext(): EditorContextValue;
+
+type DocumentEditorMode = "preview" | "edit";
+type DocumentEditorBackend = "local" | "collaborative";
+interface DocumentEditorPaneCollaborationConfig extends Omit<EditorProviderProps, "children"> {
+}
+interface DocumentEditorPaneProps extends Omit<ArtifactPaneProps, "children" | "tabs" | "toolbar" | "emptyState"> {
+    tabs?: ArtifactPaneProps["tabs"];
+    toolbar?: ReactNode;
+    markdown?: string;
+    mode?: DocumentEditorMode;
+    defaultMode?: DocumentEditorMode;
+    onModeChange?: (mode: DocumentEditorMode) => void;
+    backend?: DocumentEditorBackend;
+    placeholder?: string;
+    autoFocus?: boolean;
+    readOnly?: boolean;
+    onChange?: (markdown: string) => void;
+    onSave?: (markdown: string) => Promise<void> | void;
+    saving?: boolean;
+    saveLabel?: string;
+    previewClassName?: string;
+    editorClassName?: string;
+    collaboration?: DocumentEditorPaneCollaborationConfig;
+}
+/**
+ * DocumentEditorPane — reusable markdown document surface with preview/edit
+ * modes and optional collaborative editing backed by Yjs/Hocuspocus.
+ */
+declare function DocumentEditorPane({ eyebrow, title, subtitle, meta, headerActions, footer, className, contentClassName, tabs, toolbar, markdown, mode, defaultMode, onModeChange, backend, placeholder, autoFocus, readOnly, onChange, onSave, saving, saveLabel, previewClassName, editorClassName, collaboration, }: DocumentEditorPaneProps): react_jsx_runtime.JSX.Element;
+
+export { type Collaborator as C, type DocumentEditorBackend as D, type EditorContextValue as E, type ConnectionState as a, type DocumentEditorMode as b, DocumentEditorPane as c, type DocumentEditorPaneCollaborationConfig as d, type DocumentEditorPaneProps as e, EditorProvider as f, type EditorProviderProps as g, type EditorTokenRefreshResult as h, type EditorUser as i, useEditorContext as u };

package/dist/editor.d.ts

@@ -1,88 +1,11 @@
+import { C as Collaborator, a as ConnectionState } from './document-editor-pane-Xnl8SmA7.js';
+export { D as DocumentEditorBackend, b as DocumentEditorMode, c as DocumentEditorPane, d as DocumentEditorPaneCollaborationConfig, e as DocumentEditorPaneProps, E as EditorContextValue, f as EditorProvider, g as EditorProviderProps, h as EditorTokenRefreshResult, i as EditorUser, u as useEditorContext } from './document-editor-pane-Xnl8SmA7.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { HocuspocusProvider } from '@hocuspocus/provider';
-import { ReactNode } from 'react';
-import * as Y from 'yjs';
 import { Editor } from '@tiptap/react';
-
-/**
- * Connection state for the Hocuspocus provider.
- */
-type ConnectionState = "disconnected" | "connecting" | "connected" | "synced";
-/**
- * Collaborator information from awareness.
- */
-interface Collaborator {
-    clientId: number;
-    user: {
-        name: string;
-        color: string;
-        userId?: string;
-    };
-}
-/**
- * Editor context value exposed to children.
- */
-interface EditorContextValue {
-    /** The Y.Doc instance for collaboration */
-    doc: Y.Doc;
-    /** The Hocuspocus provider instance */
-    provider: HocuspocusProvider | null;
-    /** Current connection state */
-    connectionState: ConnectionState;
-    /** List of active collaborators */
-    collaborators: Collaborator[];
-    /** Whether the document is synced with the server */
-    isSynced: boolean;
-    /** Connect to the collaboration server */
-    connect: () => void;
-    /** Disconnect from the collaboration server */
-    disconnect: () => void;
-}
-/**
- * User information for presence/awareness.
- */
-interface EditorUser {
-    name: string;
-    color?: string;
-    userId?: string;
-}
-/**
- * Props for EditorProvider.
- */
-interface EditorProviderProps {
-    /** WebSocket URL for the Hocuspocus server */
-    websocketUrl: string;
-    /** Document name (e.g., "doc:my-document") */
-    documentName: string;
-    /** JWT token for authentication */
-    token: string;
-    /** Current user information for awareness */
-    user: EditorUser;
-    /** Auto-connect on mount (default: true) */
-    autoConnect?: boolean;
-    /** Reconnect on disconnect (default: true) */
-    autoReconnect?: boolean;
-    /** Max reconnect attempts (default: 5) */
-    maxReconnectAttempts?: number;
-    /** Callback when connection state changes */
-    onConnectionChange?: (state: ConnectionState) => void;
-    /** Callback when sync completes */
-    onSync?: () => void;
-    /** Callback on authentication error */
-    onAuthError?: (error: Error) => void;
-    /** Children components */
-    children: ReactNode;
-}
-/**
- * EditorProvider wraps children with Hocuspocus collaboration context.
- * Manages WebSocket connection, Y.Doc, and awareness state.
- */
-declare function EditorProvider({ websocketUrl, documentName, token, user, autoConnect, autoReconnect, maxReconnectAttempts, onConnectionChange, onSync, onAuthError, children, }: EditorProviderProps): react_jsx_runtime.JSX.Element;
-/**
- * Hook to access the editor context.
- * Must be used within an EditorProvider.
- */
-declare function useEditorContext(): EditorContextValue;
+import { HocuspocusProvider } from '@hocuspocus/provider';
+import 'react';
+import './artifact-pane-Bh45Ssco.js';
+import 'yjs';
 
 /**
  * Props for TiptapEditor component.
@@ -193,4 +116,4 @@ declare function useAwareness(): {
     awareness: HocuspocusProvider["awareness"] | undefined;
 };
 
-export { type Collaborator, CollaboratorsList, type ConnectionState, type EditorContextValue, EditorProvider, type EditorProviderProps, EditorToolbar, type EditorUser, TiptapEditor, type TiptapEditorProps, useAwareness, useCollaboratorPresence, useCollaborators, useDocumentChanges, useEditorConnection, useEditorContext, useYjsState };
+export { Collaborator, CollaboratorsList, ConnectionState, EditorToolbar, TiptapEditor, type TiptapEditorProps, useAwareness, useCollaboratorPresence, useCollaborators, useDocumentChanges, useEditorConnection, useYjsState };