chore: add ability to bypass height controls on Expander

ably · Apr 26, 2024 · 7ed5089 · 7ed5089
1 parent 5c3f9d8
commit 7ed5089
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 2 deletions.
diff --git a/src/core/Expander.tsx b/src/core/Expander.tsx
@@ -20,12 +20,12 @@ const Expander = ({
     setContentHeight(innerRef.current?.clientHeight ?? height);
   }, [height, expanded]);
 
-  const showControls = contentHeight > height;
+  const showControls = height > 0 && contentHeight > height;
 
   return (
     <>
       <div
-        style={{ height: expanded ? contentHeight : height }}
+        style={{ ...(height && { height: expanded ? contentHeight : height }) }}
         className={`overflow-hidden transition-all relative ${className ?? ""}`}
       >
         {showControls && !expanded && (

diff --git a/src/core/Expander/Expander.stories.tsx b/src/core/Expander/Expander.stories.tsx
@@ -130,3 +130,23 @@ export const OverriddenStyles = {
     },
   },
 };
+
+export const Bypassed = {
+  render: () => (
+    <Expander
+      className="bg-neutral-400 p-16 rounded-lg"
+      fadeClassName="from-neutral-800"
+      height={0}
+    >
+      {longContentInner}
+    </Expander>
+  ),
+  parameters: {
+    docs: {
+      description: {
+        story:
+          "A set height of 0, which means that no expansion behaviour is applied.",
+      },
+    },
+  },
+};