@soul-refiner/design-system 2.3.14 → 2.3.16
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"),styled=require("styled-components"),date$1=require("../../../common/date.js"),button=require("../../actions/button/button.js"),paragraph=require("../../atoms/typography/paragraph.js"),chevron_left=require("../../../icons/arrow/chevron_left.js"),chevron_right=require("../../../icons/arrow/chevron_right.js"),calendar=require("../../../icons/time/calendar.js"),date=require("../../../utils/date.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const CalendarInput=({selectedDate:e,onSelect:t,disablePastDates:l})=>{const o=new Date;o.setHours(0),o.setMinutes(0),o.setSeconds(0),o.setMilliseconds(0),new Date(o).setDate(1);const a=React__default.default.useRef(null),[r,n]=React__default.default.useState(!1),[d,i]=React__default.default.useState(()=>e?.toDateString()||(new Date).toDateString()),[u,c]=React__default.default.useState(()=>e?.toDateString()||(new Date).toDateString());React__default.default.useEffect(()=>{c(e?.toDateString()||(new Date).toDateString())},[e]);const s=e=>{var e=e.target,t=e.getAttribute("data-day"),a=e.getAttribute("data-month"),e=e.getAttribute("data-year");a=new Date(a+`-${t}-`+e),c(a.toDateString())};var f=date.buildCalendar(new Date(d).getMonth()+1,new Date(d).getFullYear()),[p,g,y]=(e||new Date).toLocaleString("default",{year:"2-digit",month:"2-digit",day:"2-digit"}).split("/");return React__default.default.createElement(Wrapper,{onBlurCapture:e=>{a?.current&&!a?.current?.contains(e.relatedTarget)&&n(!1)},ref:a,tabIndex:0},React__default.default.createElement(InputWrapper,null,React__default.default.createElement(Input,{value:e?p+` / ${g} / `+y:"",onFocus:()=>n(e=>!e),style:{letterSpacing:"1px",fontSize:"16px"},readOnly:!0}),React__default.default.createElement(calendar.Calendar,null)),r&&React__default.default.createElement(DateSelector,null,React__default.default.createElement(InnerWrapper,null,React__default.default.createElement("div",null,React__default.default.createElement(MonthBar,null,React__default.default.createElement(Arrow,{onClick:()=>{i(e=>{e=new Date(e);return e.setMonth(e.getMonth()-1),e.toDateString()})}},React__default.default.createElement(chevron_left.ChevronLeft,{size:24})),React__default.default.createElement(paragraph.P,null,Object.values(date$1.MONTHS)[Math.max(0,Math.min(new Date(d).getMonth(),11))]+" "+new Date(d).getFullYear()),React__default.default.createElement(Arrow,{onClick:()=>{i(e=>{e=new Date(e);return e.setMonth(e.getMonth()+1),e.toDateString()})}},React__default.default.createElement(chevron_right.ChevronRight,{size:24}))),React__default.default.createElement(WeekdayWrapper,null,Object.values(date$1.WEEKDAYS).map(e=>React__default.default.createElement(paragraph.P,{key:e},e))),React__default.default.createElement(Calendar,null,f.map((e,t)=>React__default.default.createElement(Week,{key:"week-"+t.toString(36)},e.map((e,t)=>{var a=new Date(`${e[1]}-${e[2]}-`+e[0]),r=0<o.getTime()-a.getTime(),n=e[1]!==date.zeroPad(new Date(d).getMonth()+1,2),r=l?r:n,n=Math.abs(a.getTime()-o.getTime())<.5,a=new Date(u).getTime()===a.getTime();return React__default.default.createElement(Day,{className:((n?"today":"")+(r?" not-current":"")+(a?" selected":"")).trim(),"data-day":e[2],"data-month":e[1],"data-year":e[0],key:"day-"+t.toString(36),onClick:s},(""+e[2]).startsWith("0")?(""+e[2])[1]:e[2])})))),React__default.default.createElement(BottomWrapper,null,React__default.default.createElement(button.Button,{onClick:()=>{c(e?.toDateString()||(new Date).toDateString()),n(!1)},size:"small",sx:"width: 80px;",type:"outlined"},"Cancel"),React__default.default.createElement(button.Button,{onClick:()=>{t(new Date(u)),n(!1)},size:"small",sx:"width: 80px;"},"Apply"))))))},Wrapper=styled.styled.div`
|
|
2
|
+
"use strict";var React=require("react"),styled=require("styled-components"),date$1=require("../../../common/date.js"),button=require("../../actions/button/button.js"),paragraph=require("../../atoms/typography/paragraph.js"),chevron_left=require("../../../icons/arrow/chevron_left.js"),chevron_right=require("../../../icons/arrow/chevron_right.js"),calendar=require("../../../icons/time/calendar.js"),date=require("../../../utils/date.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const CalendarInput=({selectedDate:e,onSelect:t,disablePastDates:l})=>{const o=new Date;o.setHours(0),o.setMinutes(0),o.setSeconds(0),o.setMilliseconds(0),new Date(o).setDate(1);const a=React__default.default.useRef(null),[r,n]=React__default.default.useState(!1),[d,i]=React__default.default.useState(()=>e?.toDateString()||(new Date).toDateString()),[u,c]=React__default.default.useState(()=>e?.toDateString()||(new Date).toDateString());React__default.default.useEffect(()=>{c(e?.toDateString()||(new Date).toDateString())},[e]);const s=e=>{var e=e.target,t=e.getAttribute("data-day"),a=e.getAttribute("data-month"),e=e.getAttribute("data-year");a=new Date(a+`-${t}-`+e),c(a.toDateString())};var f=date.buildCalendar(new Date(d).getMonth()+1,new Date(d).getFullYear()),[p,g,y]=(e||new Date).toLocaleString("default",{year:"2-digit",month:"2-digit",day:"2-digit"}).split("/");return React__default.default.createElement(Wrapper,{onBlurCapture:e=>{a?.current&&!a?.current?.contains(e.relatedTarget)&&n(!1)},ref:a,tabIndex:0},React__default.default.createElement(InputWrapper,null,React__default.default.createElement(Input,{value:e?p+` / ${g} / `+y:"",onFocus:()=>n(e=>!e),style:{letterSpacing:"1px",fontSize:"16px",lineHeight:"24px"},readOnly:!0}),React__default.default.createElement(calendar.Calendar,null)),r&&React__default.default.createElement(DateSelector,null,React__default.default.createElement(InnerWrapper,null,React__default.default.createElement("div",null,React__default.default.createElement(MonthBar,null,React__default.default.createElement(Arrow,{onClick:()=>{i(e=>{e=new Date(e);return e.setMonth(e.getMonth()-1),e.toDateString()})}},React__default.default.createElement(chevron_left.ChevronLeft,{size:24})),React__default.default.createElement(paragraph.P,null,Object.values(date$1.MONTHS)[Math.max(0,Math.min(new Date(d).getMonth(),11))]+" "+new Date(d).getFullYear()),React__default.default.createElement(Arrow,{onClick:()=>{i(e=>{e=new Date(e);return e.setMonth(e.getMonth()+1),e.toDateString()})}},React__default.default.createElement(chevron_right.ChevronRight,{size:24}))),React__default.default.createElement(WeekdayWrapper,null,Object.values(date$1.WEEKDAYS).map(e=>React__default.default.createElement(paragraph.P,{key:e},e))),React__default.default.createElement(Calendar,null,f.map((e,t)=>React__default.default.createElement(Week,{key:"week-"+t.toString(36)},e.map((e,t)=>{var a=new Date(`${e[1]}-${e[2]}-`+e[0]),r=0<o.getTime()-a.getTime(),n=e[1]!==date.zeroPad(new Date(d).getMonth()+1,2),r=l?r:n,n=Math.abs(a.getTime()-o.getTime())<.5,a=new Date(u).getTime()===a.getTime();return React__default.default.createElement(Day,{className:((n?"today":"")+(r?" not-current":"")+(a?" selected":"")).trim(),"data-day":e[2],"data-month":e[1],"data-year":e[0],key:"day-"+t.toString(36),onClick:s},(""+e[2]).startsWith("0")?(""+e[2])[1]:e[2])})))),React__default.default.createElement(BottomWrapper,null,React__default.default.createElement(button.Button,{onClick:()=>{c(e?.toDateString()||(new Date).toDateString()),n(!1)},size:"small",sx:"width: 80px;",type:"outlined"},"Cancel"),React__default.default.createElement(button.Button,{onClick:()=>{t(new Date(u)),n(!1)},size:"small",sx:"width: 80px;"},"Apply"))))))},Wrapper=styled.styled.div`
|
|
3
3
|
position: relative;
|
|
4
4
|
width: fit-content;
|
|
5
5
|
font-family: var(--font-inter);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";var React=require("react"),Image=require("next/image"),ReactPlayer=require("react-player"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),heading=require("../../atoms/typography/heading.js"),paragraph=require("../../atoms/typography/paragraph.js"),button=require("../../actions/button/button.js"),lock_circle=require("../../../icons/security/lock_circle.js"),play_solid=require("../../../icons/audio_video/play_solid.js"),playlistItem=require("./playlist-item.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),Image__default=_interopDefaultCompat(Image),ReactPlayer__default=_interopDefaultCompat(ReactPlayer);const VideoPlayer=({activeIndex:e,pip:t,playable:a,playlist:l,onPipChange:r,onProgress:o,orientation:i,setMediaItem:n,forwardedRef:d,subtitle:c,title:p,trailer:s})=>{const[u,f]=React__default.default.useState(!1),[x,g]=React__default.default.useState(!a),[m,y]=React__default.default.useState(l?.[e].id||null);var b=React__default.default.useRef(null);const _=d||b,h=x?s:l?.[e];const $=e=>{g(!1),n(e)};return h?React__default.default.createElement(Wrapper,{$orientation:i},React__default.default.createElement(InnerWrapper,{$orientation:i,$playable:a||x},"vertical"===i&&React__default.default.createElement(box.Box,{$dir:"column",$gap:4,sx:"margin: 24px;"},React__default.default.createElement(heading.H,{as:"h2",$bold:!0,$color:"white",$fontSize:28,$lineHeight:36},p),React__default.default.createElement(paragraph.P,{as:"h3",$bold:!0,$color:"grey-8"},c)),React__default.default.createElement(ReactPlayer__default.default,{className:"player",config:{file:{attributes:{crossOrigin:"true"},forceHLS:!0,hlsOptions:{autoStartLoad:!0},tracks:(h?.subtitles||[]).map(e=>({kind:"subtitles",label:e.label,src:e.src,srcLang:e.locale}))}},controls:!0,height:"100%",light:React__default.default.createElement(Image__default.default,{alt:"thumbnail for "+p,layout:"fill",priority:!0,quality:100,style:{objectFit:"contain"},src:h.thumbnail}),progressInterval:4e3,onDisablePIP:()=>r&&r(!1),onEnablePIP:()=>r&&r(!0),onProgress:o,onReady:()=>{x||0===_?.current?.getCurrentTime()&&0!==h?.progress&&_.current.seekTo(h.progress)},pip:t,playIcon:a||x?React__default.default.createElement(play_solid.PlaySolid,{color:"white",size:24,sx:"position: absolute; width: 54px; height: 54px;"}):React__default.default.createElement(lock_circle.LockCircle,{color:"white",size:24,sx:"position: absolute; width: 54px; height: 54px;"}),playing:a,ref:_,style:{backgroundColor:"var(--color-grey-0)",maxHeight:720,maxWidth:
|
|
2
|
+
"use strict";var React=require("react"),Image=require("next/image"),ReactPlayer=require("react-player"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),heading=require("../../atoms/typography/heading.js"),paragraph=require("../../atoms/typography/paragraph.js"),button=require("../../actions/button/button.js"),lock_circle=require("../../../icons/security/lock_circle.js"),play_solid=require("../../../icons/audio_video/play_solid.js"),playlistItem=require("./playlist-item.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),Image__default=_interopDefaultCompat(Image),ReactPlayer__default=_interopDefaultCompat(ReactPlayer);const VideoPlayer=({activeIndex:e,pip:t,playable:a,playlist:l,onPipChange:r,onProgress:o,orientation:i,setMediaItem:n,forwardedRef:d,subtitle:c,title:p,trailer:s})=>{const[u,f]=React__default.default.useState(!1),[x,g]=React__default.default.useState(!a),[m,y]=React__default.default.useState(l?.[e].id||null);var b=React__default.default.useRef(null);const _=d||b,h=x?s:l?.[e];const $=e=>{g(!1),n(e)};return h?React__default.default.createElement(Wrapper,{$orientation:i},React__default.default.createElement(InnerWrapper,{$orientation:i,$playable:a||x},"vertical"===i&&React__default.default.createElement(box.Box,{$dir:"column",$gap:4,sx:"margin: 24px;"},React__default.default.createElement(heading.H,{as:"h2",$bold:!0,$color:"white",$fontSize:28,$lineHeight:36},p),React__default.default.createElement(paragraph.P,{as:"h3",$bold:!0,$color:"grey-8"},c)),React__default.default.createElement(ReactPlayer__default.default,{className:"player",config:{file:{attributes:{crossOrigin:"true"},forceHLS:!0,hlsOptions:{autoStartLoad:!0},tracks:(h?.subtitles||[]).map(e=>({kind:"subtitles",label:e.label,src:e.src,srcLang:e.locale}))}},controls:!0,height:"100%",light:React__default.default.createElement(Image__default.default,{alt:"thumbnail for "+p,layout:"fill",priority:!0,quality:100,style:{objectFit:"contain"},src:h.thumbnail}),progressInterval:4e3,onDisablePIP:()=>r&&r(!1),onEnablePIP:()=>r&&r(!0),onProgress:o,onReady:()=>{x||0===_?.current?.getCurrentTime()&&0!==h?.progress&&_.current.seekTo(h.progress)},pip:t,playIcon:a||x?React__default.default.createElement(play_solid.PlaySolid,{color:"white",size:24,sx:"position: absolute; width: 54px; height: 54px;"}):React__default.default.createElement(lock_circle.LockCircle,{color:"white",size:24,sx:"position: absolute; width: 54px; height: 54px;"}),playing:a,ref:_,style:{backgroundColor:"var(--color-grey-0)",maxHeight:720,maxWidth:"100%",minHeight:480,overflow:"hidden",position:"relative"},url:h.src,width:"100%"}),"horizontal"===i&&React__default.default.createElement(Side,null,React__default.default.createElement(box.Box,{$dir:"column",$gap:4},React__default.default.createElement(heading.H,{as:"h2",$bold:!0,$color:"white",$fontSize:28,$lineHeight:36},p),React__default.default.createElement(paragraph.P,{as:"h3",$bold:!0,$color:"grey-8"},c)),!!s&&React__default.default.createElement(box.Box,{$dir:"column",$gap:8,sx:`
|
|
3
3
|
margin-bottom: 8x;
|
|
4
4
|
border-bottom: 1px solid var(--color-grey-4);
|
|
5
5
|
padding-bottom: 16px;
|
|
@@ -14,7 +14,6 @@
|
|
|
14
14
|
|
|
15
15
|
${({$orientation:e})=>"vertical"===e?"max-width: 960px; height: max-content;":""}
|
|
16
16
|
`,InnerWrapper=styled.styled.div`
|
|
17
|
-
max-width: 2284px;
|
|
18
17
|
flex: 1;
|
|
19
18
|
display: flex;
|
|
20
19
|
justify-content: flex-end;
|
|
@@ -39,6 +38,7 @@
|
|
|
39
38
|
}`}
|
|
40
39
|
`,Side=styled.styled.div`
|
|
41
40
|
position: relative;
|
|
41
|
+
flex: 0;
|
|
42
42
|
box-sizing: border-box;
|
|
43
43
|
display: flex;
|
|
44
44
|
flex-direction: column;
|