frst-components 0.22.80 → 0.22.82

package/dist/index.js

@@ -2983,8 +2983,8 @@ const VoteIcon = ({ style, width = '16', height = '17', stroke = '#444444' }) =>
     return (jsxRuntime.jsxs("svg", { style: style, width: width, height: height, viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsxRuntime.jsxs("g", { clipPath: "url(#clip0_2067_11382)", children: [jsxRuntime.jsx("path", { d: "M7.9987 14.9192C11.6806 14.9192 14.6654 11.9345 14.6654 8.25257C14.6654 4.57068 11.6806 1.58591 7.9987 1.58591C4.3168 1.58591 1.33203 4.57068 1.33203 8.25257C1.33203 11.9345 4.3168 14.9192 7.9987 14.9192Z", stroke: stroke, strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M11 8.25256L8 5.25256L5 8.25256", stroke: stroke, strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M8 11.2526V5.25256", stroke: stroke, strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" })] }), jsxRuntime.jsx("defs", { children: jsxRuntime.jsx("clipPath", { id: "clip0_2067_11382", children: jsxRuntime.jsx("rect", { width: "16", height: "16", fill: "white", transform: "translate(0 0.252563)" }) }) })] }));
 };
 
-const ExcludeVoteIcon = ({ style, width = '16', height = '17', stroke = '#444444', onMouseOver }) => {
-    return (jsxRuntime.jsxs("svg", { onMouseOver: onMouseOver, style: style, width: width, height: height, viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsxRuntime.jsx("path", { d: "M8.00065 14.9381C11.6825 14.9381 14.6673 11.9533 14.6673 8.2714C14.6673 4.5895 11.6825 1.60474 8.00065 1.60474C4.31875 1.60474 1.33398 4.5895 1.33398 8.2714C1.33398 11.9533 4.31875 14.9381 8.00065 14.9381Z", stroke: stroke, "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" }), jsxRuntime.jsx("path", { d: "M10.6673 5.60474L5.33398 10.9381", stroke: stroke, "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" }), jsxRuntime.jsx("path", { d: "M5.33398 5.60474L10.6673 10.9381", stroke: stroke, "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" })] }));
+const ExcludeVoteIcon = ({ style, width = '16', height = '17', stroke = '#444444' }) => {
+    return (jsxRuntime.jsxs("svg", { style: style, width: width, height: height, viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsxRuntime.jsx("path", { d: "M8.00065 14.9381C11.6825 14.9381 14.6673 11.9533 14.6673 8.2714C14.6673 4.5895 11.6825 1.60474 8.00065 1.60474C4.31875 1.60474 1.33398 4.5895 1.33398 8.2714C1.33398 11.9533 4.31875 14.9381 8.00065 14.9381Z", stroke: stroke, "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" }), jsxRuntime.jsx("path", { d: "M10.6673 5.60474L5.33398 10.9381", stroke: stroke, "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" }), jsxRuntime.jsx("path", { d: "M5.33398 5.60474L10.6673 10.9381", stroke: stroke, "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" })] }));
 };
 
 const fadeInRight = styled.keyframes `
@@ -3152,6 +3152,7 @@ const VoteButtonContainer = styled__default["default"].span `
     width: 100%;
     background: #F9CD5E;
 
+
     ${({ type }) => type === 'prioritize' && styled.css `
     background: #DC9100;
     `}
@@ -3162,6 +3163,10 @@ const VoteButtonContainer = styled__default["default"].span `
     ${({ type }) => type === 'suggested' && styled.css `
         background: #A5C3F2;
     `}
+
+    ${({ modeDelete }) => modeDelete && styled.css `
+    background: inherit;
+    `}
     border-radius:0 8px 8px 0;
     padding: 0 16px 0 16px;
     height: 100%;
@@ -3255,7 +3260,9 @@ const HypothesisComponent = ({ description, type, id, title, votes = [], onVote,
     };
     const viewVotesRef = React.useRef(null);
     const handleClickOutsideVote = (event) => {
-        if (viewVotesRef?.current && !viewVotesRef?.current?.contains(event?.target)) {
+        if (viewVotesRef?.current &&
+            !viewVotesRef?.current?.contains(event?.target) &&
+            !event.target.closest('.VoteListItem')) {
             setShowVotesList(false);
         }
     };
@@ -3291,15 +3298,17 @@ const HypothesisComponent = ({ description, type, id, title, votes = [], onVote,
     };
     return (jsxRuntime.jsx(MainContainer, { children: jsxRuntime.jsxs(Container$l, { type: type, id: id, children: [jsxRuntime.jsxs(SplitContainer, { children: [jsxRuntime.jsx(Title$6, { children: title }), jsxRuntime.jsx(Separator, { children: "|" }), jsxRuntime.jsx(Description$3, { children: description })] }), !canVote && canViewVote && hypothesisVotes.length > 0 && (jsxRuntime.jsxs("div", { style: { position: 'relative' }, children: [jsxRuntime.jsx(SplitContainer, { children: jsxRuntime.jsx(VoteMainContainer, { children: jsxRuntime.jsx(VoteButtonContainer, { ref: viewVotesRef, style: { cursor: canViewListVotes ? 'pointer' : 'default' }, type: type, onClick: canViewListVotes ? toggleVotes : null, children: jsxRuntime.jsxs(VoteCount, { children: [jsxRuntime.jsxs(VoteContent, { children: [hypothesisVotes?.slice(0, 3)?.map((vote, index) => {
                                                         return (jsxRuntime.jsx(ImageContent$1, { style: { zIndex: 14 - index }, children: jsxRuntime.jsx("img", { src: vote?.user?.avatar || 'https://cdn-images.frstfalconi.cloud/path582.svg' }) }, vote?.id));
-                                                    }), hypothesisVotes.length > 3 && (jsxRuntime.jsx(ImageContent$1, { style: { background: '#444444' }, children: jsxRuntime.jsxs("p", { style: {
+                                                    }), hypothesisVotes?.length > 3 && (jsxRuntime.jsx(ImageContent$1, { style: { background: '#444444' }, children: jsxRuntime.jsxs("p", { style: {
                                                                 fontSize: hypothesisVotes?.length > 9 ? 10 : hypothesisVotes?.length > 99 ? 8 : 14
-                                                            }, children: ["+", hypothesisVotes?.length - 3] }) }))] }), hypothesisVotes?.length, " ", hypothesisVotes?.length > 1 ? votesPluralText : votesSingularText] }) }) }) }), jsxRuntime.jsx(VoteList, { hypothesisVotes: votes, showVotes: showVotesList, viewProfile: handleViewProfile })] })), canVote && (jsxRuntime.jsx(SplitContainer, { children: jsxRuntime.jsx(VoteMainContainer, { children: jsxRuntime.jsx(VoteButtonContainer, { role: "button", type: type, onMouseOver: () => seIsHover(true), onMouseOut: () => seIsHover(false), children: hasVote ? (isHover ? (jsxRuntime.jsxs("div", { style: {
+                                                            }, children: ["+", hypothesisVotes?.length - 3] }) }))] }), hypothesisVotes?.length, " ", hypothesisVotes?.length > 1 ? votesPluralText : votesSingularText] }) }) }) }), jsxRuntime.jsx(VoteList, { hypothesisVotes: votes, showVotes: showVotesList, viewProfile: handleViewProfile })] })), canVote && (jsxRuntime.jsx(SplitContainer, { children: jsxRuntime.jsx(VoteMainContainer, { children: jsxRuntime.jsx(VoteButtonContainer, { type: type, modeDelete: isHover, onMouseEnter: () => seIsHover(true), onMouseLeave: () => seIsHover(false), children: hasVote ? (isHover ? (jsxRuntime.jsxs("div", { style: {
                                     display: 'flex',
                                     alignItems: 'center',
-                                    gap: '4px'
+                                    gap: '4px',
+                                    width: 'auto',
+                                    justifyContent: 'end'
                                 }, onClick: () => handleDeleteVote(hypothesisVotes.find((vote) => vote.user_uuid === userLoggedId).id), children: [jsxRuntime.jsx(ExcludeVoteIcon, { width: "24", height: "24" }), jsxRuntime.jsx(VoteButton, { children: deleteVoteText })] })) : (jsxRuntime.jsxs(VoteCount, { children: [jsxRuntime.jsxs(VoteContent, { children: [hypothesisVotes?.slice(0, 3)?.map((vote, index) => {
-                                                return (jsxRuntime.jsx(ImageContent$1, { style: { zIndex: 1000 - index }, children: jsxRuntime.jsx("img", { src: vote?.user?.avatar || 'https://cdn-images.frstfalconi.cloud/path582.svg' }) }, vote?.id));
-                                            }), hypothesisVotes.length > 3 && (jsxRuntime.jsx(ImageContent$1, { style: { background: '#444444' }, children: jsxRuntime.jsxs("p", { children: ["+", hypothesisVotes?.length - 3] }) }))] }), hypothesisVotes?.length, " ", hypothesisVotes?.length > 1 ? votesPluralText : votesSingularText] }))) : (jsxRuntime.jsxs("div", { style: {
+                                                return (jsxRuntime.jsx(ImageContent$1, { style: { zIndex: 14 - index }, children: jsxRuntime.jsx("img", { src: vote?.user?.avatar || 'https://cdn-images.frstfalconi.cloud/path582.svg' }) }, vote?.id));
+                                            }), hypothesisVotes.length > 3 && (jsxRuntime.jsx(ImageContent$1, { style: { background: '#444444' }, children: jsxRuntime.jsxs("p", { children: ["+", hypothesisVotes?.length - 3] }) }))] }), jsxRuntime.jsxs("p", { children: [hypothesisVotes?.length, " ", hypothesisVotes?.length > 1 ? votesPluralText : votesSingularText] })] }))) : (jsxRuntime.jsxs("div", { style: {
                                     display: 'flex',
                                     alignItems: 'center',
                                     justifyContent: 'space-around',
@@ -3308,7 +3317,8 @@ const HypothesisComponent = ({ description, type, id, title, votes = [], onVote,
                                 }, onClick: () => handleVote(id), children: [jsxRuntime.jsx(VoteIcon, { width: "24", height: "24", style: { marginLeft: '4px', marginRight: '4px' } }), jsxRuntime.jsx(VoteButton, { children: voteText })] })) }) }) }))] }) }));
 };
 const VoteList = ({ hypothesisVotes, showVotes, viewProfile }) => {
-    return (jsxRuntime.jsx(VoteListContainer, { showVotes: showVotes, children: hypothesisVotes?.map((vote, index) => (jsxRuntime.jsxs(VoteListItem, { lastVote: hypothesisVotes?.length === index + 1, onClick: () => viewProfile(vote?.user?.uuid), children: [jsxRuntime.jsx(Avatar, { src: vote?.user?.avatar, size: '24px', alt: vote?.user?.name, style: { marginLeft: '6px', cursor: 'pointer' } }), jsxRuntime.jsx("p", { children: vote?.user?.name })] }, vote?.id))) }));
+    const sortedVotes = [...hypothesisVotes].sort((a, b) => a.user.name.localeCompare(b.user.name));
+    return (jsxRuntime.jsx(VoteListContainer, { showVotes: showVotes, children: sortedVotes?.map((vote, index) => (jsxRuntime.jsxs(VoteListItem, { className: "VoteListItem", lastVote: hypothesisVotes?.length === index + 1, onClick: () => viewProfile(vote?.user?.uuid), children: [jsxRuntime.jsx(Avatar, { src: vote?.user?.avatar, size: '24px', alt: vote?.user?.name, style: { marginLeft: '6px', cursor: 'pointer' } }), jsxRuntime.jsx("p", { children: vote?.user?.name })] }, vote?.id))) }));
 };
 
 const ButtonGroupWrapper = styled__default["default"].div `

package/dist/public/customIcons/ExcludeVoteIcon.d.ts

@@ -1,9 +1,8 @@
 import { CSSProperties } from 'react';
-export declare const ExcludeVoteIcon: ({ style, width, height, stroke, onMouseOver }: {
+export declare const ExcludeVoteIcon: ({ style, width, height, stroke }: {
     style?: CSSProperties | undefined;
     width?: string;
     height?: string;
     stroke?: string;
-    onMouseOver?: () => void;
 }) => JSX.Element;
 //# sourceMappingURL=ExcludeVoteIcon.d.ts.map

package/dist/public/customIcons/ExcludeVoteIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExcludeVoteIcon.d.ts","sourceRoot":"","sources":["../../../public/customIcons/ExcludeVoteIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAErC,eAAO,MAAM,eAAe;YAOlB,aAAa,GAAG,SAAS;YACzB,MAAM;aACL,MAAM;aACN,MAAM;kBACD,MAAM,IAAI;iBAmCzB,CAAA"}
+{"version":3,"file":"ExcludeVoteIcon.d.ts","sourceRoot":"","sources":["../../../public/customIcons/ExcludeVoteIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAErC,eAAO,MAAM,eAAe;YAMlB,aAAa,GAAG,SAAS;YACzB,MAAM;aACL,MAAM;aACN,MAAM;iBA2BhB,CAAA"}

package/dist/src/components/hypothesisComponent/hypothesisComponent.style.d.ts

@@ -16,6 +16,7 @@ export declare const VoteAvatarsContainer: import("styled-components").StyledCom
 export declare const VoteAvatar: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const VoteButtonContainer: import("styled-components").StyledComponent<"span", any, {
     type?: string;
+    modeDelete?: boolean;
 }, never>;
 export declare const VoteCount: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const VoteButton: import("styled-components").StyledComponent<"p", any, {}, never>;

package/dist/src/components/hypothesisComponent/hypothesisComponent.style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hypothesisComponent.style.d.ts","sourceRoot":"","sources":["../../../../src/components/hypothesisComponent/hypothesisComponent.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,aAAa,oEAKzB,CAAA;AACD,eAAO,MAAM,SAAS;UAAsB,MAAM;SAsBjD,CAAC;AAEF,eAAO,MAAM,KAAK,qEAGjB,CAAC;AAEF,eAAO,MAAM,KAAK,qEAEjB,CAAC;AAEF,eAAO,MAAM,SAAS,oEAGrB,CAAC;AAEF,eAAO,MAAM,WAAW,qEAIvB,CAAC;AACF,eAAO,MAAM,cAAc;aAAyB,MAAM;SAKzD,CAAA;AACD,eAAO,MAAM,iBAAiB;aAAyB,MAAM;SAO5D,CAAA;AACD,eAAO,MAAM,oBAAoB,oEAKhC,CAAA;AAED,eAAO,MAAM,UAAU,oEAEtB,CAAA;AAED,eAAO,MAAM,mBAAmB;WAAwB,MAAM;SAuB7D,CAAA;AACD,eAAO,MAAM,SAAS,qEAOrB,CAAA;AACD,eAAO,MAAM,UAAU,kEActB,CAAA;AACD,eAAO,MAAM,WAAW,oEASvB,CAAA;AACD,eAAO,MAAM,YAAY,oEAexB,CAAA;AAED,eAAO,MAAM,iBAAiB;gBAA4B,OAAO;SAiBhE,CAAA;AAED,eAAO,MAAM,YAAY;eAA2B,OAAO;SAO1D,CAAA"}
+{"version":3,"file":"hypothesisComponent.style.d.ts","sourceRoot":"","sources":["../../../../src/components/hypothesisComponent/hypothesisComponent.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,aAAa,oEAKzB,CAAA;AACD,eAAO,MAAM,SAAS;UAAsB,MAAM;SAsBjD,CAAC;AAEF,eAAO,MAAM,KAAK,qEAGjB,CAAC;AAEF,eAAO,MAAM,KAAK,qEAEjB,CAAC;AAEF,eAAO,MAAM,SAAS,oEAGrB,CAAC;AAEF,eAAO,MAAM,WAAW,qEAIvB,CAAC;AACF,eAAO,MAAM,cAAc;aAAyB,MAAM;SAKzD,CAAA;AACD,eAAO,MAAM,iBAAiB;aAAyB,MAAM;SAO5D,CAAA;AACD,eAAO,MAAM,oBAAoB,oEAKhC,CAAA;AAED,eAAO,MAAM,UAAU,oEAEtB,CAAA;AAED,eAAO,MAAM,mBAAmB;WAAwB,MAAM;iBAAe,OAAO;SA4BnF,CAAA;AACD,eAAO,MAAM,SAAS,qEAOrB,CAAA;AACD,eAAO,MAAM,UAAU,kEActB,CAAA;AACD,eAAO,MAAM,WAAW,oEASvB,CAAA;AACD,eAAO,MAAM,YAAY,oEAexB,CAAA;AAED,eAAO,MAAM,iBAAiB;gBAA4B,OAAO;SAiBhE,CAAA;AAED,eAAO,MAAM,YAAY;eAA2B,OAAO;SAO1D,CAAA"}

package/dist/src/components/hypothesisComponent/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/hypothesisComponent/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAI9B,eAAO,MAAM,mBAAmB;iBAkBjB,MAAM;UACb,MAAM;QACR,MAAM;WACH,MAAM;WACN,IAAI,EAAE;kBACC,MAAM;2BACG,MAAM,KAAK,GAAG;0BACf,MAAM,KAAK,GAAG;iCACP,MAAM,KAAK,GAAG;cACjC,OAAO;uBACE,OAAO;kBACZ,OAAO;wBACD,MAAM;sBACR,MAAM;eACb,MAAM;qBACA,MAAM;iBAmKxB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/hypothesisComponent/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAI9B,eAAO,MAAM,mBAAmB;iBAkBjB,MAAM;UACb,MAAM;QACR,MAAM;WACH,MAAM;WACN,IAAI,EAAE;kBACC,MAAM;2BACG,MAAM,KAAK,GAAG;0BACf,MAAM,KAAK,GAAG;iCACP,MAAM,KAAK,GAAG;cACjC,OAAO;uBACE,OAAO;kBACZ,OAAO;wBACD,MAAM;sBACR,MAAM;eACb,MAAM;qBACA,MAAM;iBA2KxB,CAAA"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "frst-components",
   "homepage": "http://FRST-Falconi.github.io/storybook.frstfalconi.com",
-  "version": "0.22.80",
+  "version": "0.22.82",
   "private": false,
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

package/public/customIcons/ExcludeVoteIcon.tsx

@@ -5,25 +5,15 @@ export const ExcludeVoteIcon = ({
   style,
   width = '16',
   height = '17',
-  stroke = '#444444',
-  onMouseOver
+  stroke = '#444444'
 }: {
   style?: CSSProperties | undefined
   width?: string
   height?: string
   stroke?: string
-  onMouseOver?: () => void
 }) => {
   return (
-    <svg
-      onMouseOver={onMouseOver}
-      style={style}
-      width={width}
-      height={height}
-      viewBox="0 0 16 17"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-    >
+    <svg style={style} width={width} height={height} viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
       <path
         d="M8.00065 14.9381C11.6825 14.9381 14.6673 11.9533 14.6673 8.2714C14.6673 4.5895 11.6825 1.60474 8.00065 1.60474C4.31875 1.60474 1.33398 4.5895 1.33398 8.2714C1.33398 11.9533 4.31875 14.9381 8.00065 14.9381Z"
         stroke={stroke}