@flamingo-stack/openframe-frontend-core 0.0.280 → 0.0.281-snapshot.20260617191933

package/dist/{chunk-QHTJTSHT.js → chunk-S7HJ3IRR.js}

@@ -3425,7 +3425,29 @@ import * as React6 from "react";
 import { ChevronRight as ChevronRight2 } from "lucide-react";
 import { jsx as jsx26, jsxs as jsxs22 } from "react/jsx-runtime";
 var ChatTicketItem = React6.forwardRef(
-  ({ className, ticket, onClick, ...props }, ref) => {
+  ({ className, ticket, onClick, isLoading = false, ...props }, ref) => {
+    if (isLoading) {
+      return /* @__PURE__ */ jsxs22(
+        "div",
+        {
+          "aria-hidden": true,
+          className: cn(
+            "flex items-center gap-4 w-full h-20 px-4",
+            "bg-ods-card border-b border-ods-border",
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsxs22("div", { className: "flex flex-col justify-center flex-1 min-w-0 gap-1", children: [
+              /* @__PURE__ */ jsx26(Skeleton, { className: "h-5 w-1/2" }),
+              /* @__PURE__ */ jsx26(Skeleton, { className: "h-4 w-1/3" })
+            ] }),
+            /* @__PURE__ */ jsx26(Skeleton, { className: "h-8 w-20 rounded-r-md shrink-0" }),
+            /* @__PURE__ */ jsx26(Skeleton, { className: "size-12 rounded-md shrink-0" })
+          ]
+        }
+      );
+    }
+    if (!ticket) return null;
     const statusTagProps = resolveStatusTagProps({
       status: ticket.status,
       statusKind: ticket.statusKind,
@@ -3496,7 +3518,7 @@ function getMask(top, bottom) {
   return "none";
 }
 var ChatTicketList = React7.forwardRef(
-  ({ className, tickets, onTicketClick, ...props }, ref) => {
+  ({ className, tickets, onTicketClick, isLoading = false, skeletonCount = 5, ...props }, ref) => {
     const scrollRef = React7.useRef(null);
     const [fadeTop, setFadeTop] = React7.useState(false);
     const [fadeBottom, setFadeBottom] = React7.useState(false);
@@ -3510,6 +3532,15 @@ var ChatTicketList = React7.forwardRef(
     React7.useLayoutEffect(() => {
       updateFade();
     }, [ticketCount, updateFade]);
+    if (isLoading) {
+      return /* @__PURE__ */ jsxs23("div", { ref, className: cn("flex flex-col gap-2 min-h-0", className), ...props, children: [
+        /* @__PURE__ */ jsx27("p", { className: "text-h5 text-ods-text-secondary shrink-0", children: "Your Chats:" }),
+        /* @__PURE__ */ jsx27("div", { className: "border border-ods-border rounded-md flex-1 min-h-0 overflow-hidden", children: Array.from({ length: skeletonCount }).map((_, i) => (
+          // eslint-disable-next-line react/no-array-index-key
+          /* @__PURE__ */ jsx27(ChatTicketItem, { isLoading: true }, i)
+        )) })
+      ] });
+    }
     if (tickets.length === 0) return null;
     const mask = getMask(fadeTop, fadeBottom);
     return /* @__PURE__ */ jsxs23("div", { ref, className: cn("flex flex-col gap-2 min-h-0", className), ...props, children: [
@@ -5170,6 +5201,23 @@ function BreakdownRow({
   ] });
 }
 ModelDisplay.displayName = "ModelDisplay";
+var ModelDisplaySkeleton = React16.forwardRef(
+  ({ className, showTokens = false, ...props }, ref) => /* @__PURE__ */ jsxs34(
+    "div",
+    {
+      ref,
+      "aria-hidden": true,
+      className: cn("flex items-center gap-1 text-sm", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx41(Skeleton, { className: "w-4 h-5 rounded-sm shrink-0" }),
+        /* @__PURE__ */ jsx41(Skeleton, { className: "h-5 w-24" }),
+        showTokens && /* @__PURE__ */ jsx41(Skeleton, { className: "h-3 w-32 ml-auto" })
+      ]
+    }
+  )
+);
+ModelDisplaySkeleton.displayName = "ModelDisplaySkeleton";
 
 // src/components/chat/chat-composer.tsx
 import { jsx as jsx42, jsxs as jsxs35 } from "react/jsx-runtime";
@@ -39791,6 +39839,7 @@ export {
   HoverCardTrigger,
   HoverCardContent,
   ModelDisplay,
+  ModelDisplaySkeleton,
   ChatComposer,
   ChatArchivePage,
   DialogListItem,
@@ -40249,4 +40298,4 @@ export {
   LogsList,
   assets
 };
-//# sourceMappingURL=chunk-QHTJTSHT.js.map
+//# sourceMappingURL=chunk-S7HJ3IRR.js.map