@ably/ui 14.3.1 → 14.3.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/core/Expander.js +1 -1
- package/package.json +3 -3
package/core/Expander.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import React,{useEffect,useRef,useState}from"react";const Expander=({heightThreshold=200,className,fadeClassName,children})=>{const innerRef=useRef(null);const[showControls,setShowControls]=useState(false);const[height,setHeight]=useState(heightThreshold);const[expanded,setExpanded]=useState(false);useEffect(()=>{const contentHeight=innerRef.current?.clientHeight??heightThreshold;if(contentHeight<heightThreshold){setHeight("auto")}else if(expanded){setHeight(contentHeight)}else{setHeight(heightThreshold)}setShowControls(contentHeight>=heightThreshold)},[heightThreshold,expanded]);return React.createElement(React.Fragment,null,React.createElement("div",{style:{height},className:`overflow-hidden transition-all relative ${className??""}`},showControls&&!expanded&&React.createElement("div",{className:`h-64 w-full bg-gradient-to-t from-white to-transparent absolute bottom-0 left-0 right-0 ${fadeClassName??""}`}),React.createElement("div",{ref:innerRef},children)),showControls&&React.createElement("div",{onClick:()=>setExpanded(!expanded),onKeyDown:e=>e.key==="Enter"&&setExpanded(!expanded),tabIndex:0,
|
|
1
|
+
import React,{useEffect,useRef,useState}from"react";const Expander=({heightThreshold=200,className,fadeClassName,controlsClassName,controlsOpenedLabel,controlsClosedLabel,children})=>{const innerRef=useRef(null);const[showControls,setShowControls]=useState(false);const[height,setHeight]=useState(heightThreshold);const[expanded,setExpanded]=useState(false);useEffect(()=>{const contentHeight=innerRef.current?.clientHeight??heightThreshold;if(contentHeight<heightThreshold){setHeight("auto")}else if(expanded){setHeight(contentHeight)}else{setHeight(heightThreshold)}setShowControls(contentHeight>=heightThreshold)},[heightThreshold,expanded]);return React.createElement(React.Fragment,null,React.createElement("div",{style:{height},"data-testid":"expander-container",className:`overflow-hidden transition-all relative ${className??""}`},showControls&&!expanded&&React.createElement("div",{className:`h-64 w-full bg-gradient-to-t from-white to-transparent absolute bottom-0 left-0 right-0 ${fadeClassName??""}`}),React.createElement("div",{ref:innerRef},children)),showControls&&React.createElement("div",{onClick:()=>setExpanded(!expanded),onKeyDown:e=>e.key==="Enter"&&setExpanded(!expanded),tabIndex:0,"data-testid":"expander-controls",className:`mt-16 cursor-pointer font-bold text-gui-blue-default-light hover:text-gui-blue-hover-light ${controlsClassName??""}`},expanded?controlsOpenedLabel??"View less -":controlsClosedLabel??"View all +"))};export default Expander;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ably/ui",
|
|
3
|
-
"version": "14.3.
|
|
3
|
+
"version": "14.3.2",
|
|
4
4
|
"description": "Home of the Ably design system library ([design.ably.com](https://design.ably.com)). It provides a showcase, development/test environment and a publishing pipeline for different distributables.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -57,8 +57,8 @@
|
|
|
57
57
|
"start": "vite --port 5000",
|
|
58
58
|
"storybook": "yarn build && storybook dev -p 6006",
|
|
59
59
|
"build-storybook": "yarn build && storybook build --quiet -o preview",
|
|
60
|
-
"test": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && npx http-server preview --port
|
|
61
|
-
"test:update-snapshots": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && npx http-server preview --port
|
|
60
|
+
"test": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && npx http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook --url http://127.0.0.1:6007\"",
|
|
61
|
+
"test:update-snapshots": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && npx http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook -u --url http://127.0.0.1:6007\""
|
|
62
62
|
|
|
63
63
|
},
|
|
64
64
|
"dependencies": {
|