@soul-refiner/design-system 2.7.11 → 2.7.13

package/dist/components/media/audio-playlist/audio-playlist.js

@@ -1,8 +1,9 @@
-"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),heading=require("../../atoms/typography/heading.js"),arrow_up=require("../../../icons/arrow/arrow_up.js"),chevron_down=require("../../../icons/arrow/chevron_down.js"),audioPlayer=require("../audio-player/audio-player.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),styled__default=_interopDefaultCompat(styled);const AudioPlaylist=({activeIndex:e,bannerSx:t,darkMode:a,isPaidUser:l,onProgress:i,playlist:r,playlistSx:d,previewImage:o,setMediaItem:n,subtitle:u,title:s})=>{var p="undefined"!=typeof window?window:null;const f=r?.[e],[c,_]=React__default.default.useState(!1),[m,x]=React__default.default.useState(!1),[g,h]=React__default.default.useState(0);return React__default.default.createElement(Wrapper,{$darkMode:a,$fullscreen:!!l&&c},React__default.default.createElement(ThumbnailWrapper,{$sx:t},React__default.default.createElement(Image__default.default,{alt:"thumbnail",height:400,width:p?.innerWidth||500,src:o}),React__default.default.createElement(box.Box,{$dir:"column",sx:"padding: 100px 0px 160px; position: relative; z-index: 2; margin: 0px 160px;"},React__default.default.createElement(heading.H,{$bold:!0,$color:a?"white":"grey-0",$fontSize:64,$lineHeight:96},s),React__default.default.createElement(heading.H,{$color:a?"grey-8":"grey-3",$fontSize:28,$lineHeight:36,$semiBold:!0},u))),React__default.default.createElement(PlaylistWrapper,{$fullscreen:c,$sx:d},r.map((e,t)=>React__default.default.createElement(playlistItem.PlaylistItem,{darkMode:a,duration:e.duration,isPaidUser:l,key:e.id,playing:e.id===f?.id&&m,progress:g,onPause:()=>x(!1),onPlay:()=>{n(t),x(!0)},title:e.title,thumbnail:e.thumbnail}))),React__default.default.createElement(Shade,{$darkMode:a,$isFullscreen:c},l&&React__default.default.createElement(Button,{onClick:()=>_(e=>!e)},c?React__default.default.createElement(arrow_up.ArrowUp,{color:"grey-0",size:24}):React__default.default.createElement(chevron_down.ChevronDown,{color:a?"white":"grey-0",size:24}))),!!f&&React__default.default.createElement(BottomBarWrapper,null,React__default.default.createElement(audioPlayer.AudioPlayer,{onListen:e=>{h(e),i&&i(e)},onPause:()=>x(!1),onPlay:()=>x(!0),playing:m,progress:g,src:f.src,thumbnail:f.thumbnail,title:f.title})))},Wrapper=styled__default.default.div`
+"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),heading=require("../../atoms/typography/heading.js"),arrow_up=require("../../../icons/arrow/arrow_up.js"),chevron_down=require("../../../icons/arrow/chevron_down.js"),audioPlayer=require("../audio-player/audio-player.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),styled__default=_interopDefaultCompat(styled);const AudioPlaylist=({activeIndex:e,bannerSx:t,darkMode:a,isPaidUser:l,onProgress:i,playlist:r,playlistSx:d,previewImage:o,setMediaItem:n,subtitle:u,title:s})=>{var p="undefined"!=typeof window?window:null;const f=r?.[e],[c,_]=React__default.default.useState(!1),[m,x]=React__default.default.useState(!1),[g,h]=React__default.default.useState(0);e=96*r.length+512;return React__default.default.createElement(Wrapper,{$darkMode:a,$fullscreen:!!l&&c,$maxHeight:e},React__default.default.createElement(ThumbnailWrapper,{$sx:t},React__default.default.createElement(Image__default.default,{alt:"thumbnail",height:400,width:p?.innerWidth||500,src:o}),React__default.default.createElement(box.Box,{$dir:"column",sx:"padding: 100px 0px 160px; position: relative; z-index: 2; margin: 0px 160px;"},React__default.default.createElement(heading.H,{$bold:!0,$color:a?"white":"grey-0",$fontSize:64,$lineHeight:96},s),React__default.default.createElement(heading.H,{$color:a?"grey-8":"grey-3",$fontSize:28,$lineHeight:36,$semiBold:!0},u))),React__default.default.createElement(PlaylistWrapper,{$fullscreen:c,$sx:d},r.map((e,t)=>React__default.default.createElement(playlistItem.PlaylistItem,{darkMode:a,duration:e.duration,isPaidUser:l,key:e.id,playing:e.id===f?.id&&m,progress:g,onPause:()=>x(!1),onPlay:()=>{n(t),x(!0)},title:e.title,thumbnail:e.thumbnail}))),React__default.default.createElement(Shade,{$darkMode:a,$isFullscreen:c},l&&React__default.default.createElement(Button,{onClick:()=>_(e=>!e)},c?React__default.default.createElement(arrow_up.ArrowUp,{color:"grey-0",size:24}):React__default.default.createElement(chevron_down.ChevronDown,{color:a?"white":"grey-0",size:24}))),!!f&&React__default.default.createElement(BottomBarWrapper,null,React__default.default.createElement(audioPlayer.AudioPlayer,{onListen:e=>{h(e),i&&i(e)},onPause:()=>x(!1),onPlay:()=>x(!0),playing:m,progress:g,src:f.src,thumbnail:f.thumbnail,title:f.title})))},Wrapper=styled__default.default.div`
   ${({$fullscreen:e})=>e?`height: 100vh;
       overflow-y: auto;
       overflow-x: hidden;`:`height: 744px;
       overflow: hidden;`}
+  max-height: max(${({$maxHeight:e})=>e}px, 250px);
   width: 100vw;
   position: relative;
   padding-bottom: 24px;

package/dist/components/media/audio-playlist/playlist-item.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),paragraph=require("../../atoms/typography/paragraph.js"),pause_solid=require("../../../icons/audio_video/pause_solid.js"),play_solid=require("../../../icons/audio_video/play_solid.js"),progressBar=require("../audio/progress-bar.js"),time=require("../../../utils/time.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("react-h5-audio-player/lib/styles.css");var React__default=_interopDefaultCompat(React),Image__default=_interopDefaultCompat(Image),styled__default=_interopDefaultCompat(styled);const PlaylistItem=({darkMode:e=!0,duration:t,onPause:a,onPlay:r,playing:l,isPaidUser:o,progress:i,thumbnail:d,title:u})=>{var n=l?a:r,s=e?"white":"grey-3";return console.log(e),React__default.default.createElement(ItemWrapper,{$darkMode:e,$playing:l,onClick:n},React__default.default.createElement(box.Box,{$gap:24,$dir:"row",$align:"center"},React__default.default.createElement(Image__default.default,{alt:"",height:64,src:d,width:64,style:{height:64,marginRight:8,borderRadius:8}}),React__default.default.createElement(box.Box,{$align:"center",sx:"flex: 1 1 250px; width: 250px;"},o&&(l?React__default.default.createElement(Button,{onClick:a},React__default.default.createElement(pause_solid.PauseSolid,{color:s,size:24})):React__default.default.createElement(Button,{onClick:r},React__default.default.createElement(play_solid.PlaySolid,{color:s,size:24}))),React__default.default.createElement(paragraph.P,{$bold:!0,$color:s,$fontSize:14,$lineHeight:20,$textClampLines:1,sx:"margin-right: 32px;"},u))),React__default.default.createElement(box.Box,{$align:"center",sx:"flex: 3; margin-left: auto;"},React__default.default.createElement(paragraph.P,{$color:e?"grey-9":"grey-3",$fontSize:10,$lineHeight:14,$sx:"flex: 0; width: fit-content; min-width: 56px;"},time.secondsToTimestamp(t)),React__default.default.createElement(progressBar.AudioProgressBar,{duration:t||0,progress:l?i:0})))},ItemWrapper=styled__default.default.button`
+"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),paragraph=require("../../atoms/typography/paragraph.js"),pause_solid=require("../../../icons/audio_video/pause_solid.js"),play_solid=require("../../../icons/audio_video/play_solid.js"),progressBar=require("../audio/progress-bar.js"),time=require("../../../utils/time.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("react-h5-audio-player/lib/styles.css");var React__default=_interopDefaultCompat(React),Image__default=_interopDefaultCompat(Image),styled__default=_interopDefaultCompat(styled);const PlaylistItem=({darkMode:e=!0,duration:t,onPause:a,onPlay:r,playing:l,isPaidUser:o,progress:i,thumbnail:d,title:u})=>{var n=l?a:r,s=e?"white":"grey-3";return React__default.default.createElement(ItemWrapper,{$darkMode:e,$playing:l,onClick:n},React__default.default.createElement(box.Box,{$gap:24,$dir:"row",$align:"center"},React__default.default.createElement(Image__default.default,{alt:"",height:64,src:d,width:64,style:{height:64,marginRight:8,borderRadius:8}}),React__default.default.createElement(box.Box,{$align:"center",sx:"flex: 1 1 250px; width: 250px;"},o&&(l?React__default.default.createElement(Button,{onClick:a},React__default.default.createElement(pause_solid.PauseSolid,{color:s,size:24})):React__default.default.createElement(Button,{onClick:r},React__default.default.createElement(play_solid.PlaySolid,{color:s,size:24}))),React__default.default.createElement(paragraph.P,{$bold:!0,$color:s,$fontSize:14,$lineHeight:20,$textClampLines:1,sx:"margin-right: 32px;"},u))),React__default.default.createElement(box.Box,{$align:"center",sx:"flex: 3; margin-left: auto;"},React__default.default.createElement(paragraph.P,{$color:e?"grey-9":"grey-3",$fontSize:10,$lineHeight:14,$sx:"flex: 0; width: fit-content; min-width: 56px;"},time.secondsToTimestamp(t)),React__default.default.createElement(progressBar.AudioProgressBar,{duration:t||0,progress:l?i:0})))},ItemWrapper=styled__default.default.button`
   padding: 16px 32px;
   display: flex;
   flex-direction: row;

package/dist/src/components/atoms/box/box.d.ts

@@ -16,7 +16,7 @@ export interface BoxProps extends BackgroundColor, BorderRadius, Elevation, Flex
     sx?: string;
 }
 export declare const Box: ({ $display, sx, ...args }: BoxProps) => React.JSX.Element;
-export declare const Component: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, BoxProps & {
+export declare const Component: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, BoxProps & {
     $sx?: string | undefined;
-}>> & string;
+}>>;
 export {};

package/dist/src/components/atoms/typography/typography.d.ts

@@ -8,4 +8,4 @@ export type TypographyProps = Pick<React.HTMLAttributes<HTMLParagraphElement>, '
     value?: string;
     href?: string;
 } & Color & Styleable & TextClamp & TypographyStyle & TypographyWeight;
-export declare const Typography: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, TypographyProps>> & string;
+export declare const Typography: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, TypographyProps>>;

package/dist/src/components/card/styles.d.ts

@@ -1,2 +1,2 @@
 /// <reference types="react" />
-export declare const PurchaseTextWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../../components/atoms/box/box").BoxProps, never>> & string & Omit<({ $display, sx, ...args }: import("../../components/atoms/box/box").BoxProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const PurchaseTextWrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("../../components/atoms/box/box").BoxProps, never>> & Omit<({ $display, sx, ...args }: import("../../components/atoms/box/box").BoxProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;

package/dist/src/components/editor/navbar/navbar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 export declare const EditorBar: () => React.JSX.Element;
-export declare const MenuButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+export declare const MenuButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
     $active?: boolean | undefined;
-}>> & string;
+}>>;

package/dist/src/components/editor/styles/menu_button.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-export declare const MenuButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+export declare const MenuButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
     $active?: boolean | undefined;
-}>> & string;
+}>>;