@daoyi/nmtl-ui 1.1.43-beta.57 → 1.1.43-beta.58

package/lib/components/CollapseContent.js

@@ -1 +1 @@
-import e,{useState as t,useRef as n,useEffect as o,useMemo as l}from"react";import{s,c as a}from"./style-inject.es-22541f49.js";import r from"prop-types";import{Typography as c}from"@material-ui/core";import i from"./MoreButton.js";import"./_commonjsHelpers-ae1b5db5.js";import"@material-ui/icons";const p=new(0,require("html-to-react").Parser),d=require("markdown-it")({html:!1,xhtmlOut:!0,breaks:!0,langPrefix:"language-",linkify:!1,typographer:!1,quotes:"“”‘’",highlight:()=>""});s(".collapseContent__desc {\n  font-size: 1.5rem !important; }\n  .collapseContent__desc code,\n  .collapseContent__desc p {\n    font-family: 'Noto Sans TC', 'Arial', sans-serif !important;\n    display: -webkit-box;\n    overflow: hidden;\n    -webkit-box-orient: vertical;\n    white-space: pre-wrap;\n    word-break: break-all; }\n  .collapseContent__desc p,\n  .collapseContent__desc pre {\n    margin: 0; }\n  .collapseContent__desc--1 code,\n  .collapseContent__desc--1 p {\n    -webkit-line-clamp: 1; }\n  .collapseContent__desc--2 code,\n  .collapseContent__desc--2 p {\n    -webkit-line-clamp: 2; }\n  .collapseContent__desc--3 code,\n  .collapseContent__desc--3 p {\n    -webkit-line-clamp: 3; }\n  .collapseContent__desc--4 code,\n  .collapseContent__desc--4 p {\n    -webkit-line-clamp: 4; }\n  .collapseContent__desc--5 code,\n  .collapseContent__desc--5 p {\n    -webkit-line-clamp: 5; }\n  .collapseContent__desc--10 code,\n  .collapseContent__desc--10 p {\n    -webkit-line-clamp: 10; }\n  .collapseContent__desc--lightHeight code,\n  .collapseContent__desc--lightHeight p {\n    line-height: 2.25; }\n  .collapseContent__desc--expand code,\n  .collapseContent__desc--expand p {\n    -webkit-line-clamp: initial; }\n");const m=s=>{const{className:r,content:m,textColor:_,fontSize:C,lineClamp:g,useLightHeight:h,useTextIndent:f}=s,{formatMessage:u,primaryColor:b,secondaryColor:x,shadowColor:w}=s;if(!m)return e.createElement(e.Fragment,null);const[y,k]=t(!1),[v,H]=t(!1),N=n();o((()=>{if(m&&N&&N.current){const e=N.current.getElementsByTagName("code")[0]||N.current.getElementsByTagName("p")[0],{clientHeight:t,scrollHeight:n}=e||{};H(n>t)}}),[N,m]);const{fontSizeRem:S,textIndent:z}=l((()=>({fontSizeRem:C/16+"rem",textIndent:C/16*2+"rem"})),[C]);return e.createElement("div",{className:a("collapseContent",r)},e.createElement(c,{ref:N,variant:"inherit",className:a("collapseContent__desc",`collapseContent__desc--${g<=5?g:10}`,{"collapseContent__desc--expand":y},{"collapseContent__desc--lightHeight":h}),color:"textSecondary",style:{color:_,fontSize:S,textIndent:f?z:void 0}},void 0===(E=m)?"":p.parse(d.render(E))),v&&e.createElement(i,{small:!0,primaryColor:b,secondaryColor:x,shadowColor:w,formatMessage:u,expand:y,setExpand:k}));var E};m.defaultProps={className:void 0,content:void 0,textColor:void 0,fontSize:24,lineClamp:2,useLightHeight:void 0,useTextIndent:!0,formatMessage:void 0,primaryColor:"#271702",secondaryColor:"#aa8859",shadowColor:void 0},m.propTypes={className:r.string,content:r.string,textColor:r.string,fontSize:r.number,lineClamp:r.number,useLightHeight:r.bool,useTextIndent:r.bool,formatMessage:r.func,primaryColor:r.string,secondaryColor:r.string,shadowColor:r.string};export{m as default};
+import e,{useState as n,useRef as t,useEffect as o}from"react";import{s as l,c as s}from"./style-inject.es-22541f49.js";import a from"prop-types";import{Typography as r}from"@material-ui/core";import i from"./MoreButton.js";import"./_commonjsHelpers-ae1b5db5.js";import"@material-ui/icons";l(".collapseContent__desc {\n  font-size: 1.5rem !important;\n  text-indent: 3rem;\n  font-family: 'Noto Sans TC', 'Arial', sans-serif !important;\n  display: -webkit-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n  white-space: pre-wrap;\n  word-break: break-all; }\n  .collapseContent__desc p,\n  .collapseContent__desc pre {\n    margin: 0; }\n  .collapseContent__desc--1 {\n    -webkit-line-clamp: 1; }\n  .collapseContent__desc--2 {\n    -webkit-line-clamp: 2; }\n  .collapseContent__desc--3 {\n    -webkit-line-clamp: 3; }\n  .collapseContent__desc--4 {\n    -webkit-line-clamp: 4; }\n  .collapseContent__desc--5 {\n    -webkit-line-clamp: 5; }\n  .collapseContent__desc--10 {\n    -webkit-line-clamp: 10; }\n  .collapseContent__desc--lightHeight {\n    line-height: 2.25; }\n  .collapseContent__desc--expand {\n    -webkit-line-clamp: initial; }\n  .collapseContent__desc--indent {\n    text-indent: 3rem; }\n");const c=l=>{const{className:a,content:c,textColor:p,lineClamp:d,useLightHeight:m,useTextIndent:C}=l,{formatMessage:_,primaryColor:g,secondaryColor:h,shadowColor:f}=l;if(!c)return e.createElement(e.Fragment,null);const[b,u]=n(),[w,v]=n(),x=t();return o((()=>{if(c&&x&&x.current){const e=x.current,{clientHeight:n,scrollHeight:t}=e||{};v(t>n)}}),[x,c]),e.createElement("div",{className:s("collapseContent",a)},e.createElement(r,{ref:x,variant:"inherit",className:s("collapseContent__desc",`collapseContent__desc--${d<=5?d:10}`,{"collapseContent__desc--indent":C},{"collapseContent__desc--expand":b},{"collapseContent__desc--lightHeight":m}),color:"textSecondary",style:{color:p}},(y=c)&&0!==y.length?e.createElement("div",{dangerouslySetInnerHTML:{__html:`<div>${y.replaceAll("\n\n","\n").split("\n").join("<div/><br/><div>")}</div>`}}):y),w&&e.createElement(i,{small:!0,primaryColor:g,secondaryColor:h,shadowColor:f,formatMessage:_,expand:b,setExpand:u}));var y};c.defaultProps={className:void 0,content:void 0,textColor:void 0,lineClamp:2,useLightHeight:void 0,useTextIndent:!0,formatMessage:void 0,primaryColor:"#271702",secondaryColor:"#aa8859",shadowColor:void 0},c.propTypes={className:a.string,content:a.string,textColor:a.string,lineClamp:a.number,useLightHeight:a.bool,useTextIndent:a.bool,formatMessage:a.func,primaryColor:a.string,secondaryColor:a.string,shadowColor:a.string};export{c as default};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@daoyi/nmtl-ui",
-	"version": "1.1.43-beta.57",
+	"version": "1.1.43-beta.58",
 	"description": "This project is to be used as a starter kit for building React component using Storybook and Rollup",
 	"author": "daoyi",
 	"main": "lib/index.js",