@luscii-healthtech/web-ui 27.12.0 → 27.13.0

package/dist/components/Collapse/Collapse.d.ts

@@ -1,11 +1,25 @@
 import React from "react";
 type Props = {
     children: React.ReactNode;
+    /**
+     * Use this prop to apply a custom class name to the root element
+     */
     className?: string;
-    disabled?: boolean;
+    /**
+     * Use this prop to control the height of the collapsed content
+     * for example by using Tailwinds line-clamp utility classes.
+     * Hiding the overflow will be handled by the component.
+     *
+     * If this prop is not supplied, the component will not collapse and get the height of the content.
+     *
+     * @example "h-20"
+     * @example "ui-line-clamp-5"
+     */
+    contentClassName?: string;
     isCollapsed?: boolean;
     onClick?: () => void;
     moreIndicator?: React.ReactNode;
+    showMoreIndicator?: boolean;
 };
 export declare const Collapse: (props: Props) => React.JSX.Element;
 export {};

package/dist/index.development.js

@@ -2149,9 +2149,9 @@ const ModalBase = (props) => {
       { isOpen, data: { "test-id": (_a = props.dataTestId) !== null && _a !== void 0 ? _a : "react-modal" }, contentLabel: props.title, overlayClassName: classNames__default.default("ui-px-2 ui-py-15", "ui-z-20", "ui-fixed ui-top-0 ui-bottom-0 ui-left-0 ui-right-0", "ui-overflow-x-hidden ui-overflow-y-auto", "ui-bg-overlay"), onRequestClose: props.onCloseClick, shouldFocusAfterRender: false, shouldCloseOnOverlayClick: false, className: classNames__default.default("ui-mx-auto ui-my-0", "ui-relative", "ui-rounded-lg ui-bg-white ui-shadow-lg ui-outline-none", {
         "ui-overflow-y-hidden": props.scrollableContent,
         "ui-mt-17": props.withExtraMarginTop,
-        "ui-w-80": size === "small",
-        "ui-w-132": size === "medium",
-        "ui-w-216": size === "wide"
+        "md:ui-w-80": size === "small",
+        "md:ui-w-132": size === "medium",
+        "md:ui-w-216": size === "wide"
       }) },
       props.title && React__namespace.default.createElement(ModalHeader, { title: props.title, onCloseClick: props.onCloseClick }),
       React__namespace.default.createElement(
@@ -6194,15 +6194,20 @@ const Indicator = () => {
 HoverIndicatorControl.Indicator = Indicator;
 
 const Collapse = (props) => {
-  const { children, className: classNameFromProps, disabled, isCollapsed, onClick, moreIndicator = React__namespace.default.createElement(Text, { className: "ui-text-center" }, "...") } = props;
-  const className = classNames__default.default("w-full", classNameFromProps, {
+  const { children, className, contentClassName: classNameFromProps, isCollapsed, onClick, moreIndicator = React__namespace.default.createElement(Text, { className: "ui-text-center" }, "..."), showMoreIndicator = true } = props;
+  const contentClassName = classNames__default.default("w-full", classNameFromProps, {
     "ui-overflow-hidden": isCollapsed
   });
+  const buttonClassName = classNames__default.default("ui-text-left", className);
   return React__namespace.default.createElement(
     React__namespace.default.Fragment,
     null,
-    React__namespace.default.createElement("button", { disabled, className, onClick, "aria-expanded": !isCollapsed }, children),
-    isCollapsed && moreIndicator
+    React__namespace.default.createElement(
+      "button",
+      { className: buttonClassName, onClick, "aria-expanded": !isCollapsed },
+      React__namespace.default.createElement("div", { className: contentClassName }, children),
+      isCollapsed && showMoreIndicator && moreIndicator
+    )
   );
 };