@soul-refiner/design-system 2.13.8 → 2.13.10
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),button=require("../../actions/button/button.js"),dropdown=require("../../actions/dropdown/dropdown.js"),heading=require("../../atoms/typography/heading.js"),paragraph=require("../../atoms/typography/paragraph.js"),ellipsis_horizontal=require("../../../icons/basic/ellipsis_horizontal.js"),ispaid=require("../../iconography/avatar/icons/ispaid.js"),material=require("@mui/material"),hourglass=require("../../../icons/time/hourglass.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),Image__default=_interopDefaultCompat(Image);const PersonCard=({actions:e,chip:t,dotsActions:a,href:l,image:r,subtitle:i,sx:o,title:n,isPaidUser:d,progress:s,lastOnline:u})=>React__default.default.createElement(Wrapper,{$image:r},React__default.default.createElement(Person,{$sx:o},React__default.default.createElement(ContentWrapper,{as:l?"a":"div",href:l},a&&!!a.length&&React__default.default.createElement(dropdown.Dropdown,{containerSx:"",hasArrow:!0,maintainState:!1,onClick:e=>e.preventDefault(),options:a,sx:"position: absolute; top: 8px; right: 8px; z-index: 24; display: none;",trigger:React__default.default.createElement(button.Button,{className:"icon",icon:React__default.default.createElement(ellipsis_horizontal.EllipsisHorizontal,null),onClick:e=>e.stopPropagation(),showChevron:!1,size:"small",type:"outlined"})}),React__default.default.createElement(Image__default.default,{alt:"",height:400,quality:100,src:r,width:312})),t&&React__default.default.createElement(box.Box,{sx:"position: absolute; top: 8px; left: 8px; z-index: 24;"},t),React__default.default.createElement(Figcaption,null,React__default.default.createElement(box.Box,{$display:"flex",$dir:"row",$gap:8},React__default.default.createElement(heading.H,{as:"span",$bold:!0,$color:"white",$fontSize:24,$lineHeight:36},n),d&&React__default.default.createElement(box.Box,{sx:"padding: .6rem 0 0 0; width: 18.33px; height: 18.33px;"},React__default.default.createElement(ispaid.IsPaid,null))),i&&React__default.default.createElement(paragraph.P,{as:"span",$color:"white",$fontSize:14,$lineHeight:20},i),(s||u)&&React__default.default.createElement(ProgressContainer,null,s&&React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(material.CircularProgress,{variant:"determinate",value:s,style:{color:"green",width:18,height:18}}),React__default.default.createElement(ProgressDataContainer,null,React__default.default.createElement(paragraph.P,{$fontSize:10,$color:"grey-9",$lineHeight:14},"Progress"),React__default.default.createElement(paragraph.P,{$fontSize:10,$color:"white",$bold:!0,$lineHeight:14},s,"%"))),u&&React__default.default.createElement(LastOnlineContainer,{$addMarginLeft
|
|
2
|
+
"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),button=require("../../actions/button/button.js"),dropdown=require("../../actions/dropdown/dropdown.js"),heading=require("../../atoms/typography/heading.js"),paragraph=require("../../atoms/typography/paragraph.js"),ellipsis_horizontal=require("../../../icons/basic/ellipsis_horizontal.js"),ispaid=require("../../iconography/avatar/icons/ispaid.js"),material=require("@mui/material"),hourglass=require("../../../icons/time/hourglass.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),Image__default=_interopDefaultCompat(Image);const PersonCard=({actions:e,chip:t,dotsActions:a,href:l,image:r,subtitle:i,sx:o,title:n,isPaidUser:d,progress:s,lastOnline:u,containerSx:p})=>React__default.default.createElement(Wrapper,{$image:r,$sx:p},React__default.default.createElement(Person,{$sx:o},React__default.default.createElement(ContentWrapper,{as:l?"a":"div",href:l},a&&!!a.length&&React__default.default.createElement(dropdown.Dropdown,{containerSx:"",hasArrow:!0,maintainState:!1,onClick:e=>e.preventDefault(),options:a,sx:"position: absolute; top: 8px; right: 8px; z-index: 24; display: none;",trigger:React__default.default.createElement(button.Button,{className:"icon",icon:React__default.default.createElement(ellipsis_horizontal.EllipsisHorizontal,null),onClick:e=>e.stopPropagation(),showChevron:!1,size:"small",type:"outlined"})}),React__default.default.createElement(Image__default.default,{alt:"",height:400,quality:100,src:r,width:312})),t&&React__default.default.createElement(box.Box,{sx:"position: absolute; top: 8px; left: 8px; z-index: 24;"},t),React__default.default.createElement(Figcaption,null,React__default.default.createElement(box.Box,{$display:"flex",$dir:"row",$gap:8},React__default.default.createElement(heading.H,{as:"span",$bold:!0,$color:"white",$fontSize:24,$lineHeight:36},n),d&&React__default.default.createElement(box.Box,{sx:"padding: .6rem 0 0 0; width: 18.33px; height: 18.33px;"},React__default.default.createElement(ispaid.IsPaid,null))),i&&React__default.default.createElement(paragraph.P,{as:"span",$color:"white",$fontSize:14,$lineHeight:20},i),(s||u)&&React__default.default.createElement(ProgressContainer,null,void 0!==s&&React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(material.CircularProgress,{variant:"determinate",value:s,style:{color:"green",width:18,height:18}}),React__default.default.createElement(ProgressDataContainer,null,React__default.default.createElement(paragraph.P,{$fontSize:10,$color:"grey-9",$lineHeight:14},"Progress"),React__default.default.createElement(paragraph.P,{$fontSize:10,$color:"white",$bold:!0,$lineHeight:14},s,"%"))),u&&React__default.default.createElement(LastOnlineContainer,{$addMarginLeft:void 0!==s},React__default.default.createElement(hourglass.Hourglass,null),React__default.default.createElement(LastOnlineDataContainer,null,React__default.default.createElement(paragraph.P,{$fontSize:10,$color:"grey-9",$lineHeight:14},"Last online"),React__default.default.createElement(paragraph.P,{$fontSize:10,$color:"white",$bold:!0,$lineHeight:14},u)))),e&&React__default.default.createElement(box.Box,{$display:"flex",$dir:"row",$gap:8,sx:"margin-top: 16px;"},React__default.default.Children.toArray(e))))),ContentWrapper=styled.styled.div`
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
&:hover > div {
|
|
@@ -21,6 +21,8 @@
|
|
|
21
21
|
border-radius: 16px;
|
|
22
22
|
object-fit: cover;
|
|
23
23
|
}
|
|
24
|
+
|
|
25
|
+
${({$sx:e})=>e||""};
|
|
24
26
|
`,Person=styled.styled.figure`
|
|
25
27
|
position: relative;
|
|
26
28
|
width: 100%;
|
|
@@ -12,5 +12,6 @@ export interface PersonCardProps {
|
|
|
12
12
|
isPaidUser?: boolean;
|
|
13
13
|
progress?: number;
|
|
14
14
|
lastOnline?: string;
|
|
15
|
+
containerSx?: string;
|
|
15
16
|
}
|
|
16
|
-
export declare const PersonCard: ({ actions, chip, dotsActions, href, image, subtitle, sx, title, isPaidUser, progress, lastOnline, }: PersonCardProps) => React.JSX.Element;
|
|
17
|
+
export declare const PersonCard: ({ actions, chip, dotsActions, href, image, subtitle, sx, title, isPaidUser, progress, lastOnline, containerSx, }: PersonCardProps) => React.JSX.Element;
|