@soul-refiner/design-system 2.3.3 → 2.3.5
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"),box=require("../../atoms/box/box.js"),checkbox=require("../../input/checkbox/checkbox.js"),paragraph=require("../../atoms/typography/paragraph.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const Dropdown=({checkbox:l,children:e,closeOnChange:a=!0,closeOnBlur:t=!0,defaultValue:o="",disabled:r=!1,hasArrow:n,maintainState:
|
|
2
|
+
"use strict";var React=require("react"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),checkbox=require("../../input/checkbox/checkbox.js"),paragraph=require("../../atoms/typography/paragraph.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const Dropdown=({checkbox:l,children:e,closeOnChange:a=!0,closeOnBlur:t=!0,defaultValue:o="",disabled:r=!1,hasArrow:n,maintainState:d=!0,multiple:c,offset:i=[0,16],onChange:u,open:p="right",options:s,sx:f,trigger:x,containerSx:_,additionalOptions:g,additionalOnChange:h,defaultAdditionalValue:b,useFullWidth:$=!1,...v})=>{const y=React__default.default.useId(),m=React__default.default.useRef(null);var k=React__default.default.useRef(null);const[R,C]=React__default.default.useState(!1),[w,E]=React__default.default.useState(()=>o||(c?[]:"")),[S,O]=React__default.default.useState(b||"");React__default.default.useEffect(()=>{r&&C(!1)},[r]);b=()=>{r||C(e=>!e)};const D=c?e=>{e.stopPropagation();const t=e.target.getAttribute("data-value")??"";Array.isArray(w)&&w.includes(t)?E(e=>e.filter(e=>e!==t)):E(e=>[t,...e]),a&&C(!1),u&&u(e)}:e=>{e.stopPropagation();var t=e.target.getAttribute("data-value")??"";w!==t?E(t):E(""),a&&C(!1),u&&u(e)},A=e=>{e.stopPropagation();e=e.target.getAttribute("data-value")??"";S!==e?O(e):O(""),h&&h(e)},W=e=>d&&(c?w.includes(e):e===w);let B=null;return e&&(B=React__default.default.Children.map(e,e=>{if(React__default.default.isValidElement(e)){const{onClick:t,...a}=e.props;return e=a,React__default.default.createElement(Option,{key:e.value,checkbox:!!l,onClick:D,selected:W(e.value),...e})}return null})),s&&(B=s.map((e,t)=>"string"==typeof e&&"break"===e?React__default.default.createElement(Spacer,{key:y+"-spacer-"+t}):React__default.default.createElement(Option,{key:e.value,checkbox:!!l,onClick:D,selected:W(e.value),...e}))),React__default.default.createElement(Wrapper,{$sx:f,tabIndex:0,ref:m,onBlurCapture:e=>{t&&m?.current&&!m?.current?.contains(e.relatedTarget)&&C(!1)},...v},React__default.default.cloneElement(x,"string"==typeof x.type||"Button"!==x.type?.displayName&&"Button"!==x.type?.name?{onClick:b}:{isDropdownOpen:R,onClick:b}),R&&React__default.default.createElement(Container,{$hasArrow:n,$offset:i,$openDirection:p,ref:k,$sx:_,$useFullWidth:$},React__default.default.createElement("div",{style:{display:"flex"}},React__default.default.createElement("div",{style:{display:"flex",flexDirection:"column",width:"100%"}},B),!!g?.length&&React__default.default.createElement("div",{style:{display:"flex",flexDirection:"column"}},g.map(e=>React__default.default.createElement(Option,{key:e.value,onClick:A,selected:S===e.value,label:e.label,value:e.value}))))))},Wrapper=styled.styled.div`
|
|
3
3
|
position: relative;
|
|
4
4
|
display: block;
|
|
5
5
|
outline: none;
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
box-shadow: var(--elevation-2);
|
|
16
16
|
border-radius: 8px;
|
|
17
17
|
overflow: auto;
|
|
18
|
-
|
|
18
|
+
width: 100%;
|
|
19
19
|
& > div:first-of-type {
|
|
20
20
|
border-radius: 8px 8px 0px 0px;
|
|
21
21
|
}
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
}
|
|
40
40
|
`:""}
|
|
41
41
|
${({$offset:e})=>e?`transform: translate(${e[0]}px, ${e[1]}px);`:""}
|
|
42
|
-
`,Option=({checkbox:e,disabled:t,icon:a,label:l,onClick:o,selected:r,sublabel:n,sx:
|
|
42
|
+
`,Option=({checkbox:e,disabled:t,icon:a,label:l,onClick:o,selected:r,sublabel:n,sx:d,value:c,color:i})=>React__default.default.createElement(OptionWrapper,{"data-value":c,onClick:t?void 0:o,$disabled:t,$hasCheckbox:!!e,$hasSublabel:!!n,$selected:r,$sx:d},e?React__default.default.createElement(checkbox.Checkbox,{selected:r}):a,React__default.default.createElement(box.Box,{$dir:"column",$display:"flex"},l&&React__default.default.createElement(paragraph.P,{$color:i||"grey-4",$fontSize:14,$lineHeight:20,$mediumBold:!0,$textClampLines:1},l),n&&React__default.default.createElement(paragraph.P,{$color:"grey-4",$fontSize:12,$lineHeight:16,$textClampLines:1},n))),OptionWrapper=(Option.displayName="Dropdown.Option",Dropdown.Option=Option,styled.styled.div`
|
|
43
43
|
position: relative;
|
|
44
44
|
z-index: 1;
|
|
45
45
|
padding: ${({$hasSublabel:e})=>e?10:12}px 16px;
|
|
@@ -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"),heading=require("../../atoms/typography/heading.js"),paragraph=require("../../atoms/typography/paragraph.js"),rate=require("../../actions/rate/rate.js"),cart_filled=require("../../../icons/shopping/cart_filled.js"),styles=require("../styles.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 AudioEpisodeCard=({actions:e,actionDropdown:a,content:t,cta:r,href:l,image:i,logo:o,numRating:d,purchaseText:n,rating:p,subtitle:s,supportLabel:
|
|
2
|
+
"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"),paragraph=require("../../atoms/typography/paragraph.js"),rate=require("../../actions/rate/rate.js"),cart_filled=require("../../../icons/shopping/cart_filled.js"),styles=require("../styles.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 AudioEpisodeCard=({actions:e,actionDropdown:a,content:t,cta:r,href:l,image:i,logo:o,numRating:d,purchaseText:n,rating:p,subtitle:s,supportLabel:c,sx:u,title:f})=>{var x=!!o;return React__default.default.createElement(Wrapper,{$sx:u,href:l,$hasPurchaseText:!!n},React__default.default.createElement(Figure,null,a&&React__default.default.createElement(DropdownWrapper,null,a),!!n&&React__default.default.createElement(styles.PurchaseTextWrapper,{className:"not-hover"},React__default.default.createElement(cart_filled.CartFilled,{color:"yellow-5",size:24}),React__default.default.createElement(paragraph.P,{$bold:!0,$color:"white"},n)),React__default.default.createElement(Image__default.default,{alt:"",className:"thumbnail",height:228,quality:100,src:i,width:228}),React__default.default.createElement(Figcaption,null,React__default.default.createElement(box.Box,{$display:"block",className:"hidden"},r),React__default.default.createElement(box.Box,{$align:"center",$dir:"row",$gap:16},o,React__default.default.createElement(box.Box,{$dir:"column",$gap:4,sx:"width: calc(100% - 56px);"},React__default.default.createElement(heading.H,{$color:"grey-2",$semiBold:!0,$fontSize:x?18:16,$textClampLines:1},f),React__default.default.createElement(paragraph.P,{$color:"grey-4",$fontSize:12,$lineHeight:16,$textClampLines:1,$sx:"display: flex; gap: 8px;"},s,c&&React__default.default.createElement(paragraph.P,{as:"span",className:"not-hover",$color:"grey-4",$fontSize:12,$lineHeight:16,sx:"display: inline-block; flex: 1; text-align: right;"},c)))),React__default.default.createElement(paragraph.P,{$color:"grey-5",$fontSize:14,$lineHeight:20,$mediumBold:!0,$textClampLines:6,className:"hidden inline"},t),React__default.default.createElement(box.Box,{className:"hidden",$align:"center",$dir:"row"},React__default.default.createElement(rate.Rate,{isRateable:!1,percent:p,size:"small"}),React__default.default.createElement(paragraph.P,{$color:"grey-4",$fontSize:12,$lineHeight:16,sx:"margin: 0px auto 0px 4px;"},"(",d,")"),React__default.default.createElement(box.Box,{$align:"center",$dir:"row",$gap:8},React__default.default.Children.toArray(e))))))},Wrapper=styled.styled.a`
|
|
3
3
|
cursor: pointer;
|
|
4
4
|
display: block;
|
|
5
5
|
position: relative;
|
|
@@ -86,6 +86,9 @@
|
|
|
86
86
|
flex-flow: column nowrap;
|
|
87
87
|
gap: 8px;
|
|
88
88
|
padding: 8px;
|
|
89
|
+
width: 100%;
|
|
90
|
+
position: relative;
|
|
91
|
+
box-sizing: border-box;
|
|
89
92
|
`,DropdownWrapper=styled.styled.div`
|
|
90
93
|
position: absolute;
|
|
91
94
|
top: 8px;
|