@nexusui/components
Version:
These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.
2 lines (1 loc) • 1.16 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("@mui/material/Typography"),n=require("@lexical/react/LexicalComposerContext");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=o(r);exports.ReadMorePlugin=({maxLines:r=3,selected:o,onLayoutChange:s,t:i})=>{const[u]=n.useLexicalComposerContext(),[c,l]=t.useState(!1),[x,p]=t.useState(!1),m=t.useRef(),d=t.useRef();t.useEffect((()=>{const e=u.getRootElement();if(e){m.current=e;const t=parseInt(window.getComputedStyle(e).lineHeight,10),n=e.clientHeight,o=t*r;d.current=o,p(n>o),e.style.maxHeight=`${o}px`}}),[u,r]),t.useEffect((()=>{m.current&&(m.current.style.maxHeight=o?"unset":`${d.current}px`,l(!!o))}),[o]);const f=i(c?"readLess":"readMore");return x?e.jsx(a.default,{"data-testid":"show-more-text",component:"div",variant:"caption",color:"primary",sx:{mx:0,mt:3,mb:.5,alignSelf:"flex-start",cursor:"pointer",display:"inline-block"},onClick:e=>{e.stopPropagation();const t=!c;m.current&&(m.current.style.maxHeight=t?"unset":`${d.current}px`),l(t),s?.()},children:f}):e.jsx(e.Fragment,{})};