@soul-refiner/design-system 2.14.62 → 2.14.63

package/dist/components/navigation/tabs/tabs.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),Link=require("next/link"),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),Link__default=_interopDefaultCompat(Link);const colorLookup={blue:{bg:"var(--color-hue-blue-2)",icon:"var(--color-hue-blue-1)"},green:{bg:"var(--color-green-8)",icon:"var(--color-green-2)"},grey:{bg:"var(--color-grey-9)",icon:"var(--color-grey-7)"},mint:{bg:"var(--color-hue-mint-2)",icon:"var(--color-hue-mint-1)"},ocean:{bg:"var(--color-hue-ocean-2)",icon:"var(--color-hue-ocean-1)"},orange:{bg:"var(--color-hue-orange-2)",icon:"var(--color-hue-orange-1)"},pink:{bg:"var(--color-hue-pink-2)",icon:"var(--color-hue-pink-1)"},purple:{bg:"var(--color-hue-purple-2)",icon:"var(--color-hue-purple-1)"},red:{bg:"var(--color-red-9)",icon:"var(--color-red-3)"},yellow:{bg:"var(--color-yellow-8)",icon:"var(--color-yellow-3)"},dark:{bg:"var(--color-grey-1)",icon:"var(--color-grey-9)"}},Tabs=({activeIndex:o,items:e,onChange:a,size:t="large",sx:r})=>{const l=React__default.default.useId();return React__default.default.createElement(Wrapper,{$sx:r},e.map((e,r)=>React__default.default.createElement(Item,{active:o===r,color:e?.color,disabled:e?.disabled,href:e?.href,icon:e?.icon,key:l+r.toString(36),label:e.label,onClick:()=>a&&a(r),size:t})))},Wrapper=styled.styled.div`
+"use strict";var r=require("react/jsx-runtime"),o=require("react"),e=require("styled-components"),n=require("next/link"),a=require("../../atoms/typography/paragraph.js");function l(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var i=l(o),c=l(n);const t={blue:{bg:"var(--color-hue-blue-2)",icon:"var(--color-hue-blue-1)"},green:{bg:"var(--color-green-8)",icon:"var(--color-green-2)"},grey:{bg:"var(--color-grey-9)",icon:"var(--color-grey-7)"},mint:{bg:"var(--color-hue-mint-2)",icon:"var(--color-hue-mint-1)"},ocean:{bg:"var(--color-hue-ocean-2)",icon:"var(--color-hue-ocean-1)"},orange:{bg:"var(--color-hue-orange-2)",icon:"var(--color-hue-orange-1)"},pink:{bg:"var(--color-hue-pink-2)",icon:"var(--color-hue-pink-1)"},purple:{bg:"var(--color-hue-purple-2)",icon:"var(--color-hue-purple-1)"},red:{bg:"var(--color-red-9)",icon:"var(--color-red-3)"},yellow:{bg:"var(--color-yellow-8)",icon:"var(--color-yellow-3)"},dark:{bg:"var(--color-grey-1)",icon:"var(--color-grey-9)"}},d=({activeIndex:o,items:e,onChange:n,size:a="large",sx:l})=>{const c=i.default.useId();return r.jsx(p,{$sx:l,children:e.map((e,l)=>r.jsx(s,{active:o===l,color:e?.color,disabled:e?.disabled,href:e?.href,icon:e?.icon,label:e.label,onClick:()=>n&&n(l),size:a},c+l.toString(36)))})},p=e.styled.div`
   display: flex;
   flex-flow: row nowrap;
   align-items: flex-end;
@@ -12,8 +12,8 @@
     text-decoration: none;
   }
 
-  ${({$sx:e})=>e||""}
-`,Item=({active:e,color:r,disabled:o,href:a,icon:t,label:l,onClick:c,size:i="large"})=>{var n=o?"grey":r||"blue",p=colorLookup[n].icon,n=colorLookup[n].bg,d="large"===i?16:"medium"===i?14:12,u="large"===i?24:"medium"===i?20:16,c={onClick:!o&&c?c:void 0,href:a||"#",scroll:!1,$active:e,$color:p,$disabled:o,$hasIcon:!!t,$size:i},a="dark"===r?DarkElement:Element;return React__default.default.createElement(a,{...c,$bg:n},t&&React__default.default.createElement(IconWrapper,{$bg:n},t),React__default.default.createElement(paragraph.P,{$fontSize:d,$lineHeight:u,$semiBold:!0},l))},Element=styled.styled(Link__default.default)`
+  ${({$sx:r})=>r||""}
+`,s=({active:o,color:e,disabled:n,href:l,icon:i,label:c,onClick:d,size:p="large"})=>{const s=n?"grey":e||"blue",v=t[s].icon,h=t[s].bg,x="large"===p?16:"medium"===p?14:12,$="large"===p?24:"medium"===p?20:16,m={onClick:!n&&d?d:void 0,href:l||"#",scroll:!1,$active:o,$color:v,$disabled:n,$hasIcon:!!i,$size:p},f="dark"===e?g:u;return r.jsxs(f,{...m,$bg:h,children:[i&&r.jsx(b,{$bg:h,children:i}),r.jsx(a.P,{$fontSize:x,$lineHeight:$,$semiBold:!0,children:c})]})},u=e.styled(c.default)`
   position: relative;
   display: flex;
   align-items: center;
@@ -21,76 +21,33 @@
   cursor: pointer;
   user-select: none;
 
-  ${({$size:e,$hasIcon:r})=>{if(r)return"padding: 16px 12px;";switch(e){case"small":return"padding: 10px 8px;";case"medium":return"padding: 14px 10px;";default:return"padding: 22px 12px;"}}}
+  ${({$size:r,$hasIcon:o})=>{if(o)return"padding: 16px 12px;";switch(r){case"small":return"padding: 10px 8px;";case"medium":return"padding: 14px 10px;";default:return"padding: 22px 12px;"}}}
 
-  ${({$disabled:e,$hasIcon:r,$color:o})=>e?"cursor: initial;":r?`
-        &:hover {
-          p {
-            color: ${o};
-          }
-        }
-        div > svg {
-          fill: ${o};
-        }
-      `:`
-        &:hover {
-          background-color: var(--color-grey-10);
-          &:after {
-            position: absolute;
-            content: '';
-            width: 100%;
-            height: 3px;
-            bottom: 0px;
-            left: 0px;
-            background-color: var(--color-primary-blue-3);
-            border-top-right-radius: 3px;
-            border-top-left-radius: 3px;
-          }
-        }
-        &:active {
-          background-color: var(--color-grey-9);
-        }
-      `}
+  ${({$disabled:r,$hasIcon:o,$color:e})=>r?"cursor: initial;":o?`\n        &:hover {\n          p {\n            color: ${e};\n          }\n        }\n        div > svg {\n          fill: ${e};\n        }\n      `:"\n        &:hover {\n          background-color: var(--color-grey-10);\n          &:after {\n            position: absolute;\n            content: '';\n            width: 100%;\n            height: 3px;\n            bottom: 0px;\n            left: 0px;\n            background-color: var(--color-primary-blue-3);\n            border-top-right-radius: 3px;\n            border-top-left-radius: 3px;\n          }\n        }\n        &:active {\n          background-color: var(--color-grey-9);\n        }\n      "}
 
-  ${({$active:e,$color:r,$hasIcon:o})=>e&&`
-      &:after {
-        position: absolute;
-        content: '';
-        width: 100%;
-        height: 3px;
-        bottom: 0px;
-        left: 0px;
-        background-color: ${o?r:"var(--color-primary-blue-2)"} !important;
-        border-top-right-radius: 3px;
-        border-top-left-radius: 3px;
-      }
-    `}
-`,DarkElement=styled.styled(Element)`
+  ${({$active:r,$color:o,$hasIcon:e})=>r&&`\n      &:after {\n        position: absolute;\n        content: '';\n        width: 100%;\n        height: 3px;\n        bottom: 0px;\n        left: 0px;\n        background-color: ${e?o:"var(--color-primary-blue-2)"} !important;\n        border-top-right-radius: 3px;\n        border-top-left-radius: 3px;\n      }\n    `}
+`,g=e.styled(u)`
   p {
-    color: ${({$color:e})=>e};
+    color: ${({$color:r})=>r};
   }
 
   &:hover {
-    background-color: ${({$active:e,$bg:r})=>e?"var(--color-grey)":r};
+    background-color: ${({$active:r,$bg:o})=>r?"var(--color-grey)":o};
 
     &:after {
       content: '';
       position: absolute;
       width: 100%;
-      height: ${({$active:e})=>e?"3px":"1px"};
+      height: ${({$active:r})=>r?"3px":"1px"};
       bottom: 0;
       left: 0;
-      background-color: ${({$active:e})=>e?"var(--color-primary-blue-3)":"var(--color-primary-blue-1)"};
+      background-color: ${({$active:r})=>r?"var(--color-primary-blue-3)":"var(--color-primary-blue-1)"};
     }
   }
 
-  ${({$active:e,$color:r,$hasIcon:o})=>e&&`
-      &:after {
-        background-color: ${o?r:"var(--color-primary-blue-2)"};
-      }
-    `}
-`,IconWrapper=styled.styled.div`
+  ${({$active:r,$color:o,$hasIcon:e})=>r&&`\n      &:after {\n        background-color: ${e?o:"var(--color-primary-blue-2)"};\n      }\n    `}
+`,b=e.styled.div`
   padding: 8px;
   border-radius: 8px;
-  background-color: ${({$bg:e})=>e};
-`;(Tabs.Item=Item).displayName="Tabs.Item",exports.Tabs=Tabs;
+  background-color: ${({$bg:r})=>r};
+`;d.Item=s,s.displayName="Tabs.Item",exports.Tabs=d;

package/dist/components/surfaces/accordion/accordion.js

@@ -1,7 +1,7 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),box=require("../../atoms/box/box.js"),_function=require("../../../utils/function.js"),chevron_down=require("../../../icons/arrow/chevron_down.js"),chevron_up=require("../../../icons/arrow/chevron_up.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const AccordionContext=React__default.default.createContext([-1,()=>{}]),Accordion=({children:e,defaultOpen:t=-1,sx:n})=>{const[a,r]=React__default.default.useState(t);React__default.default.useEffect(()=>{r(t)},[t]);return React__default.default.createElement(AccordionContext.Provider,{value:[a,t=>{r(e=>e===t?-1:t)}]},React__default.default.createElement(Wrapper,{$sx:n},React__default.default.Children.map(e,(e,t)=>React__default.default.isValidElement(e)?React__default.default.cloneElement(e,{index:t}):null)))},Wrapper=styled.styled.div`
+"use strict";var e=require("react/jsx-runtime"),n=require("react"),r=require("styled-components"),t=require("../../atoms/box/box.js"),i=require("../../../utils/function.js"),o=require("../../../icons/arrow/chevron_down.js"),s=require("../../../icons/arrow/chevron_up.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=l(n);const c=d.default.createContext([-1,()=>{}]),u=({children:n,defaultOpen:r=-1,sx:t})=>{const[i,o]=d.default.useState(r);d.default.useEffect(()=>{o(r)},[r]);return e.jsx(c.Provider,{value:[i,e=>{o(n=>n===e?-1:e)}],children:e.jsx(a,{$sx:t,children:d.default.Children.map(n,(e,n)=>d.default.isValidElement(e)?d.default.cloneElement(e,{index:n}):null)})})},a=r.styled.div`
   ${({$sx:e})=>e||""};
-`,AccordionItem=({buttonSx:e,children:t,index:n,sx:a,trigger:r})=>{const[o,c]=React__default.default.useContext(AccordionContext);return React__default.default.createElement(box.Box,{$dir:"column"},React__default.default.createElement(TriggerWrapper,{onClick:_function.callAll(()=>c(n),r?.props?.onClick),$sx:e},r,o===n?React__default.default.createElement(chevron_up.ChevronUp,null):React__default.default.createElement(chevron_down.ChevronDown,null)),React__default.default.createElement(box.Box,{sx:o===n?a:"visibility: hidden; height: 0px; overflow: hidden;"},t))},TriggerWrapper=styled.styled.div`
+`,x=({buttonSx:n,children:r,index:l,sx:u,trigger:a})=>{const[x,f]=d.default.useContext(c);return e.jsxs(t.Box,{$dir:"column",children:[e.jsxs(p,{onClick:i.callAll(()=>f(l),a?.props?.onClick),$sx:n,children:[a,x===l?e.jsx(s.ChevronUp,{}):e.jsx(o.ChevronDown,{})]}),e.jsx(t.Box,{sx:x===l?u:"visibility: hidden; height: 0px; overflow: hidden;",children:r})]})},p=r.styled.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -12,4 +12,4 @@
   background-color: transparent;
   cursor: pointer;
   ${({$sx:e})=>e||""};
-`;(Accordion.Item=AccordionItem).displayName="Accordion.Item",exports.Accordion=Accordion;
+`;u.Item=x,x.displayName="Accordion.Item",exports.Accordion=u;

package/dist/components/surfaces/calendar_date/calendar_date.js

@@ -1,26 +1,26 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),heading=require("../../atoms/typography/heading.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 CalendarDate=({monthAbbreviation:e,date:t,isDisabled:a,dayOfWeek:r,startTime:l,endTime:n,sx:d,size:i="large"})=>React__default.default.createElement(Container,{$sx:d},React__default.default.createElement(CalendarContainer,{$size:i},React__default.default.createElement(MonthContainer,{$size:i},"large"===i&&React__default.default.createElement(heading.H.Seven,{$color:"white",$textAlign:"center",$semiBold:!0},e),"small"===i&&React__default.default.createElement(paragraph.P,{$color:"white",$textAlign:"center",$fontSize:14},e)),React__default.default.createElement(DateContainer,{$size:i},"large"===i&&React__default.default.createElement(heading.H.One,{$textAlign:"center",$semiBold:!0},t),"small"===i&&React__default.default.createElement(heading.H.Six,{$color:"grey-2",$textAlign:"center"},t))),r&&l&&n&&React__default.default.createElement(TimeContainer,null,React__default.default.createElement(paragraph.P,{as:"span",$color:a?"grey-7":"red-5"},r+`, ${l} -> `+n))),Container=styled.styled.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("styled-components"),i=require("../../atoms/typography/heading.js"),s=require("../../atoms/typography/paragraph.js");const d=r.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
 
   ${({$sx:e})=>e||""}
-`,CalendarContainer=styled.styled.div`
+`,l=r.styled.div`
   display: flex;
   flex-direction: column;
 
   ${({$size:e})=>"large"===e?"width: 120px;":"width: 64px;"}
-`,MonthContainer=styled.styled.div`
+`,t=r.styled.div`
   background-color: var(--color-red-5);
   border-radius: 16px 16px 0 0;
 
   ${({$size:e})=>"large"===e?"padding: 8px 16px;":"padding: 2px 8px;"}
-`,DateContainer=styled.styled.div`
+`,n=r.styled.div`
   background-color: white;
   border-radius: 0 0 16px 16px;
   box-shadow: var(--elevation-3);
 
   ${({$size:e})=>"large"===e?"padding: 8px 16px;":"padding: 2px 16px;"}
-`,TimeContainer=styled.styled.div`
+`,a=r.styled.div`
   margin-top: 16px;
-`;exports.CalendarDate=CalendarDate;
+`;exports.CalendarDate=({monthAbbreviation:r,date:x,isDisabled:o,dayOfWeek:c,startTime:p,endTime:$,sx:g,size:h="large"})=>e.jsxs(d,{$sx:g,children:[e.jsxs(l,{$size:h,children:[e.jsxs(t,{$size:h,children:["large"===h&&e.jsx(i.H.Seven,{$color:"white",$textAlign:"center",$semiBold:!0,children:r}),"small"===h&&e.jsx(s.P,{$color:"white",$textAlign:"center",$fontSize:14,children:r})]}),e.jsxs(n,{$size:h,children:["large"===h&&e.jsx(i.H.One,{$textAlign:"center",$semiBold:!0,children:x}),"small"===h&&e.jsx(i.H.Six,{$color:"grey-2",$textAlign:"center",children:x})]})]}),c&&p&&$&&e.jsx(a,{children:e.jsx(s.P,{as:"span",$color:o?"grey-7":"red-5",children:`${c}, ${p} -> ${$}`})})]});

package/dist/components/surfaces/carousel/card/card.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),chevron_left=require("../../../../icons/arrow/chevron_left.js"),chevron_right=require("../../../../icons/arrow/chevron_right.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const DEFAULT_SCROLL_TRIGGER_DISTANCE=11,DEFAULT_SCROLL_DISTANCE=450,CardCarousel=({children:e,onScrollEnd:t,scrollTriggerDistance:r=DEFAULT_SCROLL_TRIGGER_DISTANCE,scrollDistance:l=DEFAULT_SCROLL_DISTANCE,sx:o})=>{const a=React__default.default.useRef(null);return React__default.default.createElement(Wrapper,{$sx:o},React__default.default.createElement(Button,{className:"carousel-navigation",onClick:()=>{var e;a.current&&(e=a.current.scrollLeft-l,a.current.scrollLeft=e<0?0:e)},$side:"left"},React__default.default.createElement(chevron_left.ChevronLeft,{color:"white",size:48})),React__default.default.createElement(Inner,{onScroll:e=>{e=e.target;e.scrollWidth-e.scrollLeft-e.clientWidth<r&&t&&t()},ref:a},e),React__default.default.createElement(Button,{className:"carousel-navigation",onClick:()=>{var e;a.current&&(e=a.current.scrollLeft+l,a.current.scrollLeft=e)},$side:"right"},React__default.default.createElement(chevron_right.ChevronRight,{color:"white",size:48})))},Wrapper=styled.styled.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),o=require("../../../../icons/arrow/chevron_left.js"),i=require("../../../../icons/arrow/chevron_right.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=n(r);const s=t.styled.div`
   position: relative;
   height: 288px;
 
@@ -8,7 +8,7 @@
   }
 
   ${({$sx:e})=>e||""}
-`,Inner=styled.styled.div`
+`,c=t.styled.div`
   position: absolute;
   width: 100%;
   top: 0px;
@@ -32,7 +32,7 @@
     width: 0px;
     height: 0px;
   }
-`,Button=styled.styled.button`
+`,a=t.styled.button`
   position: absolute;
   z-index: 1;
   top: 0px;
@@ -48,10 +48,5 @@
 
   display: none;
 
-  ${({$side:e})=>"left"===e?`
-    left: 0px;
-    border-radius: 0px 16px 16px 0px;
-    `:`
-    right: 0px;
-    border-radius: 16px 0px 0px 16px;`};
-`;exports.CardCarousel=CardCarousel;
+  ${({$side:e})=>"left"===e?"\n    left: 0px;\n    border-radius: 0px 16px 16px 0px;\n    ":"\n    right: 0px;\n    border-radius: 16px 0px 0px 16px;"};
+`;exports.CardCarousel=({children:r,onScrollEnd:t,scrollTriggerDistance:n=11,scrollDistance:p=450,sx:d})=>{const x=l.default.useRef(null);return e.jsxs(s,{$sx:d,children:[e.jsx(a,{className:"carousel-navigation",onClick:()=>{if(x.current){const e=x.current.scrollLeft-p;x.current.scrollLeft=e<0?0:e}},$side:"left",children:e.jsx(o.ChevronLeft,{color:"white",size:48})}),e.jsx(c,{onScroll:e=>{const r=e.target;r.scrollWidth-r.scrollLeft-r.clientWidth<n&&t&&t()},ref:x,children:r}),e.jsx(a,{className:"carousel-navigation",onClick:()=>{if(x.current){const e=x.current.scrollLeft+p;x.current.scrollLeft=e}},$side:"right",children:e.jsx(i.ChevronRight,{color:"white",size:48})})]})};

package/dist/components/surfaces/comment/comment.js

@@ -1,38 +1,5 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),Link=require("next/link"),avatar=require("../../iconography/avatar/avatar.js"),box=require("../../atoms/box/box.js"),highlighter=require("../../atoms/highlighter/highlighter.js"),paragraph=require("../../atoms/typography/paragraph.js"),button=require("../../actions/button/button.js"),portal=require("../portal/portal.js"),regex=require("../../../common/regex.js"),styles=require("../../../common/styles.js"),emoticon_add=require("../../../icons/basic/emoticon_add.js"),comment=require("../../../icons/message/comment.js"),helpers=require("./helpers.js"),responsive_text_area=require("../../input/responsive-text_area/responsive_text_area.js"),send_text=require("../../../icons/email/send_text.js"),selector=(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")),emojiPicker=(require("../../atoms/typography/display.js"),require("../../atoms/typography/heading.js"),require("../../atoms/typography/typography.js"),require("../../card/action/action.js"),require("../../card/audio/audio.js"),require("../../card/feature/feature.js"),require("../../card/person/person.js"),require("../../card/price/price.js"),require("../../card/regular/regular.js"),require("../../card/video/video.js"),require("../../card/written/written.js"),require("../../card/meeting/meeting.js"),require("../../editor/editor.js"),require("../../editor/simple_editor/simple_editor.js"),require("../../feedback/badge/badge.js"),require("../../feedback/banner/banner.js"),require("../../feedback/loader/loader.js"),require("../../feedback/notification/notification.js"),require("../../feedback/progress/progress.js"),require("../../feedback/toast/toast.js"),require("react-tooltip"),require("../../feedback/animated_toast/animated_toast.js"),require("../../feedback/emojiPicker/emoji-picker.js")),emojiReactions=require("../../feedback/emojiPicker/emoji-reactions.js"),eye=(require("../../feedback/videoLoader/videoLoader.js"),require("../../iconography/icon/icon.js"),require("../../input/checkbox/checkbox.js"),require("../../input/date/date.js"),require("../../input/filter/filter.js"),require("../../input/radio/radio.js"),require("../../input/search/search.js"),require("../../input/select/select.js"),require("../../input/text_area/text_area.js"),require("../../input/text_input/text_input.js"),require("../../input/calendar/calendar.js"),require("../../input/time/time.js"),require("@mui/x-date-pickers/LocalizationProvider"),require("@mui/x-date-pickers/AdapterDateFnsV3"),require("@mui/x-date-pickers/TimeField"),require("../../media/audio-player/audio-player.js"),require("../../media/audio-playlist/audio-playlist.js"),require("../../media/audio-preview/audio-preview.js"),require("react-player"),require("next/image"),require("../../media/video-player/video.js"),require("../../media/audio-playlist/playing_indicator.js"),require("../../navigation/breadcrumb/breadcrumb.js"),require("../../navigation/inner/inner.js"),require("../../navigation/tabs/tabs.js"),require("../accordion/accordion.js"),require("../carousel/card/card.js"),require("../discuss_post/discuss_post.js"),require("../drawer/drawer.js"),require("../drawer/bottom-drawer.js"),require("../message/message.js"),require("../modal/modal.js"),require("../post/post.js"),require("../calendar_date/calendar_date.js"),require("../../table/table/table.js"),require("../../custom/users_selection/users_selection.js"),require("../../custom/courses_selection/courses_selection.js"),require("../../../icons/basic/eye.js")),trash_slash=(require("../../../icons/basic/subtask.js"),require("../../../icons/basic/trash_slash.js")),lock=require("../../../icons/security/lock.js"),calendar_dates=(require("../../../common/colors.js"),require("../../../icons/time/calendar_dates.js"));function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),styled__default=_interopDefaultCompat(styled),Link__default=_interopDefaultCompat(Link);const MAX_REACTIONS_SHOWN=5,visibilityMapping={PRIVATE:"Private",MEETING_MEMBERS:"Meeting",PUBLIC:"Public",PUBLIC_WITH_MEETING:""},visibilityIcons={PRIVATE:React__default.default.createElement(lock.Lock,null),MEETING_MEMBERS:React__default.default.createElement(calendar_dates.CalendarDates,null),PUBLIC:React__default.default.createElement(eye.Eye,null),PUBLIC_WITH_MEETING:React__default.default.createElement(React__default.default.Fragment,null)},Comment=({avatarTooltipContent:e,avatarTooltipSx:t,content:a,createdDate:r,hasMoreReplies:l,id:i,onComment:M,onReact:o,latestReaction:W,onShowReplies:n,onEdit:u,isEditing:s,setIsEditing:d,dropdown:z,reactionModal:A,reactions:c,replies:p,userImageUri:f,userName:D,userReactions:N,visibilityIcon:U,customPlaceHolder:O,userProfileUri:_,sx:H,moveButtonsToLeft:m=!1,useNewVersion:g=!1,onDelete:x,visibility:y,shareDropdown:F,belongsToLoggedUser:R=!1,disableRedirectionToUserProfile:h=!1,replyAccountOptions:b,selectedReplyAccount:G,onReplyAccountChange:j,showAccountSelector:V=!1,accountSelectorSize:X=32})=>{const[E,v]=React__default.default.useState(!1),[q,Y]=React__default.default.useState({x:0,y:0}),[J,K]=React__default.default.useState("up"),[Q,Z]=React__default.default.useState(!1),[k,ee]=React__default.default.useState(!1),[$,w]=React__default.default.useState(""),[C,S]=React__default.default.useState(a),P=React__default.default.useRef(null),[I,B]=React__default.default.useState(!1),L=React__default.default.Children.toArray(p);React__default.default.useEffect(()=>{(s||I)&&P.current&&P.current.focus()},[s,I]);var p=e=>{e.stopPropagation(),v(e=>!e),Y({y:e.clientY,x:e.clientX}),K(400<e.clientY?"up":"down")},te=()=>{n&&n(),ee(!0)},r=helpers.abbrTimeBeforeDate(r),c=c&&Object.entries(c).slice(0,MAX_REACTIONS_SHOWN).sort((e,t)=>e[1]<t[1]?1:-1).map(([e,t])=>React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(emojiReactions.EmojiReaction,{size:16,key:i+e,emoji:e,isActive:N?.includes(e),onReact:()=>o(e),showSparkle:e===W,count:t,showCount:!0}))),T=!!L?.length&&0<L.length,ae=T&&L.map((e,t)=>{var a;return React__default.default.isValidElement(e)?(a=e.props?.id,t=t!==L.length-1||l,React__default.default.createElement(ReplyWrapper,{$hasLine:t,key:a},e,React__default.default.createElement(ReplyIndicator,null))):null});return React__default.default.createElement(Wrapper,{$sx:H,id:"comment-"+i,$moveButtonsToLeft:m},React__default.default.createElement(avatar.Avatar,{as:h?void 0:Link__default.default,href:h?void 0:_,image:f,size:32,tooltipContent:e,tooltipSx:t}),React__default.default.createElement(box.Box,{$flex:1,$dir:"column"},React__default.default.createElement(ContentWrapper,{$hasReplies:T||!!l},s||I?React__default.default.createElement(responsive_text_area.ResponsiveTextArea,{inputStyles:"min-height: 104px;",wrapperStyles:"background:var(--color-grey-9); ",onChange:e=>{S(e.target.value)},value:C,ref:P,onBlur:async()=>{g&&(u&&await u(C,i),B(!1))}}):React__default.default.createElement(CommentBox,{onClick:()=>g&&R?B(!0):void 0},React__default.default.createElement(box.Box,{$dir:"row",$justify:"space-between",$align:"center"},React__default.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:8}},React__default.default.createElement(paragraph.P,{as:h?void 0:_?Link__default.default:"span",href:h?void 0:_,$bold:!0,$color:"grey-2",sx:"text-decoration:none !important; color:var(--color-grey-2) !important;",$fontSize:14,$lineHeight:20},D),g&&y&&("PUBLIC_WITH_MEETING"===y?React__default.default.createElement(React__default.default.Fragment,null,visibilityIcons.PUBLIC,React__default.default.createElement(paragraph.P,{$fontSize:14},visibilityMapping.PUBLIC),visibilityIcons.MEETING_MEMBERS,React__default.default.createElement(paragraph.P,{$fontSize:14},visibilityMapping.MEETING_MEMBERS)):React__default.default.createElement(React__default.default.Fragment,null,visibilityIcons[y],React__default.default.createElement(paragraph.P,{$fontSize:14},visibilityMapping[y])))),g&&R?React__default.default.createElement(trash_slash.TrashSlash,{sx:"cursor: pointer;",onClick:e=>{e.stopPropagation(),e.preventDefault(),x&&x()}}):z),React__default.default.createElement(paragraph.P,{sx:"white-space: pre-line;letter-spacing: -0.176px; word-break: break-word;"},React__default.default.createElement(highlighter.Highlighter,{highlightRender:e=>React__default.default.createElement(paragraph.P,{as:"span",$color:"primary-blue-2"},React__default.default.createElement(Link__default.default,{href:e,target:"_blank"},e)),seperator:regex.URL_REGEX,text:a}))),React__default.default.createElement(box.Box,{$align:"flex-start",$dir:"row",$display:"flex",$gap:16,sx:"margin: 8px 0px; position: relative;"},s?React__default.default.createElement(box.Box,{$display:"flex",$align:"center",$justify:"space-between",$gap:6,sx:"margin-top: 8px; width: 100%;"},React__default.default.createElement(emoticon_add.Emoticon,{color:"primary-blue-2",onClick:p,size:24,sx:`cursor: pointer; flex-shrink: 0;
-                    ${!m&&"margin-right: auto;"}
-                  `}),React__default.default.createElement(button.Button,{onClick:()=>{d&&d(!s),S(a)},sx:`background-color: transparent; border: none; box-shadow: none; color: var(--color-primary-blue-2);
-                  ${m?"margin-left: 20px;":"margin-left: auto;"}
-                  &:hover, &:focus {
-                  border: none;
-                  outline: none;
-                  }
-                  `,size:"small",type:"outlined"},"Cancel"),React__default.default.createElement(button.Button,{onClick:()=>{u&&u(C,i),d&&d(!1)},size:"small",type:"primary"},"Save")):React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(emoticon_add.Emoticon,{color:"primary-blue-2",onClick:p,size:24,sx:" cursor: pointer; flex-shrink: 0;"}),React__default.default.createElement(comment.Comment,{color:"primary-blue-2",onClick:()=>Z(e=>!e),size:24,sx:"border-radius: 50%; cursor: pointer; flex-shrink: 0;"}),React__default.default.createElement(paragraph.P,{$color:"grey-7"},"•"),React__default.default.createElement(paragraph.P,{$color:"grey-4",$fontSize:12,$lineHeight:24,sx:"flex-shrink: 0;"},r),React__default.default.createElement("div",{style:{display:"flex",flexDirection:"column",marginLeft:"auto",width:"100%"}},React__default.default.createElement(box.Box,{$display:"flex",$flow:"row wrap",$gap:6,sx:`max-width: calc(100% - 190px);   
-                       margin-left: auto;
-                       @media (max-width: 500px) {
-                        max-width: 100%;
-                       }
-                       ${c?.length?"margin-bottom: 12px;":""}
-                    `},c,A),g&&F)),E&&React__default.default.createElement(portal.Portal,null,React__default.default.createElement(PickerWrapper,{$pickerOrientation:J,$top:q.y,$left:q.x},React__default.default.createElement(emojiPicker.CustomEmojiPicker,{open:E,trigger:React__default.default.createElement(React__default.default.Fragment,null),onSelect:({native:e})=>{o(e),v(!1)},onClickOutside:()=>v(!1)}))))),T&&k&&React__default.default.createElement(RepliesWrapper,null,ae),!k&&!l&&T&&React__default.default.createElement(RepliesWrapper,null,React__default.default.createElement(ReplyWrapper,{$hasLine:!1},React__default.default.createElement(button.Button,{onClick:te,size:"small",sx:"color: var(--color-grey-3);",type:"text"},"show replies"),React__default.default.createElement(ReplyIndicator,null))),l&&React__default.default.createElement(RepliesWrapper,null,React__default.default.createElement(ReplyWrapper,{$hasLine:!1},React__default.default.createElement(button.Button,{onClick:te,size:"small",sx:"color: var(--color-grey-3);",type:"text"},"show more replies"),React__default.default.createElement(ReplyIndicator,null))),Q&&React__default.default.createElement(CommentWrapper,null,V&&b&&j?React__default.default.createElement(selector.AccountSelector,{selectedOption:G??null,options:b,onOptionChange:j,size:X,showChevron:1<b.length}):React__default.default.createElement(avatar.Avatar,{as:h?void 0:Link__default.default,href:h?void 0:_,image:f,size:32,tooltipContent:e,tooltipSx:t}),React__default.default.createElement(responsive_text_area.ResponsiveTextArea,{bg:"var(--color-grey-10)",value:$,onChange:e=>{w(e.target.value)},placeholder:O||"Write a reply",maxCharacters:1e3,wrapperStyles:"margin: 16px 0; width: 100%;",actionComponent:React__default.default.createElement(box.Box,{sx:"margin: auto 0 5px 0px;",$align:"center",$justify:"center",$gap:8},U,React__default.default.createElement(button.Button,{disabled:!$.length,icon:React__default.default.createElement(send_text.SendText,null),onClick:e=>{e.stopPropagation(),e.preventDefault(),M($),w("")},sx:`
-                  justify-content: center; 
-                  background-color: var(--color-primary-blue-2);
-                  align-items: center;  
-                  height: 40px;
-                  width: 40px;
-                  cursor: pointer;
-                  border: none;
-                  box-shadow: none;
-                  svg {
-                    fill: white;
-                  }
-                  &:disabled {
-                    svg {
-                      fill: var(--color-grey-7);
-                    }
-                    border: none !important;
-                    background-color: var(--color-grey-1);
-                  }
-                `,type:"secondary"})),inputStyles:"font-size: 14px;"}))))},Wrapper=styled__default.default.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),o=require("next/link"),i=require("../../iconography/avatar/avatar.js"),n=require("../../atoms/box/box.js"),s=require("../../atoms/highlighter/highlighter.js"),l=require("../../atoms/typography/paragraph.js"),a=require("../../actions/button/button.js"),c=require("../portal/portal.js"),d=require("../../../common/regex.js"),p=require("../../../common/styles.js"),x=require("../../../icons/basic/emoticon_add.js"),u=require("../../../icons/message/comment.js"),h=require("./helpers.js"),g=require("../../input/responsive-text_area/responsive_text_area.js"),f=require("../../../icons/email/send_text.js"),m=require("../../actions/AccountSelector/selector.js"),j=require("../../feedback/emojiPicker/emoji-picker.js"),y=require("../../feedback/emojiPicker/emoji-reactions.js"),b=require("../../../icons/basic/trash_slash.js"),v=require("../../../icons/security/lock.js"),$=require("../../../icons/basic/eye.js"),w=require("../../../icons/time/calendar_dates.js");function k(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var S=k(r),C=k(t),E=k(o);const P={PRIVATE:"Private",MEETING_MEMBERS:"Meeting",PUBLIC:"Public",PUBLIC_WITH_MEETING:""},B={PRIVATE:e.jsx(v.Lock,{}),MEETING_MEMBERS:e.jsx(w.CalendarDates,{}),PUBLIC:e.jsx($.Eye,{}),PUBLIC_WITH_MEETING:e.jsx(e.Fragment,{})},q=C.default.div`
   max-width: 700px;
   display: flex;
   flex-direction: row;
@@ -42,58 +9,38 @@
   ${({$sx:e})=>e||""}
 
   ${({$moveButtonsToLeft:e})=>e?"justify-content: flex-start;":"justify-content: space-between;"}
-`,ContentWrapper=styled__default.default.div`
+`,R=C.default.div`
   display: flex;
   word-break: break-word;
   flex-direction: column;
-  ${({$hasReplies:e})=>e?`
-    position: relative;
-
-    &::before {
-      content: "";
-      position: absolute;
-      top: 32px;
-      left: -28px;
-      height: calc(100% - 12px);
-      border-left: 2px solid var(--color-grey-9);
-    }`:""}
-`,CommentBox=styled__default.default.div`
+  ${({$hasReplies:e})=>e?'\n    position: relative;\n\n    &::before {\n      content: "";\n      position: absolute;\n      top: 32px;\n      left: -28px;\n      height: calc(100% - 12px);\n      border-left: 2px solid var(--color-grey-9);\n    }':""}
+`,T=C.default.div`
   padding: 16px;
   display: flex;
   flex-direction: column;
   gap: 8px;
   background-color: var(--color-grey-10);
   border-radius: 16px;
-`,PickerWrapper=styled__default.default.div`
+`,I=C.default.div`
   position: absolute;
   z-index: 1000;
 
   ${({$pickerOrientation:e})=>"up"===e?"transform: translateY(-345px);":""}
   top: ${({$top:e})=>e}px;
   left: ${({$left:e})=>e}px;
-`,RepliesWrapper=(styled__default.default.div`
-  ${styles.Styles.flex}
+`;C.default.div`
+  ${p.Styles.flex}
   display: flex;
   padding: 2px 6px;
   border-radius: 12px;
   cursor: pointer;
-  ${({$userSelected:e})=>e?`
-    background-color: var(--color-primary-blue-4);
-    border: 1px solid var(--color-primary-blue-3);
-    `:""}
-`,styled__default.default.div`
+  ${({$userSelected:e})=>e?"\n    background-color: var(--color-primary-blue-4);\n    border: 1px solid var(--color-primary-blue-3);\n    ":""}
+`;const z=C.default.div`
   padding-top: 12px;
-`),ReplyWrapper=styled__default.default.div`
+`,_=C.default.div`
   position: relative;
-  ${({$hasLine:e})=>e?`
-    &::before {
-      content: "";
-      position: absolute;
-      left: -28px;
-      height: 100%;
-      border-left: 2px solid var(--color-grey-9);
-    }`:""}
-`,ReplyIndicator=styled__default.default.div`
+  ${({$hasLine:e})=>e?'\n    &::before {\n      content: "";\n      position: absolute;\n      left: -28px;\n      height: 100%;\n      border-left: 2px solid var(--color-grey-9);\n    }':""}
+`,L=C.default.div`
   position: absolute;
   top: -12px;
   left: -28px;
@@ -103,10 +50,10 @@
   border: 2px solid var(--color-grey-9);
   border-top: none;
   border-right: none;
-`,CommentWrapper=styled__default.default.form`
+`,M=C.default.form`
   display: flex;
   align-items: center;
   gap: 12px;
   width: 100%;
   padding: 8px 0;
-`;exports.Comment=Comment;
+`;exports.Comment=({avatarTooltipContent:r,avatarTooltipSx:t,content:o,createdDate:p,hasMoreReplies:v,id:$,onComment:w,onReact:k,latestReaction:C,onShowReplies:A,onEdit:U,isEditing:N,setIsEditing:D,dropdown:G,reactionModal:H,reactions:O,replies:F,userImageUri:V,userName:W,userReactions:Y,visibilityIcon:X,customPlaceHolder:J,userProfileUri:K,sx:Q,moveButtonsToLeft:Z=!1,useNewVersion:ee=!1,onDelete:re,visibility:te,shareDropdown:oe,belongsToLoggedUser:ie=!1,disableRedirectionToUserProfile:ne=!1,replyAccountOptions:se,selectedReplyAccount:le,onReplyAccountChange:ae,showAccountSelector:ce=!1,accountSelectorSize:de=32})=>{const[pe,xe]=S.default.useState(!1),[ue,he]=S.default.useState({x:0,y:0}),[ge,fe]=S.default.useState("up"),[me,je]=S.default.useState(!1),[ye,be]=S.default.useState(!1),[ve,$e]=S.default.useState(""),[we,ke]=S.default.useState(o),Se=S.default.useRef(null),[Ce,Ee]=S.default.useState(!1),Pe=S.default.Children.toArray(F);S.default.useEffect(()=>{(N||Ce)&&Se.current&&Se.current.focus()},[N,Ce]);const Be=e=>{e.stopPropagation(),xe(e=>!e),he({y:e.clientY,x:e.clientX}),fe(e.clientY>400?"up":"down")},qe=()=>{A&&A(),be(!0)},Re=h.abbrTimeBeforeDate(p),Te=O&&Object.entries(O).slice(0,5).sort((e,r)=>e[1]<r[1]?1:-1).map(([r,t])=>e.jsx(e.Fragment,{children:e.jsx(y.EmojiReaction,{size:16,emoji:r,isActive:Y?.includes(r),onReact:()=>k(r),showSparkle:r===C,count:t,showCount:!0},$+r)})),Ie=!!Pe?.length&&Pe.length>0,ze=Ie&&Pe.map((r,t)=>{if(!S.default.isValidElement(r))return null;const o=r.props?.id,i=t!==Pe.length-1||v;return e.jsxs(_,{$hasLine:i,children:[r,e.jsx(L,{})]},o)});return e.jsxs(q,{$sx:Q,id:"comment-"+$,$moveButtonsToLeft:Z,children:[e.jsx(i.Avatar,{as:ne?void 0:E.default,href:ne?void 0:K,image:V,size:32,tooltipContent:r,tooltipSx:t}),e.jsxs(n.Box,{$flex:1,$dir:"column",children:[e.jsxs(R,{$hasReplies:Ie||!!v,children:[N||Ce?e.jsx(g.ResponsiveTextArea,{inputStyles:"min-height: 104px;",wrapperStyles:"background:var(--color-grey-9); ",onChange:e=>{ke(e.target.value)},value:we,ref:Se,onBlur:async()=>{ee&&(U&&await U(we,$),Ee(!1))}}):e.jsxs(T,{onClick:()=>ee&&ie?Ee(!0):void 0,children:[e.jsxs(n.Box,{$dir:"row",$justify:"space-between",$align:"center",children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[e.jsx(l.P,{as:ne?void 0:K?E.default:"span",href:ne?void 0:K,$bold:!0,$color:"grey-2",sx:"text-decoration:none !important; color:var(--color-grey-2) !important;",$fontSize:14,$lineHeight:20,children:W}),ee&&te&&("PUBLIC_WITH_MEETING"===te?e.jsxs(e.Fragment,{children:[B.PUBLIC,e.jsx(l.P,{$fontSize:14,children:P.PUBLIC}),B.MEETING_MEMBERS,e.jsx(l.P,{$fontSize:14,children:P.MEETING_MEMBERS})]}):e.jsxs(e.Fragment,{children:[B[te],e.jsx(l.P,{$fontSize:14,children:P[te]})]}))]}),ee&&ie?e.jsx(b.TrashSlash,{sx:"cursor: pointer;",onClick:e=>{e.stopPropagation(),e.preventDefault(),re&&re()}}):G]}),e.jsx(l.P,{sx:"white-space: pre-line;letter-spacing: -0.176px; word-break: break-word;",children:e.jsx(s.Highlighter,{highlightRender:r=>e.jsx(l.P,{as:"span",$color:"primary-blue-2",children:e.jsx(E.default,{href:r,target:"_blank",children:r})}),seperator:d.URL_REGEX,text:o})})]}),e.jsxs(n.Box,{$align:"flex-start",$dir:"row",$display:"flex",$gap:16,sx:"margin: 8px 0px; position: relative;",children:[N?e.jsxs(n.Box,{$display:"flex",$align:"center",$justify:"space-between",$gap:6,sx:"margin-top: 8px; width: 100%;",children:[e.jsx(x.Emoticon,{color:"primary-blue-2",onClick:Be,size:24,sx:`cursor: pointer; flex-shrink: 0;\n                    ${!Z&&"margin-right: auto;"}\n                  `}),e.jsx(a.Button,{onClick:()=>{D&&D(!N),ke(o)},sx:`background-color: transparent; border: none; box-shadow: none; color: var(--color-primary-blue-2);\n                  ${Z?"margin-left: 20px;":"margin-left: auto;"}\n                  &:hover, &:focus {\n                  border: none;\n                  outline: none;\n                  }\n                  `,size:"small",type:"outlined",children:"Cancel"}),e.jsx(a.Button,{onClick:()=>{U&&U(we,$),D&&D(!1)},size:"small",type:"primary",children:"Save"})]}):e.jsxs(e.Fragment,{children:[e.jsx(x.Emoticon,{color:"primary-blue-2",onClick:Be,size:24,sx:" cursor: pointer; flex-shrink: 0;"}),e.jsx(u.Comment,{color:"primary-blue-2",onClick:()=>je(e=>!e),size:24,sx:"border-radius: 50%; cursor: pointer; flex-shrink: 0;"}),e.jsx(l.P,{$color:"grey-7",children:"•"}),e.jsx(l.P,{$color:"grey-4",$fontSize:12,$lineHeight:24,sx:"flex-shrink: 0;",children:Re}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",marginLeft:"auto",width:"100%"},children:[e.jsxs(n.Box,{$display:"flex",$flow:"row wrap",$gap:6,sx:`max-width: calc(100% - 190px);   \n                       margin-left: auto;\n                       @media (max-width: 500px) {\n                        max-width: 100%;\n                       }\n                       ${Te?.length?"margin-bottom: 12px;":""}\n                    `,children:[Te,H]}),ee&&oe]})]}),pe&&e.jsx(c.Portal,{children:e.jsx(I,{$pickerOrientation:ge,$top:ue.y,$left:ue.x,children:e.jsx(j.CustomEmojiPicker,{open:pe,trigger:e.jsx(e.Fragment,{}),onSelect:({native:e})=>{k(e),xe(!1)},onClickOutside:()=>xe(!1)})})})]})]}),Ie&&ye&&e.jsx(z,{children:ze}),!ye&&!v&&Ie&&e.jsx(z,{children:e.jsxs(_,{$hasLine:!1,children:[e.jsx(a.Button,{onClick:qe,size:"small",sx:"color: var(--color-grey-3);",type:"text",children:"show replies"}),e.jsx(L,{})]})}),v&&e.jsx(z,{children:e.jsxs(_,{$hasLine:!1,children:[e.jsx(a.Button,{onClick:qe,size:"small",sx:"color: var(--color-grey-3);",type:"text",children:"show more replies"}),e.jsx(L,{})]})}),me&&e.jsxs(M,{children:[ce&&se&&ae?e.jsx(m.AccountSelector,{selectedOption:le??null,options:se,onOptionChange:ae,size:de,showChevron:se.length>1}):e.jsx(i.Avatar,{as:ne?void 0:E.default,href:ne?void 0:K,image:V,size:32,tooltipContent:r,tooltipSx:t}),e.jsx(g.ResponsiveTextArea,{bg:"var(--color-grey-10)",value:ve,onChange:e=>{$e(e.target.value)},placeholder:J||"Write a reply",maxCharacters:1e3,wrapperStyles:"margin: 16px 0; width: 100%;",actionComponent:e.jsxs(n.Box,{sx:"margin: auto 0 5px 0px;",$align:"center",$justify:"center",$gap:8,children:[X,e.jsx(a.Button,{disabled:!ve.length,icon:e.jsx(f.SendText,{}),onClick:e=>{e.stopPropagation(),e.preventDefault(),w(ve),$e("")},sx:"\n                  justify-content: center; \n                  background-color: var(--color-primary-blue-2);\n                  align-items: center;  \n                  height: 40px;\n                  width: 40px;\n                  cursor: pointer;\n                  border: none;\n                  box-shadow: none;\n                  svg {\n                    fill: white;\n                  }\n                  &:disabled {\n                    svg {\n                      fill: var(--color-grey-7);\n                    }\n                    border: none !important;\n                    background-color: var(--color-grey-1);\n                  }\n                ",type:"secondary"})]}),inputStyles:"font-size: 14px;"})]})]})]})};

package/dist/components/surfaces/comment/helpers.js

@@ -1 +1 @@
-"use strict";const abbrTimeBeforeDate=e=>{e=(new Date).getTime()-e.getTime();return e<6e4?"Now":e<36e5?Math.floor(e/6e4)+"m":e<864e5?Math.floor(e/36e5)+"h":e<6048e5?Math.floor(e/864e5)+"d":Math.floor(e/6048e5)+"w"};exports.abbrTimeBeforeDate=abbrTimeBeforeDate;
+"use strict";exports.abbrTimeBeforeDate=e=>{const r=(new Date).getTime()-e.getTime();if(r<6e4)return"Now";if(r<36e5){return`${Math.floor(r/6e4)}m`}if(r<864e5){return`${Math.floor(r/36e5)}h`}if(r<6048e5){return`${Math.floor(r/864e5)}d`}return`${Math.floor(r/6048e5)}w`};

package/dist/components/surfaces/discuss_post/discuss_post.js

@@ -1,19 +1,5 @@
 "use client";
-"use strict";var React=require("react"),Link=require("next/link"),styled=require("styled-components"),regex=require("../../../common/regex.js"),styles=require("../../../common/styles.js"),box=require("../../atoms/box/box.js"),hide=require("../../atoms/hide/hide.js"),highlighter=require("../../atoms/highlighter/highlighter.js"),time_ago=require("../../atoms/time_ago/time_ago.js"),paragraph=require("../../atoms/typography/paragraph.js"),avatar=require("../../iconography/avatar/avatar.js"),helpers=require("./helpers.js"),emojiReactions=require("../../feedback/emojiPicker/emoji-reactions.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React),Link__default=_interopDefaultCompat(Link),styled__default=_interopDefaultCompat(styled);const MAX_REACTIONS_SHOWN=5,DiscussPost=({avatarSx:e,content:t,createdDate:a,editActions:r,editing:l,firstNewPost:o,handleContentChange:i,id:n,onReact:d,popupActions:u,latestReaction:c,popupSx:s,reactions:p,reactionModal:f,replyContent:x,replyUserHref:_,replyUserImageUri:g,replyUserName:m,sx:h,userHref:R,userImageUri:y,userName:b,isAdmin:$,userReactions:v})=>{const E=React__default.default.useRef(null),[w,k]=React__default.default.useState(!1);React__default.default.useEffect(()=>{E.current&&(E.current.value=t)},[t]),React__default.default.useEffect(()=>{E?.current&&E.current.value!==t&&i&&i(E.current.value)},[w]);var j=React__default.default.useMemo(()=>helpers.isSameDay(new Date,new Date(a))?React__default.default.createElement(time_ago.TimeAgo,{date:a}):new Intl.DateTimeFormat("en-US",{minute:"numeric",hour:"numeric",day:"numeric",month:"long",year:"numeric"}).format(a),[a]),A=React__default.default.useMemo(()=>{if(p){let e=Object.entries(p);return(e=f?e.slice(0,MAX_REACTIONS_SHOWN):e).sort((e,t)=>e[1]<t[1]?1:-1).map(([e,t])=>React__default.default.createElement(React__default.default.Fragment,null,React__default.default.createElement(emojiReactions.EmojiReaction,{key:n+e,emoji:e,isActive:v?.includes(e),onReact:()=>d(e),count:t,showSparkle:e===c,showCount:!0})))}},[p,v]);return React__default.default.createElement(Wrapper,{$editing:l,$firstNewPost:o,$sx:h,id:n},React__default.default.createElement(hide.HideButRender,{show:!l&&!!x},React__default.default.createElement(box.Box,{$align:"center",$gap:4,sx:"margin-left: 56px;"},React__default.default.createElement(ReplyMarker,null),React__default.default.createElement(avatar.Avatar,{as:Link__default.default,href:_,image:g,size:16,sx:"img { cursor: pointer;}"}),React__default.default.createElement(paragraph.P,{as:Link__default.default,href:_,$color:"primary-blue-2",$fontSize:12,$lineHeight:16,sx:"flex-shrink: 0; text-decoration: none;"},"@",m),React__default.default.createElement(paragraph.P,{sx:"word-break: break-word; white-space: pre-line;",$fontSize:12,$lineHeight:16,$textClampLines:1},x))),React__default.default.createElement(hide.HideButRender,{show:l},React__default.default.createElement(box.Box,{$gap:16,$align:"flex-start",className:"editing"},React__default.default.createElement(avatar.Avatar,{as:Link__default.default,href:R,image:y,size:40,sx:e}),React__default.default.createElement(box.Box,{$gap:10,sx:`
-            flex: 1; 
-            background-color: var(--color-grey-10);
-            border-radius: 8px;
-            @media (max-width: 768px) {
-              flex-direction: column;
-              min-height: calc(${E?.current?.style?.height||"360px"} + 24px);
-            }
-            `},React__default.default.createElement(TextAreaElement,{onChange:()=>k(e=>!e),onInput:e=>{e=e.target;e.style.height="48px",e.style.height=Math.max(e.scrollHeight,e.offsetHeight)+"px"},ref:E}),React__default.default.createElement(EditActionsWrapper,null,r)))),React__default.default.createElement(hide.HideButRender,{show:!l},React__default.default.createElement(box.Box,{$gap:16,$align:"flex-start"},React__default.default.createElement(PopupActionsWrapper,{$sx:s,className:"popup-actions"},u),React__default.default.createElement(avatar.Avatar,{as:Link__default.default,href:R,image:y,size:40,sx:"img { cursor: pointer; }; "+e}),React__default.default.createElement(box.Box,{$gap:4,$dir:"column",sx:"flex: 1;"},React__default.default.createElement(box.Box,{$align:"center",$gap:8,sx:`height: 20px;
-              @media screen and (max-width: 400px) {
-                flex-direction: column;
-                align-items: flex-start;
-                height: 40px;
-                gap: 0px;
-              }`},React__default.default.createElement(paragraph.P,{$bold:!0,$color:$?"special-orange-1":"primary-blue-2",$fontSize:14,$lineHeight:20,as:R?Link__default.default:"span",href:R},b),React__default.default.createElement(paragraph.P,{$color:"grey-4",$fontSize:10,$lineHeight:14},j)),React__default.default.createElement(paragraph.P,{$fontSize:14,$lineHeight:20,sx:"white-space: pre-line; word-break: break-word;"},React__default.default.createElement(highlighter.Highlighter,{highlightRender:e=>React__default.default.createElement(paragraph.P,{as:"span",$color:"primary-blue-2",sx:"font-size: inherit; line-height: inherit;"},React__default.default.createElement(Link__default.default,{href:e,target:"_blank"},e)),seperator:regex.URL_REGEX,text:t})),React__default.default.createElement(box.Box,{$display:"flex",$flow:"row wrap",$gap:6,sx:"margin-left: auto;"},A,f)))))},Wrapper=styled__default.default.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("next/link"),t=require("styled-components"),n=require("../../../common/regex.js"),o=require("../../../common/styles.js"),a=require("../../atoms/box/box.js"),s=require("../../atoms/hide/hide.js"),l=require("../../atoms/highlighter/highlighter.js"),d=require("../../atoms/time_ago/time_ago.js"),c=require("../../atoms/typography/paragraph.js"),x=require("../../iconography/avatar/avatar.js"),p=require("./helpers.js"),u=require("../../feedback/emojiPicker/emoji-reactions.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=h(r),f=h(i),m=h(t);const $=m.default.div`
   position: relative;
   padding: 12px 16px;
   display: flex;
@@ -22,40 +8,10 @@
   .popup-actions {
     display: none;
   }
-  ${({$firstNewPost:e})=>e?`
-    &:before {
-      content: "";
-      position: absolute;
-      left: 16px;
-      top: 0px;
-      height: 1px;
-      width: calc(100% - 32px);
-      border-top: 1px solid var(--color-red-5);
-    }
-    &:after {
-      position: absolute;
-      top: -8px;
-      right: 16px;
-      content: 'New';
-      padding: 0px 4px;
-      color: var(--color-white);
-      font-family: var(--font-inter);
-      font-size: 12px;
-      font-weight: 500;
-      line-height: 16px;
-      background-color: var(--color-red-5);
-      border-radius: 18px;
-    }`:""}
-  ${({$editing:e})=>e?`
-      background-color: var(--color-grey-9);`:`
-    &:hover {
-      background-color: var(--color-grey-10);
-      .popup-actions {
-        display: flex;
-      }
-    }`}
+  ${({$firstNewPost:e})=>e?"\n    &:before {\n      content: \"\";\n      position: absolute;\n      left: 16px;\n      top: 0px;\n      height: 1px;\n      width: calc(100% - 32px);\n      border-top: 1px solid var(--color-red-5);\n    }\n    &:after {\n      position: absolute;\n      top: -8px;\n      right: 16px;\n      content: 'New';\n      padding: 0px 4px;\n      color: var(--color-white);\n      font-family: var(--font-inter);\n      font-size: 12px;\n      font-weight: 500;\n      line-height: 16px;\n      background-color: var(--color-red-5);\n      border-radius: 18px;\n    }":""}
+  ${({$editing:e})=>e?"\n      background-color: var(--color-grey-9);":"\n    &:hover {\n      background-color: var(--color-grey-10);\n      .popup-actions {\n        display: flex;\n      }\n    }"}
   ${({$sx:e})=>e||""}
-`,TextAreaElement=styled__default.default.textarea`
+`,j=m.default.textarea`
   min-width: ${({$minHeight:e})=>e?e-24+"px;":""};
   width: 100%;
   padding: 4px 16px;
@@ -82,7 +38,7 @@
   &::-webkit-scrollbar {
     width: 0px;
   }
-`,ReplyMarker=styled__default.default.div`
+`,b=m.default.div`
   height: 12px;
   width: 24px;
   margin-top: 4px;
@@ -90,17 +46,14 @@
   border-left: 2px solid var(--color-grey-9);
   border-top: 2px solid var(--color-grey-9);
   border-radius: 6px 0px 0px 0px;
-`,PopupActionsWrapper=(styled__default.default.div`
-  ${styles.Styles.flex}
+`;m.default.div`
+  ${o.Styles.flex}
   display: flex;
   padding: 2px 6px;
   border-radius: 12px;
   cursor: pointer;
-  ${({$userSelected:e})=>e?`
-    background-color: var(--color-primary-blue-4);
-    border: 1px solid var(--color-primary-blue-3);
-    `:""}
-`,styled__default.default.div`
+  ${({$userSelected:e})=>e?"\n    background-color: var(--color-primary-blue-4);\n    border: 1px solid var(--color-primary-blue-3);\n    ":""}
+`;const y=m.default.div`
   position: absolute;
   top: -16px;
   right: 16px;
@@ -111,8 +64,8 @@
   border: 1px solid var(--color-grey-9);
   box-shadow: var(--elevation-1);
   ${({$sx:e})=>e||""}
-`),EditActionsWrapper=styled__default.default.div`
+`,v=m.default.div`
   display: flex;
   align-items: center;
   gap: 4px;
-`;exports.DiscussPost=DiscussPost;
+`;exports.DiscussPost=({avatarSx:r,content:i,createdDate:t,editActions:o,editing:h,firstNewPost:m,handleContentChange:w,id:k,onReact:q,popupActions:H,latestReaction:S,popupSx:z,reactions:R,reactionModal:P,replyContent:B,replyUserHref:A,replyUserImageUri:N,replyUserName:U,sx:C,userHref:D,userImageUri:E,userName:I,isAdmin:M,userReactions:_})=>{const F=g.default.useRef(null),[L,T]=g.default.useState(!1);g.default.useEffect(()=>{F.current&&(F.current.value=i)},[i]),g.default.useEffect(()=>{F?.current&&F.current.value!==i&&w&&w(F.current.value)},[L]);const G=g.default.useMemo(()=>p.isSameDay(new Date,new Date(t))?e.jsx(d.TimeAgo,{date:t}):new Intl.DateTimeFormat("en-US",{minute:"numeric",hour:"numeric",day:"numeric",month:"long",year:"numeric"}).format(t),[t]),O=g.default.useMemo(()=>{if(R){let r=Object.entries(R);return P&&(r=r.slice(0,5)),r.sort((e,r)=>e[1]<r[1]?1:-1).map(([r,i])=>e.jsx(e.Fragment,{children:e.jsx(u.EmojiReaction,{emoji:r,isActive:_?.includes(r),onReact:()=>q(r),count:i,showSparkle:r===S,showCount:!0},k+r)}))}},[R,_]);return e.jsxs($,{$editing:h,$firstNewPost:m,$sx:C,id:k,children:[e.jsx(s.HideButRender,{show:!h&&!!B,children:e.jsxs(a.Box,{$align:"center",$gap:4,sx:"margin-left: 56px;",children:[e.jsx(b,{}),e.jsx(x.Avatar,{as:f.default,href:A,image:N,size:16,sx:"img { cursor: pointer;}"}),e.jsxs(c.P,{as:f.default,href:A,$color:"primary-blue-2",$fontSize:12,$lineHeight:16,sx:"flex-shrink: 0; text-decoration: none;",children:["@",U]}),e.jsx(c.P,{sx:"word-break: break-word; white-space: pre-line;",$fontSize:12,$lineHeight:16,$textClampLines:1,children:B})]})}),e.jsx(s.HideButRender,{show:h,children:e.jsxs(a.Box,{$gap:16,$align:"flex-start",className:"editing",children:[e.jsx(x.Avatar,{as:f.default,href:D,image:E,size:40,sx:r}),e.jsxs(a.Box,{$gap:10,sx:`\n            flex: 1; \n            background-color: var(--color-grey-10);\n            border-radius: 8px;\n            @media (max-width: 768px) {\n              flex-direction: column;\n              min-height: calc(${F?.current?.style?.height||"360px"} + 24px);\n            }\n            `,children:[e.jsx(j,{onChange:()=>T(e=>!e),onInput:e=>{const r=e.target;r.style.height="48px",r.style.height=`${Math.max(r.scrollHeight,r.offsetHeight)}px`},ref:F}),e.jsx(v,{children:o})]})]})}),e.jsx(s.HideButRender,{show:!h,children:e.jsxs(a.Box,{$gap:16,$align:"flex-start",children:[e.jsx(y,{$sx:z,className:"popup-actions",children:H}),e.jsx(x.Avatar,{as:f.default,href:D,image:E,size:40,sx:`img { cursor: pointer; }; ${r}`}),e.jsxs(a.Box,{$gap:4,$dir:"column",sx:"flex: 1;",children:[e.jsxs(a.Box,{$align:"center",$gap:8,sx:"height: 20px;\n              @media screen and (max-width: 400px) {\n                flex-direction: column;\n                align-items: flex-start;\n                height: 40px;\n                gap: 0px;\n              }",children:[e.jsx(c.P,{$bold:!0,$color:M?"special-orange-1":"primary-blue-2",$fontSize:14,$lineHeight:20,as:D?f.default:"span",href:D,children:I}),e.jsx(c.P,{$color:"grey-4",$fontSize:10,$lineHeight:14,children:G})]}),e.jsx(c.P,{$fontSize:14,$lineHeight:20,sx:"white-space: pre-line; word-break: break-word;",children:e.jsx(l.Highlighter,{highlightRender:r=>e.jsx(c.P,{as:"span",$color:"primary-blue-2",sx:"font-size: inherit; line-height: inherit;",children:e.jsx(f.default,{href:r,target:"_blank",children:r})}),seperator:n.URL_REGEX,text:i})}),e.jsxs(a.Box,{$display:"flex",$flow:"row wrap",$gap:6,sx:"margin-left: auto;",children:[O,P]})]})]})})]})};

package/dist/components/surfaces/discuss_post/helpers.js

@@ -1 +1 @@
-"use strict";const isSameDay=(e,s)=>(sanitizeTime(e),sanitizeTime(s),e.getTime()===s.getTime()),sanitizeTime=e=>{e.setHours(0),e.setMinutes(0),e.setSeconds(0),e.setMilliseconds(0)};exports.isSameDay=isSameDay;
+"use strict";const e=e=>{e.setHours(0),e.setMinutes(0),e.setSeconds(0),e.setMilliseconds(0)};exports.isSameDay=(s,t)=>(e(s),e(t),s.getTime()===t.getTime());

package/dist/components/surfaces/drawer/bottom-drawer.js

@@ -1,5 +1,5 @@
 "use client";
-"use strict";var React=require("react"),styled=require("styled-components"),_function=require("../../../utils/function.js");function _interopDefaultCompat(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var React__default=_interopDefaultCompat(React);const DrawerContext=React__default.default.createContext([!1,()=>{}]),BottomDrawer=({children:e,open:t,onOpenChange:r,height:a="auto",maxHeight:o="80vh",showCloseButton:l=!0})=>{const[d,n]=React__default.default.useState(t||!1);React__default.default.useEffect(()=>{void 0!==t&&n(t)},[t]);var i,u=React__default.default.useCallback(()=>{n(!1),r?.(!1)},[r]),c=[],f=[];let s=null,p=null;for(const g of React__default.default.Children.toArray(e))React__default.default.isValidElement(g)&&("BottomDrawer.Trigger"===(i=g.type?.displayName)?c.push(g):"BottomDrawer.Header"===i?s=g:"BottomDrawer.Footer"===i?p=g:f.push(g));return React__default.default.createElement(DrawerContext.Provider,{value:[d,n]},c,d&&React__default.default.createElement(Backdrop,{onClick:u}),React__default.default.createElement(DrawerContainer,{$open:d,$height:a,$maxHeight:o},l&&React__default.default.createElement(CloseButton,{onClick:u,"aria-label":"Close drawer"},"×"),s&&React__default.default.createElement(HeaderWrapper,null,s),React__default.default.createElement(ContentWrapper,null,f),p&&React__default.default.createElement(FooterWrapper,null,p)))},Backdrop=styled.styled.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),t=require("../../../utils/function.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=i(r);const n=a.default.createContext([!1,()=>{}]),d=({children:r,open:o,onOpenChange:t,height:i="auto",maxHeight:d="80vh",showCloseButton:x=!0})=>{const[h,g]=a.default.useState(o||!1);a.default.useEffect(()=>{void 0!==o&&g(o)},[o]);const b=a.default.useCallback(()=>{g(!1),t?.(!1)},[t]),m=a.default.Children.toArray(r),y=[],v=[];let k=null,w=null;for(const e of m)if(a.default.isValidElement(e)){const r=e.type?.displayName;"BottomDrawer.Trigger"===r?y.push(e):"BottomDrawer.Header"===r?k=e:"BottomDrawer.Footer"===r?w=e:v.push(e)}return e.jsxs(n.Provider,{value:[h,g],children:[y,h&&e.jsx(l,{onClick:b}),e.jsxs(s,{$open:h,$height:i,$maxHeight:d,children:[x&&e.jsx(u,{onClick:b,"aria-label":"Close drawer",children:"×"}),k&&e.jsx(c,{children:k}),e.jsx(f,{children:v}),w&&e.jsx(p,{children:w})]})]})},l=o.styled.div`
   position: fixed;
   inset: 0;
   background: rgba(0, 0, 0, 0.5);
@@ -15,7 +15,7 @@
       opacity: 1;
     }
   }
-`,DrawerContainer=styled.styled.div`
+`,s=o.styled.div`
   position: fixed;
   bottom: 0;
   left: 0;
@@ -33,13 +33,13 @@
   overflow: hidden;
   width: 98vw;
   margin: 0 auto;
-`,HeaderWrapper=styled.styled.div`
+`,c=o.styled.div`
   padding: 20px 24px;
   border-bottom: 1px solid var(--color-grey-3, #e5e5e5);
   background: var(--color-white, #ffffff);
   flex-shrink: 0;
   border-radius: 24px 24px 0 0;
-`,CloseButton=styled.styled.button`
+`,u=o.styled.button`
   position: absolute;
   top: 20px;
   right: 24px;
@@ -69,7 +69,7 @@
     outline: none;
     outline-offset: 0;
   }
-`,ContentWrapper=styled.styled.div`
+`,f=o.styled.div`
   flex: 1;
   overflow-y: auto;
   padding: 24px;
@@ -91,9 +91,9 @@
   &::-webkit-scrollbar-thumb:hover {
     background: var(--color-grey-6, #9e9e9e);
   }
-`,FooterWrapper=styled.styled.div`
+`,p=o.styled.div`
   padding: 20px 24px;
   border-top: 1px solid var(--color-grey-3, #e5e5e5);
   background: var(--color-white, #ffffff);
   flex-shrink: 0;
-`,DrawerTrigger=({children:e})=>{const[,t]=React__default.default.useContext(DrawerContext);return e&&React__default.default.cloneElement(e,{onClick:_function.callAll(()=>t(!0),e.props.onClick)})},DrawerHeader=(DrawerTrigger.displayName="BottomDrawer.Trigger",BottomDrawer.Trigger=DrawerTrigger,({children:e})=>React__default.default.createElement(React__default.default.Fragment,null,e)),DrawerFooter=(DrawerHeader.displayName="BottomDrawer.Header",BottomDrawer.Header=DrawerHeader,({children:e})=>React__default.default.createElement(React__default.default.Fragment,null,e));DrawerFooter.displayName="BottomDrawer.Footer",BottomDrawer.Footer=DrawerFooter,exports.BottomDrawer=BottomDrawer;
+`,x=({children:e})=>{const[,r]=a.default.useContext(n);return e&&a.default.cloneElement(e,{onClick:t.callAll(()=>r(!0),e.props.onClick)})};x.displayName="BottomDrawer.Trigger",d.Trigger=x;const h=({children:r})=>e.jsx(e.Fragment,{children:r});h.displayName="BottomDrawer.Header",d.Header=h;const g=({children:r})=>e.jsx(e.Fragment,{children:r});g.displayName="BottomDrawer.Footer",d.Footer=g,exports.BottomDrawer=d;