frst-components 0.21.63 → 0.21.64

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -4584,6 +4584,17 @@ const RepplysContainer = styled__default["default"].div `
4584
4584
  width: ${({ width }) => (width ? `${width}px` : 'auto')};
4585
4585
  margin-left:50px`;
4586
4586
 
4587
+ const InputContainer = styled__default["default"].div `
4588
+ display:flex;
4589
+ flex-direction:column;
4590
+ position:relative;
4591
+ `;
4592
+ const Container$g = styled__default["default"].div `
4593
+ display:flex;
4594
+ justify-content:center;
4595
+ margin-bottom:40px;
4596
+ `;
4597
+
4587
4598
  const container = styled__default["default"].div `
4588
4599
  display: flex;
4589
4600
  justify-content: center;
@@ -4657,17 +4668,6 @@ function Loading(props) {
4657
4668
  return (jsxRuntime.jsx(styled.ThemeProvider, { theme: FRSTTheme, children: jsxRuntime.jsxs(container, { textPosition: PositionTextLoad, style: { ...props.style }, children: [jsxRuntime.jsx(loader, { children: jsxRuntime.jsx(Load, { width: Size, height: Size, fill: Color !== '' && Color }) }), jsxRuntime.jsx(loadText, { style: { color: props.loadTextColor ? props.loadTextColor : 'white' }, children: LoadText })] }) }));
4658
4669
  }
4659
4670
 
4660
- const InputContainer = styled__default["default"].div `
4661
- display:flex;
4662
- flex-direction:column;
4663
- position:relative;
4664
- `;
4665
- const Container$g = styled__default["default"].div `
4666
- display:flex;
4667
- justify-content:center;
4668
- margin-bottom:40px;
4669
- `;
4670
-
4671
4671
  const InputReply = ({ placeHolderText, getSearchUsers, onClickPublishButton, parentId, limitInput, publishButtonText, replyMentionedUser, imgProfile, styles, handleHiddenInput }) => {
4672
4672
  const [comment, setComment] = React.useState('');
4673
4673
  const [CaptureFormattedValue, setCaptureFormattedValue] = React.useState('');
@@ -4675,12 +4675,12 @@ const InputReply = ({ placeHolderText, getSearchUsers, onClickPublishButton, par
4675
4675
  const [users, setUsers] = React.useState([]);
4676
4676
  const [isLoading, setIsLoading] = React.useState(false);
4677
4677
  const inputRef = React.useRef(null);
4678
+ const handleClickOutside = (event) => {
4679
+ if (inputRef.current && !inputRef.current.contains(event.target) && comment.length === 0) {
4680
+ handleHiddenInput();
4681
+ }
4682
+ };
4678
4683
  React.useEffect(() => {
4679
- const handleClickOutside = (event) => {
4680
- if (inputRef.current && !inputRef.current.contains(event.target) && comment.length === 0) {
4681
- handleHiddenInput();
4682
- }
4683
- };
4684
4684
  document.addEventListener('mousedown', handleClickOutside);
4685
4685
  return () => {
4686
4686
  document.removeEventListener('mousedown', handleClickOutside);
@@ -4713,29 +4713,17 @@ const InputReply = ({ placeHolderText, getSearchUsers, onClickPublishButton, par
4713
4713
  };
4714
4714
  return (jsxRuntime.jsxs(Container$g, { children: [jsxRuntime.jsx(Avatar, { src: imgProfile, size: "32px", style: { marginTop: '55px', marginRight: '8px' } }), jsxRuntime.jsxs(InputContainer, { ref: inputRef, style: { ...styles }, children: [jsxRuntime.jsx(InputComment$1, { styles: { width: '100%', marginTop: '22.5px' }, className: "userComment", onChange: (e) => {
4715
4715
  handleSearchUsers(e);
4716
- }, value: comment, placeholder: placeHolderText, limit: limitInput, showCharacterCounter: true, onContentUnformat: (unformattedValue) => setCommentData(unformattedValue), onContentFormat: (formattedValue) => setCaptureFormattedValue(formattedValue), onSendMentions: (mentions) => setCaptureMentions(mentions), users: users, replyMentionedUser: replyMentionedUser }), jsxRuntime.jsx(MiniButton, { disabled: comment.length <= 0 || isLoading, label: publishButtonText, onClick: () => handlePublish(), variant: "primary", styles: { marginLeft: 'auto', marginTop: '15px' } }), isLoading && jsxRuntime.jsx(Loading, {})] })] }));
4716
+ }, value: comment, placeholder: placeHolderText, limit: limitInput, showCharacterCounter: true, onContentUnformat: (unformattedValue) => setCommentData(unformattedValue), onContentFormat: (formattedValue) => setCaptureFormattedValue(formattedValue), onSendMentions: (mentions) => setCaptureMentions(mentions), users: users }), jsxRuntime.jsx(MiniButton, { disabled: comment.length <= 0 || isLoading, label: publishButtonText, onClick: () => handlePublish(), variant: "primary", styles: { marginLeft: 'auto', marginTop: '15px' } }), isLoading && jsxRuntime.jsx(Loading, {})] })] }));
4717
4717
  };
4718
4718
 
4719
4719
  const CommentaryBoxReply = ({ commentData, showMoreButtonText, showLessButtonText, answerButtonText, onClickAnswerButton }) => {
4720
- return (jsxRuntime.jsx(CommentaryBoxV2, { hasActionToClickOnAvatar: false, imgProfile: commentData.user?.profile?.avatar, itsLiked: false, userName: commentData.user?.name, userOffice: commentData.user?.profile?.role_name, userCompany: commentData.user?.profile?.company_name, commentId: commentData.id, commentText: commentData.text, howLongAgo: commentData.howLongAgo, showMoreText: showMoreButtonText, actionAnswer: () => onClickAnswerButton(commentData.id), showLessText: showLessButtonText, answerButtonText: answerButtonText, styles: { marginTop: '8px' }, commentTextWithMention: commentData.mentionText }));
4720
+ return (jsxRuntime.jsx(CommentaryBoxV2, { hasActionToClickOnAvatar: false, imgProfile: commentData.user?.avatar, itsLiked: false, userName: commentData.user?.name, userOffice: commentData.user?.role_name, userCompany: commentData.user?.company_name, commentId: commentData.id, commentText: commentData.text, howLongAgo: commentData.howLongAgo, showMoreText: showMoreButtonText, actionAnswer: () => onClickAnswerButton(commentData.id), showLessText: showLessButtonText, answerButtonText: answerButtonText, styles: { marginTop: '8px' }, commentTextWithMention: commentData.mentionText }));
4721
4721
  };
4722
4722
 
4723
4723
  const ThreadComments = ({ mainComment, listReplyComments, placeHolderText, onClickPublishButton, showReplysButtonText, publishButtonText, limitInputs, answerButtonText, loggedUserProfileImg, getSearchUsers, showMoreButtonText, showLessButtonText, styles, relationToPhaseText }) => {
4724
- const [isLoading, setIsLoading] = React.useState(false);
4725
4724
  const [showAnswers, setShowAnswers] = React.useState(false);
4726
4725
  const [showReplyInput, setShowReplyInput] = React.useState(false);
4727
4726
  const [showInputByIdReply, setShowInputByIdReply] = React.useState([]);
4728
- const handleShowReplys = async () => {
4729
- setIsLoading(true);
4730
- try {
4731
- setShowAnswers(true);
4732
- }
4733
- catch (error) {
4734
- }
4735
- finally {
4736
- setIsLoading(false);
4737
- }
4738
- };
4739
4727
  const handleHiddenInput = () => {
4740
4728
  setShowReplyInput(false);
4741
4729
  };
@@ -4748,7 +4736,7 @@ const ThreadComments = ({ mainComment, listReplyComments, placeHolderText, onCli
4748
4736
  const handleCommentReplyReply = (idReply) => {
4749
4737
  setShowInputByIdReply([...showInputByIdReply, idReply]);
4750
4738
  };
4751
- return (jsxRuntime.jsx(Container$h, { style: styles, children: jsxRuntime.jsxs(CommentarysContainer, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(CommentaryBoxV2, { styles: { marginBottom: '8px' }, hasActionToClickOnAvatar: false, imgProfile: mainComment.user.profile?.avatar, itsLiked: false, userId: mainComment.user.user_uuid, userName: mainComment.user.name, userOffice: mainComment.user.profile?.role_name, userCompany: mainComment.user.profile?.company_name, commentId: mainComment.id, commentText: mainComment.text, howLongAgo: mainComment.howLongAgo, showMoreText: showMoreButtonText, showLessText: showLessButtonText, answerButtonText: answerButtonText, showLikeButton: false, actionAnswer: handleCommentReply, relationToPhaseText: relationToPhaseText, commentTextWithMention: mainComment.mentionText }), listReplyComments?.length > 0 && !showAnswers && (jsxRuntime.jsx(ViewReplysButtonContainer, { children: jsxRuntime.jsx("span", { onClick: () => handleShowReplys(), children: showReplysButtonText }) })), showReplyInput && (jsxRuntime.jsx(InputReply, { styles: { width: '100%', marginTop: '24px' }, imgProfile: loggedUserProfileImg, idInput: `idInput-${mainComment.id}`, placeHolderText: placeHolderText, publishButtonText: publishButtonText, limitInput: limitInputs, onClickPublishButton: onClickPublishButton, getSearchUsers: getSearchUsers, replyMentionedUser: mainComment.user, parentId: Number(mainComment.id), handleHiddenInput: handleHiddenInput }))] }), isLoading && jsxRuntime.jsx(Loading, {}), showAnswers && !isLoading && (jsxRuntime.jsx(RepplysContainer, { children: listReplyComments?.map((replyComment) => {
4739
+ return (jsxRuntime.jsx(Container$h, { style: styles, children: jsxRuntime.jsxs(CommentarysContainer, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(CommentaryBoxV2, { styles: { marginBottom: '8px' }, hasActionToClickOnAvatar: false, imgProfile: mainComment.user?.avatar, itsLiked: false, userId: mainComment.user?.uuid, userName: mainComment.user?.name, userOffice: mainComment.user?.role_name, userCompany: mainComment.user?.company_name, commentId: mainComment.id, commentText: mainComment.text, howLongAgo: mainComment.howLongAgo, showMoreText: showMoreButtonText, showLessText: showLessButtonText, answerButtonText: answerButtonText, showLikeButton: false, actionAnswer: handleCommentReply, relationToPhaseText: relationToPhaseText, commentTextWithMention: mainComment.mentionText }), listReplyComments?.length > 0 && !showAnswers && (jsxRuntime.jsx(ViewReplysButtonContainer, { children: jsxRuntime.jsx("span", { onClick: () => setShowAnswers(true), children: showReplysButtonText }) })), showReplyInput && (jsxRuntime.jsx(InputReply, { styles: { width: '100%', marginTop: '24px' }, imgProfile: loggedUserProfileImg, idInput: `idInput-${mainComment.id}`, placeHolderText: placeHolderText, publishButtonText: publishButtonText, limitInput: limitInputs, onClickPublishButton: onClickPublishButton, getSearchUsers: getSearchUsers, replyMentionedUser: mainComment.user, parentId: Number(mainComment.id), handleHiddenInput: handleHiddenInput }))] }), showAnswers && (jsxRuntime.jsx(RepplysContainer, { children: listReplyComments?.map((replyComment) => {
4752
4740
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(CommentaryBoxReply, { commentData: replyComment, answerButtonText: answerButtonText, showMoreButtonText: showMoreButtonText, showLessButtonText: showLessButtonText, onClickAnswerButton: handleCommentReplyReply }), showInputByIdReply.includes(replyComment.id) && (jsxRuntime.jsx(InputReply, { imgProfile: loggedUserProfileImg, styles: { width: '100%', marginTop: '24px' }, idInput: `idInput-${replyComment.id}`, placeHolderText: placeHolderText, publishButtonText: publishButtonText, limitInput: limitInputs, onClickPublishButton: onClickPublishButton, replyMentionedUser: replyComment.user, getSearchUsers: getSearchUsers, parentId: Number(mainComment.id), handleHiddenInput: (replyId = replyComment.id) => handleHiddenInputReply(replyId) }))] }));
4753
4741
  }) }))] }) }));
4754
4742
  };
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/FI/ThreadComments/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAMxD,eAAO,MAAM,cAAc,iQAexB,eAAe,gBAuHjB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/FI/ThreadComments/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAKxD,eAAO,MAAM,cAAc,iQAexB,eAAe,gBA0GjB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/FI/ThreadComments/utilitiesComponents/inputReply/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAMjD,eAAO,MAAM,UAAU,kKAWpB,WAAW,gBAmFb,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/FI/ThreadComments/utilitiesComponents/inputReply/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAKjD,eAAO,MAAM,UAAU,kKAWpB,WAAW,gBAiFb,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "frst-components",
3
3
  "homepage": "http://FRST-Falconi.github.io/storybook.frstfalconi.com",
4
- "version": "0.21.63",
4
+ "version": "0.21.64",
5
5
  "private": false,
6
6
  "main": "./dist/index.js",
7
7
  "types": "./dist/index.d.ts",