@soul-refiner/design-system 2.14.151 → 2.14.153

package/dist/common/fluid-typography.js

@@ -0,0 +1 @@
+"use strict";const m={100:"clamp(3rem, 3.906vw, 6.25rem)",80:"clamp(2.5rem, 3.125vw, 5rem)",64:"clamp(2rem, 2.5vw, 4rem)",56:"clamp(1.75rem, 2.1875vw, 3.5rem)",48:"clamp(1.5rem, 1.875vw, 3rem)",40:"clamp(1.25rem, 1.5625vw, 2.5rem)",36:"clamp(1.375rem, 1.406vw, 2.25rem)",32:"clamp(1.25rem, 1.25vw, 2rem)",28:"clamp(1.125rem, 1.094vw, 1.75rem)",24:"clamp(1rem, 0.9375vw, 1.5rem)",20:"clamp(0.875rem, 0.781vw, 1.25rem)",18:"clamp(0.75rem, 0.703vw, 1.125rem)",16:"clamp(0.875rem, 0.625vw, 1rem)",14:"clamp(0.8125rem, 0.547vw, 0.875rem)",12:"clamp(0.75rem, 0.469vw, 0.8125rem)",11:"clamp(0.625rem, 0.43vw, 0.6875rem)",10:"clamp(0.5625rem, 0.391vw, 0.625rem)"},e=(m,e=2560,r)=>{const l=+(m/16).toFixed(4);return`clamp(${void 0!==r?+(r/16).toFixed(4):+(m/2/16).toFixed(4)}rem, ${+(m/e*100).toFixed(3)}vw, ${l}rem)`};exports.computeFluidClamp=e,exports.fluidFontSize=m,exports.resolveFluidFontSize=r=>m[r]??e(r);

package/dist/common/media.js

@@ -0,0 +1 @@
+"use strict";exports.breakpointAliasOrder=["xs","sm","md","lg","hd","xl","xxl"],exports.breakpointAliases={xs:480,sm:768,md:1024,lg:1280,hd:1366,xl:1440,xxl:1920},exports.breakpoints={mobile:480,"mobile-lg":768,tablet:1024,desktop:1280,"desktop-hd":1366,"desktop-lg":1440,wide:1920};

package/dist/common/styles.js

@@ -1,34 +1,34 @@
-"use strict";var e,o=require("styled-components"),r=require("./colors.js");exports.Styles=void 0,(e=exports.Styles||(exports.Styles={})).backgroundColor=o.css`
-    background-color: ${({$backgroundColor:e})=>e?r.colorReference[e]:"var(--page-bg)"};
-  `,e.borderRadius=o.css`
+"use strict";var e=require("styled-components"),r=require("./sx.js"),o=require("./media.js"),i=require("./colors.js");var t;exports.Styles=void 0,(t=exports.Styles||(exports.Styles={})).backgroundColor=e.css`
+    background-color: ${({$backgroundColor:e})=>e?i.colorReference[e]:"var(--page-bg)"};
+  `,t.borderRadius=e.css`
     border-radius: ${({$borderRadius:e})=>e?`var(--${e})`:""};
-  `,e.color=o.css`
-    color: ${({$color:e})=>e?r.colorReference[e]:"var(--color-grey-3)"};
-  `,e.elevation=o.css`
+  `,t.color=e.css`
+    color: ${({$color:e})=>e?i.colorReference[e]:"var(--color-grey-3)"};
+  `,t.elevation=e.css`
     box-shadow: ${({$elevation:e})=>e?`var(--elevation-${e})`:"none"};
-  `,e.flex=o.css`
+  `,t.flex=e.css`
     align-items: ${({$align:e})=>e??"normal"};
     gap: ${({$gap:e})=>e&&"number"==typeof e?`${e}px`:e&&"string"==typeof e?`var(--${e})`:"0px"};
     flex: ${({$flex:e})=>e??"none"};
-    flex-flow: ${({$flow:e})=>e??"row"};
-    flex-direction: ${({$dir:e})=>e??"row"};
+    ${({$flow:e})=>e?`flex-flow: ${e};`:""}
+    ${({$dir:e})=>((e="row")=>{if("string"==typeof e)return`flex-direction: ${e};`;const r=[...o.breakpointAliasOrder].reverse().filter(r=>void 0!==e[r]);if(0===r.length)return"";const[i,...t]=r,s=[`flex-direction: ${e[i]};`];for(const r of t)s.push(`@media (max-width: ${o.breakpointAliases[r]}px) { flex-direction: ${e[r]}; }`);return s.join("\n")})(e)}
     justify-content: ${({$justify:e})=>e??"normal"};
-  `,e.margin=o.css`
+  `,t.margin=e.css`
     margin: ${({$margin:e})=>e&&"number"==typeof e?`${e}px`:e&&"string"==typeof e?`var(--${e})`:"0px"};
-  `,e.padding=o.css`
+  `,t.padding=e.css`
     padding: ${({$padding:e})=>e&&"number"==typeof e?`${e}px;`:e&&"string"==typeof e&&e.includes("px")?e:e&&"string"==typeof e?`var(--${e});`:"0px"};
-  `,e.styleable=o.css`
-    ${({sx:e})=>e||""}
-  `,e.textClamp=o.css`
+  `,t.styleable=e.css`
+    ${({sx:e,$fluid:o})=>r.processSx(e,{fluid:o})}
+  `,t.textClamp=e.css`
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     line-clamp: ${({$textClampLines:e})=>e??1};
     -webkit-line-clamp: ${({$textClampLines:e})=>e??1};
     -webkit-box-orient: vertical;
-  `,e.typography=o.css`
+  `,t.typography=e.css`
     font-style: ${({$italic:e})=>e?"italic":"normal"};
-    text-decoration: ${({$strikethrough:e,$underline:o})=>e?"line-through":o?"underline":"none"};
-  `,e.weight=o.css`
-    font-weight: ${({$bold:e,$semiBold:o,$mediumBold:r})=>e?700:o?600:r?500:400};
+    text-decoration: ${({$strikethrough:e,$underline:r})=>e?"line-through":r?"underline":"none"};
+  `,t.weight=e.css`
+    font-weight: ${({$bold:e,$semiBold:r,$mediumBold:o})=>e?700:r?600:o?500:400};
   `;

package/dist/common/sx.js

@@ -0,0 +1 @@
+"use strict";var e=require("./media.js"),o=require("./fluid-typography.js");const t=new Set(["opacity","zIndex","fontWeight","flex","flexGrow","flexShrink","order","orphans","widows","zoom","fillOpacity","strokeOpacity","strokeWidth","tabSize","columnCount","aspectRatio"]),r=e=>e.replace(/[A-Z]+/g,(e,o)=>(o>0?"-":"")+e.toLowerCase()),i=(e,r,i,n,s)=>i&&"fontSize"===e&&"number"==typeof r?void 0!==n?o.computeFluidClamp(r,n,s):o.resolveFluidFontSize(r):"number"!=typeof r||t.has(e)?`${r}`:`${r}px`;exports.processSx=(o,t={})=>{if(!o)return"";if("string"==typeof o)return o;const n=t.fluid??!1,s=[],a={};for(const[t,l]of Object.entries(o)){const o=r(t);if("object"==typeof l&&null!==l){const r=l,s={};if(n&&"fontSize"===t)for(let o=0;o<e.breakpointAliasOrder.length;o++){const t=e.breakpointAliasOrder[o];if("number"==typeof r[t])for(let i=o-1;i>=0;i--){const o=e.breakpointAliasOrder[i];if(void 0===r[o])continue;const n=parseFloat(`${r[o]}`);isNaN(n)||(s[t]=n);break}}for(const l of e.breakpointAliasOrder)void 0!==r[l]&&(a[l]||(a[l]=[]),a[l].push(`${o}: ${i(t,r[l],n,e.breakpointAliases[l],s[l])};`))}else s.push(`${o}: ${i(t,l,n)};`)}const l=[...e.breakpointAliasOrder].reverse().filter(e=>a[e]?.length).map(o=>`@media (max-width: ${e.breakpointAliases[o]}px) {\n  ${a[o].join("\n  ")}\n}`).join("\n");return[s.join("\n"),l].filter(Boolean).join("\n")};

package/dist/components/actions/button/button.js

@@ -1,8 +1,8 @@
 "use client";
-"use strict";var r=require("react/jsx-runtime"),o=require("react"),e=require("styled-components"),l=require("../../../common/styles.js"),a=require("../../atoms/typography/paragraph.js"),c=require("../../atoms/box/box.js"),d=require("../../../icons/arrow/chevron_down.js"),i=require("../../../icons/arrow/chevron_up.js");function s(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var t=s(o),n=s(e);const p=()=>({primary:b,secondary:x,outlined:v,danger:g,raised:m,special:$,text:y,dropdown:f}),u=e.css`
+"use strict";var r=require("react/jsx-runtime"),o=require("react"),e=require("styled-components"),l=require("../../../common/styles.js"),a=require("../../../common/sx.js"),d=require("../../atoms/typography/paragraph.js"),c=require("../../atoms/box/box.js"),i=require("../../../icons/arrow/chevron_down.js"),s=require("../../../icons/arrow/chevron_up.js");function n(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var t=n(o),p=n(e);const u=()=>({primary:x,secondary:v,outlined:g,danger:y,raised:$,special:f,text:m,dropdown:h}),b=e.css`
   font-family: var(--font-inter);
   display: flex;
-  border-radius: ${({$roundness:r})=>"large"===r?"32px":"medium-small"===r?"8px":"small"===r?"4px":"0px"};
+  border-radius: ${({$borderRadiusOverride:r,$roundness:o})=>r||("large"===o?"32px":"medium-small"===o?"8px":"small"===o?"4px":"0px")};
   cursor: pointer;
   user-select: none;
   box-sizing: border-box;
@@ -19,7 +19,7 @@
     color: var(--color-grey-7) !important;
     cursor: unset !important;
   }
-`,b=n.default(c.Box)`
+`,x=p.default(c.Box)`
   background-color: var(--color-primary-blue-2);
   color: var(--color-white);
   border: 1px solid var(--color-primary-blue-2);
@@ -39,12 +39,12 @@
     background-color: var(--color-primary-blue-0);
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
 
   ${({$sx:r})=>r||""}
-`,x=n.default(c.Box)`
+`,v=p.default(c.Box)`
   background-color: var(--color-primary-blue-4);
   color: var(--color-primary-blue-2);
   border: 1px solid var(--color-primary-blue-4);
@@ -64,12 +64,12 @@
     color: var(--color-primary-blue-0);
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
 
   ${({$sx:r})=>r||""}
-`,v=n.default(c.Box)`
+`,g=p.default(c.Box)`
   background-color: var(--color-white);
   color: var(--color-grey-3);
   border: 1px solid var(--color-grey-8);
@@ -101,12 +101,12 @@
     border: 1px solid var(--color-grey-8);
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
 
   ${({$sx:r})=>r||""}
-`,g=n.default(c.Box)`
+`,y=p.default(c.Box)`
   background-color: var(--color-red-4);
   color: var(--color-white);
   border: 1px solid var(--color-red-4);
@@ -126,12 +126,12 @@
     background-color: var(--color-red-2);
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
 
   ${({$sx:r})=>r||""}
-`,y=n.default(c.Box)`
+`,m=p.default(c.Box)`
   background-color: transparent;
   border-color: transparent !important;
   border: 1px solid transparent;
@@ -155,11 +155,11 @@
     border: 1px solid transparent !important;
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
   ${({$sx:r})=>r||""}
-`,m=n.default(c.Box)`
+`,$=p.default(c.Box)`
   background-color: var(--color-white);
   color: var(--color-grey-3);
   border: 1px solid var(--color-white);
@@ -179,12 +179,12 @@
     border: 1px solid var(--color-grey-9) !important;
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
 
   ${({$sx:r})=>r||""}
-`,$=n.default(c.Box)`
+`,f=p.default(c.Box)`
   background-color: transparent;
   border: 1px solid transparent;
   color: var(--color-primary-grey-3);
@@ -208,12 +208,12 @@
     border: 1px solid transparent !important;
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
 
   ${({$sx:r})=>r||""}
-`,f=n.default(c.Box)`
+`,h=p.default(c.Box)`
   width: 100%;
   background-color: var(--color-blue-10);
   color: var(--color-grey-3);
@@ -227,11 +227,11 @@
     background-color: var(--color-blue-10);
   }
 
-  ${u}
+  ${b}
   ${l.Styles.flex}
   ${l.Styles.padding}
 
   border-radius: 8px;
 
   ${({$sx:r})=>r||""}
-`;exports.Button=({as:o="button",children:e,disabled:l,fluid:c=!1,href:s,icon:n,isDropdownOpen:u,roundness:b="large",size:x="large",sx:v,type:g="primary",showChevron:y=!0,customDropdownIcon:m,...$})=>{const f=p()[g],h=t.default.Children.map(n,r=>{if(t.default.isValidElement(r))return{...r,props:{...r.props??{},size:"large"!==x||e?"large"===x?20:16:24}}})?.[0],k=m;let w;y&&(!0===u?w=k?r.jsx(k,{sx:"margin-left:auto;",size:"large"===x?20:16}):r.jsx(i.ChevronUp,{sx:"margin-left:auto;",size:"large"===x?20:16}):!1===u&&(w=k?r.jsx(k,{sx:"margin-left:auto;",size:"large"===x?20:16}):r.jsx(d.ChevronDown,{sx:"margin-left:auto;",size:"large"===x?20:16})));const S=e?"large"===x?"11px 19px":"5px 15px":"large"===x?"11px":"7px";return r.jsxs(f,{as:o,disabled:l,href:s,$align:"center",$display:"flex",$fluid:c,$gap:"large"===x?12:8,$hasChildren:!!e,$justify:"center",$padding:S,$roundness:b,$size:x,$sx:v,...$,children:[h,e&&r.jsx(a.P,{as:"span",$mediumBold:!0,$fontSize:"large"===x?16:14,$color:"inherit",children:e}),!!e&&w]})};
+`;exports.Button=({as:o="button",children:e,disabled:l,fluid:c=!1,href:n,icon:p,isDropdownOpen:b,roundness:x="large",size:v="large",sx:g,type:y="primary",showChevron:m=!0,customDropdownIcon:$,$fontSize:f,$padding:h,$borderRadius:k,...S})=>{const w=u()[y],j=t.default.Children.map(p,r=>{if(t.default.isValidElement(r))return{...r,props:{...r.props??{},size:"large"!==v||e?"large"===v?20:16:24}}})?.[0],z=$;let B;m&&(!0===b?B=z?r.jsx(z,{sx:"margin-left:auto;",size:"large"===v?20:16}):r.jsx(s.ChevronUp,{sx:"margin-left:auto;",size:"large"===v?20:16}):!1===b&&(B=z?r.jsx(z,{sx:"margin-left:auto;",size:"large"===v?20:16}):r.jsx(i.ChevronDown,{sx:"margin-left:auto;",size:"large"===v?20:16})));const q=h??(e?"large"===v?"11px 19px":"5px 15px":"large"===v?"11px":"7px"),C=f??("large"===v?16:14),D=null!=k?`${k}px`:void 0;return r.jsxs(w,{as:o,disabled:l,href:n,$align:"center",$display:"flex",$fluid:c,$gap:"large"===v?12:8,$hasChildren:!!e,$justify:"center",$padding:q,$roundness:x,$borderRadiusOverride:D,$size:v,$sx:a.processSx(g),...S,children:[j,e&&r.jsx(d.P,{as:"span",$mediumBold:!0,$fontSize:C,$color:"inherit",children:e}),!!e&&B]})};

package/dist/components/actions/stepIndicator/stepIndicator.js

@@ -1,15 +1,15 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime");require("../../atoms/box/box.js"),require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js"),require("../../atoms/typography/heading.js");var r=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js");var t=require("react"),o=require("styled-components");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=a(t),n=a(o);const l=n.default.div`
+"use strict";var e=require("react/jsx-runtime");require("../../atoms/box/box.js"),require("../../atoms/image/image.js"),require("../../atoms/layout/container.js"),require("../../atoms/layout/grid.js"),require("../../atoms/layout/inline.js"),require("../../atoms/layout/section.js"),require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js"),require("../../atoms/typography/heading.js");var r=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js");var t=require("react"),o=require("styled-components");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=a(t),n=a(o);const l=n.default.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 14px 1px;
-`,c=n.default.div`
+`,s=n.default.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 8px;
-`,s=n.default.div`
+`,c=n.default.div`
   width: 32px;
   height: 32px;
   border-radius: 50%;
@@ -22,18 +22,18 @@
   color: ${({$active:e,$completed:r})=>e||r?"white":"var(--color-grey-4)"};
   transition: all 0.2s ease;
   border: ${({$active:e,$completed:r})=>e||r?"none":"2px solid var(--color-grey-8)"};
-`,p=n.default(r.P)`
+`,u=n.default(r.P)`
   font-size: 14px;
   font-family: var(--font-inter);
   font-weight: 600;
   line-height: 20px;
   color: ${({$active:e})=>e?"var(--color-blue-2) !important":"var(--color-grey-3) !important"};
   white-space: nowrap;
-`,d=n.default.div`
+`,p=n.default.div`
   flex: 1;
   height: 2px;
   background-color: ${({$completed:e})=>e?"var(--color-blue-2)":"var(--color-grey-8)"};
   margin: 0 8px;
   margin-bottom: 24px;
   transition: all 0.2s ease;
-`;exports.StepIndicator=({currentStep:r,steps:t})=>e.jsx(l,{children:t.map((o,a)=>e.jsxs(i.default.Fragment,{children:[e.jsxs(c,{children:[e.jsx(s,{$active:r===o.number,$completed:r>o.number,children:o.number}),e.jsx(p,{$active:r===o.number,children:o.label})]}),a<t.length-1&&e.jsx(d,{$completed:r>o.number})]},o.number))});
+`;exports.StepIndicator=({currentStep:r,steps:t})=>e.jsx(l,{children:t.map((o,a)=>e.jsxs(i.default.Fragment,{children:[e.jsxs(s,{children:[e.jsx(c,{$active:r===o.number,$completed:r>o.number,children:o.number}),e.jsx(u,{$active:r===o.number,children:o.label})]}),a<t.length-1&&e.jsx(p,{$completed:r>o.number})]},o.number))});

package/dist/components/actions/upload/upload.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),i=require("react"),r=require("styled-components"),t=require("../../../common/colors.js"),l=require("../../atoms/box/box.js"),o=require("../button/button.js"),s=require("../../../icons/special/upload_audio.js"),a=require("../../../icons/special/upload_file.js"),n=require("../../../icons/special/upload_image.js"),d=require("../../../icons/special/upload_video.js"),c=require("../../../icons/basic/paperclip.js"),u=require("../../surfaces/modal/modal.js");require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js");var p=require("../../atoms/typography/heading.js"),h=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js");var x=require("./validations.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=g(i);const $=r.styled.div`
+"use strict";var e=require("react/jsx-runtime"),i=require("react"),r=require("styled-components"),t=require("../../../common/colors.js"),o=require("../../atoms/box/box.js"),l=require("../button/button.js"),s=require("../../../icons/special/upload_audio.js"),a=require("../../../icons/special/upload_file.js"),n=require("../../../icons/special/upload_image.js"),d=require("../../../icons/special/upload_video.js"),u=require("../../../icons/basic/paperclip.js"),c=require("../../surfaces/modal/modal.js");require("../../atoms/image/image.js"),require("../../atoms/layout/container.js"),require("../../atoms/layout/grid.js"),require("../../atoms/layout/inline.js"),require("../../atoms/layout/section.js"),require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js");var p=require("../../atoms/typography/heading.js"),h=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js");var x=require("./validations.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=g(i);const j=r.styled.div`
   box-sizing: border-box;
   width: ${({$size:e,$width:i})=>i?i+"px":"large"===e?"100%":"fit-content"===e?"fit-content":"134px"};
   height: ${({$height:e})=>e}px;
@@ -7,6 +7,6 @@
   background-color: ${({$background:e})=>t.COLORS.includes(e)?`var(--color-${e})`:e};
   border: 2px dashed var(--color-${({$borderColor:e})=>e});
   border-radius: ${({$size:e})=>"large"===e?"16px":"8px"};
-`,j=r.styled.input`
+`,m=r.styled.input`
   display: none;
-`;exports.Upload=({background:i="hue-blue-3",borderColor:r="hue-blue-2",children:t,iconColor:g="primary-blue-2",multiple:m,onDrop:y,size:b="large",subtext:v,text:q,type:w,showOnlyUploadButton:k=!1,height:C,width:z,validation:B,validationMessage:D})=>{const F=f.default.useRef(null),[U,L]=f.default.useState(!1),[O,S]=f.default.useState([]),A={color:g,size:x.heightLookup[w].icon[b]},P={audio:e.jsx(s.UploadAudio,{...A}),file:e.jsx(a.UploadFile,{...A}),image:e.jsx(n.UploadImage,{...A}),video:e.jsx(d.UploadVideo,{...A})},_=(e,i)=>{0===e.length&&y?y(i):S(e)},M=()=>{F.current&&(F.current.value="")};return e.jsxs(e.Fragment,{children:[e.jsx(u.Modal,{controlledOpen:O.length>0,children:e.jsx(u.Modal.Content,{footer:e.jsx(l.Box,{$display:"flex",$justify:"center",$gap:16,sx:"position: relative; width: 100%;",children:e.jsx(o.Button,{fluid:!0,size:"small",type:"primary",onClick:()=>S([]),children:"Close"})}),header:e.jsx(p.H,{$bold:!0,$color:"grey-2",$fontSize:20,children:"Can't read files"}),children:e.jsx(l.Box,{$align:"flex-start",$display:"flex",$dir:"column",$gap:32,sx:"width: 500px",children:e.jsx(h.P,{$textClampLines:10,children:D})})})}),e.jsx($,{$background:i,$borderColor:r,$draggingOver:U,$height:C||x.heightLookup[w].height[b],$width:z??0,$size:b,onDragOver:e=>{e.preventDefault(),L(!0)},onDragLeave:e=>{e.preventDefault(),L(!1)},onDrop:async e=>{S([]),e.preventDefault(),L(!1);const i=e.dataTransfer.files,r=new DataTransfer,t=[];for(const e of Array.from(i))if(B){const i=await x.validateFile(e,B);0===i.length?r.items.add(e):t.push(...i)}else r.items.add(e);const l=F.current;null!==l&&(l.files=r.files,t.length>0?_(t,l.files):_([],l.files))},children:e.jsxs(l.Box,{$align:"center",$borderRadius:"medium",$dir:"column",$display:"flex",$gap:16,$justify:"center",sx:"height: 100%; width: 100%; svg { flex-shrink: 0; };",children:[k?e.jsx(o.Button,{icon:e.jsx(c.Paperclip,{}),onClick:()=>F.current?.click(),size:"small",type:"secondary",children:q}):e.jsxs(e.Fragment,{children:[P[w],"small"!==b&&e.jsxs(l.Box,{$align:"center",$dir:"column",$display:"flex",$gap:8,$justify:"center",sx:"width: 100%;",children:[e.jsxs(h.P,{$textAlign:"center",sx:"width: 100%;",children:[q,e.jsx(o.Button,{onClick:()=>F.current?.click(),size:"small",sx:"display: inline;",type:"text",children:"Browse"})]}),e.jsx(h.P,{$textAlign:"center",sx:"width: 100%;",children:v})]})]}),e.jsx(j,{"data-testid":"dropzone-upload-input",ref:F,type:"file",multiple:m,accept:x.fileTypeLookup[w],name:"Files",onChange:async()=>{S([]);const e=F.current;if(e?.files?.length){const i=[];for(const r of e.files)if(B){const e=await x.validateFile(r,B);if(e.length>0){i.push(...e);break}}_(i,e.files)}}})]})}),f.default.Children.map(t,e=>f.default.isValidElement(e)?f.default.cloneElement(e,{handleUpload:()=>F.current?.click(),removeFileFromState:M}):e)]})};
+`;exports.Upload=({background:i="hue-blue-3",borderColor:r="hue-blue-2",children:t,iconColor:g="primary-blue-2",multiple:$,onDrop:y,size:b="large",subtext:q,text:v,type:w,showOnlyUploadButton:k=!1,height:C,width:z,validation:B,validationMessage:D})=>{const F=f.default.useRef(null),[U,L]=f.default.useState(!1),[O,S]=f.default.useState([]),A={color:g,size:x.heightLookup[w].icon[b]},P={audio:e.jsx(s.UploadAudio,{...A}),file:e.jsx(a.UploadFile,{...A}),image:e.jsx(n.UploadImage,{...A}),video:e.jsx(d.UploadVideo,{...A})},_=(e,i)=>{0===e.length&&y?y(i):S(e)},M=()=>{F.current&&(F.current.value="")};return e.jsxs(e.Fragment,{children:[e.jsx(c.Modal,{controlledOpen:O.length>0,children:e.jsx(c.Modal.Content,{footer:e.jsx(o.Box,{$display:"flex",$justify:"center",$gap:16,sx:"position: relative; width: 100%;",children:e.jsx(l.Button,{fluid:!0,size:"small",type:"primary",onClick:()=>S([]),children:"Close"})}),header:e.jsx(p.H,{$bold:!0,$color:"grey-2",$fontSize:20,children:"Can't read files"}),children:e.jsx(o.Box,{$align:"flex-start",$display:"flex",$dir:"column",$gap:32,sx:"width: 500px",children:e.jsx(h.P,{$textClampLines:10,children:D})})})}),e.jsx(j,{$background:i,$borderColor:r,$draggingOver:U,$height:C||x.heightLookup[w].height[b],$width:z??0,$size:b,onDragOver:e=>{e.preventDefault(),L(!0)},onDragLeave:e=>{e.preventDefault(),L(!1)},onDrop:async e=>{S([]),e.preventDefault(),L(!1);const i=e.dataTransfer.files,r=new DataTransfer,t=[];for(const e of Array.from(i))if(B){const i=await x.validateFile(e,B);0===i.length?r.items.add(e):t.push(...i)}else r.items.add(e);const o=F.current;null!==o&&(o.files=r.files,t.length>0?_(t,o.files):_([],o.files))},children:e.jsxs(o.Box,{$align:"center",$borderRadius:"medium",$dir:"column",$display:"flex",$gap:16,$justify:"center",sx:"height: 100%; width: 100%; svg { flex-shrink: 0; };",children:[k?e.jsx(l.Button,{icon:e.jsx(u.Paperclip,{}),onClick:()=>F.current?.click(),size:"small",type:"secondary",children:v}):e.jsxs(e.Fragment,{children:[P[w],"small"!==b&&e.jsxs(o.Box,{$align:"center",$dir:"column",$display:"flex",$gap:8,$justify:"center",sx:"width: 100%;",children:[e.jsxs(h.P,{$textAlign:"center",sx:"width: 100%;",children:[v,e.jsx(l.Button,{onClick:()=>F.current?.click(),size:"small",sx:"display: inline;",type:"text",children:"Browse"})]}),e.jsx(h.P,{$textAlign:"center",sx:"width: 100%;",children:q})]})]}),e.jsx(m,{"data-testid":"dropzone-upload-input",ref:F,type:"file",multiple:$,accept:x.fileTypeLookup[w],name:"Files",onChange:async()=>{S([]);const e=F.current;if(e?.files?.length){const i=[];for(const r of e.files)if(B){const e=await x.validateFile(r,B);if(e.length>0){i.push(...e);break}}_(i,e.files)}}})]})}),f.default.Children.map(t,e=>f.default.isValidElement(e)?f.default.cloneElement(e,{handleUpload:()=>F.current?.click(),removeFileFromState:M}):e)]})};

package/dist/components/atoms/box/box.js

@@ -1,12 +1,12 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),s=require("styled-components"),l=require("../../../common/styles.js");const t=s.styled.div`
-  ${({$display:e})=>"flex"===e?"display: flex;":""}
-  ${l.Styles.flex}
-  ${l.Styles.backgroundColor}
-  ${l.Styles.borderRadius}
-  ${l.Styles.elevation}
-  ${l.Styles.margin}
-  ${l.Styles.padding}
-  ${l.Styles.styleable}
-  ${({$sx:e})=>e||""}
-`;exports.Box=({$display:s="flex",sx:l,...r})=>e.jsx(t,{$display:s,$sx:l,...r}),exports.Component=t;
+"use strict";var e=require("react/jsx-runtime"),s=require("styled-components"),t=require("../../../common/styles.js");const l=s.styled.div.withConfig({shouldForwardProp:e=>"sx"!==e})`
+  ${({$display:e="flex"})=>"flex"===e?"display: flex;":""}
+  ${t.Styles.flex}
+  ${t.Styles.backgroundColor}
+  ${t.Styles.borderRadius}
+  ${t.Styles.elevation}
+  ${t.Styles.margin}
+  ${t.Styles.padding}
+  ${t.Styles.styleable}
+  ${({$sx:e})=>e??""}
+`;exports.Box=s=>e.jsx(l,{...s}),exports.Component=l;

package/dist/components/atoms/image/image.js

@@ -0,0 +1,10 @@
+"use client";
+"use strict";var t=require("react/jsx-runtime"),e=require("styled-components"),i=require("../../../common/styles.js");const s=e.styled.img.withConfig({shouldForwardProp:t=>!["sx","$sx","$fit","$ratio","$fill"].includes(t)})`
+  display: block;
+  max-width: 100%;
+  height: ${({$fill:t})=>t?"100%":"auto"};
+  ${({$fill:t})=>t?"width: 100%;":""}
+  object-fit: ${({$fit:t="cover"})=>t};
+  aspect-ratio: ${({$ratio:t})=>t??"auto"};
+  ${i.Styles.styleable}
+`;exports.Image=({alt:e,...i})=>t.jsx(s,{alt:e,...i});

package/dist/components/atoms/layout/container.js

@@ -0,0 +1,14 @@
+"use client";
+"use strict";var e=require("react/jsx-runtime"),i=require("styled-components"),t=require("../../../common/styles.js"),r=require("../../../common/media.js");const n=e=>void 0===e?"0":"number"==typeof e?`${e}px`:`var(--${e})`,d=i.styled.div.withConfig({shouldForwardProp:e=>!["sx","$breakpoint","$paddingX"].includes(e)})`
+  width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  padding-left: ${({$paddingX:e})=>n(e)};
+  padding-right: ${({$paddingX:e})=>n(e)};
+  ${({$breakpoint:e="desktop"})=>{const t=r.breakpoints[e];return i.css`
+      @media (min-width: ${t}px) {
+        max-width: ${t}px;
+      }
+    `}}
+  ${t.Styles.styleable}
+`;exports.Container=i=>e.jsx(d,{...i});

package/dist/components/atoms/layout/grid.js

@@ -0,0 +1,7 @@
+"use client";
+"use strict";var e=require("react/jsx-runtime"),r=require("styled-components"),o=require("../../../common/styles.js"),i=require("../../../common/media.js");const t=e=>void 0===e?"0px":"number"==typeof e?`${e}px`:`var(--${e})`,a=r.styled.div.withConfig({shouldForwardProp:e=>!["sx","$cols","$minColWidth","$gap","$rowGap","$colGap"].includes(e)})`
+  display: grid;
+  ${({$cols:e,$minColWidth:r})=>((e="auto",r=280)=>{if("auto"===e)return`grid-template-columns: repeat(auto-fit, minmax(${r}px, 1fr));`;if("number"==typeof e)return`grid-template-columns: repeat(${e}, minmax(0, 1fr));`;const o=[...i.breakpointAliasOrder].reverse().filter(r=>void 0!==e[r]);if(0===o.length)return"";const[t,...a]=o,n=[`grid-template-columns: repeat(${e[t]}, minmax(0, 1fr));`];for(const r of a){const o=e[r],t=i.breakpointAliases[r];n.push(`@media (max-width: ${t}px) { grid-template-columns: repeat(${o}, minmax(0, 1fr)); }`)}return n.join("\n")})(e,r)}
+  ${({$gap:e,$rowGap:r,$colGap:o})=>{if(void 0!==r||void 0!==o){const i=[];return void 0!==r?i.push(`row-gap: ${t(r)};`):void 0!==e&&i.push(`row-gap: ${t(e)};`),void 0!==o?i.push(`column-gap: ${t(o)};`):void 0!==e&&i.push(`column-gap: ${t(e)};`),i.join(" ")}return void 0!==e?`gap: ${t(e)};`:""}}
+  ${o.Styles.styleable}
+`;exports.Grid=r=>e.jsx(a,{...r});

package/dist/components/atoms/layout/inline.js

@@ -0,0 +1,10 @@
+"use client";
+"use strict";var e=require("react/jsx-runtime"),s=require("styled-components"),r=require("../../../common/styles.js");const t=s.styled.div.withConfig({shouldForwardProp:e=>!["sx","$gap","$align","$justify"].includes(e)})`
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: ${({$align:e="center"})=>e};
+  justify-content: ${({$justify:e})=>e??"normal"};
+  gap: ${({$gap:e="small"})=>"number"==typeof e?`${e}px`:`var(--${e})`};
+  ${r.Styles.styleable}
+`;exports.Inline=s=>e.jsx(t,{...s});

package/dist/components/atoms/layout/section.js

@@ -0,0 +1,8 @@
+"use client";
+"use strict";var e=require("react/jsx-runtime"),s=require("styled-components"),t=require("../../../common/styles.js");const r={sm:"1.5rem",md:"3rem",lg:"4rem",xl:"6rem"},i=s.styled.section.withConfig({shouldForwardProp:e=>!["sx","$spacing"].includes(e)})`
+  width: 100%;
+  padding-top: ${({$spacing:e="md"})=>r[e]};
+  padding-bottom: ${({$spacing:e="md"})=>r[e]};
+  ${t.Styles.styleable}
+  ${({$sx:e})=>e??""}
+`;exports.Section=s=>e.jsx(i,{...s});

package/dist/components/atoms/layout/stack.js

@@ -0,0 +1,2 @@
+"use client";
+"use strict";var r=require("react/jsx-runtime"),e=require("../box/box.js");exports.Stack=({$dir:i="column",$gap:s="medium",...t})=>r.jsx(e.Box,{$dir:i,$gap:s,...t});

package/dist/components/atoms/typography/display.js

@@ -1,6 +1,7 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),t=require("styled-components"),i=require("./typography.js");const n=t.styled(i.Typography)`
-  font-size: ${({$fontSize:e})=>e+"px"};
-  line-height: ${({$lineHeight:e})=>e+"px"};
+"use strict";var e=require("react/jsx-runtime"),t=require("styled-components"),i=require("./typography.js"),l=require("../../../common/styles.js"),o=require("../../../common/fluid-typography.js");const r=t.styled(i.Typography).withConfig({shouldForwardProp:e=>"sx"!==e})`
+  font-size: ${({$fontSize:e=64,$fluid:t})=>t&&o.fluidFontSize[e]?o.fluidFontSize[e]:e/16+"rem"};
+  line-height: ${({$fluid:e})=>e?"1.2":void 0};
   text-align: ${({$textAlign:e})=>e||"left"};
-`;exports.Display=({as:t="h1",$fontSize:i=64,$lineHeight:s=96,$textAlign:l="left",...r})=>e.jsx(n,{as:t||"h1",$fontSize:i,$lineHeight:s,$textAlign:l,...r});
+  ${l.Styles.styleable}
+`;exports.Display=({as:t="h1",$fontSize:i=64,$lineHeight:l=96,$textAlign:o="left",...s})=>e.jsx(r,{as:t||"h1",$fontSize:i,$lineHeight:l,$textAlign:o,...s});

package/dist/components/atoms/typography/heading.js

@@ -1,7 +1,8 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),s=require("styled-components"),i=require("./typography.js");const t=s.styled(i.Typography)`
-  font-size: ${({$fontSize:e})=>e+"px"};
-  line-height: ${({$lineHeight:e})=>e+"px"};
+"use strict";var e=require("react/jsx-runtime"),i=require("styled-components"),t=require("./typography.js"),s=require("../../../common/styles.js"),n=require("../../../common/fluid-typography.js");const o=e=>e/16+"rem",l=i.styled(t.Typography).withConfig({shouldForwardProp:e=>"sx"!==e})`
+  ${({$fontSize:e,$fluid:i})=>e?`font-size: ${i&&n.fluidFontSize[e]?n.fluidFontSize[e]:o(e)};`:""}
+  ${({$lineHeight:e,$fluid:i})=>e?`line-height: ${i?"1.3":o(e)};`:i?"line-height: 1.3;":""}
   text-align: ${({$textAlign:e})=>e||"left"};
+  ${s.Styles.styleable}
   ${({$sx:e})=>e||""}
-`,n=({sx:s,...i})=>e.jsx(t,{$sx:s,...i}),x=({sx:s,...i})=>e.jsx(t,{as:"h1",$fontSize:48,$lineHeight:64,$sx:s,...i});x.displayName="H.One",n.One=x;const $=({sx:s,...i})=>e.jsx(t,{as:"h2",$fontSize:40,$lineHeight:60,$sx:s,...i});$.displayName="H.Two",n.Two=$;const a=({sx:s,...i})=>e.jsx(t,{as:"h3",$fontSize:36,$lineHeight:54,$sx:s,...i});a.displayName="H.Three",n.Three=a;const o=({sx:s,...i})=>e.jsx(t,{as:"h4",$fontSize:32,$lineHeight:48,$sx:s,...i});o.displayName="H.Four",n.Four=o;const h=({sx:s,...i})=>e.jsx(t,{as:"h5",$fontSize:28,$lineHeight:36,$sx:s,...i});h.displayName="H.Five",n.Five=h;const l=({sx:s,...i})=>e.jsx(t,{as:"h6",$fontSize:24,$lineHeight:36,$sx:s,...i});l.displayName="H.Six",n.Six=l;const H=({sx:s,...i})=>e.jsx(t,{as:"h6",$fontSize:20,$lineHeight:28,$sx:s,...i});H.displayName="H.Seven",n.Seven=H;const r=({sx:s,...i})=>e.jsx(t,{as:"h6",$fontSize:18,$lineHeight:26,$sx:s,...i});r.displayName="H.Eight",n.Eight=r,exports.H=n;
+`,a=i=>e.jsx(l,{...i}),h=i=>e.jsx(l,{as:"h1",$fontSize:48,$lineHeight:64,...i});h.displayName="H.One",a.One=h;const $=i=>e.jsx(l,{as:"h2",$fontSize:40,$lineHeight:60,...i});$.displayName="H.Two",a.Two=$;const r=i=>e.jsx(l,{as:"h3",$fontSize:36,$lineHeight:54,...i});r.displayName="H.Three",a.Three=r;const g=i=>e.jsx(l,{as:"h4",$fontSize:32,$lineHeight:48,...i});g.displayName="H.Four",a.Four=g;const y=i=>e.jsx(l,{as:"h5",$fontSize:28,$lineHeight:36,...i});y.displayName="H.Five",a.Five=y;const H=i=>e.jsx(l,{as:"h6",$fontSize:24,$lineHeight:36,...i});H.displayName="H.Six",a.Six=H;const d=i=>e.jsx(l,{as:"h6",$fontSize:20,$lineHeight:28,...i});d.displayName="H.Seven",a.Seven=d;const f=i=>e.jsx(l,{as:"h6",$fontSize:18,$lineHeight:26,...i});f.displayName="H.Eight",a.Eight=f,exports.H=a;

package/dist/components/atoms/typography/paragraph.js

@@ -1,9 +1,9 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),t=require("styled-components"),i=require("../../../common/styles.js");const l=t.styled.p`
+"use strict";var e=require("react/jsx-runtime"),t=require("styled-components"),i=require("../../../common/styles.js"),l=require("../../../common/fluid-typography.js");const n=t.styled.p.withConfig({shouldForwardProp:e=>"sx"!==e})`
   margin: 0px;
   font-family: var(--font-inter);
-  font-size: ${({$fontSize:e})=>e+"px"};
-  line-height: ${({$lineHeight:e})=>e+"px"};
+  font-size: ${({$fontSize:e=16,$fluid:t})=>t&&l.fluidFontSize[e]?l.fluidFontSize[e]:e/16+"rem"};
+  line-height: ${({$lineHeight:e=24,$fluid:t})=>t?"1.6":e/16+"rem"};
   text-align: ${({$textAlign:e})=>e||"left"};
   ${i.Styles.color}
   ${i.Styles.weight}
@@ -11,4 +11,4 @@
   ${i.Styles.styleable}
   ${({$textClampLines:e})=>e?i.Styles.textClamp:""}
   ${({$sx:e})=>e||""}
-`;exports.P=({as:t="p",children:i,$fontSize:n=16,$lineHeight:s=24,$textAlign:$="left",sx:r,innerRef:o,...x})=>e.jsx(l,{as:t,$fontSize:n,$lineHeight:s,$textAlign:$,$sx:r,ref:o,...x,children:i});
+`;exports.P=({as:t="p",children:i,$fontSize:l=16,$lineHeight:r=24,$textAlign:s="left",$fluid:o=!1,innerRef:$,...f})=>e.jsx(n,{as:t,$fontSize:l,$lineHeight:r,$textAlign:s,$fluid:o,ref:$,...f,children:i});

package/dist/components/atoms/typography/typography.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var t=require("styled-components"),e=require("../../../common/styles.js");const s=t.styled.p`
+"use strict";var t=require("styled-components"),e=require("../../../common/styles.js");const s=t.styled.p.withConfig({shouldForwardProp:t=>"sx"!==t})`
   margin: 0px;
   font-family: var(--font-inter);
   ${e.Styles.color}

package/dist/components/editor/plugins/blocks/biblical-quote.js

@@ -1,11 +1,11 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("styled-components"),t=require("@udecode/plate-common");require("../../../iconography/icon/icon.js");var s=require("../../../../icons/basic/bible.js");require("../../../../icons/basic/subtask.js");var o=require("../../constants.js");require("../../../atoms/box/box.js"),require("../../../atoms/highlighter/highlighter.js"),require("../../../atoms/typography/display.js"),require("../../../atoms/typography/heading.js");var a=require("../../../atoms/typography/paragraph.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../../atoms/typography/typography.js"),require("../../../atoms/countdown/countdown.js");const n=l(r).default.forwardRef(({children:r,...i},o)=>e.jsx(t.PlateElement,{asChild:!0,ref:o,...i,children:e.jsxs(d,{children:[e.jsxs(u,{children:[e.jsx(s.Bible,{size:30,color:"grey-6"}),e.jsx(p,{})]}),e.jsx(a.P,{$sx:"flex:1;",$color:"grey-6",children:r})]})})),c=t.createPluginFactory({key:o.ELEMENT_BIBLICAL_QUOTE,type:o.ELEMENT_BIBLICAL_QUOTE,isElement:!0}),d=i.styled.blockquote`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("styled-components"),t=require("@udecode/plate-common");require("../../../iconography/icon/icon.js");var s=require("../../../../icons/basic/bible.js");require("../../../../icons/basic/subtask.js");var o=require("../../constants.js");require("../../../atoms/box/box.js"),require("../../../atoms/image/image.js"),require("../../../atoms/layout/container.js"),require("../../../atoms/layout/grid.js"),require("../../../atoms/layout/inline.js"),require("../../../atoms/layout/section.js"),require("../../../atoms/highlighter/highlighter.js"),require("../../../atoms/typography/display.js"),require("../../../atoms/typography/heading.js");var a=require("../../../atoms/typography/paragraph.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../../atoms/typography/typography.js"),require("../../../atoms/countdown/countdown.js");const n=l(r).default.forwardRef(({children:r,...i},o)=>e.jsx(t.PlateElement,{asChild:!0,ref:o,...i,children:e.jsxs(u,{children:[e.jsxs(d,{children:[e.jsx(s.Bible,{size:30,color:"grey-6"}),e.jsx(g,{})]}),e.jsx(a.P,{$sx:"flex:1;",$color:"grey-6",children:r})]})})),c=t.createPluginFactory({key:o.ELEMENT_BIBLICAL_QUOTE,type:o.ELEMENT_BIBLICAL_QUOTE,isElement:!0}),u=i.styled.blockquote`
   display: flex;
   flex-direction: row;
   align-items: center;
   padding: 0;
   margin: 0;
   min-height: 120px;
-`,u=i.styled.div`
+`,d=i.styled.div`
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -13,7 +13,7 @@
   gap: 16px;
   flex: none;
   align-self: stretch;
-`,p=i.styled.div`
+`,g=i.styled.div`
   width: 1px;
   align-self: stretch;
   background-color: var(--color-grey-9);

package/dist/components/editor/plugins/blocks/prayer_for_change.js

@@ -1,20 +1,20 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("styled-components"),t=require("@udecode/plate-common");require("../../../iconography/icon/icon.js");var s=require("../../../../icons/basic/prayer.js");require("../../../../icons/basic/subtask.js");var a=require("../../constants.js");require("../../../atoms/box/box.js"),require("../../../atoms/highlighter/highlighter.js"),require("../../../atoms/typography/display.js"),require("../../../atoms/typography/heading.js");var n=require("../../../atoms/typography/paragraph.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../../atoms/typography/typography.js"),require("../../../atoms/countdown/countdown.js");var l=o(r);const c=l.default.forwardRef(({children:r,...i},a)=>{const o=l.default.Children.toArray(r),c=o[0],d=o.slice(1);return e.jsx(t.PlateElement,{asChild:!0,ref:a,...i,children:e.jsxs(p,{children:[e.jsxs(g,{children:[e.jsx(s.Prayer,{size:40,color:"grey-6"}),e.jsx(h,{})]}),e.jsxs(u,{children:[e.jsx(n.P,{$fontSize:16,$lineHeight:24,$bold:!0,$color:"grey-3",sx:"letter-spacing: -0.176px; ",children:c}),e.jsx(n.P,{$fontSize:16,$lineHeight:24,$color:"grey-3",sx:"letter-spacing: -0.176px;",children:d})]})]})})}),d=t.createPluginFactory({key:a.ELEMENT_PRAYER_FOR_CHANGE,type:a.ELEMENT_PRAYER_FOR_CHANGE,isElement:!0}),p=i.styled.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("styled-components"),t=require("@udecode/plate-common");require("../../../iconography/icon/icon.js");var s=require("../../../../icons/basic/prayer.js");require("../../../../icons/basic/subtask.js");var a=require("../../constants.js");require("../../../atoms/box/box.js"),require("../../../atoms/image/image.js"),require("../../../atoms/layout/container.js"),require("../../../atoms/layout/grid.js"),require("../../../atoms/layout/inline.js"),require("../../../atoms/layout/section.js"),require("../../../atoms/highlighter/highlighter.js"),require("../../../atoms/typography/display.js"),require("../../../atoms/typography/heading.js");var o=require("../../../atoms/typography/paragraph.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../../atoms/typography/typography.js"),require("../../../atoms/countdown/countdown.js");var l=n(r);const c=l.default.forwardRef(({children:r,...i},a)=>{const n=l.default.Children.toArray(r),c=n[0],d=n.slice(1);return e.jsx(t.PlateElement,{asChild:!0,ref:a,...i,children:e.jsxs(u,{children:[e.jsxs(p,{children:[e.jsx(s.Prayer,{size:40,color:"grey-6"}),e.jsx(g,{})]}),e.jsxs(y,{children:[e.jsx(o.P,{$fontSize:16,$lineHeight:24,$bold:!0,$color:"grey-3",sx:"letter-spacing: -0.176px; ",children:c}),e.jsx(o.P,{$fontSize:16,$lineHeight:24,$color:"grey-3",sx:"letter-spacing: -0.176px;",children:d})]})]})})}),d=t.createPluginFactory({key:a.ELEMENT_PRAYER_FOR_CHANGE,type:a.ELEMENT_PRAYER_FOR_CHANGE,isElement:!0}),u=i.styled.div`
   display: flex;
   padding: 8px 40px;
   align-items: center;
   align-self: stretch;
-`,g=i.styled.div`
+`,p=i.styled.div`
   display: flex;
   height: 72px;
   padding: 0 16px;
   align-items: center;
   gap: 16px;
-`,h=i.styled.div`
+`,g=i.styled.div`
   width: 1px;
   align-self: stretch;
   background-color: #eaebed;
   flex: none;
-`,u=i.styled.div`
+`,y=i.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;

package/dist/components/editor/simple_editor/simple_editor.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),a=require("@udecode/plate-common"),t=require("./plugins.js"),i=require("./navbar.js");require("../../surfaces/accordion/accordion.js"),require("../../surfaces/carousel/card/card.js"),require("../../surfaces/comment/comment.js"),require("../../surfaces/discuss_post/discuss_post.js"),require("../../surfaces/drawer/drawer.js"),require("../../surfaces/drawer/bottom-drawer.js"),require("../../surfaces/message/message.js");var s=require("../../surfaces/modal/modal.js");require("react-dom"),require("../../surfaces/post/post.js"),require("../../surfaces/calendar_date/calendar_date.js"),require("../../surfaces/success_modal/success-modal.js"),require("../../surfaces/trailer-modal/trailer-modal.js");var n=require("../../atoms/box/box.js");require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js");var l=require("../../atoms/typography/heading.js"),d=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js");var c=require("../../actions/button/button.js");require("../../actions/dropdown/dropdown.js"),require("../../actions/rate/rate.js"),require("../../actions/switch/switch.js"),require("../../actions/toggle/toggle.js"),require("../../actions/upload/upload.js"),require("../../actions/AccountSelector/selector.js"),require("../../actions/stepIndicator/stepIndicator.js");var u=require("../../actions/upload/validations.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=p(r);const g=o.styled.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),a=require("@udecode/plate-common"),t=require("./plugins.js"),i=require("./navbar.js");require("../../surfaces/accordion/accordion.js"),require("../../surfaces/carousel/card/card.js"),require("../../surfaces/comment/comment.js"),require("../../surfaces/discuss_post/discuss_post.js"),require("../../surfaces/drawer/drawer.js"),require("../../surfaces/drawer/bottom-drawer.js"),require("../../surfaces/message/message.js");var s=require("../../surfaces/modal/modal.js");require("react-dom"),require("../../surfaces/post/post.js"),require("../../surfaces/calendar_date/calendar_date.js"),require("../../surfaces/success_modal/success-modal.js"),require("../../surfaces/trailer-modal/trailer-modal.js");var n=require("../../atoms/box/box.js");require("../../atoms/image/image.js"),require("../../atoms/layout/container.js"),require("../../atoms/layout/grid.js"),require("../../atoms/layout/inline.js"),require("../../atoms/layout/section.js"),require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js");var l=require("../../atoms/typography/heading.js"),d=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js");var u=require("../../actions/button/button.js");require("../../actions/dropdown/dropdown.js"),require("../../actions/rate/rate.js"),require("../../actions/switch/switch.js"),require("../../actions/toggle/toggle.js"),require("../../actions/upload/upload.js"),require("../../actions/AccountSelector/selector.js"),require("../../actions/stepIndicator/stepIndicator.js");var c=require("../../actions/upload/validations.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=p(r);const m=o.styled.div`
   & > div {
     padding: 24px;
     min-height: 224px;
@@ -10,7 +10,7 @@
     }
   }
   ${({$sx:e})=>e||""};
-`,m=o.styled.div`
+`,g=o.styled.div`
   position: relative;
   max-width: 1200px;
   width: 100%;
@@ -70,4 +70,4 @@
   & > [data-slate-editor='true'] > * {
     margin: 24px 0px;
   }
-`;exports.SimpleEditor=({editable:r,handleUploadImage:o,onChange:p,validation:x,sx:j,validationMessage:f,placeholder:q="",previousContent:y=[{type:"p",children:[{text:""}]}],showLink:v=!0,showImage:b=!0})=>{const[w,$]=h.default.useState([]);return e.jsxs(e.Fragment,{children:[e.jsx(s.Modal,{controlledOpen:w.length>0,children:e.jsx(s.Modal.Content,{footer:e.jsx(n.Box,{$display:"flex",$justify:"center",$gap:16,sx:"position: relative; width: 100%;",children:e.jsx(c.Button,{fluid:!0,size:"small",type:"primary",onClick:()=>$([]),children:"Close"})}),header:e.jsx(l.H,{$bold:!0,$color:"grey-2",$fontSize:20,children:"Can't read files"}),children:e.jsx(n.Box,{$align:"flex-start",$display:"flex",$dir:"column",$gap:32,sx:"width: 500px",children:e.jsx(d.P,{$textClampLines:10,children:f})})})}),e.jsx(a.Plate,{id:"main",initialValue:y,onChange:p,plugins:t.plugins,children:e.jsxs(m,{children:[r&&e.jsx(i.EditorBar,{handleUploadImage:async e=>{$([]);const r=[];if(x)for(let o=0;o<e.length;o++){const a=e[o],t=await u.validateFile(a,x);if(t.length>0){r.push(...t);break}}return r?.length>0?($(r),""):await o(e)},showLink:v,showImage:b}),e.jsx(g,{$sx:j,children:e.jsx(a.PlateContent,{id:"main",autoFocus:!0,placeholder:q,readOnly:!r,spellCheck:!0})})]})})]})};
+`;exports.SimpleEditor=({editable:r,handleUploadImage:o,onChange:p,validation:j,sx:x,validationMessage:f,placeholder:q="",previousContent:y=[{type:"p",children:[{text:""}]}],showLink:v=!0,showImage:b=!0})=>{const[w,$]=h.default.useState([]);return e.jsxs(e.Fragment,{children:[e.jsx(s.Modal,{controlledOpen:w.length>0,children:e.jsx(s.Modal.Content,{footer:e.jsx(n.Box,{$display:"flex",$justify:"center",$gap:16,sx:"position: relative; width: 100%;",children:e.jsx(u.Button,{fluid:!0,size:"small",type:"primary",onClick:()=>$([]),children:"Close"})}),header:e.jsx(l.H,{$bold:!0,$color:"grey-2",$fontSize:20,children:"Can't read files"}),children:e.jsx(n.Box,{$align:"flex-start",$display:"flex",$dir:"column",$gap:32,sx:"width: 500px",children:e.jsx(d.P,{$textClampLines:10,children:f})})})}),e.jsx(a.Plate,{id:"main",initialValue:y,onChange:p,plugins:t.plugins,children:e.jsxs(g,{children:[r&&e.jsx(i.EditorBar,{handleUploadImage:async e=>{$([]);const r=[];if(j)for(let o=0;o<e.length;o++){const a=e[o],t=await c.validateFile(a,j);if(t.length>0){r.push(...t);break}}return r?.length>0?($(r),""):await o(e)},showLink:v,showImage:b}),e.jsx(m,{$sx:x,children:e.jsx(a.PlateContent,{id:"main",autoFocus:!0,placeholder:q,readOnly:!r,spellCheck:!0})})]})})]})};

package/dist/components/feedback/emojiPicker/emoji-picker.js

@@ -1,9 +1,9 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),o=require("../../../assets/custom_emoji_data.json.js"),i=require("react-window"),s=require("./utils.js"),n=require("./constants.js"),a=require("../../atoms/box/box.js");require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js"),require("../../atoms/typography/heading.js");var d=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js"),require("../../iconography/icon/icon.js"),require("../../../icons/basic/subtask.js");var l=require("../../../icons/basic/emoticon_add.js"),c=require("../../../icons/emoji/emoji_add.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../../icons/security/verified_filled.js"),require("../../../common/colors.js");var p=u(r),g=u(t);const x={[n.CategoryId.FREQUENTLY]:"Frequently Used",[n.CategoryId.PEOPLE]:"Smile & People",[n.CategoryId.NATURE]:"Nature",[n.CategoryId.FOODS]:"Food & Drink",[n.CategoryId.ACTIVITY]:"Activity",[n.CategoryId.OBJECTS]:"Objects",[n.CategoryId.SYMBOLS]:"Symbols",[n.CategoryId.FLAGS]:"Flags"},h=g.default.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),o=require("../../../assets/custom_emoji_data.json.js"),i=require("react-window"),s=require("./utils.js"),n=require("./constants.js"),a=require("../../atoms/box/box.js");require("../../atoms/image/image.js"),require("../../atoms/layout/container.js"),require("../../atoms/layout/grid.js"),require("../../atoms/layout/inline.js"),require("../../atoms/layout/section.js"),require("../../atoms/highlighter/highlighter.js"),require("../../atoms/typography/display.js"),require("../../atoms/typography/heading.js");var d=require("../../atoms/typography/paragraph.js");require("../../atoms/typography/typography.js"),require("../../atoms/countdown/countdown.js"),require("../../iconography/icon/icon.js"),require("../../../icons/basic/subtask.js");var u=require("../../../icons/basic/emoticon_add.js"),l=require("../../../icons/emoji/emoji_add.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../../../icons/security/verified_filled.js"),require("../../../common/colors.js");var p=c(r),g=c(t);const x={[n.CategoryId.FREQUENTLY]:"Frequently Used",[n.CategoryId.PEOPLE]:"Smile & People",[n.CategoryId.NATURE]:"Nature",[n.CategoryId.FOODS]:"Food & Drink",[n.CategoryId.ACTIVITY]:"Activity",[n.CategoryId.OBJECTS]:"Objects",[n.CategoryId.SYMBOLS]:"Symbols",[n.CategoryId.FLAGS]:"Flags"},m=g.default.div`
   cursor: pointer;
-`,m=g.default.div`
+`,h=g.default.div`
   position: relative;
   display: inline-block;
-`,f=g.default.div`
+`,j=g.default.div`
   z-index: 100;
   width: 320px;
   max-height: 450px;
@@ -21,7 +21,7 @@
   justify-content: center;
   align-items: center;
   border-bottom: 1px solid var(--color-grey-9);
-`,j=g.default.input`
+`,f=g.default.input`
   width: 95%;
   padding: 6px 0px 6px 6px;
   border-radius: 6px;
@@ -80,4 +80,4 @@
   &:hover {
     background: var(--color-grey-9);
   }
-`;exports.CustomEmojiPicker=({onSelect:r,onClickOutside:t,open:i,trigger:u,$pickersx:g})=>{const[$,C]=p.default.useState(n.CategoryId.FREQUENTLY),[k,w]=p.default.useState(""),[L,T]=p.default.useState(""),q=p.default.useRef(null),O=p.default.useRef(null),[R,_]=p.default.useState(!1),P=void 0!==i?i:R;p.default.useEffect(()=>{const e=e=>{q.current&&!q.current.contains(e.target)&&(void 0===i&&_(!1),t())};return P&&document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[P,i]),p.default.useEffect(()=>{const e=setTimeout(()=>{T(k)},300);return()=>{clearTimeout(e)}},[k]);const{categories:U,emojiMap:N}=p.default.useMemo(()=>s.preprocessEmojiData(o.default,n.FREQUENTLY_USED_IDS),[]),z=p.default.useMemo(()=>{if(!L.trim())return U;const e=L.toLowerCase(),r=[];for(const t of Object.values(N))(t.name.toLowerCase().includes(e)||t.keywords?.some(r=>r.toLowerCase().includes(e)))&&r.push(t);return{search:r}},[U,N,L]),M=p.default.useMemo(()=>{const e=Object.entries(z);return"search"in z?e.map(([e,r])=>({categoryId:e,emojis:r})):e.sort((e,r)=>e[0]===n.CategoryId.FREQUENTLY?-1:r[0]===n.CategoryId.FREQUENTLY?1:0).map(([e,r])=>({categoryId:e,emojis:r}))},[z]),F=p.default.memo(({index:t,style:o})=>{const i=M[t],s="search"===i.categoryId;return e.jsxs("div",{style:o,children:[e.jsx(d.P,{$color:"grey-5",sx:"padding: 8px;",$fontSize:14,children:s&&i.emojis.length>0?"Search Results":i.emojis.length>0?x[i.categoryId]||i.categoryId:null}),s&&0===i.emojis.length?e.jsxs(a.Box,{$dir:"column",$align:"center",sx:" height: 100%;",children:[e.jsx(a.Box,{sx:"margin-top:auto;",children:e.jsx(l.Emoticon,{size:24})}),e.jsx(d.P,{$bold:!0,children:"No emojis found."}),e.jsx(d.P,{$fontSize:10,sx:"margin-bottom: auto;",children:"Try using different keywords"})]}):e.jsx(b,{children:i.emojis.map(t=>e.jsx(v,{$x:t.coordinates?.x,$y:t.coordinates?.y,title:`:${t.id}`,onClick:()=>{r({id:t.id,name:t.name,native:t.skins?.[0]?.native||"",unified:t.skins?.[0]?.unified||""}),_(!1)},children:!t.coordinates&&t.skins[0].native},t.id))})]})});return e.jsxs(m,{ref:q,onMouseDown:e=>{e.stopPropagation()},onMouseUp:e=>{e.stopPropagation()},onClick:e=>{e.stopPropagation()},children:[e.jsx(h,{onClick:()=>_(e=>!e),style:{cursor:"pointer"},children:u??e.jsx(a.Box,{sx:"width: 28px; height: 28px;",$justify:"center",$align:"center",children:e.jsx(c.EmojiAdd,{size:32})})}),P&&e.jsxs(f,{$sx:g,children:[e.jsx(y,{children:e.jsx(j,{type:"text",placeholder:"Search…",value:k,onChange:e=>{w(e.target.value)}})}),e.jsx(E,{height:400,itemCount:M.length,itemSize:e=>{const r=M[e].emojis.length;return 36+38*Math.ceil(r/10)+12},width:"100%",ref:O,children:F}),e.jsx(I,{children:Object.entries(n.CATEGORY_ICONS).map(([r,t])=>e.jsx(S,{$active:$===r,onClick:()=>(e=>{const r=M.findIndex(r=>r.categoryId===e);-1!==r&&O.current&&(O.current.scrollToItem(r,"start"),C(e))})(r),children:t},r))})]})]})};
+`;exports.CustomEmojiPicker=({onSelect:r,onClickOutside:t,open:i,trigger:c,$pickersx:g})=>{const[$,C]=p.default.useState(n.CategoryId.FREQUENTLY),[k,q]=p.default.useState(""),[w,L]=p.default.useState(""),T=p.default.useRef(null),O=p.default.useRef(null),[R,_]=p.default.useState(!1),P=void 0!==i?i:R;p.default.useEffect(()=>{const e=e=>{T.current&&!T.current.contains(e.target)&&(void 0===i&&_(!1),t())};return P&&document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[P,i]),p.default.useEffect(()=>{const e=setTimeout(()=>{L(k)},300);return()=>{clearTimeout(e)}},[k]);const{categories:U,emojiMap:N}=p.default.useMemo(()=>s.preprocessEmojiData(o.default,n.FREQUENTLY_USED_IDS),[]),z=p.default.useMemo(()=>{if(!w.trim())return U;const e=w.toLowerCase(),r=[];for(const t of Object.values(N))(t.name.toLowerCase().includes(e)||t.keywords?.some(r=>r.toLowerCase().includes(e)))&&r.push(t);return{search:r}},[U,N,w]),M=p.default.useMemo(()=>{const e=Object.entries(z);return"search"in z?e.map(([e,r])=>({categoryId:e,emojis:r})):e.sort((e,r)=>e[0]===n.CategoryId.FREQUENTLY?-1:r[0]===n.CategoryId.FREQUENTLY?1:0).map(([e,r])=>({categoryId:e,emojis:r}))},[z]),F=p.default.memo(({index:t,style:o})=>{const i=M[t],s="search"===i.categoryId;return e.jsxs("div",{style:o,children:[e.jsx(d.P,{$color:"grey-5",sx:"padding: 8px;",$fontSize:14,children:s&&i.emojis.length>0?"Search Results":i.emojis.length>0?x[i.categoryId]||i.categoryId:null}),s&&0===i.emojis.length?e.jsxs(a.Box,{$dir:"column",$align:"center",sx:" height: 100%;",children:[e.jsx(a.Box,{sx:"margin-top:auto;",children:e.jsx(u.Emoticon,{size:24})}),e.jsx(d.P,{$bold:!0,children:"No emojis found."}),e.jsx(d.P,{$fontSize:10,sx:"margin-bottom: auto;",children:"Try using different keywords"})]}):e.jsx(b,{children:i.emojis.map(t=>e.jsx(v,{$x:t.coordinates?.x,$y:t.coordinates?.y,title:`:${t.id}`,onClick:()=>{r({id:t.id,name:t.name,native:t.skins?.[0]?.native||"",unified:t.skins?.[0]?.unified||""}),_(!1)},children:!t.coordinates&&t.skins[0].native},t.id))})]})});return e.jsxs(h,{ref:T,onMouseDown:e=>{e.stopPropagation()},onMouseUp:e=>{e.stopPropagation()},onClick:e=>{e.stopPropagation()},children:[e.jsx(m,{onClick:()=>_(e=>!e),style:{cursor:"pointer"},children:c??e.jsx(a.Box,{sx:"width: 28px; height: 28px;",$justify:"center",$align:"center",children:e.jsx(l.EmojiAdd,{size:32})})}),P&&e.jsxs(j,{$sx:g,children:[e.jsx(y,{children:e.jsx(f,{type:"text",placeholder:"Search…",value:k,onChange:e=>{q(e.target.value)}})}),e.jsx(E,{height:400,itemCount:M.length,itemSize:e=>{const r=M[e].emojis.length;return 36+38*Math.ceil(r/10)+12},width:"100%",ref:O,children:F}),e.jsx(I,{children:Object.entries(n.CATEGORY_ICONS).map(([r,t])=>e.jsx(S,{$active:$===r,onClick:()=>(e=>{const r=M.findIndex(r=>r.categoryId===e);-1!==r&&O.current&&(O.current.scrollToItem(r,"start"),C(e))})(r),children:t},r))})]})]})};