@wealthx/shadcn 1.5.37 → 1.5.39

package/dist/{chunk-OG2VM34K.mjs → chunk-MHBQJVHE.mjs}

@@ -1,7 +1,7 @@
 import {
   LeadCard,
   OpportunityCard
-} from "./chunk-DSVKEVX6.mjs";
+} from "./chunk-CZOGJC76.mjs";
 import {
   Tooltip,
   TooltipContent,

package/dist/{chunk-NB3ZL36B.mjs → chunk-MZI77ZMX.mjs}

@@ -1,10 +1,19 @@
+import {
+  Button
+} from "./chunk-NOOEKOWY.mjs";
 import {
   cn
 } from "./chunk-AFML43VJ.mjs";
 
 // src/components/ui/page-top-bar.tsx
+import { Bot } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
-function PageTopBar({ title, actions, className }) {
+function PageTopBar({
+  title,
+  actions,
+  onAskSupport,
+  className
+}) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -16,7 +25,13 @@ function PageTopBar({ title, actions, className }) {
       ),
       children: [
         /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold leading-tight", children: title }),
-        actions && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: actions })
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          actions,
+          onAskSupport && /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", onClick: onAskSupport, children: [
+            /* @__PURE__ */ jsx(Bot, { className: "size-3.5", "aria-hidden": "true" }),
+            "Ask Support"
+          ] })
+        ] })
       ]
     }
   );

package/dist/chunk-R7M657QL.mjs

@@ -0,0 +1,587 @@
+import {
+  Skeleton
+} from "./chunk-GTAVSBDO.mjs";
+import {
+  ChatInputArea
+} from "./chunk-EFHPSKVF.mjs";
+import {
+  Sheet,
+  SheetContent
+} from "./chunk-H3PTREG6.mjs";
+import {
+  Spinner
+} from "./chunk-JVMXMFBB.mjs";
+import {
+  Button
+} from "./chunk-NOOEKOWY.mjs";
+import {
+  cn
+} from "./chunk-AFML43VJ.mjs";
+
+// src/components/ui/support-agent/support-agent-primitives.tsx
+import * as React from "react";
+import {
+  Check,
+  ChevronDown,
+  ChevronUp,
+  ExternalLink,
+  MapPin,
+  MousePointerClick
+} from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function SupportContextChip({
+  context,
+  isLoading = false,
+  className
+}) {
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(
+      Skeleton,
+      {
+        className: cn("h-6 w-48", className),
+        "data-slot": "support-context-chip"
+      }
+    );
+  }
+  if (!context) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex w-fit items-center gap-1.5 bg-muted px-2.5 py-1 text-xs text-muted-foreground",
+        className
+      ),
+      "data-slot": "support-context-chip",
+      children: [
+        /* @__PURE__ */ jsx(MapPin, { className: "size-3 shrink-0", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: context.pageLabel }),
+        context.entityLabel && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u203A" }),
+          /* @__PURE__ */ jsx("span", { className: "truncate max-w-[160px]", children: context.entityLabel })
+        ] })
+      ]
+    }
+  );
+}
+function SupportSuggestedQuestion({
+  question,
+  onSelect,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      type: "button",
+      variant: "ghost",
+      onClick: () => onSelect(question),
+      className: cn(
+        "h-auto w-full justify-start border border-border bg-background px-3 py-2.5 text-left text-sm font-normal text-foreground hover:bg-muted/50",
+        className
+      ),
+      "data-slot": "support-suggested-question",
+      children: question
+    }
+  );
+}
+function SupportStepGuideCard({
+  title,
+  steps,
+  onHighlight,
+  onStepComplete,
+  defaultExpanded,
+  className
+}) {
+  const isLong = steps.length > 5;
+  const [expanded, setExpanded] = React.useState(defaultExpanded != null ? defaultExpanded : !isLong);
+  const completedCount = steps.filter((s) => s.completed).length;
+  const allDone = completedCount === steps.length;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("mt-2 border border-border bg-background", className),
+      "data-slot": "support-step-guide-card",
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => setExpanded((v) => !v),
+            className: "flex w-full items-center justify-between gap-2 px-3 py-2.5 text-left hover:bg-muted/30",
+            "aria-expanded": expanded,
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-foreground", children: title }),
+                /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: allDone ? "All steps complete" : `${completedCount} of ${steps.length} complete` })
+              ] }),
+              expanded ? /* @__PURE__ */ jsx(
+                ChevronUp,
+                {
+                  className: "size-4 shrink-0 text-muted-foreground",
+                  "aria-hidden": "true"
+                }
+              ) : /* @__PURE__ */ jsx(
+                ChevronDown,
+                {
+                  className: "size-4 shrink-0 text-muted-foreground",
+                  "aria-hidden": "true"
+                }
+              )
+            ]
+          }
+        ),
+        expanded && /* @__PURE__ */ jsx("ol", { className: "flex flex-col divide-y divide-border border-t border-border", children: steps.map((step, index) => /* @__PURE__ */ jsxs(
+          "li",
+          {
+            className: cn(
+              "flex items-start gap-3 px-3 py-2.5",
+              step.completed && "opacity-60"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => !step.completed && (onStepComplete == null ? void 0 : onStepComplete(step.id)),
+                  disabled: step.completed,
+                  title: step.completed ? "Step complete" : "Mark as done",
+                  className: cn(
+                    "mt-0.5 flex size-5 shrink-0 items-center justify-center border text-xs font-semibold",
+                    step.completed ? "border-primary bg-primary text-primary-foreground" : "border-border text-muted-foreground hover:bg-muted"
+                  ),
+                  "aria-label": step.completed ? `Step ${index + 1} complete` : `Mark step ${index + 1} as done`,
+                  children: step.completed ? /* @__PURE__ */ jsx(Check, { className: "size-3", "aria-hidden": "true" }) : index + 1
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-1", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground leading-snug", children: step.label }),
+                step.elementId && onHighlight && !step.completed && /* @__PURE__ */ jsxs(
+                  Button,
+                  {
+                    type: "button",
+                    variant: "ghost",
+                    size: "sm",
+                    onClick: () => onHighlight(step.elementId),
+                    className: "h-auto w-fit gap-1 px-0 py-0 text-xs text-primary hover:bg-transparent hover:underline",
+                    children: [
+                      /* @__PURE__ */ jsx(MousePointerClick, { className: "size-3", "aria-hidden": "true" }),
+                      "Show me"
+                    ]
+                  }
+                )
+              ] })
+            ]
+          },
+          step.id
+        )) })
+      ]
+    }
+  );
+}
+function SupportArticleCard({
+  title,
+  excerpt,
+  href,
+  isExternal = false,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href,
+      target: isExternal ? "_blank" : void 0,
+      rel: isExternal ? "noopener noreferrer" : void 0,
+      className: cn(
+        "mt-2 flex flex-col gap-1.5 border border-border bg-background px-3 py-2.5 text-left no-underline hover:bg-muted/30 text-foreground",
+        className
+      ),
+      "data-slot": "support-article-card",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-sm font-semibold text-foreground", children: title }),
+          isExternal && /* @__PURE__ */ jsx(
+            ExternalLink,
+            {
+              className: "size-3.5 shrink-0 text-muted-foreground",
+              "aria-hidden": "true"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground line-clamp-2 leading-relaxed", children: excerpt }),
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-primary", children: isExternal ? "Open article \u2192" : "Read more \u2192" })
+      ]
+    }
+  );
+}
+
+// src/components/ui/support-agent/support-agent-fab.tsx
+import { HelpCircle, X } from "lucide-react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function SupportAgentFAB({
+  isOpen = false,
+  onClick,
+  hasNudge = false,
+  nudgeMessage,
+  onDismissNudge,
+  position = "bottom-right",
+  className
+}) {
+  const showBubble = hasNudge && !!nudgeMessage && !isOpen;
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      className: cn(
+        "fixed bottom-6 z-50 flex flex-col items-end gap-2",
+        position === "bottom-right" ? "right-6" : "left-6",
+        className
+      ),
+      "data-slot": "support-agent-fab",
+      children: [
+        showBubble && /* @__PURE__ */ jsxs2("div", { className: "relative flex max-w-[220px] items-start gap-2 border border-border bg-background px-3 py-2 shadow-md", children: [
+          /* @__PURE__ */ jsx2("p", { className: "flex-1 text-xs text-foreground leading-relaxed", children: nudgeMessage }),
+          onDismissNudge && /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              onClick: onDismissNudge,
+              className: "mt-0.5 shrink-0 text-muted-foreground hover:text-foreground",
+              "aria-label": "Dismiss",
+              children: /* @__PURE__ */ jsx2(X, { className: "size-3" })
+            }
+          ),
+          /* @__PURE__ */ jsx2(
+            "span",
+            {
+              className: "absolute -bottom-[5px] right-4 size-2.5 rotate-45 border-b border-r border-border bg-background",
+              "aria-hidden": "true"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
+          /* @__PURE__ */ jsx2(
+            Button,
+            {
+              type: "button",
+              size: "icon",
+              onClick,
+              className: "size-12 rounded-full shadow-lg",
+              "aria-label": isOpen ? "Close support assistant" : "Open support assistant",
+              "data-state": isOpen ? "open" : "closed",
+              children: isOpen ? /* @__PURE__ */ jsx2(X, { className: "size-5", "aria-hidden": "true" }) : /* @__PURE__ */ jsx2(HelpCircle, { className: "size-5", "aria-hidden": "true" })
+            }
+          ),
+          hasNudge && !isOpen && /* @__PURE__ */ jsx2(
+            "span",
+            {
+              className: "absolute -right-0.5 -top-0.5 size-3 rounded-full border-2 border-background bg-destructive",
+              "aria-label": "New suggestion",
+              role: "status"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/ui/support-agent/support-agent-panel.tsx
+import * as React2 from "react";
+import { Bot, ChevronLeft, ChevronRight, SquarePen, X as X2 } from "lucide-react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function SupportTypingIndicator() {
+  return /* @__PURE__ */ jsx3(
+    "span",
+    {
+      className: "flex items-center gap-1 py-1",
+      "aria-label": "Assistant is thinking",
+      role: "status",
+      children: [0, 150, 300].map((delay) => /* @__PURE__ */ jsx3(
+        "span",
+        {
+          className: "size-1.5 rounded-full bg-current animate-bounce",
+          style: { animationDelay: `${delay}ms` },
+          "aria-hidden": "true"
+        },
+        delay
+      ))
+    }
+  );
+}
+function MessageBubble({ message }) {
+  const isUser = message.role === "user";
+  const isEmpty = !message.content.trim();
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      className: cn(
+        "flex w-full flex-col",
+        isUser ? "items-end" : "items-start"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs3(
+          "div",
+          {
+            className: cn(
+              "max-w-[88%] px-3 py-2 text-sm",
+              isUser ? "bg-primary text-primary-foreground" : "bg-muted text-foreground",
+              message.isErrored && "bg-destructive/10 text-destructive"
+            ),
+            "data-slot": "support-message-bubble",
+            "data-role": message.role,
+            children: [
+              isEmpty && message.isStreaming ? /* @__PURE__ */ jsx3(SupportTypingIndicator, {}) : /* @__PURE__ */ jsx3("span", { className: "whitespace-pre-wrap break-words leading-relaxed", children: message.content }),
+              message.isErrored && /* @__PURE__ */ jsx3("p", { className: "mt-1 text-xs opacity-70", children: "Failed to send. Please try again." })
+            ]
+          }
+        ),
+        !isUser && message.richContent && /* @__PURE__ */ jsx3("div", { className: "w-full max-w-[88%]", children: /* @__PURE__ */ jsx3(RichContentRenderer, { richContent: message.richContent }) })
+      ]
+    }
+  );
+}
+function RichContentRenderer({ richContent }) {
+  if (richContent.type === "step-guide") {
+    return /* @__PURE__ */ jsx3(
+      SupportStepGuideCard,
+      {
+        title: richContent.title,
+        steps: richContent.steps
+      }
+    );
+  }
+  if (richContent.type === "article") {
+    return /* @__PURE__ */ jsx3(
+      SupportArticleCard,
+      {
+        title: richContent.title,
+        excerpt: richContent.excerpt,
+        href: richContent.href,
+        isExternal: richContent.isExternal
+      }
+    );
+  }
+  return null;
+}
+function SupportAgentPanel({
+  open,
+  onClose,
+  messages = [],
+  recentConversations,
+  suggestedQuestions = [],
+  conversationTitle,
+  context,
+  isStreaming = false,
+  isLoading = false,
+  onSendMessage,
+  onAttachFile,
+  onAttachImage,
+  onNewChat,
+  onBack,
+  onOpenConversation,
+  onViewAllConversations,
+  className
+}) {
+  var _a;
+  const [inputValue, setInputValue] = React2.useState("");
+  const messagesEndRef = React2.useRef(null);
+  const hasMessages = messages.length > 0;
+  const isChatMode = hasMessages && !!conversationTitle;
+  React2.useEffect(() => {
+    if (!messagesEndRef.current) return;
+    messagesEndRef.current.scrollIntoView({
+      behavior: "smooth",
+      block: "nearest"
+    });
+  }, [messages.length]);
+  const handleSend = React2.useCallback(
+    (text) => {
+      onSendMessage == null ? void 0 : onSendMessage(text);
+      setInputValue("");
+    },
+    [onSendMessage]
+  );
+  const handleQuestionSelect = React2.useCallback(
+    (question) => {
+      onSendMessage == null ? void 0 : onSendMessage(question);
+    },
+    [onSendMessage]
+  );
+  const hasRecents = !!(recentConversations == null ? void 0 : recentConversations.length);
+  return /* @__PURE__ */ jsx3(Sheet, { open, onOpenChange: (o) => !o && onClose(), children: /* @__PURE__ */ jsxs3(
+    SheetContent,
+    {
+      side: "right",
+      showCloseButton: false,
+      className: cn(
+        "flex w-[400px] max-w-full flex-col gap-0 p-0",
+        className
+      ),
+      "data-slot": "support-agent-panel",
+      children: [
+        /* @__PURE__ */ jsxs3("div", { className: "shrink-0 border-b border-border px-3 py-2.5", children: [
+          isChatMode ? (
+            /* Chat mode: [←]  Conversation title  [✕] */
+            /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-1", children: [
+              onBack && /* @__PURE__ */ jsxs3(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  className: "size-7 shrink-0",
+                  onClick: onBack,
+                  title: "Back to conversations",
+                  children: [
+                    /* @__PURE__ */ jsx3(ChevronLeft, { className: "size-3.5" }),
+                    /* @__PURE__ */ jsx3("span", { className: "sr-only", children: "Back" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx3("span", { className: "flex-1 truncate px-1 text-sm font-medium text-foreground", children: conversationTitle }),
+              /* @__PURE__ */ jsxs3(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  className: "size-7 shrink-0",
+                  onClick: onClose,
+                  title: "Close",
+                  children: [
+                    /* @__PURE__ */ jsx3(X2, { className: "size-3.5" }),
+                    /* @__PURE__ */ jsx3("span", { className: "sr-only", children: "Close" })
+                  ]
+                }
+              )
+            ] })
+          ) : (
+            /* Home mode: [Bot icon]  Support Assistant  [✕] */
+            /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2.5", children: [
+                /* @__PURE__ */ jsx3("span", { className: "flex size-7 shrink-0 items-center justify-center rounded-full border border-primary/40 bg-primary/10", children: /* @__PURE__ */ jsx3(
+                  Bot,
+                  {
+                    className: "size-3.5 text-foreground",
+                    "aria-hidden": "true"
+                  }
+                ) }),
+                /* @__PURE__ */ jsx3("span", { className: "text-sm font-semibold text-foreground", children: "Support Assistant" })
+              ] }),
+              /* @__PURE__ */ jsxs3(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  className: "size-7",
+                  onClick: onClose,
+                  title: "Close",
+                  children: [
+                    /* @__PURE__ */ jsx3(X2, { className: "size-3.5" }),
+                    /* @__PURE__ */ jsx3("span", { className: "sr-only", children: "Close" })
+                  ]
+                }
+              )
+            ] })
+          ),
+          context && /* @__PURE__ */ jsx3("div", { className: "mt-2", children: /* @__PURE__ */ jsx3(SupportContextChip, { context }) })
+        ] }),
+        /* @__PURE__ */ jsx3("div", { className: "flex flex-1 flex-col overflow-y-auto", children: isLoading ? (
+          /* Loading state */
+          /* @__PURE__ */ jsx3("div", { className: "flex flex-1 items-center justify-center py-20", children: /* @__PURE__ */ jsxs3("div", { className: "flex flex-col items-center gap-3", children: [
+            /* @__PURE__ */ jsx3(Spinner, { size: "lg", className: "text-muted-foreground" }),
+            /* @__PURE__ */ jsx3("p", { className: "text-sm text-muted-foreground", children: "Loading\u2026" })
+          ] }) })
+        ) : !hasMessages ? (
+          /* Home state — Rovo pattern: New Chat CTA + Recents + Suggested */
+          /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-5 p-4", children: [
+            onNewChat && /* @__PURE__ */ jsxs3(
+              Button,
+              {
+                variant: "outline",
+                className: "w-full justify-start gap-2 text-sm font-medium",
+                onClick: onNewChat,
+                disabled: isLoading,
+                children: [
+                  /* @__PURE__ */ jsx3(SquarePen, { className: "size-3.5", "aria-hidden": "true" }),
+                  "New chat"
+                ]
+              }
+            ),
+            hasRecents && /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-1", children: [
+              /* @__PURE__ */ jsx3("p", { className: "px-1 text-xs font-medium uppercase tracking-wide text-muted-foreground", children: "Recents" }),
+              /* @__PURE__ */ jsx3("div", { className: "flex flex-col", children: recentConversations.map((conv) => /* @__PURE__ */ jsxs3(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => onOpenConversation == null ? void 0 : onOpenConversation(conv.id),
+                  className: "flex w-full items-center justify-between gap-2 px-1 py-2.5 text-left text-sm text-foreground hover:bg-muted/50",
+                  children: [
+                    /* @__PURE__ */ jsx3("span", { className: "flex-1 truncate", children: conv.title }),
+                    /* @__PURE__ */ jsx3(
+                      ChevronRight,
+                      {
+                        className: "size-3.5 shrink-0 text-muted-foreground",
+                        "aria-hidden": "true"
+                      }
+                    )
+                  ]
+                },
+                conv.id
+              )) }),
+              onViewAllConversations && /* @__PURE__ */ jsxs3(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: onViewAllConversations,
+                  className: "h-auto w-fit gap-0.5 px-1 py-1 text-xs text-muted-foreground hover:bg-transparent hover:text-foreground",
+                  children: [
+                    "View all conversations",
+                    /* @__PURE__ */ jsx3(ChevronRight, { className: "size-3.5", "aria-hidden": "true" })
+                  ]
+                }
+              )
+            ] }),
+            suggestedQuestions.length > 0 && /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-1.5", children: [
+              /* @__PURE__ */ jsx3("p", { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: "Suggested" }),
+              /* @__PURE__ */ jsx3("div", { className: "flex flex-col gap-1.5", children: suggestedQuestions.map((q) => /* @__PURE__ */ jsx3(
+                SupportSuggestedQuestion,
+                {
+                  question: q,
+                  onSelect: handleQuestionSelect
+                },
+                q
+              )) })
+            ] }),
+            !onNewChat && !hasRecents && !suggestedQuestions.length && /* @__PURE__ */ jsx3("p", { className: "text-sm text-muted-foreground", children: "How can I help you today?" })
+          ] })
+        ) : (
+          /* Chat thread */
+          /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-3 p-4", children: [
+            messages.map((msg) => /* @__PURE__ */ jsx3(MessageBubble, { message: msg }, msg.id)),
+            isStreaming && ((_a = messages[messages.length - 1]) == null ? void 0 : _a.role) === "user" && /* @__PURE__ */ jsx3("div", { className: "flex justify-start", children: /* @__PURE__ */ jsx3("div", { className: "bg-muted px-3 py-2 text-muted-foreground", children: /* @__PURE__ */ jsx3(SupportTypingIndicator, {}) }) }),
+            /* @__PURE__ */ jsx3("div", { ref: messagesEndRef, "aria-hidden": "true" })
+          ] })
+        ) }),
+        /* @__PURE__ */ jsx3("div", { className: "shrink-0 border-t border-border p-3", children: /* @__PURE__ */ jsx3(
+          ChatInputArea,
+          {
+            value: inputValue,
+            onChange: setInputValue,
+            onSend: handleSend,
+            onAttachFile,
+            onAttachImage,
+            disabled: isLoading || isStreaming,
+            placeholder: "Ask anything\u2026"
+          }
+        ) })
+      ]
+    }
+  ) });
+}
+
+export {
+  SupportContextChip,
+  SupportSuggestedQuestion,
+  SupportStepGuideCard,
+  SupportArticleCard,
+  SupportAgentFAB,
+  SupportAgentPanel
+};