@lukeashford/aurelius 2.19.0 → 2.20.0

package/dist/index.d.mts

@@ -18,12 +18,22 @@ interface InputProps extends React$1.InputHTMLAttributes<HTMLInputElement> {
 declare const Input: React$1.ForwardRefExoticComponent<InputProps & React$1.RefAttributes<HTMLInputElement>>;
 
 type CardVariant = 'default' | 'elevated' | 'outlined' | 'ghost' | 'featured';
+type CardSlotLoading = {
+    header?: {
+        title?: boolean;
+        subtitle?: boolean;
+        action?: boolean;
+    };
+    media?: boolean;
+    body?: boolean;
+    footer?: boolean;
+};
 interface CardProps extends React$1.HTMLAttributes<HTMLDivElement> {
     variant?: CardVariant;
     interactive?: boolean;
     selected?: boolean;
     noPadding?: boolean;
-    isLoading?: boolean;
+    loading?: CardSlotLoading;
 }
 interface CardHeaderProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'title'> {
     title?: React$1.ReactNode;
@@ -989,6 +999,7 @@ interface ScriptCardProps extends Omit<CardProps, 'title'> {
      * Maximum height before scrolling (default: 16rem / 256px)
      */
     maxHeight?: string;
+    loading?: CardSlotLoading;
 }
 /**
  * ScriptCard displays a formatted movie/video script.
@@ -1079,7 +1090,7 @@ interface ArtifactCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
     /**
      * Whether the artifact is still loading
      */
-    isLoading?: boolean;
+    loading?: CardSlotLoading;
 }
 /**
  * A dispatcher component that renders the appropriate specialist card
@@ -1496,7 +1507,7 @@ interface ArtifactsPanelProps extends React$1.HTMLAttributes<HTMLDivElement> {
     /**
      * Whether artifacts are still loading (show skeletons)
      */
-    isLoading?: boolean;
+    loading?: CardSlotLoading;
     /**
      * Current width of the panel as CSS value (e.g., "50vw", "400px").
      */
@@ -1643,6 +1654,7 @@ interface ImageCardProps extends Omit<CardProps, 'title'> {
     overlay?: React$1.ReactNode;
     mediaClassName?: string;
     contentClassName?: string;
+    loading?: CardSlotLoading;
 }
 declare const ImageCard: React$1.ForwardRefExoticComponent<ImageCardProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -1662,6 +1674,7 @@ interface VideoCardProps extends Omit<CardProps, 'title'> {
     mediaClassName?: string;
     contentClassName?: string;
     playerProps?: any;
+    loading?: CardSlotLoading;
 }
 declare const VideoCard: React$1.ForwardRefExoticComponent<VideoCardProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -1678,6 +1691,7 @@ interface AudioCardProps extends Omit<CardProps, 'title'> {
     contentClassName?: string;
     playerProps?: any;
     height?: string | number;
+    loading?: CardSlotLoading;
 }
 declare const AudioCard: React$1.ForwardRefExoticComponent<AudioCardProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -1706,6 +1720,7 @@ interface PdfCardProps extends Omit<CardProps, 'title'> {
      * Optional class name for the content container
      */
     contentClassName?: string;
+    loading?: CardSlotLoading;
 }
 /**
  * A card for displaying PDF documents with an embedded viewer.
@@ -1739,6 +1754,7 @@ interface TextCardProps extends Omit<CardProps, 'title'> {
      * Optional class name for the content container
      */
     contentClassName?: string;
+    loading?: CardSlotLoading;
 }
 /**
  * A card for displaying text content, supporting Markdown and HTML formatting.

package/dist/index.d.ts

@@ -18,12 +18,22 @@ interface InputProps extends React$1.InputHTMLAttributes<HTMLInputElement> {
 declare const Input: React$1.ForwardRefExoticComponent<InputProps & React$1.RefAttributes<HTMLInputElement>>;
 
 type CardVariant = 'default' | 'elevated' | 'outlined' | 'ghost' | 'featured';
+type CardSlotLoading = {
+    header?: {
+        title?: boolean;
+        subtitle?: boolean;
+        action?: boolean;
+    };
+    media?: boolean;
+    body?: boolean;
+    footer?: boolean;
+};
 interface CardProps extends React$1.HTMLAttributes<HTMLDivElement> {
     variant?: CardVariant;
     interactive?: boolean;
     selected?: boolean;
     noPadding?: boolean;
-    isLoading?: boolean;
+    loading?: CardSlotLoading;
 }
 interface CardHeaderProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'title'> {
     title?: React$1.ReactNode;
@@ -989,6 +999,7 @@ interface ScriptCardProps extends Omit<CardProps, 'title'> {
      * Maximum height before scrolling (default: 16rem / 256px)
      */
     maxHeight?: string;
+    loading?: CardSlotLoading;
 }
 /**
  * ScriptCard displays a formatted movie/video script.
@@ -1079,7 +1090,7 @@ interface ArtifactCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
     /**
      * Whether the artifact is still loading
      */
-    isLoading?: boolean;
+    loading?: CardSlotLoading;
 }
 /**
  * A dispatcher component that renders the appropriate specialist card
@@ -1496,7 +1507,7 @@ interface ArtifactsPanelProps extends React$1.HTMLAttributes<HTMLDivElement> {
     /**
      * Whether artifacts are still loading (show skeletons)
      */
-    isLoading?: boolean;
+    loading?: CardSlotLoading;
     /**
      * Current width of the panel as CSS value (e.g., "50vw", "400px").
      */
@@ -1643,6 +1654,7 @@ interface ImageCardProps extends Omit<CardProps, 'title'> {
     overlay?: React$1.ReactNode;
     mediaClassName?: string;
     contentClassName?: string;
+    loading?: CardSlotLoading;
 }
 declare const ImageCard: React$1.ForwardRefExoticComponent<ImageCardProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -1662,6 +1674,7 @@ interface VideoCardProps extends Omit<CardProps, 'title'> {
     mediaClassName?: string;
     contentClassName?: string;
     playerProps?: any;
+    loading?: CardSlotLoading;
 }
 declare const VideoCard: React$1.ForwardRefExoticComponent<VideoCardProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -1678,6 +1691,7 @@ interface AudioCardProps extends Omit<CardProps, 'title'> {
     contentClassName?: string;
     playerProps?: any;
     height?: string | number;
+    loading?: CardSlotLoading;
 }
 declare const AudioCard: React$1.ForwardRefExoticComponent<AudioCardProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -1706,6 +1720,7 @@ interface PdfCardProps extends Omit<CardProps, 'title'> {
      * Optional class name for the content container
      */
     contentClassName?: string;
+    loading?: CardSlotLoading;
 }
 /**
  * A card for displaying PDF documents with an embedded viewer.
@@ -1739,6 +1754,7 @@ interface TextCardProps extends Omit<CardProps, 'title'> {
      * Optional class name for the content container
      */
     contentClassName?: string;
+    loading?: CardSlotLoading;
 }
 /**
  * A card for displaying text content, supporting Markdown and HTML formatting.

package/dist/index.js

@@ -274,8 +274,18 @@ var Skeleton = import_react3.default.forwardRef(
 Skeleton.displayName = "Skeleton";
 
 // src/components/Card.tsx
-var CardContext = (0, import_react4.createContext)({ isLoading: false });
+var CardContext = (0, import_react4.createContext)({ loading: void 0 });
 var useCardContext = () => (0, import_react4.useContext)(CardContext);
+function slotLoading(loading, path) {
+  if (!loading) {
+    return false;
+  }
+  if (Array.isArray(path)) {
+    const [section, field] = path;
+    return !!loading[section]?.[field];
+  }
+  return !!loading[path];
+}
 var VARIANT_STYLES = {
   default: "bg-charcoal shadow-sm border border-gold/30",
   elevated: "bg-charcoal shadow-lg border-0",
@@ -289,12 +299,12 @@ var CardBase = import_react4.default.forwardRef(
     interactive = false,
     selected = false,
     noPadding = false,
-    isLoading = false,
+    loading,
     className,
     children,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ import_react4.default.createElement(CardContext.Provider, { value: { isLoading } }, /* @__PURE__ */ import_react4.default.createElement(
+    return /* @__PURE__ */ import_react4.default.createElement(CardContext.Provider, { value: { loading } }, /* @__PURE__ */ import_react4.default.createElement(
       "div",
       {
         ref,
@@ -322,9 +332,12 @@ var CardBase = import_react4.default.forwardRef(
 CardBase.displayName = "Card";
 var CardHeader = import_react4.default.forwardRef(
   ({ title, subtitle, action, className, children, ...props }, ref) => {
-    const { isLoading } = useCardContext();
+    const { loading } = useCardContext();
+    const titleIsLoading = slotLoading(loading, ["header", "title"]);
+    const subtitleIsLoading = slotLoading(loading, ["header", "subtitle"]);
+    const actionIsLoading = slotLoading(loading, ["header", "action"]);
     const hasContent = title || subtitle || action || children;
-    if (!hasContent && !isLoading) {
+    if (!hasContent && !titleIsLoading && !subtitleIsLoading && !actionIsLoading) {
       return null;
     }
     return /* @__PURE__ */ import_react4.default.createElement(
@@ -334,18 +347,19 @@ var CardHeader = import_react4.default.forwardRef(
         className: cx("px-6 py-4 border-b border-ash", className),
         ...props
       },
-      isLoading && !title && !subtitle ? /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-5 w-3/4" }), /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-1/2" })) : title || subtitle || action ? /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex-1 min-w-0" }, title ? /* @__PURE__ */ import_react4.default.createElement("h3", { className: "text-lg font-semibold text-white m-0" }, title) : isLoading ? /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-5 w-3/4 mb-1" }) : null, subtitle ? /* @__PURE__ */ import_react4.default.createElement("p", { className: "text-sm text-silver mt-1 m-0" }, subtitle) : isLoading ? /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-1/2 mt-1" }) : null), action && /* @__PURE__ */ import_react4.default.createElement("div", { className: "shrink-0" }, action)) : children
+      title || subtitle || action || titleIsLoading || subtitleIsLoading || actionIsLoading ? /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex-1 min-w-0" }, title ? /* @__PURE__ */ import_react4.default.createElement("h3", { className: "text-lg font-semibold text-white m-0" }, title) : titleIsLoading ? /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-5 w-3/4 mb-1" }) : null, subtitle ? /* @__PURE__ */ import_react4.default.createElement("p", { className: "text-sm text-silver mt-1 m-0" }, subtitle) : subtitleIsLoading ? /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-1/2 mt-1" }) : null), action ? /* @__PURE__ */ import_react4.default.createElement("div", { className: "shrink-0" }, action) : actionIsLoading ? /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-8 w-8 shrink-0" }) : null) : children
     );
   }
 );
 CardHeader.displayName = "CardHeader";
 var CardBody = import_react4.default.forwardRef(
   ({ className, children, ...props }, ref) => {
-    const { isLoading } = useCardContext();
-    if (!children && !isLoading) {
+    const { loading } = useCardContext();
+    const isBodyLoading = slotLoading(loading, "body");
+    if (!children && !isBodyLoading) {
       return null;
     }
-    return /* @__PURE__ */ import_react4.default.createElement("div", { ref, className: cx("px-6 py-4", className), ...props }, isLoading && !children ? /* @__PURE__ */ import_react4.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-full" }), /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-full" }), /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-3/4" })) : children);
+    return /* @__PURE__ */ import_react4.default.createElement("div", { ref, className: cx("px-6 py-4", className), ...props }, isBodyLoading ? /* @__PURE__ */ import_react4.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-full" }), /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-full" }), /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "h-4 w-3/4" })) : children);
   }
 );
 CardBody.displayName = "CardBody";
@@ -381,13 +395,14 @@ var CardMedia = import_react4.default.forwardRef(
     children,
     ...props
   }, ref) => {
-    const { isLoading } = useCardContext();
+    const { loading } = useCardContext();
+    const isMediaLoading = slotLoading(loading, "media");
     const aspectClass = aspect && aspect !== "none" ? {
       video: "aspect-video",
       square: "aspect-square",
       wide: "aspect-wide"
     }[aspect] : "";
-    if (!children && !isLoading) {
+    if (!children && !isMediaLoading) {
       return null;
     }
     return /* @__PURE__ */ import_react4.default.createElement(
@@ -403,7 +418,7 @@ var CardMedia = import_react4.default.forwardRef(
         ),
         ...props
       },
-      isLoading && !children ? /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "w-full h-full" }) : children
+      isMediaLoading ? /* @__PURE__ */ import_react4.default.createElement(Skeleton, { className: "w-full h-full" }) : children
     );
   }
 );
@@ -5188,7 +5203,7 @@ var ImageCard = import_react61.default.forwardRef(
     contentClassName,
     className,
     children,
-    isLoading,
+    loading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ import_react61.default.createElement(
@@ -5196,7 +5211,7 @@ var ImageCard = import_react61.default.forwardRef(
       {
         ref,
         className: cx("p-0 overflow-hidden w-full", className),
-        isLoading,
+        loading,
         ...props
       },
       /* @__PURE__ */ import_react61.default.createElement(
@@ -5205,7 +5220,7 @@ var ImageCard = import_react61.default.forwardRef(
           className: mediaClassName,
           style: { aspectRatio: resolveAspectRatio(aspectRatio) }
         },
-        src && /* @__PURE__ */ import_react61.default.createElement(
+        /* @__PURE__ */ import_react61.default.createElement(import_react61.default.Fragment, null, src && /* @__PURE__ */ import_react61.default.createElement(
           "img",
           {
             src,
@@ -5215,14 +5230,13 @@ var ImageCard = import_react61.default.forwardRef(
               objectFit === "cover" ? "object-cover" : "object-contain"
             )
           }
-        ),
-        overlay && /* @__PURE__ */ import_react61.default.createElement(
+        ), overlay && /* @__PURE__ */ import_react61.default.createElement(
           "div",
           {
             className: "absolute inset-0 bg-obsidian/80 opacity-0 group-hover:opacity-100 transition-opacity duration-200 flex items-center justify-center"
           },
           overlay
-        )
+        ))
       ),
       /* @__PURE__ */ import_react61.default.createElement(
         Card.Header,
@@ -5269,7 +5283,7 @@ var VideoCard = import_react62.default.forwardRef(
     className,
     children,
     playerProps,
-    isLoading,
+    loading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ import_react62.default.createElement(
@@ -5277,7 +5291,7 @@ var VideoCard = import_react62.default.forwardRef(
       {
         ref,
         className: cx("p-0 overflow-hidden w-full", className),
-        isLoading,
+        loading,
         ...props
       },
       /* @__PURE__ */ import_react62.default.createElement(
@@ -5337,7 +5351,7 @@ var AudioCard = import_react63.default.forwardRef(
     children,
     playerProps,
     height = "40px",
-    isLoading,
+    loading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ import_react63.default.createElement(
@@ -5345,7 +5359,7 @@ var AudioCard = import_react63.default.forwardRef(
       {
         ref,
         className: cx("p-0 overflow-hidden w-full", className),
-        isLoading,
+        loading,
         ...props
       },
       /* @__PURE__ */ import_react63.default.createElement(Card.Media, { className: cx(
@@ -5401,7 +5415,7 @@ var PdfCard = import_react64.default.forwardRef(
     contentClassName,
     className,
     children,
-    isLoading,
+    loading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ import_react64.default.createElement(
@@ -5409,7 +5423,7 @@ var PdfCard = import_react64.default.forwardRef(
       {
         ref,
         className: cx("p-0 overflow-hidden w-full", className),
-        isLoading,
+        loading,
         ...props
       },
       /* @__PURE__ */ import_react64.default.createElement(
@@ -5477,13 +5491,13 @@ function ScriptElementRenderer({ element }) {
   }
 }
 var ScriptCard = import_react65.default.forwardRef(
-  ({ title, subtitle, elements, maxHeight = "16rem", className, style, isLoading, ...rest }, ref) => {
+  ({ title, subtitle, elements, maxHeight = "16rem", className, style, loading, ...rest }, ref) => {
     return /* @__PURE__ */ import_react65.default.createElement(
       Card,
       {
         ref,
         className: cx("p-0 overflow-hidden w-full", className),
-        isLoading,
+        loading,
         ...rest
       },
       /* @__PURE__ */ import_react65.default.createElement(
@@ -5517,7 +5531,7 @@ var TextCard = import_react66.default.forwardRef(
     maxHeight = "16rem",
     contentClassName,
     className,
-    isLoading,
+    loading,
     ...props
   }, ref) => {
     return /* @__PURE__ */ import_react66.default.createElement(
@@ -5525,7 +5539,7 @@ var TextCard = import_react66.default.forwardRef(
       {
         ref,
         className: cx("p-0 overflow-hidden w-full", className),
-        isLoading,
+        loading,
         ...props
       },
       /* @__PURE__ */ import_react66.default.createElement(
@@ -5555,6 +5569,21 @@ var TextCard = import_react66.default.forwardRef(
 );
 TextCard.displayName = "TextCard";
 
+// src/utils/artifactLoading.ts
+function deriveCardSlotLoading(a) {
+  if (!a.isPending) {
+    return void 0;
+  }
+  const header = {
+    title: !a.title,
+    subtitle: !a.subtitle
+  };
+  const mediaNeeded = (type) => ["IMAGE", "VIDEO", "AUDIO", "PDF"].includes(type);
+  const media = mediaNeeded(a.type) && !a.url;
+  const body = a.type === "TEXT" && !(a.inlineContent && a.inlineContent.trim().length) || a.type === "SCRIPT" && !(a.scriptElements && a.scriptElements.length > 0);
+  return { header, media, body };
+}
+
 // src/components/ArtifactCard.tsx
 var ARTIFACT_TYPES = {
   TEXT: "TEXT",
@@ -5565,11 +5594,12 @@ var ARTIFACT_TYPES = {
   PDF: "PDF"
 };
 var ArtifactCard = import_react67.default.forwardRef(
-  ({ artifact, onExpand, isLoading, className, ...props }, ref) => {
+  ({ artifact, onExpand, loading, className, ...props }, ref) => {
+    const derivedLoading = deriveCardSlotLoading(artifact);
     const commonProps = {
       title: artifact.title,
       subtitle: artifact.subtitle,
-      isLoading: isLoading || artifact.isPending,
+      loading: loading || derivedLoading,
       className: "w-full"
     };
     const handleExpand = (e) => {
@@ -5753,7 +5783,7 @@ function ArtifactModal({
         MarkdownContent,
         {
           content: artifact.inlineContent || "",
-          isMarkdown: artifact.mimeType === "text/markdown",
+          isMarkdown: artifact.mimeType !== "text/plain",
           className: cx(
             "prose prose-invert max-w-none",
             artifact.mimeType === "text/plain" && "whitespace-pre-wrap"
@@ -5772,14 +5802,14 @@ function ArtifactModal({
 }
 function ArtifactRenderer({
   artifact,
-  isLoading,
+  loading,
   onExpand
 }) {
   return /* @__PURE__ */ import_react68.default.createElement(
     ArtifactCard,
     {
       artifact,
-      isLoading,
+      loading,
       onExpand
     }
   );
@@ -5789,7 +5819,7 @@ var ArtifactsPanel = import_react68.default.forwardRef(
     artifacts,
     isOpen = false,
     onClose,
-    isLoading = false,
+    loading,
     width,
     widthPercent,
     onResizeStart,
@@ -5891,12 +5921,12 @@ var ArtifactsPanel = import_react68.default.forwardRef(
             columns === 3 && "grid-cols-3"
           )
         },
-        artifacts.length === 0 && !isLoading ? /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-xs text-silver/60 text-center py-8" }, "No artifacts to display") : artifacts.map((artifact) => /* @__PURE__ */ import_react68.default.createElement(
+        artifacts.length === 0 && !loading ? /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-xs text-silver/60 text-center py-8" }, "No artifacts to display") : artifacts.map((artifact) => /* @__PURE__ */ import_react68.default.createElement(
           ArtifactRenderer,
           {
             key: artifact.id,
             artifact,
-            isLoading,
+            loading,
             onExpand: () => setExpandedArtifact(artifact)
           }
         ))
@@ -6228,9 +6258,6 @@ var ChatInterface = import_react72.default.forwardRef(
       }
       return -1;
     }, [effectiveMessages]);
-    const hasPendingArtifact = (0, import_react72.useMemo)(() => {
-      return artifacts.some((a) => a.isPending);
-    }, [artifacts]);
     (0, import_react72.useEffect)(() => {
       if (isPanelControlled) {
         return;
@@ -6394,7 +6421,6 @@ var ChatInterface = import_react72.default.forwardRef(
           artifacts,
           isOpen: artifactsPanelOpen,
           onClose: toggleArtifactsPanel,
-          isLoading: isStreaming && hasPendingArtifact,
           width: artifactsWidth,
           widthPercent: artifactsWidthPercent,
           onResizeStart: startResizingArtifacts,