@soul-refiner/design-system 2.14.61 → 2.14.63

package/dist/components/surfaces/drawer/drawer.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),_function=require("../../../utils/function.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const DrawerContext=React__default.default.createContext([!1,()=>{}]),Drawer=({children:e,controlledOpen:r,onOpenChange:t})=>{const[a,o]=React__default.default.useState(r||!1);React__default.default.useEffect(()=>{void 0!==r&&o(r)},[r]);var l,d=[],n=[];let i=null,c=null;for(const p of React__default.default.Children.toArray(e))React__default.default.isValidElement(p)&&("Drawer.Trigger"===(l=p.type?.displayName)?d.push(p):"Drawer.Header"===l?c=p:"Drawer.Footer"===l?i=p:n.push(p));return React__default.default.createElement(DrawerContext.Provider,{value:[a,o]},d,a&&React__default.default.createElement(Background,{onClick:_function.callAll(()=>o(!1),()=>t&&t())}),React__default.default.createElement(Component,{$open:a},c&&React__default.default.createElement(HeaderWrapper,null,c),React__default.default.createElement(ContentWrapper,null,n),i&&React__default.default.createElement(FooterWrapper,null,i)))},Background=styled.styled.div`
+"use strict";var r=require("react/jsx-runtime"),e=require("react"),o=require("styled-components"),i=require("../../../utils/function.js");function t(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var a=t(e);const l=a.default.createContext([!1,()=>{}]),n=({children:e,controlledOpen:o,onOpenChange:t})=>{const[n,u]=a.default.useState(o||!1);a.default.useEffect(()=>{void 0!==o&&u(o)},[o]);const h=a.default.Children.toArray(e),g=[],w=[];let v=null,b=null;for(const r of h)if(a.default.isValidElement(r)){const e=r.type?.displayName;"Drawer.Trigger"===e?g.push(r):"Drawer.Header"===e?b=r:"Drawer.Footer"===e?v=r:w.push(r)}return r.jsxs(l.Provider,{value:[n,u],children:[g,n&&r.jsx(d,{onClick:i.callAll(()=>u(!1),()=>t&&t())}),r.jsxs(s,{$open:n,children:[b&&r.jsx(c,{children:b}),r.jsx(p,{children:w}),v&&r.jsx(x,{children:v})]})]})},d=o.styled.div`
   position: fixed;
   height: 100vh;
   width: 100vw;
@@ -11,7 +11,7 @@
   background: #000000;
   opacity: 0.5;
   cursor: pointer;
-`,Component=styled.styled.div`
+`,s=o.styled.div`
   position: fixed;
   top: 0;
   right: 0;
@@ -27,8 +27,8 @@
   transition: margin-right 0.5s;
   background-color: var(--color-grey-10);
 
-  ${({$open:e})=>e?"margin-right: 0px;":""}
-`,HeaderWrapper=styled.styled.div`
+  ${({$open:r})=>r?"margin-right: 0px;":""}
+`,c=o.styled.div`
   background-color: var(--color-white);
   box-shadow: var(--elevation-2);
   filter: drop-shadow(var(--elevation-2));
@@ -36,7 +36,7 @@
   position: sticky;
   top: 0;
   border-radius: 16px 0px 0px 0px;
-`,ContentWrapper=styled.styled.div`
+`,p=o.styled.div`
   height: calc(100vh - 224px);
   position: relative;
   display: flex;
@@ -62,11 +62,11 @@
     background-color: var(--color-grey-6);
     opacity: 30%;
   }
-`,FooterWrapper=styled.styled.div`
+`,x=o.styled.div`
   background-color: var(--color-white);
   box-shadow: var(--elevation-1);
   position: -webkit-sticky;
   position: sticky;
   bottom: 0;
   border-radius: 0px 0px 0px 16px;
-`,DrawerTrigger=({children:e})=>{const[,r]=React__default.default.useContext(DrawerContext);return e&&React__default.default.cloneElement(e,{onClick:_function.callAll(()=>r(e=>!e),e.props.onClick)})},DrawerHeader=(DrawerTrigger.displayName="Drawer.Trigger",Drawer.Trigger=DrawerTrigger,({children:e})=>React__default.default.createElement("div",null,e)),DrawerContent=(DrawerHeader.displayName="Drawer.Header",Drawer.Header=DrawerHeader,({children:e})=>React__default.default.createElement("div",null,e)),DrawerFooter=(DrawerContent.displayName="Drawer.Content",Drawer.Content=DrawerContent,({children:e})=>React__default.default.createElement("div",null,e));DrawerFooter.displayName="Drawer.Footer",Drawer.Footer=DrawerFooter,exports.Drawer=Drawer;
+`,u=({children:r})=>{const[,e]=a.default.useContext(l);return r&&a.default.cloneElement(r,{onClick:i.callAll(()=>e(r=>!r),r.props.onClick)})};u.displayName="Drawer.Trigger",n.Trigger=u;const h=({children:e})=>r.jsx("div",{children:e});h.displayName="Drawer.Header",n.Header=h;const g=({children:e})=>r.jsx("div",{children:e});g.displayName="Drawer.Content",n.Content=g;const w=({children:e})=>r.jsx("div",{children:e});w.displayName="Drawer.Footer",n.Footer=w,exports.Drawer=n;

package/dist/components/surfaces/message/message.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),avatar=require("../../iconography/avatar/avatar.js"),box=require("../../atoms/box/box.js"),paragraph=require("../../atoms/typography/paragraph.js"),heading=require("../../atoms/typography/heading.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const Message=({messages:d,userId:u})=>{const c=React__default.default.useId();return React__default.default.createElement(box.Box,{$display:"flex",$dir:"column",$gap:16},d.map(({content:e,createdDate:a,senderAvatarURI:t,senderHref:r,senderId:l,senderName:o},i)=>{var n=l===u,l=d?.[i-1]?.senderId!==l;return n?React__default.default.createElement(React__default.default.Fragment,{key:c+i},l&&React__default.default.createElement(paragraph.P,{$color:"grey-4",$fontSize:12,$lineHeight:16,sx:"margin-top: 40px; margin-left: auto;"},a.toLocaleDateString()," ",a.toLocaleTimeString()),React__default.default.createElement(Wrapper,{$isSelf:n},e)):React__default.default.createElement(React__default.default.Fragment,{key:c+i},l&&React__default.default.createElement(avatar.Avatar,{image:t,href:r,subtitle:React__default.default.createElement(paragraph.P,{as:"span",$color:"blue-2",$fontSize:12,$lineHeight:16,sx:"vertical-align: top;"},a.toLocaleTimeString()),size:56,sx:"margin-top: 40px;",textPosition:"right",title:React__default.default.createElement(heading.H,{as:"span",$color:"blue-2",$fontSize:18,$lineHeight:26,$mediumBold:!0},o)}),React__default.default.createElement(Wrapper,{$isSelf:n},e))}))},Wrapper=styled.styled.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),a=require("../../iconography/avatar/avatar.js"),i=require("../../atoms/box/box.js"),o=require("../../atoms/typography/paragraph.js"),n=require("../../atoms/typography/heading.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=s(r);const d=t.styled.div`
   max-width: 552px;
   padding: 16px;
   border-radius: 16px;
@@ -8,14 +8,5 @@
   line-height: 20px;
   letter-spacing: -0.006em;
 
-  ${({$isSelf:e})=>e?`
-    margin-left: auto;
-    color: var(--color-white);
-    background-color: var(--color-primary-blue-2);
-    border-top-right-radius: 0px;`:`
-    margin-left: 68px;
-    margin-right: auto;
-    color: var(--color-grey-3);
-    background-color: var(--color-grey-9);
-    border-top-left-radius: 0px;`}
-`;exports.Message=Message;
+  ${({$isSelf:e})=>e?"\n    margin-left: auto;\n    color: var(--color-white);\n    background-color: var(--color-primary-blue-2);\n    border-top-right-radius: 0px;":"\n    margin-left: 68px;\n    margin-right: auto;\n    color: var(--color-grey-3);\n    background-color: var(--color-grey-9);\n    border-top-left-radius: 0px;"}
+`;exports.Message=({messages:r,userId:t})=>{const s=l.default.useId();return e.jsx(i.Box,{$display:"flex",$dir:"column",$gap:16,children:r.map(({content:i,createdDate:c,senderAvatarURI:g,senderHref:u,senderId:p,senderName:x},m)=>{const f=p===t,h=r?.[m-1]?.senderId!==p;return f?e.jsxs(l.default.Fragment,{children:[h&&e.jsxs(o.P,{$color:"grey-4",$fontSize:12,$lineHeight:16,sx:"margin-top: 40px; margin-left: auto;",children:[c.toLocaleDateString()," ",c.toLocaleTimeString()]}),e.jsx(d,{$isSelf:f,children:i})]},s+m):e.jsxs(l.default.Fragment,{children:[h&&e.jsx(a.Avatar,{image:g,href:u,subtitle:e.jsx(o.P,{as:"span",$color:"blue-2",$fontSize:12,$lineHeight:16,sx:"vertical-align: top;",children:c.toLocaleTimeString()}),size:56,sx:"margin-top: 40px;",textPosition:"right",title:e.jsx(n.H,{as:"span",$color:"blue-2",$fontSize:18,$lineHeight:26,$mediumBold:!0,children:x})}),e.jsx(d,{$isSelf:f,children:i})]},s+m)})})};

package/dist/components/surfaces/modal/modal.js

@@ -1,11 +1,7 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),button=require("../../actions/button/button.js"),close=require("../../../icons/basic/close.js"),_function=require("../../../utils/function.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const ModalContext=React__default.default.createContext([!1,()=>{}]),Modal=({alwaysRender:e=!0,controlledOpen:t,onChange:a,children:l,...o})=>{const[n,d]=React__default.default.useState(t||!1);React__default.default.useEffect(()=>{void 0!==t&&d(t)},[t]),React__default.default.useEffect(()=>{a&&a(n)},[n]);let r;const i=[];return React__default.default.Children.forEach(l,e=>{var t=React__default.default.isValidElement(e)&&e.type?.displayName;t&&t.toLowerCase().includes("trigger")?r=e:i.push(e)}),React__default.default.createElement(ModalContext.Provider,{value:[n,d],...o},r,(n||e)&&i)},ModalTrigger=({children:e})=>{const[,t]=React__default.default.useContext(ModalContext);return e&&React__default.default.cloneElement(e,{onClick:_function.callAll(()=>t(!0),e.props.onClick,e=>{e?.stopPropagation(),e?.preventDefault()})})},ModalDismiss=(ModalTrigger.displayName="Modal.Trigger",Modal.Trigger=ModalTrigger,({children:e,setClosed:t})=>{const[,a]=React__default.default.useContext(ModalContext);return e&&React__default.default.cloneElement(e,{onClick:_function.callAll(()=>a(!1),e.props.onClick,e=>{t&&t(),e?.stopPropagation(),e?.preventDefault()})})}),ModalContent=(ModalDismiss.displayName="Modal.Dismiss",Modal.Dismiss=ModalDismiss,({backgroundDark:e=!0,children:t,footer:a,header:l,setClosed:o,sx:n,preventOutsideClick:d=!1,...r})=>{const[i,s]=React__default.default.useContext(ModalContext);return React__default.default.createElement(Wrapper,{$backgroundDark:e,$open:i,onClick:e=>{d||e.currentTarget==e.target&&(e.preventDefault(),e.stopPropagation(),e.preventDefault(),o?o():s(!1))}},React__default.default.createElement(Content,{...r,$sx:n},l&&React__default.default.createElement("div",{className:"header"},React__default.default.createElement("div",null,l),React__default.default.createElement(Modal.Dismiss,{setClosed:o},React__default.default.createElement(button.Button,{icon:React__default.default.createElement(close.Close,null),type:"special"}))),t,a&&React__default.default.createElement("div",{className:"footer"},a)))}),Wrapper=(ModalContent.displayName="Modal.Content",Modal.Content=ModalContent,styled.styled.div`
-  ${({$open:e})=>e?`display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;`:"display: none;"}
-  ${({$backgroundDark:e})=>e?`background: rgba(0, 0, 0, 0.5);
-    cursor: pointer;`:""}
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("styled-components"),o=require("../../actions/button/button.js"),s=require("../../../icons/basic/close.js"),l=require("../../../utils/function.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=r(t);const a=i.default.createContext([!1,()=>{}]),d=({alwaysRender:t=!0,controlledOpen:n,onChange:o,children:s,...l})=>{const[r,d]=i.default.useState(n||!1);let c;i.default.useEffect(()=>{void 0!==n&&d(n)},[n]),i.default.useEffect(()=>{o&&o(r)},[r]);const u=[];return i.default.Children.forEach(s,e=>{const t=i.default.isValidElement(e)&&e.type?.displayName;t&&t.toLowerCase().includes("trigger")?c=e:u.push(e)}),e.jsxs(a.Provider,{value:[r,d],...l,children:[c,(r||t)&&u]})},c=({children:e})=>{const[,t]=i.default.useContext(a);return e&&i.default.cloneElement(e,{onClick:l.callAll(()=>t(!0),e.props.onClick,e=>{e?.stopPropagation(),e?.preventDefault()})})};c.displayName="Modal.Trigger",d.Trigger=c;const u=({children:e,setClosed:t})=>{const[,n]=i.default.useContext(a);return e&&i.default.cloneElement(e,{onClick:l.callAll(()=>n(!1),e.props.onClick,e=>{t&&t(),e?.stopPropagation(),e?.preventDefault()})})};u.displayName="Modal.Dismiss",d.Dismiss=u;const p=({backgroundDark:t=!0,children:n,footer:l,header:r,setClosed:c,sx:u,preventOutsideClick:p=!1,...h})=>{const[g,m]=i.default.useContext(a),v=i.default.useRef(!1);return e.jsx(f,{$backgroundDark:t,$open:g,onMouseUp:e=>{null===e.target.closest("[data-modal-content]")&&!v.current&&(c?c():m(!1))},onMouseDown:e=>{v.current=null!==e.target.closest("[data-modal-content]")},children:e.jsxs(x,{...h,$sx:u,"data-modal-content":!0,children:[r&&e.jsxs("div",{className:"header",children:[e.jsx("div",{children:r}),e.jsx(d.Dismiss,{setClosed:c,children:e.jsx(o.Button,{icon:e.jsx(s.Close,{}),type:"special"})})]}),n,l&&e.jsx("div",{className:"footer",children:l})]})})};p.displayName="Modal.Content",d.Content=p;const f=n.styled.div`
+  ${({$open:e})=>e?"display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;":"display: none;"}
+  ${({$backgroundDark:e})=>e?"background: rgba(0, 0, 0, 0.5);\n    cursor: pointer;":""}
   position: fixed;
   top: 0;
   left: 0;
@@ -15,7 +11,7 @@
   padding: 0px;
   margin: 0px;
   overflow: hidden;
-`),Content=styled.styled.div`
+`,x=n.styled.div`
   position: absolute;
   z-index: 101;
   background-color: var(--color-white);
@@ -41,4 +37,4 @@
     padding-top: 16px;
   }
   ${({$sx:e})=>e||""}
-`;exports.Modal=Modal;
+`;exports.Modal=d;

package/dist/components/surfaces/portal/portal.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";var React=require("react"),ReactDOM=require("react-dom");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),ReactDOM__default=_interopDefaultCompat(ReactDOM);const Portal=({children:e,wrapperId:a="root-portal-wrapper"})=>{const[t,r]=React__default.default.useState(null);return React__default.default.useEffect(()=>{let e=document.getElementById(a),t=!1;return e||(t=!0,(e=document.createElement("div")).setAttribute("id",a),document.body.appendChild(e)),r(e),()=>{t&&e?.parentNode&&e.parentNode.removeChild(e)}},[a]),t?ReactDOM__default.default.createPortal(e,t):null};exports.Portal=Portal;
+"use strict";var e=require("react"),t=require("react-dom");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=r(e);exports.Portal=({children:e,wrapperId:r="root-portal-wrapper"})=>{const[d,u]=a.default.useState(null);return a.default.useEffect(()=>{let e=document.getElementById(r),t=!1;return e||(t=!0,e=document.createElement("div"),e.setAttribute("id",r),document.body.appendChild(e)),u(e),()=>{t&&e?.parentNode&&e.parentNode.removeChild(e)}},[r]),d?t.createPortal(e,d):null};

package/dist/components/surfaces/post/post.js

@@ -1,10 +1,5 @@
 "use client";
-"use strict";var React=require("react"),Image=require("next/image"),Link=require("next/link"),styled=require("styled-components"),ShowMoreText=require("react-show-more-text"),regex=require("../../../common/regex.js"),box=require("../../atoms/box/box.js"),highlighter=require("../../atoms/highlighter/highlighter.js"),heading=require("../../atoms/typography/heading.js"),paragraph=require("../../atoms/typography/paragraph.js"),modal=require("../modal/modal.js"),time_ago=(require("../../atoms/typography/display.js"),require("../../atoms/typography/typography.js"),require("../../atoms/time_ago/time_ago.js")),avatar=require("../../iconography/avatar/avatar.js"),lock=require("../../../icons/security/lock.js"),chevron_left=require("../../../icons/arrow/chevron_left.js"),chevron_right=require("../../../icons/arrow/chevron_right.js"),video=require("../../media/video/video.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),Image__default=_interopDefaultCompat(Image),Link__default=_interopDefaultCompat(Link),ShowMoreText__default=_interopDefaultCompat(ShowMoreText);const Post=({actions:e,author:t,authorActive:a,authorHref:l,authorImage:r,avatarTooltipContent:i,avatarTooltipSx:o,children:n,content:d,createdDate:u,dropdown:c,hasComments:s,id:f,images:p,isPaidUser:h,isPaywalled:m=!1,link:_,video:g,onJoin:x,monthlyMembershipPrice:y,onImageClick:v})=>{const w=React__default.default.useId(),R=React__default.default.useRef(null),[b,E]=React__default.default.useState(!1),[$,k]=React__default.default.useState(-1),[C,j]=React__default.default.useState(!1),[q,L]=React__default.default.useState(-1),[S,P]=React__default.default.useState({x:"30vw",y:"30vh"});var W=!!g?.url&&!!g?.thumbnail,e=(React__default.default.useEffect(()=>{if(R.current&&0<d?.length){var t=Math.ceil(R.current.offsetHeight/24);if(k(t),!b)try{var e=R.current.style.webkitLineClamp,a=(R.current.style.webkitLineClamp="none",R.current.offsetHeight),l=Math.ceil(a/24);R.current.style.webkitLineClamp=e,j(3<l)}catch(e){j(3<=t)}}else k(-1),j(!1)},[d,b]),React__default.default.useEffect(()=>{const e=e=>{"ArrowLeft"===e.key?I():"ArrowRight"===e.key?H():"Escape"!==e.key&&"Enter"!==e.key||L(-1)};return"undefined"!=typeof document&&p?.length&&-1<q&&document.addEventListener("keydown",e),()=>{p?.length&&document.removeEventListener("keydown",e)}},[]),React__default.default.Children.toArray(e)),n=React__default.default.Children.toArray(n);const H=()=>{L(e=>p?.length&&e!==p.length-1?e+1:e)},I=()=>{L(e=>p?.length&&0!==e?e-1:e)};return React__default.default.createElement(Wrapper,{id:f},-1<q&&!!p?.[q]&&React__default.default.createElement(modal.Modal,{alwaysRender:!1,controlledOpen:!0,onChange:e=>!e&&L(-1)},React__default.default.createElement(modal.Modal.Content,{sx:`
-            position: relative; 
-            height: ${S.y}; 
-            width: ${S.x};
-            margin: 0 auto;
-            `},React__default.default.createElement(NavArrow,{$side:"left",$visible:0!==q,onClick:I},React__default.default.createElement(chevron_left.ChevronLeft,{color:"white",size:48})),React__default.default.createElement(Image__default.default,{alt:"",fill:!0,quality:100,onLoad:e=>{var{naturalHeight:e,naturalWidth:t}=e.target;let a=t+"px",l=e+"px";window?.innerHeight<e&&window?.innerWidth<t?(a=Math.floor(.95*window.innerHeight*t/e)+"px",l=Math.round(.95*window.innerWidth*e/t)+"px"):window?.innerHeight<e?(a=Math.floor(.95*window.innerHeight*t/e)+"px",l="95vh"):window?.innerWidth<t&&(a="95vw",l=Math.round(.95*window.innerWidth*e/t)+"px"),P({x:a,y:l})},draggable:!1,priority:!0,sizes:"100vw",src:p[q],style:{objectFit:"cover"}}),React__default.default.createElement(NavArrow,{$side:"right",$visible:q!==p.length-1,onClick:H},React__default.default.createElement(chevron_right.ChevronRight,{color:"white",size:48})))),React__default.default.createElement(Header,null,React__default.default.createElement(avatar.Avatar,{isPaidUser:h,as:l?Link__default.default:"button",href:l,image:r,size:64,status:a?"online":void 0,subtitle:React__default.default.createElement(paragraph.P,{as:"span",sx:"vertical-align: top;",$fontSize:14,$lineHeight:20},React__default.default.createElement(time_ago.TimeAgo,{date:new Date(u)})),title:React__default.default.createElement(heading.H,{as:l?Link__default.default:"span",href:l,sx:"text-decoration:none;",$bold:!0,$fontSize:18,$lineHeight:26},t),textPosition:"right",tooltipContent:i,tooltipSx:o,sx:l?"img { cursor: pointer; }":void 0}),c),!!d?.length&&React__default.default.createElement("div",{style:{padding:"16px 24px"}},m&&1<$?React__default.default.createElement(ShowMoreText__default.default,{lines:2,more:"Continue Reading",onClick:x,anchorClass:"see-more",expanded:!1,truncatedEndingComponent:"... "},React__default.default.createElement(paragraph.P,{$sx:"white-space: pre-line; word-break: break-word;",$textClampLines:2},React__default.default.createElement(highlighter.Highlighter,{highlightRender:e=>React__default.default.createElement(paragraph.P,{as:"span",$color:"primary-blue-2"},React__default.default.createElement(Link__default.default,{href:e,target:"_blank"},e)),seperator:regex.URL_REGEX,text:d}))):React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(paragraph.P,{$sx:"white-space: pre-line; word-break: break-word;",innerRef:R,$textClampLines:b?void 0:5},React__default.default.createElement(highlighter.Highlighter,{highlightRender:e=>React__default.default.createElement(paragraph.P,{as:"span",$color:"primary-blue-2"},React__default.default.createElement(Link__default.default,{href:e,target:"_blank"},e)),seperator:regex.URL_REGEX,text:m&&1===$?"This is a premium post. Join to the membership to unlock the full access.":d})),C&&!m?React__default.default.createElement(paragraph.P,{$color:"grey-5",sx:"cursor:pointer;",$mediumBold:!0,$fontSize:14,onClick:()=>E(e=>!e)},b?"See less":"See more"):null),m&&!p?.length&&React__default.default.createElement(JoinNow,{onClick:x},React__default.default.createElement(paragraph.P,{$fontSize:14,$mediumBold:!0},"Join now for $",y," per month"))),m&&!!p?.length&&!W&&React__default.default.createElement(BlurredContentWrapper,null,React__default.default.createElement(Image__default.default,{alt:"",width:650,height:427,priority:!0,quality:100,src:p[0],style:{objectFit:"fill",height:"100%",width:"100%",filter:"blur(60px)",position:"absolute",top:0,left:"50%",transform:"translateX(-50%)"}}),React__default.default.createElement(lock.Lock,{size:40,color:"white",sx:"z-index: 1"}),React__default.default.createElement("div",{style:{display:"flex",flexDirection:"column",zIndex:1}},React__default.default.createElement(paragraph.P,{$color:"white",$fontSize:14,$bold:!0,$lineHeight:20},"Become a member"),React__default.default.createElement(paragraph.P,{$color:"white",$fontSize:14,$bold:!0,$lineHeight:20},"to unlock this post")),React__default.default.createElement(JoinNow,{onClick:x,style:{zIndex:1,marginTop:0}},React__default.default.createElement(paragraph.P,{$fontSize:14,$mediumBold:!0},"Join now for $",y," per month"))),!!p?.length&&!W&&!m&&React__default.default.createElement(ImagesWrapper,{$numImages:p.length},p.slice(0,4).map((e,t)=>React__default.default.createElement(ImageWrapper,{key:""+w+e.slice(0,15)+t},React__default.default.createElement(Image__default.default,{alt:"",fill:!0,onClick:()=>{v?.(t),L(t)},quality:100,src:e,draggable:!1,style:{cursor:"pointer",objectFit:"cover"}}))),4<p.length&&React__default.default.createElement(heading.H,{as:"p",className:"more-than",sx:"pointer-events: none;",$color:"grey-10",$fontSize:28,$lineHeight:36,$semiBold:!0},"+",p.length-4)),!p?.length&&!W&&_&&!m&&React__default.default.createElement(Link__default.default,{href:_.url,target:"_blank"},React__default.default.createElement(ImageWrapper,null,React__default.default.createElement(Image__default.default,{alt:"",fill:!0,quality:100,src:_.imageUrl,draggable:!1,style:{cursor:"pointer",objectFit:"cover"}})),React__default.default.createElement(box.Box,{$dir:"column",$gap:8,sx:"padding: 8px 16px;"},React__default.default.createElement(paragraph.P,{$color:"grey-2",$semiBold:!0},_.title),React__default.default.createElement(paragraph.P,{$color:"grey-5"},_.description))),W&&React__default.default.createElement(VideoWrapper,null,React__default.default.createElement(video.Video,{src:g.url,thumbnail:g.thumbnail,subtitles:[],title:g?.title})),!!e.length&&React__default.default.createElement(ActionsWrapper,null,!m&&e),s&&!!n.length&&React__default.default.createElement(CommentWrapper,null,n))},Wrapper=styled.styled.div`
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),i=require("next/image"),r=require("next/link"),n=require("styled-components"),o=require("react-show-more-text"),l=require("../../../common/regex.js"),s=require("../../atoms/box/box.js"),a=require("../../atoms/highlighter/highlighter.js"),d=require("../../atoms/typography/heading.js"),h=require("../../atoms/typography/paragraph.js"),c=require("../modal/modal.js");require("../../atoms/typography/display.js"),require("../../atoms/typography/typography.js");var x=require("../../atoms/time_ago/time_ago.js"),p=require("../../iconography/avatar/avatar.js"),u=require("../../../icons/security/lock.js"),g=require("../../../icons/arrow/chevron_left.js"),f=require("../../../icons/arrow/chevron_right.js"),m=require("../../media/video/video.js");function y(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var w=y(t),j=y(i),v=y(r),b=y(o);const $=n.styled.div`
   position: relative;
   max-width: 700px;
   width: 100%;
@@ -21,18 +16,18 @@
     text-decoration: underline;
     cursor: pointer;
   }
-`,Header=(styled.styled.button`
+`;n.styled.button`
   background: none;
   border: none;
   cursor: pointer;
   color: var(--color-grey-5);
-`,styled.styled.div`
+`;const k=n.styled.div`
   padding: 16px 24px;
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   border-bottom: 1px solid var(--color-grey-9);
-`),ImagesWrapper=styled.styled.div`
+`,C=n.styled.div`
   position: relative;
   display: flex;
   gap: 8px;
@@ -50,25 +45,8 @@
     text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
   }
 
-  ${({$numImages:e})=>1<e?`
-    div {
-      min-width: calc(50% - 4px);
-      max-width: calc(50% - 4px);
-
-      flex:1;
-      img {
-        object-fit: cover;
-        width: 100%;
-        height: 100%;
-      }
-    }`:`
-    div > img {
-      object-fit: contain;
-      width: 100%;
-      height: 100%;
-    }
-    `}
-`,ImageWrapper=styled.styled.div`
+  ${({$numImages:e})=>e>1?"\n    div {\n      min-width: calc(50% - 4px);\n      max-width: calc(50% - 4px);\n\n      flex:1;\n      img {\n        object-fit: cover;\n        width: 100%;\n        height: 100%;\n      }\n    }":"\n    div > img {\n      object-fit: contain;\n      width: 100%;\n      height: 100%;\n    }\n    "}
+`,q=n.styled.div`
   position: relative;
   aspect-ratio: 700 / 427;
   flex: 1;
@@ -83,11 +61,11 @@
     height: 100%;
     pointer-events: none;
   }
-`,VideoWrapper=styled.styled.div`
+`,z=n.styled.div`
   position: relative;
   width: 100%;
   height: 480px;
-`,BlurredContentWrapper=styled.styled.div`
+`,P=n.styled.div`
   position: relative;
   display: flex;
   flex-direction: column;
@@ -97,17 +75,17 @@
   justify-content: center;
   gap: 16px;
   overflow: hidden;
-`,ActionsWrapper=styled.styled.div`
+`,H=n.styled.div`
   display: flex;
   justify-content: space-around;
   align-items: center;
   padding: 24px;
-`,CommentWrapper=styled.styled.div`
+`,S=n.styled.div`
   padding: 24px;
   display: flex;
   flex-flow: column nowrap;
   gap: 24px;
-`,NavArrow=styled.styled.button`
+`,L=n.styled.button`
   width: 48px;
   height: 150px;
   display: flex;
@@ -123,7 +101,7 @@
   &:hover {
     background-color: rgba(0, 0, 0, 0.2);
   }
-`,JoinNow=styled.styled.div`
+`,R=n.styled.div`
   margin-top: 24px;
   border-radius: 32px;
   border: 1px solid var(--color-grey-8);
@@ -131,4 +109,4 @@
   padding: 6px 16px;
   width: fit-content;
   cursor: pointer;
-`;exports.Post=Post;
+`;exports.Post=({actions:t,author:i,authorActive:r,authorHref:n,authorImage:o,avatarTooltipContent:y,avatarTooltipSx:E,children:M,content:_,createdDate:A,dropdown:B,hasComments:I,id:F,images:T,isPaidUser:U,isPaywalled:W=!1,link:J,video:D,onJoin:X,monthlyMembershipPrice:G,onImageClick:N})=>{const O=w.default.useId(),V=w.default.useRef(null),[K,Q]=w.default.useState(!1),[Y,Z]=w.default.useState(-1),[ee,te]=w.default.useState(!1),[ie,re]=w.default.useState(-1),[ne,oe]=w.default.useState({x:"30vw",y:"30vh"}),le=!!D?.url&&!!D?.thumbnail;w.default.useEffect(()=>{if(V.current&&_?.length>0){const e=24,t=Math.ceil(V.current.offsetHeight/e);if(Z(t),!K)try{const t=V.current.style.webkitLineClamp;V.current.style.webkitLineClamp="none";const i=V.current.offsetHeight,r=Math.ceil(i/e);V.current.style.webkitLineClamp=t,te(r>3)}catch(e){te(t>=3)}}else Z(-1),te(!1)},[_,K]),w.default.useEffect(()=>{const e=e=>{"ArrowLeft"===e.key?he():"ArrowRight"===e.key?de():"Escape"!==e.key&&"Enter"!==e.key||re(-1)};return"undefined"!=typeof document&&T?.length&&ie>-1&&document.addEventListener("keydown",e),()=>{T?.length&&document.removeEventListener("keydown",e)}},[]);const se=w.default.Children.toArray(t),ae=w.default.Children.toArray(M),de=()=>{re(e=>T?.length&&e!==T.length-1?e+1:e)},he=()=>{re(e=>T?.length&&0!==e?e-1:e)};return e.jsxs($,{id:F,children:[ie>-1&&!!T?.[ie]&&e.jsx(c.Modal,{alwaysRender:!1,controlledOpen:!0,onChange:e=>!e&&re(-1),children:e.jsxs(c.Modal.Content,{sx:`\n            position: relative; \n            height: ${ne.y}; \n            width: ${ne.x};\n            margin: 0 auto;\n            `,children:[e.jsx(L,{$side:"left",$visible:0!==ie,onClick:he,children:e.jsx(g.ChevronLeft,{color:"white",size:48})}),e.jsx(j.default,{alt:"",fill:!0,quality:100,onLoad:e=>{const{naturalHeight:t,naturalWidth:i}=e.target;let r=`${i}px`,n=`${t}px`;window?.innerHeight<t&&window?.innerWidth<i?(r=`${Math.floor(.95*window.innerHeight*i/t)}px`,n=`${Math.round(.95*window.innerWidth*t/i)}px`):window?.innerHeight<t?(r=`${Math.floor(.95*window.innerHeight*i/t)}px`,n="95vh"):window?.innerWidth<i&&(r="95vw",n=`${Math.round(.95*window.innerWidth*t/i)}px`),oe({x:r,y:n})},draggable:!1,priority:!0,sizes:"100vw",src:T[ie],style:{objectFit:"cover"}}),e.jsx(L,{$side:"right",$visible:ie!==T.length-1,onClick:de,children:e.jsx(f.ChevronRight,{color:"white",size:48})})]})}),e.jsxs(k,{children:[e.jsx(p.Avatar,{isPaidUser:U,as:n?v.default:"button",href:n,image:o,size:64,status:r?"online":void 0,subtitle:e.jsx(h.P,{as:"span",sx:"vertical-align: top;",$fontSize:14,$lineHeight:20,children:e.jsx(x.TimeAgo,{date:new Date(A)})}),title:e.jsx(d.H,{as:n?v.default:"span",href:n,sx:"text-decoration:none;",$bold:!0,$fontSize:18,$lineHeight:26,children:i}),textPosition:"right",tooltipContent:y,tooltipSx:E,sx:n?"img { cursor: pointer; }":void 0}),B]}),!!_?.length&&e.jsxs("div",{style:{padding:"16px 24px"},children:[W&&Y>1?e.jsx(b.default,{lines:2,more:"Continue Reading",onClick:X,anchorClass:"see-more",expanded:!1,truncatedEndingComponent:"... ",children:e.jsx(h.P,{$sx:"white-space: pre-line; word-break: break-word;",$textClampLines:2,children:e.jsx(a.Highlighter,{highlightRender:t=>e.jsx(h.P,{as:"span",$color:"primary-blue-2",children:e.jsx(v.default,{href:t,target:"_blank",children:t})}),seperator:l.URL_REGEX,text:_})})}):e.jsxs(e.Fragment,{children:[e.jsx(h.P,{$sx:"white-space: pre-line; word-break: break-word;",innerRef:V,$textClampLines:K?void 0:5,children:e.jsx(a.Highlighter,{highlightRender:t=>e.jsx(h.P,{as:"span",$color:"primary-blue-2",children:e.jsx(v.default,{href:t,target:"_blank",children:t})}),seperator:l.URL_REGEX,text:W&&1===Y?"This is a premium post. Join to the membership to unlock the full access.":_})}),ee&&!W?e.jsx(h.P,{$color:"grey-5",sx:"cursor:pointer;",$mediumBold:!0,$fontSize:14,onClick:()=>Q(e=>!e),children:K?"See less":"See more"}):null]}),W&&!T?.length&&e.jsx(R,{onClick:X,children:e.jsxs(h.P,{$fontSize:14,$mediumBold:!0,children:["Join now for $",G," per month"]})})]}),W&&!!T?.length&&!le&&e.jsxs(P,{children:[e.jsx(j.default,{alt:"",width:650,height:427,priority:!0,quality:100,src:T[0],style:{objectFit:"fill",height:"100%",width:"100%",filter:"blur(60px)",position:"absolute",top:0,left:"50%",transform:"translateX(-50%)"}}),e.jsx(u.Lock,{size:40,color:"white",sx:"z-index: 1"}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",zIndex:1},children:[e.jsx(h.P,{$color:"white",$fontSize:14,$bold:!0,$lineHeight:20,children:"Become a member"}),e.jsx(h.P,{$color:"white",$fontSize:14,$bold:!0,$lineHeight:20,children:"to unlock this post"})]}),e.jsx(R,{onClick:X,style:{zIndex:1,marginTop:0},children:e.jsxs(h.P,{$fontSize:14,$mediumBold:!0,children:["Join now for $",G," per month"]})})]}),!!T?.length&&!le&&!W&&e.jsxs(C,{$numImages:T.length,children:[T.slice(0,4).map((t,i)=>e.jsx(q,{children:e.jsx(j.default,{alt:"",fill:!0,onClick:()=>{N?.(i),re(i)},quality:100,src:t,draggable:!1,style:{cursor:"pointer",objectFit:"cover"}})},`${O}${t.slice(0,15)}${i}`)),T.length>4&&e.jsxs(d.H,{as:"p",className:"more-than",sx:"pointer-events: none;",$color:"grey-10",$fontSize:28,$lineHeight:36,$semiBold:!0,children:["+",T.length-4]})]}),!T?.length&&!le&&J&&!W&&e.jsxs(v.default,{href:J.url,target:"_blank",children:[e.jsx(q,{children:e.jsx(j.default,{alt:"",fill:!0,quality:100,src:J.imageUrl,draggable:!1,style:{cursor:"pointer",objectFit:"cover"}})}),e.jsxs(s.Box,{$dir:"column",$gap:8,sx:"padding: 8px 16px;",children:[e.jsx(h.P,{$color:"grey-2",$semiBold:!0,children:J.title}),e.jsx(h.P,{$color:"grey-5",children:J.description})]})]}),le&&e.jsx(z,{children:e.jsx(m.Video,{src:D.url,thumbnail:D.thumbnail,subtitles:[],title:D?.title})}),!!se.length&&e.jsx(H,{children:!W&&se}),I&&!!ae.length&&e.jsx(S,{children:ae})]})};

package/dist/components/table/table/table.js

@@ -1,22 +1,13 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),box=require("../../atoms/box/box.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const Table=({border:e=!0,children:t,compact:l,footer:a,header:o,separated:r,striped:d,sx:i,padding:n=32})=>React__default.default.createElement(box.Box,{$backgroundColor:"white",$borderRadius:"large",$display:"flex",$dir:"column",$gap:32,$padding:n,sx:l?"width: fit-content;":""},!!o&&o,React__default.default.createElement(box.Box,{$borderRadius:"small",sx:e?"border: 1px solid var(--color-grey-8);":""},React__default.default.createElement(TableElement,{$compact:l,$separated:r,$striped:d,$sx:i},t)),!!a&&a),TableElement=styled.styled.table`
+"use strict";var e=require("react/jsx-runtime"),r=require("styled-components"),o=require("../../atoms/box/box.js");const t=({border:r=!0,children:t,compact:i,footer:d,header:n,separated:a,striped:s,sx:c,padding:p=32})=>e.jsxs(o.Box,{$backgroundColor:"white",$borderRadius:"large",$display:"flex",$dir:"column",$gap:32,$padding:p,sx:i?"width: fit-content;":"",children:[!!n&&n,e.jsx(o.Box,{$borderRadius:"small",sx:r?"border: 1px solid var(--color-grey-8);":"",children:e.jsx(l,{$compact:i,$separated:a,$striped:s,$sx:c,children:t})}),!!d&&d]}),l=r.styled.table`
   width: 100%;
   border-collapse: collapse;
   border-spacing: 0;
   ${({$compact:e})=>e?"width: fit-content;":""}
-  ${({$separated:e})=>e?`
-    & > tbody > * {
-      border-bottom: 1px solid var(--color-grey-9);
-      &:last-child {
-        border-bottom: none;
-      }
-    }`:""}
-  ${({$striped:e})=>e?`
-    & > tbody > *:nth-of-type(even) {
-      background-color: var(--color-grey-10);
-    }`:""}
+  ${({$separated:e})=>e?"\n    & > tbody > * {\n      border-bottom: 1px solid var(--color-grey-9);\n      &:last-child {\n        border-bottom: none;\n      }\n    }":""}
+  ${({$striped:e})=>e?"\n    & > tbody > *:nth-of-type(even) {\n      background-color: var(--color-grey-10);\n    }":""}
   ${({$sx:e})=>e||""}
-`,Head=({children:e,...t})=>React__default.default.createElement(HeadElement,{...t},e),HeadElement=styled.styled.thead`
+`,i=({children:r,...o})=>e.jsx(d,{...o,children:r}),d=r.styled.thead`
   tr {
     background-color: var(--color-grey-10);
     border-top-left-radius: 8px;
@@ -32,7 +23,7 @@
       border-bottom-right-radius: 8px;
     }
   }
-`,Body=(Head.displayName="Table.Head",Table.Head=Head,({children:e,...t})=>React__default.default.createElement(BodyElement,{...t},e)),BodyElement=styled.styled.tbody`
+`;i.displayName="Table.Head",t.Head=i;const n=({children:r,...o})=>e.jsx(a,{...o,children:r}),a=r.styled.tbody`
   & > tr:last-of-type {
     & > *:first-child {
       border-bottom-left-radius: 8px;
@@ -42,40 +33,18 @@
       border-bottom-right-radius: 8px;
     }
   }
-`,Foot=(Body.displayName="Table.Body",Table.Body=Body,({children:e,...t})=>React__default.default.createElement("tfoot",{...t},e)),Row=(Foot.displayName="Table.Foot",Table.Footer=Foot,({children:e,disabled:t,href:l,hoverable:a=!1,onClick:o,selected:r,sx:d,...i})=>{var n=l?e=>{e.metaKey||e.ctrlKey?window.open(l,"_blank")?.focus():window.location.href=l}:o?e=>{o(e)}:void 0;return React__default.default.createElement(RowElement,{onClick:n,$disabled:t,$hoverable:a,$isAnchor:!!l,$selected:r,$sx:d,...i},e)}),RowElement=styled.styled.tr`
+`;n.displayName="Table.Body",t.Body=n;const s=({children:r,...o})=>e.jsx("tfoot",{...o,children:r});s.displayName="Table.Foot",t.Footer=s;const c=({children:r,disabled:o,href:t,hoverable:l=!1,onClick:i,selected:d,sx:n,...a})=>{const s=t?e=>{if(e.metaKey||e.ctrlKey){const e=window.open(t,"_blank");e?.focus()}else window.location.href=t}:i?e=>{i(e)}:void 0;return e.jsx(p,{onClick:s,$disabled:o,$hoverable:l,$isAnchor:!!t,$selected:d,$sx:n,...a,children:r})},p=r.styled.tr`
   display: table-row;
 
-  ${({$disabled:e})=>e?`
-    background-color: var(--color-grey-9) !important;
-    color: var(--color-grey-7);
-    & > * {
-      color: var(--color-grey-7) !important;
-    }`:""}
+  ${({$disabled:e})=>e?"\n    background-color: var(--color-grey-9) !important;\n    color: var(--color-grey-7);\n    & > * {\n      color: var(--color-grey-7) !important;\n    }":""}
 
-  ${({$disabled:e,$hoverable:t})=>!e&&t?"background-color: var(--color-grey-9);":""}
+  ${({$disabled:e,$hoverable:r})=>!e&&r?"background-color: var(--color-grey-9);":""}
 
-  ${({$disabled:e,$selected:t})=>!e&&t?"background-color: var(--color-grey-8;":""}
+  ${({$disabled:e,$selected:r})=>!e&&r?"background-color: var(--color-grey-8;":""}
 
-  ${({$disabled:e,$isAnchor:t})=>!e&&t?`
-    cursor: pointer;
-    padding-right: 24px;
-
-    &:hover {
-      background-color: var(--color-grey-10);
-
-      & > td:last-child {
-        position: relative;
-      }
-      & > td:last-child::after {
-        content: "❯";
-        color: var(--color-blue-3);
-        position: absolute;
-        right: 12px;
-        top: calc(50% - 11px);
-      }
-    }`:""}
+  ${({$disabled:e,$isAnchor:r})=>!e&&r?'\n    cursor: pointer;\n    padding-right: 24px;\n\n    &:hover {\n      background-color: var(--color-grey-10);\n\n      & > td:last-child {\n        position: relative;\n      }\n      & > td:last-child::after {\n        content: "❯";\n        color: var(--color-blue-3);\n        position: absolute;\n        right: 12px;\n        top: calc(50% - 11px);\n      }\n    }':""}
   ${({$sx:e})=>e||""}
-`,Cell=(Row.displayName="Table.Row",Table.Row=Row,({children:e,lines:t,padding:l="16px 24px",sx:a,textAlign:o="left",verticalAlign:r="middle",width:d})=>{d=d?d*(1/16)+"%":void 0;return React__default.default.createElement(CellElement,{$clamp:t,$padding:l,$sx:a,$textAlign:o,$verticalAlign:r,$width:d||"fit-content"},React__default.default.createElement("div",null,e))}),CellElement=styled.styled.td`
+`;c.displayName="Table.Row",t.Row=c;const $=({children:r,lines:o,padding:t="16px 24px",sx:l,textAlign:i="left",verticalAlign:d="middle",width:n})=>{const a=n?n*(1/16)+"%":void 0;return e.jsx(x,{$clamp:o,$padding:t,$sx:l,$textAlign:i,$verticalAlign:d,$width:a||"fit-content",children:e.jsx("div",{children:r})})},x=r.styled.td`
   width: ${({$width:e})=>e};
   height: 20px;
   font-family: var(--font-inter);
@@ -86,18 +55,10 @@
   vertical-align: ${({$verticalAlign:e})=>e||""};
   text-align: ${({$textAlign:e})=>e||""};
   padding: ${({$padding:e})=>e};
-  ${({$clamp:e})=>e?`
-  & > div {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: -webkit-box;
-    line-clamp: ${e};
-    -webkit-line-clamp: ${e};
-    -webkit-box-orient: vertical;
-  }`:""}
+  ${({$clamp:e})=>e?`\n  & > div {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    line-clamp: ${e};\n    -webkit-line-clamp: ${e};\n    -webkit-box-orient: vertical;\n  }`:""}
   ${({$sx:e})=>e||""}
-`,HeaderCell=(Cell.displayName="Table.Cell",Table.Cell=Cell,({children:e,lines:t,padding:l="16px 24px",sx:a,textAlign:o="left",verticalAlign:r="middle",width:d})=>{d=d?6.25*d+"%":void 0;return React__default.default.createElement(HeadCellElement,{as:"th",$clamp:t,$padding:l,$sx:a,$textAlign:o,$verticalAlign:r,$width:d||"fit-content"},e)}),HeadCellElement=styled.styled(CellElement)`
+`;$.displayName="Table.Cell",t.Cell=$;const b=({children:r,lines:o,padding:t="16px 24px",sx:l,textAlign:i="left",verticalAlign:d="middle",width:n})=>{const a=n?6.25*n+"%":void 0;return e.jsx(h,{as:"th",$clamp:o,$padding:t,$sx:l,$textAlign:i,$verticalAlign:d,$width:a||"fit-content",children:r})},h=r.styled(x)`
   font-size: 16px;
   font-weight: 700;
   line-height: 24px;
-`;HeaderCell.displayName="Table.HeaderCell",Table.HeaderCell=HeaderCell,exports.Table=Table;
+`;b.displayName="Table.HeaderCell",t.HeaderCell=b,exports.Table=t;