@useloops/design-system 1.4.677 → 1.4.678

package/dist/esm/systems/WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js

@@ -1 +1 @@
-import{jsxs as e,jsx as o}from"react/jsx-runtime";import{styled as r,Box as t,useTheme as s}from"@mui/material";import{useRef as i,useState as n,useEffect as a}from"react";import{usePrevious as l}from"../../../utils/usePrevious.js";import{Text as d}from"../Text/Text.js";import c from"./components/ExpandCollapseButton/ExpandCollapseButton.js";import m from"./components/GradientShim/GradientShim.js";import{createShimGradient as u}from"./helpers/shimUtils.js";const p=r(t)(()=>({position:"absolute",bottom:0,right:0,display:"flex",alignItems:"center",overflow:"hidden"})),h=({onShowMoreClick:r,onShowLessClick:h,disabled:x,backgroundColorOverride:f,dimmed:g,sizing:b="sm",slotProps:w,...v})=>{const B=s(),y=i(null),[C,k]=n(!1),T=l(C),j=()=>{if(!y.current)return;const{scrollHeight:e,clientHeight:o}=y.current;k(e>o)};return a(()=>{if(y.current){j();new ResizeObserver(j).observe(y.current)}return()=>{}},[v.children]),e(t,{sx:{position:"relative"},id:"ExpandableTypography",children:[o(d,{ref:y,clamp:2,disabled:x||g,...v}),void 0!==r&&C&&e(p,{className:"ExpandableTypography__show-more-container",children:[o(m,{...w?.gradientBox,sizing:b}),o(t,{className:"ExpandableTypography__show-more-button",sx:{backgroundColor:f??B.custom.palette.surface.default,boxShadow:u(f??B.custom.palette.surface.default),...w?.showMoreButton?.sx},children:o(c,{sizing:b,disabled:x,onClick:x?void 0:r,...w?.showMoreButton,children:"More"})})]}),void 0!==h&&T&&!C&&e(p,{children:[o(m,{...w?.gradientBox,sx:w?.gradientBox?.sx,sizing:b}),o(t,{className:"ExpandableTypography__show-more-button",sx:{backgroundColor:f??B.custom.palette.surface.default,boxShadow:u(f??B.custom.palette.surface.default),...w?.showLessButton?.sx},children:o(c,{sizing:b,onClick:x?void 0:h,...w?.showLessButton,sx:w?.showLessButton?.sx,children:"Less"})})]})]})};export{h as default};
+import{jsxs as e,jsx as o}from"react/jsx-runtime";import{styled as s,Box as r,useTheme as t}from"@mui/material";import{useRef as i,useState as n,useEffect as a}from"react";import{usePrevious as l}from"../../../utils/usePrevious.js";import{Text as d}from"../Text/Text.js";import c from"./components/ExpandCollapseButton/ExpandCollapseButton.js";import p from"./components/GradientShim/GradientShim.js";import{createShimGradient as m}from"./helpers/shimUtils.js";const h=s(r)(()=>({position:"absolute",bottom:0,right:0,display:"flex",alignItems:"center",overflow:"hidden"})),u=({onShowMoreClick:s,onShowLessClick:u,disabled:x,backgroundColorOverride:f,dimmed:b,sizing:g="sm",slotProps:w,...y})=>{const v=t(),C=i(null),[B,T]=n(!1),_=l(B),j=()=>{if(!C.current)return;const{scrollHeight:e,clientHeight:o}=C.current;T(e>o)};return a(()=>{if(C.current){j();new ResizeObserver(j).observe(C.current)}return()=>{}},[y.children]),e(r,{sx:{position:"relative"},id:"ExpandableTypography",children:[o(d,{ref:C,clamp:2,disabled:x||b,...y,size:g}),void 0!==s&&B&&e(h,{className:"ExpandableTypography__show-more-container",children:[o(p,{...w?.gradientBox,sizing:g}),o(r,{className:"ExpandableTypography__show-more-button",sx:{backgroundColor:f??v.custom.palette.surface.default,boxShadow:m(f??v.custom.palette.surface.default),...w?.showMoreButton?.sx},children:o(c,{sizing:g,disabled:x,onClick:x?void 0:s,...w?.showMoreButton,children:"More"})})]}),void 0!==u&&_&&!B&&o(r,{className:"ExpandableTypography__show-less-container",sx:{display:"flex",justifyContent:"flex-end"},children:o(r,{className:"ExpandableTypography__show-less-button",sx:{...w?.showLessButton?.sx},children:o(c,{sizing:g,onClick:x?void 0:u,...w?.showLessButton,sx:w?.showLessButton?.sx,children:"Less"})})})]})};export{u as default};

package/dist/systems/WebCore/ExpandableTypographyClamp/ExpandableTypographyClamp.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),s=require("@mui/material"),r=require("react"),o=require("../../../utils/usePrevious.js"),t=require("../Text/Text.js"),i=require("./components/ExpandCollapseButton/ExpandCollapseButton.js"),n=require("./components/GradientShim/GradientShim.js"),a=require("./helpers/shimUtils.js");const l=s.styled(s.Box)(()=>({position:"absolute",bottom:0,right:0,display:"flex",alignItems:"center",overflow:"hidden"}));module.exports=({onShowMoreClick:u,onShowLessClick:d,disabled:c,backgroundColorOverride:x,dimmed:h,sizing:p="sm",slotProps:m,...g})=>{const b=s.useTheme(),f=r.useRef(null),[j,w]=r.useState(!1),B=o.usePrevious(j),v=()=>{if(!f.current)return;const{scrollHeight:e,clientHeight:s}=f.current;w(e>s)};return r.useEffect(()=>{if(f.current){v();new ResizeObserver(v).observe(f.current)}return()=>{}},[g.children]),e.jsxs(s.Box,{sx:{position:"relative"},id:"ExpandableTypography",children:[e.jsx(t.Text,{ref:f,clamp:2,disabled:c||h,...g}),void 0!==u&&j&&e.jsxs(l,{className:"ExpandableTypography__show-more-container",children:[e.jsx(n,{...m?.gradientBox,sizing:p}),e.jsx(s.Box,{className:"ExpandableTypography__show-more-button",sx:{backgroundColor:x??b.custom.palette.surface.default,boxShadow:a.createShimGradient(x??b.custom.palette.surface.default),...m?.showMoreButton?.sx},children:e.jsx(i,{sizing:p,disabled:c,onClick:c?void 0:u,...m?.showMoreButton,children:"More"})})]}),void 0!==d&&B&&!j&&e.jsxs(l,{children:[e.jsx(n,{...m?.gradientBox,sx:m?.gradientBox?.sx,sizing:p}),e.jsx(s.Box,{className:"ExpandableTypography__show-more-button",sx:{backgroundColor:x??b.custom.palette.surface.default,boxShadow:a.createShimGradient(x??b.custom.palette.surface.default),...m?.showLessButton?.sx},children:e.jsx(i,{sizing:p,onClick:c?void 0:d,...m?.showLessButton,sx:m?.showLessButton?.sx,children:"Less"})})]})]})};
+"use strict";var e=require("react/jsx-runtime"),s=require("@mui/material"),o=require("react"),r=require("../../../utils/usePrevious.js"),t=require("../Text/Text.js"),i=require("./components/ExpandCollapseButton/ExpandCollapseButton.js"),n=require("./components/GradientShim/GradientShim.js"),a=require("./helpers/shimUtils.js");const l=s.styled(s.Box)(()=>({position:"absolute",bottom:0,right:0,display:"flex",alignItems:"center",overflow:"hidden"}));module.exports=({onShowMoreClick:u,onShowLessClick:d,disabled:c,backgroundColorOverride:x,dimmed:h,sizing:p="sm",slotProps:m,...b})=>{const g=s.useTheme(),j=o.useRef(null),[f,w]=o.useState(!1),y=r.usePrevious(f),B=()=>{if(!j.current)return;const{scrollHeight:e,clientHeight:s}=j.current;w(e>s)};return o.useEffect(()=>{if(j.current){B();new ResizeObserver(B).observe(j.current)}return()=>{}},[b.children]),e.jsxs(s.Box,{sx:{position:"relative"},id:"ExpandableTypography",children:[e.jsx(t.Text,{ref:j,clamp:2,disabled:c||h,...b,size:p}),void 0!==u&&f&&e.jsxs(l,{className:"ExpandableTypography__show-more-container",children:[e.jsx(n,{...m?.gradientBox,sizing:p}),e.jsx(s.Box,{className:"ExpandableTypography__show-more-button",sx:{backgroundColor:x??g.custom.palette.surface.default,boxShadow:a.createShimGradient(x??g.custom.palette.surface.default),...m?.showMoreButton?.sx},children:e.jsx(i,{sizing:p,disabled:c,onClick:c?void 0:u,...m?.showMoreButton,children:"More"})})]}),void 0!==d&&y&&!f&&e.jsx(s.Box,{className:"ExpandableTypography__show-less-container",sx:{display:"flex",justifyContent:"flex-end"},children:e.jsx(s.Box,{className:"ExpandableTypography__show-less-button",sx:{...m?.showLessButton?.sx},children:e.jsx(i,{sizing:p,onClick:c?void 0:d,...m?.showLessButton,sx:m?.showLessButton?.sx,children:"Less"})})})]})};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@useloops/design-system",
-    "version": "1.4.677",
+    "version": "1.4.678",
     "description": "The official React based Loops design system",
     "main": "dist/index.js",
     "module": "dist/esm/index.js",