@landtrustinc/design-system 1.2.5-beta.0 → 1.2.5-beta.2

package/dist/index.d.ts

@@ -1307,8 +1307,13 @@ type ChatWidgetProps = {
      * Number to display in notification badge on trigger button
      */
     notificationCount?: number;
+    /**
+     * Whether to close the widget when clicking outside
+     * @default true
+     */
+    closeOnClickOutside?: boolean;
 };
-declare const ChatWidget: ({ title, messages, onSubmit, placeholder, disabled, className, ariaLabel, panelWidth, expanded, defaultExpanded, onExpandedChange, isThinking, thinkingText, emptyState, containerProps, suggestedPrompts, onPromptClick, suggestedPromptsTitle, notificationCount, }: ChatWidgetProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ChatWidget: ({ title, messages, onSubmit, placeholder, disabled, className, ariaLabel, panelWidth, expanded, defaultExpanded, onExpandedChange, isThinking, thinkingText, emptyState, containerProps, suggestedPrompts, onPromptClick, suggestedPromptsTitle, notificationCount, closeOnClickOutside, }: ChatWidgetProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type DividerProps = React__default.HTMLAttributes<HTMLHRElement> & SpaceProps & {
     /**
@@ -2163,6 +2168,11 @@ type WidgetProps = {
      * Additional props for the container
      */
     containerProps?: BoxProps;
+    /**
+     * Whether to close the widget when clicking outside
+     * @default true
+     */
+    closeOnClickOutside?: boolean;
 };
 type WidgetTriggerProps = {
     /**

package/dist/index.js

@@ -4932,11 +4932,9 @@ var panelContainer = import_react25.css`
   bottom: calc(100% + var(--spacing-2));
   z-index: 1;
 
-  @media (max-width: calc(${screens.sm} - 1px)) {
+  @media (max-width: calc(${screens.md} - 1px)) {
     position: fixed;
     inset: 0;
-    right: 0;
-    bottom: 0;
     display: flex;
     align-items: stretch;
     justify-content: stretch;
@@ -4948,13 +4946,11 @@ var panelCard = (width2) => import_react25.css`
   border: 1px solid var(--border-primary);
   border-radius: var(--radius-lg);
   padding: var(--spacing-4);
-  overflow: auto;
   box-shadow: 0 0 var(--shadow-blur-lg, 24px) var(--shadow-spread-xs, -4px)
     rgba(17, 17, 17, 0.1);
 
   /* Width passed from props (desktop/tablet) */
   width: ${typeof width2 === "number" ? `${width2}px` : width2};
-  max-height: 90vh;
 
   /* Scale animation on open */
   transform-origin: bottom right;
@@ -4969,13 +4965,14 @@ var panelCard = (width2) => import_react25.css`
     }
   }
 
-  @media (max-width: calc(${screens.sm} - 1px)) {
+  @media (max-width: calc(${screens.md} - 1px)) {
     width: 100vw;
     height: 100vh;
+    max-height: 100vh;
     border-radius: 0;
     padding: var(--spacing-4);
     overflow: auto;
-    transform-origin: center;
+    animation: none;
   }
 `;
 var widgetTrigger = import_react25.css`
@@ -5033,7 +5030,8 @@ var WidgetRoot = ({
   panelWidth,
   className,
   children,
-  containerProps
+  containerProps,
+  closeOnClickOutside = true
 }) => {
   const [internalExpanded, setInternalExpanded] = (0, import_react26.useState)(defaultExpanded);
   const isControlled = typeof expanded === "boolean";
@@ -5059,7 +5057,7 @@ var WidgetRoot = ({
     [isExpanded, setExpanded]
   );
   (0, import_react26.useEffect)(() => {
-    if (!isExpanded)
+    if (!isExpanded || !closeOnClickOutside)
       return;
     const onDocClick = (e) => {
       const target = e.target;
@@ -5071,7 +5069,7 @@ var WidgetRoot = ({
     };
     document.addEventListener("mousedown", onDocClick);
     return () => document.removeEventListener("mousedown", onDocClick);
-  }, [isExpanded, setExpanded]);
+  }, [isExpanded, setExpanded, closeOnClickOutside]);
   (0, import_react26.useEffect)(() => {
     if (!isExpanded)
       return;
@@ -5136,9 +5134,11 @@ var containerStyles = import_react27.css`
   flex-direction: column;
   min-height: 0;
   height: 765px;
+  max-height: 80vh;
 
-  @media (max-width: calc(${screens.sm} - 1px)) {
+  @media (max-width: calc(${screens.md} - 1px)) {
     height: 100%;
+    max-height: 100%;
   }
 `;
 var thinkingRowStyles = import_react27.css`
@@ -5336,7 +5336,8 @@ var ChatWidget = ({
   suggestedPrompts,
   onPromptClick,
   suggestedPromptsTitle = "Other Helpful Topics",
-  notificationCount
+  notificationCount,
+  closeOnClickOutside = true
 }) => {
   const [value, setValue] = (0, import_react30.useState)("");
   const scrollRef = (0, import_react30.useRef)(null);
@@ -5389,6 +5390,7 @@ var ChatWidget = ({
       panelWidth,
       className,
       containerProps,
+      closeOnClickOutside,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime214.jsx)(Box_default, { mt: 2, children: /* @__PURE__ */ (0, import_jsx_runtime214.jsx)(AskBuckButton_default, { badgeCount: notificationCount }) }),
         /* @__PURE__ */ (0, import_jsx_runtime214.jsx)(Widget_default.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime214.jsxs)(Box_default, { css: containerStyles, children: [