@luscii-healthtech/web-ui 42.4.5 → 42.5.1

package/dist/index.development.js

@@ -2048,7 +2048,7 @@ function TagIcon({ colorTheme, size }) {
 }
 
 function ChatBubble(props) {
-  const { as: Component = "div", children, className, sender: _, timestamp: __, readReceipt, color = "blue", tipPosition } = props, rest = __rest(props, ["as", "children", "className", "sender", "timestamp", "readReceipt", "color", "tipPosition"]);
+  const { as: Component = "div", children, className, sender: _, timestamp: __, readReceipt, color = "blue", tipPosition, footerAccessory } = props, rest = __rest(props, ["as", "children", "className", "sender", "timestamp", "readReceipt", "color", "tipPosition", "footerAccessory"]);
   const isInteractive = (Component === "button" || Component === "a") && !rest.disabled;
   const tipPositionClasses = classNames__default.default({
     "ui:hidden": !tipPosition,
@@ -2071,10 +2071,10 @@ function ChatBubble(props) {
   return jsxRuntime.jsx(Component, Object.assign({}, rest, { className: classNames__default.default("ui:group/chat-bubble ui:text-left", {
     "ui:pl-[16px]": tipPosition === "top-left" || tipPosition === "bottom-left",
     "ui:pr-[16px]": tipPosition === "top-right" || tipPosition === "bottom-right"
-  }, transitionClasses, className), children: jsxRuntime.jsxs("div", { className: classNames__default.default("ui:transition-colors ui:duration-150 ui:ease-out", backgroundColorClasses, "ui:relative ui:grid ui:gap-xxs ui:p-m ui:radius-m", {
+  }, transitionClasses, className), children: jsxRuntime.jsxs("div", { className: classNames__default.default("ui:transition-colors ui:duration-150 ui:ease-out", backgroundColorClasses, "ui:relative ui:grid ui:p-m ui:radius-m", {
     "ui:group-hover/chat-bubble:bg-blue-50": isInteractive && color === "blue",
     "ui:group-hover/chat-bubble:bg-slate-50": isInteractive && color === "grey"
-  }), children: [jsxRuntime.jsx("div", { className: classNames__default.default(tipColorClasses, tipPositionClasses, transitionClasses, "ui:absolute ui:h-[11px] ui:w-[11px] ui:transform ui:border-11") }), jsxRuntime.jsx(Meta, Object.assign({}, props)), jsxRuntime.jsx(Content$1, { children }), jsxRuntime.jsx("div", { className: "ui:absolute ui:radius-m" }), readReceipt && jsxRuntime.jsx(Text, { variant: "sm", children: readReceipt })] }) }));
+  }), children: [jsxRuntime.jsx("div", { className: classNames__default.default(tipColorClasses, tipPositionClasses, transitionClasses, "ui:absolute ui:h-[11px] ui:w-[11px] ui:transform ui:border-11") }), jsxRuntime.jsx(Meta, Object.assign({}, props)), jsxRuntime.jsxs(Stack, { width: "full", gap: "xxs", children: [jsxRuntime.jsx(Content$1, { children }), readReceipt || footerAccessory ? jsxRuntime.jsxs(Stack, { axis: "x", gap: "xxs", align: "center", divider: jsxRuntime.jsx(Text, { as: "span", color: "on-surface-variant", children: "\u2022" }), children: [readReceipt && jsxRuntime.jsx(Text, { variant: "sm", children: readReceipt }), footerAccessory] }) : null] })] }) }));
 }
 function Meta(props) {
   const { sender, timestamp } = props;
@@ -2095,7 +2095,7 @@ function ChatBubbleText(props) {
 }
 ChatBubble.Text = ChatBubbleText;
 function ChatBubbleDateIndicator(props) {
-  return jsxRuntime.jsx("div", { className: "ui:flex ui:justify-center", children: jsxRuntime.jsx(Tag, { colorTheme: "gray", size: "small", children: props.children }) });
+  return jsxRuntime.jsx("div", { className: "ui:flex ui:justify-center", children: jsxRuntime.jsx(Tag, { colorTheme: "gray", size: "small", className: "ui:py-2", children: props.children }) });
 }
 ChatBubble.DateIndicator = ChatBubbleDateIndicator;
 
@@ -5257,9 +5257,9 @@ const VerticalMenu = (props) => {
   const shouldShowCollapseButton = localization && Boolean(onCollapseButtonClick);
   const hasHeaderContent = title || shouldShowCollapseButton;
   const contextValue = React.useMemo(() => ({ variant }), [variant]);
-  return jsxRuntime.jsx(context$1.Provider, { value: contextValue, children: jsxRuntime.jsxs(Stack, Object.assign({ as: "div", px: "xxs", py: "m", align: "normal", className: classNames__default.default("ui:max-w-full", {
+  return jsxRuntime.jsx(context$1.Provider, { value: contextValue, children: jsxRuntime.jsxs(Stack, Object.assign({ as: "div", px: "xxs", py: "m", align: "normal", className: classNames__default.default("ui:max-w-full", "ui:max-h-full", {
     [DEFAULT_TEXT_CLASS_NAME]: isCollapsed
-  }, className) }, rest, { children: [header && jsxRuntime.jsx("div", { children: header }), jsxRuntime.jsxs(Stack, { axis: "x", gap: "xxs", p: hasHeaderContent ? "m" : void 0, align: "start", justify: "between", width: "full", children: [title && jsxRuntime.jsx(Box, { children: jsxRuntime.jsx(Text, { variant: "lg-strong", children: title }) }), shouldShowCollapseButton && jsxRuntime.jsx(
+  }, className) }, rest, { children: [jsxRuntime.jsxs(Stack, { width: "full", children: [header && jsxRuntime.jsx(Box, { width: "full", children: header }), jsxRuntime.jsxs(Stack, { axis: "x", gap: "xxs", p: hasHeaderContent ? "m" : void 0, align: "start", justify: "between", width: "full", children: [title && jsxRuntime.jsx(Box, { children: jsxRuntime.jsx(Text, { variant: "lg-strong", children: title }) }), shouldShowCollapseButton && jsxRuntime.jsx(
     Box,
     {
       /**
@@ -5284,7 +5284,7 @@ const VerticalMenu = (props) => {
         children: jsxRuntime.jsx(SidebarIcon, {})
       }) })
     }
-  )] }), isPrimaryVariant && hasHeaderContent && jsxRuntime.jsx(VerticalMenu.Divider, {}), jsxRuntime.jsx(Stack, { width: "full", gap: isCollapsed ? "xxs" : void 0, children: props.children }), jsxRuntime.jsx("div", { className: "ui:mt-auto", children: footer })] })) });
+  )] })] }), isPrimaryVariant && hasHeaderContent && jsxRuntime.jsx(VerticalMenu.Divider, {}), jsxRuntime.jsx(Stack, { width: "full", className: "ui:flex-1 ui:overflow-y-auto", gap: isCollapsed ? "xxs" : void 0, children: props.children }), jsxRuntime.jsx("div", { className: "ui:mt-auto", children: footer })] })) });
 };
 VerticalMenu.Divider = MenuDivider;
 VerticalMenu.Item = MenuItem;