@soul-refiner/design-system 2.3.18 → 2.3.20
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"),chip=require("../../feedback/chip/chip.js"),checkmark_circle=require("../../../icons/basic/checkmark_circle.js"),alert_circle=require("../../../icons/notifications/alert_circle.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const TextInput=({bg:e="var(--color-blue-10)",disabled:t,helperText:r,icon:
|
|
2
|
+
"use strict";var React=require("react"),styled=require("styled-components"),chip=require("../../feedback/chip/chip.js"),checkmark_circle=require("../../../icons/basic/checkmark_circle.js"),alert_circle=require("../../../icons/notifications/alert_circle.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const TextInput=({bg:e="var(--color-blue-10)",disabled:t,helperText:r,icon:l,inputSx:a,label:o,maxCharacters:n,multiple:c,name:i,onChange:s,onClick:d,onFocus:u,onKeyDown:p,onBlur:f,onMultipleChange:m,placeholder:g,placeIconAtTheEnd:$=!1,size:y="large",successful:_,sx:b,type:h="text",value:x,variant:v="default",warning:k})=>{const z=React__default.default.useId();const[w,C]=React__default.default.useState("");return React__default.default.createElement(Label,{$disabled:t,$size:y,$sx:b},React__default.default.createElement(Legend,{$bg:e,$size:y,$successful:_,$warning:k,$variant:v},o),React__default.default.createElement(InputWrapper,{$bg:e,$size:y,$successful:_,$warning:k},!$&&l,c?React__default.default.createElement(MultipleInputWrapper,{onSubmit:e=>{e.stopPropagation(),e.preventDefault();e=x.includes(w);m&&!e&&m([...x,w]),C("")}},x.filter(Boolean).map((e,t)=>React__default.default.createElement(chip.Chip,{key:z+e+t,color:"blue",size:"small",onDismiss:()=>{var t;t=e,m&&m(x.filter(e=>e!==t))}},e)),React__default.default.createElement(Input,{$size:y,$sx:a,onBlur:f,onChange:e=>{C(e.target.value)},onClick:d,onFocus:u,onKeyDown:e=>{!x.length||!m||w||"Delete"!==e.key&&"Backspace"!==e.key||m(x.slice(0,x.length-1))},value:w})):React__default.default.createElement(Input,{$size:y,$sx:a,disabled:t,name:i,onBlur:f,onChange:s,onClick:d,onFocus:u,onKeyDown:p,placeholder:g,type:h,value:"number"!==h&&n?x?.slice(0,n-1)||"":x}),n&&"number"!==h&&!$&&React__default.default.createElement(MaxCharactersText,{$size:y},x?.length||0," / ",n),$&&l,_&&React__default.default.createElement(checkmark_circle.CheckmarkCircle,{color:"green-3"}),k&&React__default.default.createElement(alert_circle.AlertCircle,{color:"red-4"})),r&&React__default.default.createElement(HelperText,{$size:y,$warning:k},k&&React__default.default.createElement(alert_circle.AlertCircle,{color:"red-4"}),r))},Label=styled.styled.label`
|
|
3
3
|
font-family: var(--font-inter);
|
|
4
4
|
font-size: ${({$size:e})=>"small"===e?.75:.87}rem;
|
|
5
5
|
font-weight: 400;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),Player=require("react-h5-audio-player"),box=require("../../atoms/box/box.js"),paragraph=require("../../atoms/typography/paragraph.js"),fast_forward_30=require("../../../icons/audio_video/fast_forward_30.js"),pause=require("../../../icons/audio_video/pause.js"),play=require("../../../icons/audio_video/play.js"),rewind_30=require("../../../icons/audio_video/rewind_30.js"),volume_high=require("../../../icons/audio_video/volume_high.js"),volume_slash=require("../../../icons/audio_video/volume_slash.js"),progressBar=require("../audio/progress-bar.js"),constants=require("../constants.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),Player__default=_interopDefaultCompat(Player);const AudioPlayer=({autoPlay:e,autoPlayAfterSrcChange:t,onListen:a,onPause:r,onPlay:o,playing:l,progress:u,src:i,title:n,thumbnail:d})=>{const[s
|
|
2
|
+
"use strict";var React=require("react"),Image=require("next/image"),styled=require("styled-components"),Player=require("react-h5-audio-player"),box=require("../../atoms/box/box.js"),paragraph=require("../../atoms/typography/paragraph.js"),fast_forward_30=require("../../../icons/audio_video/fast_forward_30.js"),pause=require("../../../icons/audio_video/pause.js"),play=require("../../../icons/audio_video/play.js"),rewind_30=require("../../../icons/audio_video/rewind_30.js"),volume_high=require("../../../icons/audio_video/volume_high.js"),volume_slash=require("../../../icons/audio_video/volume_slash.js"),progressBar=require("../audio/progress-bar.js"),constants=require("../constants.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),Player__default=_interopDefaultCompat(Player);const AudioPlayer=({autoPlay:e,autoPlayAfterSrcChange:t,onListen:a,onPause:r,onPlay:o,playing:l,progress:u,src:i,title:n,thumbnail:d})=>{const[c,s]=React__default.default.useState(null);var _=Math.ceil(((c?.audio.current?.duration||0)-u)/60),_=0===_?"":1===_?"Under 1 minute left":2===_?"1 minute left":_+" minutes left";React__default.default.useEffect(()=>{c?.audio.current&&!l?c.audio.current.pause():c?.audio.current&&c.audio.current.play()},[l,c?.audio.current]);return React__default.default.createElement(Wrapper,null,React__default.default.createElement(Player__default.default,{autoPlay:e,autoPlayAfterSrcChange:t,customIcons:{forward:React__default.default.createElement(fast_forward_30.FastForward30,{color:"grey-9",size:20}),pause:React__default.default.createElement(pause.Pause,{color:"grey-9",size:20}),play:React__default.default.createElement(play.Play,{color:"grey-9",size:20}),rewind:React__default.default.createElement(rewind_30.Rewind30,{color:"grey-9",size:20}),volume:React__default.default.createElement(volume_high.VolumeHigh,{color:"grey-9",size:20}),volumeMute:React__default.default.createElement(volume_slash.VolumeSlash,{color:"grey-9",size:20})},customAdditionalControls:[React__default.default.createElement(box.Box,{className:"image-title-container",$align:"center",$gap:56},React__default.default.createElement(Image__default.default,{alt:"",height:64,src:d,width:64,style:{height:64}}),React__default.default.createElement(box.Box,{sx:"max-width: 250px; height: 52px;",$dir:"column",$gap:16},React__default.default.createElement(paragraph.P,{$color:"white",$fontSize:16,$lineHeight:20,$semiBold:!0},n),React__default.default.createElement(paragraph.P,{$color:"grey-4",$fontSize:12,$lineHeight:16,$mediumBold:!0},_)))],customControlsSection:[Player.RHAP_UI.ADDITIONAL_CONTROLS,Player.RHAP_UI.MAIN_CONTROLS],customProgressBarSection:[React__default.default.createElement(progressBar.AudioProgressBar,{key:"audio-progress-"+u,duration:c?.audio.current?.duration||0,progress:u,onSeek:e=>{c?.audio.current&&(c.audio.current.currentTime=c.audio.current.duration*e)}}),Player.RHAP_UI.VOLUME_CONTROLS,Player.RHAP_UI.CURRENT_TIME,React__default.default.createElement(paragraph.P,{$color:"white",$fontSize:14}," ","/"," "),Player.RHAP_UI.DURATION],hasDefaultKeyBindings:!1,layout:"horizontal-reverse",listenInterval:constants.LISTEN_CALLBACK_INTERVAL,onListen:()=>{c?.audio.current?.currentTime&&a&&a(c.audio.current.currentTime)},onPause:r,onPlay:o,progressJumpSteps:{backward:constants.FF_INTERVAL,forward:constants.FF_INTERVAL},ref:s,src:i}))},Wrapper=styled__default.default.div`
|
|
3
3
|
position: fixed;
|
|
4
4
|
width: 100%;
|
|
5
5
|
bottom: 0px;
|
|
@@ -13,6 +13,10 @@ export type Props = {
|
|
|
13
13
|
multiple?: boolean;
|
|
14
14
|
name?: string;
|
|
15
15
|
onChange?: React.ChangeEventHandler<HTMLInputElement>;
|
|
16
|
+
onClick?: React.MouseEventHandler<HTMLInputElement>;
|
|
17
|
+
onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;
|
|
18
|
+
onFocus?: React.FocusEventHandler<HTMLInputElement>;
|
|
19
|
+
onBlur?: React.FocusEventHandler<HTMLInputElement>;
|
|
16
20
|
onMultipleChange?: (values: string[]) => void;
|
|
17
21
|
onSubmit?: React.FormEventHandler<HTMLInputElement>;
|
|
18
22
|
placeholder?: string;
|
|
@@ -40,5 +44,5 @@ interface WarningProps extends Props {
|
|
|
40
44
|
warning?: true;
|
|
41
45
|
}
|
|
42
46
|
export type TextInputProps = DisabledProps | SuccessfulProps | WarningProps;
|
|
43
|
-
export declare const TextInput: ({ bg, disabled, helperText, icon, inputSx, label, maxCharacters, multiple, name, onChange, onMultipleChange, placeholder, placeIconAtTheEnd, size, successful, sx, type, value, variant, warning, }: TextInputProps) => React.JSX.Element;
|
|
47
|
+
export declare const TextInput: ({ bg, disabled, helperText, icon, inputSx, label, maxCharacters, multiple, name, onChange, onClick, onFocus, onKeyDown, onBlur, onMultipleChange, placeholder, placeIconAtTheEnd, size, successful, sx, type, value, variant, warning, }: TextInputProps) => React.JSX.Element;
|
|
44
48
|
export {};
|