rasp-feedback 1.0.7 → 1.0.8

package/dist/nextjs/components/PostItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PostItem.d.ts","sourceRoot":"","sources":["../../../src/nextjs/components/PostItem.tsx"],"names":[],"mappings":"AAIA,iBAAS,QAAQ,CAAC,EAAC,IAAI,EAAE,aAAa,EAAE,cAAc,EAAC,EAAC;IACpD,IAAI,EAAC,GAAG,CAAC;IACT,aAAa,EAAC,GAAG,CAAC;IAClB,cAAc,EAAC,GAAG,CAAC;CAEtB,2CAoEA;AAED,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"PostItem.d.ts","sourceRoot":"","sources":["../../../src/nextjs/components/PostItem.tsx"],"names":[],"mappings":"AAKA,iBAAS,QAAQ,CAAC,EAAC,IAAI,EAAE,aAAa,EAAE,cAAc,EAAC,EAAC;IACpD,IAAI,EAAC,GAAG,CAAC;IACT,aAAa,EAAC,GAAG,CAAC;IAClB,cAAc,EAAC,GAAG,CAAC;CAEtB,2CA6DA;AAED,eAAe,QAAQ,CAAA"}

package/dist/nextjs/components/PostItem.js

@@ -1,56 +1,54 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
+import { useState, useEffect } from 'react';
 import { fontMap } from '../constants/fontexp';
-import { CircleArrowDown, CircleArrowUp } from 'lucide-react';
+import { CircleArrowUp } from 'lucide-react';
+import { motion } from 'framer-motion';
 function PostItem({ post, setShowVoteUI, setCurrentPost }) {
-    const [isMobile, setIsMobile] = useState(false);
+    const [hasUpvoted, setHasUpvoted] = useState(false);
     useEffect(() => {
-        if (typeof window === 'undefined')
-            return;
-        const checkMobile = () => {
-            setIsMobile(window.innerWidth <= 768);
-        };
-        checkMobile();
-        window.addEventListener('resize', checkMobile);
-        return () => window.removeEventListener('resize', checkMobile);
-    }, []);
-    return (_jsxs("div", { onClick: () => {
+        // Check if user has upvoted this post
+        const voteKey = `voted_${post._id}`;
+        const voteStatus = localStorage.getItem(voteKey);
+        setHasUpvoted(voteStatus === 'up');
+    }, [post._id]);
+    const purpleColor = '#9e54df';
+    const backgroundColor = hasUpvoted ? purpleColor : 'white';
+    const borderColor = hasUpvoted ? purpleColor : 'black';
+    const badgeBackgroundColor = hasUpvoted ? purpleColor : 'black';
+    return (_jsxs(motion.div, { onClick: () => {
             setCurrentPost(post);
             setShowVoteUI(true);
+        }, whileHover: {
+            borderColor: purpleColor,
+            boxShadow: `0 4px 8px 0 rgba(158, 84, 223, 0.2), 0 6px 20px 0 rgba(158, 84, 223, 0.19)`,
+            transition: { duration: 0.1 },
         }, style: {
-            padding: isMobile ? "8px" : "5px",
+            padding: "10px",
             width: "100%",
             display: "flex",
             flexDirection: "row",
-            gap: isMobile ? "10px" : "20px",
-            justifyContent: "start",
+            gap: "20px",
             alignItems: "center",
-            borderBottom: "2px solid black",
-            cursor: "pointer"
-        }, children: [_jsxs("div", { style: {
+            border: `2px solid ${borderColor}`,
+            borderRadius: '10px',
+            cursor: "pointer",
+            justifyContent: "space-between",
+            backgroundColor: backgroundColor,
+            transition: 'all 0.3s ease',
+        }, children: [_jsx("h1", { className: fontMap.poppins.className, style: {
+                    fontSize: "12px",
+                    color: hasUpvoted ? 'white' : 'black'
+                }, children: post.title }), _jsxs("div", { style: {
                     display: "flex",
                     flexDirection: "row",
-                    gap: "5px",
+                    gap: "4px",
                     alignItems: "center",
-                    minWidth: isMobile ? "60px" : "auto"
-                }, children: [_jsx(CircleArrowUp, { size: isMobile ? 16 : 20 }), _jsx("p", { className: fontMap.wixmadefor.className, style: {
-                            fontSize: isMobile ? "12px" : "14px"
-                        }, children: post.upvote_count }), _jsx(CircleArrowDown, { size: isMobile ? 16 : 20 }), _jsx("p", { className: fontMap.wixmadefor.className, style: {
-                            fontSize: isMobile ? "12px" : "14px"
-                        }, children: post.downvote_count })] }), _jsxs("div", { style: {
-                    flex: 1,
-                    overflow: "hidden"
-                }, children: [_jsx("h1", { className: fontMap.poppins.className, style: {
-                            fontSize: isMobile ? "11px" : "12px",
-                            whiteSpace: isMobile ? "nowrap" : "normal",
-                            overflow: isMobile ? "hidden" : "visible",
-                            textOverflow: isMobile ? "ellipsis" : "clip"
-                        }, children: post.title }), _jsx("h2", { className: fontMap.wixmadefor.className, style: {
-                            fontSize: isMobile ? "9px" : "10px",
-                            color: "gray",
-                            whiteSpace: isMobile ? "nowrap" : "normal",
-                            overflow: isMobile ? "hidden" : "visible",
-                            textOverflow: isMobile ? "ellipsis" : "clip"
-                        }, children: isMobile ? post.subtitle.slice(0, 45) + "..." : post.subtitle.slice(0, 65) + "..." })] })] }));
+                    backgroundColor: badgeBackgroundColor,
+                    padding: "8px",
+                    borderRadius: "10px",
+                }, children: [_jsx(CircleArrowUp, { size: 20, color: "white" }), _jsx("p", { className: fontMap.wixmadefor.className, style: {
+                            fontSize: "14px",
+                            color: "white"
+                        }, children: post.upvote_count })] })] }));
 }
 export default PostItem;

package/dist/nextjs/components/RaspForm.d.ts

@@ -1,7 +1,7 @@
 import type { CSSProperties } from 'react';
 interface Props {
-    otherStyles?: CSSProperties;
+    style?: CSSProperties;
 }
-export declare function RaspForm({ otherStyles }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function RaspForm({ style }: Props): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=RaspForm.d.ts.map

package/dist/nextjs/components/RaspForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RaspForm.d.ts","sourceRoot":"","sources":["../../../src/nextjs/components/RaspForm.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAS3C,UAAU,KAAK;IACb,WAAW,CAAC,EAAE,aAAa,CAAC;CAC7B;AAED,wBAAgB,QAAQ,CAAC,EAAE,WAAW,EAAE,EAAE,KAAK,2CA6L9C"}
+{"version":3,"file":"RaspForm.d.ts","sourceRoot":"","sources":["../../../src/nextjs/components/RaspForm.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAS3C,UAAU,KAAK;IACb,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,2CAsKxC"}

package/dist/nextjs/components/RaspForm.js

@@ -2,44 +2,46 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 { /*@ts-ignore*/ }
-import { getFormByDomainOrCompany, getBrandTheme, getFormTheme } from '../functions/functionsexp';
+import { getFormByRoute, getBrandTheme, getFormTheme } from '../functions/functionsexp';
 import StaticFormComponent from './StaticFormComponent';
 import Skeleton from './Skeleton';
 import { fontMap } from '../constants/fontexp';
 import { RASP_LOGO_BASE64 } from '../constants/baserasplogo';
-export function RaspForm({ otherStyles }) {
+export function RaspForm({ style }) {
     const [companyId, setCompanyId] = useState(null);
-    const [currentUrl, setCurrentUrl] = useState('');
+    const [currentPath, setCurrentPath] = useState('');
     const [form, setForm] = useState(null);
     const [fields, setFields] = useState(null);
     const [mainTheme, setMainTheme] = useState(null);
     const [isLoading, setIsLoading] = useState(true);
-    const [isMobile, setIsMobile] = useState(false);
+    const [windowWidth, setWindowWidth] = useState(0);
     const getForm = async () => {
-        const f = await getFormByDomainOrCompany(companyId, currentUrl);
-        if (!f) {
-            setForm(f);
+        setIsLoading(true);
+        const result = await getFormByRoute(currentPath, undefined, companyId);
+        if (!result) {
+            setForm(null);
             setIsLoading(false);
             return;
         }
-        setForm(f[0]);
+        setForm(result.form);
+        setIsLoading(false);
     };
     useEffect(() => {
         if (typeof window !== 'undefined') {
             setCompanyId(process.env.NEXT_PUBLIC_RASP_COMPANY_ID);
-            setCurrentUrl(window.location.href);
-            // Check if mobile
-            const checkMobile = () => {
-                setIsMobile(window.innerWidth <= 768);
-            };
-            checkMobile();
-            window.addEventListener('resize', checkMobile);
-            return () => window.removeEventListener('resize', checkMobile);
+            setCurrentPath(window.location.pathname);
         }
     }, []);
     useEffect(() => {
         if (typeof window === 'undefined')
             return;
+        // Set initial window width
+        setWindowWidth(window.innerWidth);
+        // Add resize listener
+        const handleResize = () => {
+            setWindowWidth(window.innerWidth);
+        };
+        window.addEventListener('resize', handleResize);
         if (!document.getElementById('rasp-google-fonts')) {
             const link = document.createElement('link');
             link.id = 'rasp-google-fonts';
@@ -68,12 +70,10 @@ export function RaspForm({ otherStyles }) {
         }
     }, [form]);
     useEffect(() => {
-        if (currentUrl.trim()) {
-            if (companyId) {
-                getForm();
-            }
+        if (companyId && currentPath) {
+            getForm();
         }
-    });
+    }, [companyId, currentPath]);
     return (_jsxs("div", { children: [form && _jsx(_Fragment, { children: form.active && mainTheme && fields && _jsx("div", { id: "rasp-form-div", style: {
                         padding: 0,
                         margin: 0,
@@ -82,36 +82,17 @@ export function RaspForm({ otherStyles }) {
                         width: "auto",
                         height: "auto",
                         display: "inline-block",
-                        transform: isMobile ? "none" : "translate(-50%, -25%)",
+                        transform: "translate(-50%, -25%)",
                         overflow: "visible",
-                        ...otherStyles
-                    }, children: _jsx(StaticFormComponent, { form: form, mainTheme: mainTheme, fields: fields }) }) }), !isLoading && !form && _jsxs("div", { style: {
+                        ...style
+                    }, children: _jsx(StaticFormComponent, { form: form, mainTheme: mainTheme, fields: fields, submitable: true, isFormComponent: true }) }) }), !isLoading && !form && _jsxs("div", { style: {
                     display: 'flex',
                     flexDirection: 'column',
                     alignItems: 'center',
-                    borderRadius: '0.75rem',
                     backgroundColor: 'white',
-                    margin: isMobile ? '0.75rem' : '1.25rem',
-                    width: isMobile ? '90vw' : '470px',
-                    maxWidth: '470px',
-                    minHeight: isMobile ? '350px' : '400px',
-                    border: '1px solid black',
-                    padding: isMobile ? '0.75rem' : '1rem',
-                    boxShadow: '0 1px 3px 0 rgba(0, 0, 0, 1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)'
-                }, children: [_jsx("br", {}), _jsx("br", {}), _jsx("img", { src: RASP_LOGO_BASE64, width: isMobile ? "120px" : "150px", height: isMobile ? "120px" : "150px", alt: "rasp logo" }), _jsx("h1", { className: `${fontMap.poppins.className}`, style: { fontSize: isMobile ? '2rem' : '2.5rem' }, children: "404" }), _jsx("h2", { className: `${fontMap.wixmadefor.className}`, style: {
-                            textAlign: 'center',
-                            fontSize: isMobile ? '0.9rem' : '1rem',
-                            padding: isMobile ? '0 0.5rem' : '0'
-                        }, children: !companyId ? "CompanyId is not provided. Please provide companyId in your env file." : "No forms found for this URL." }), !companyId && _jsxs("p", { className: `${fontMap.wixmadefor.className}`, style: {
-                            textAlign: 'center',
-                            fontSize: isMobile ? '0.85rem' : '1rem',
-                            padding: isMobile ? '0 0.5rem' : '0'
-                        }, children: [" Refer to Rasp docs for help: ", _jsx("a", { href: 'https://tryrasp.online/docs', style: { textDecoration: "underline" }, children: "https://tryrasp.online/docs" })] }), companyId && _jsxs("p", { className: `${fontMap.wixmadefor.className}`, style: {
-                            textAlign: 'center',
-                            fontSize: isMobile ? '0.85rem' : '1rem',
-                            padding: isMobile ? '0 0.5rem' : '0',
-                            wordBreak: 'break-all'
-                        }, children: [" Set this as your form domain url: ", currentUrl] })] }), isLoading &&
+                    width: '470px',
+                    minHeight: '400px',
+                }, children: [_jsx("br", {}), _jsx("br", {}), _jsx("img", { src: RASP_LOGO_BASE64, width: "150px", height: "150px", alt: "rasp logo" }), _jsx("h1", { className: `${fontMap.poppins.className}`, children: "404" }), _jsx("h2", { className: `${fontMap.wixmadefor.className}`, style: { textAlign: 'center' }, children: !companyId ? "CompanyId is not provided. Please provide companyId in your env file." : "No forms found for this URL." }), !companyId && _jsxs("p", { className: `${fontMap.wixmadefor.className}`, style: { textAlign: 'center' }, children: [" Refer to Rasp docs for help: ", _jsx("a", { href: 'https://www.tryrasp.online/docs', style: { textDecoration: "underline" }, children: "https://www.tryrasp.online/docs" })] }), companyId && typeof window !== 'undefined' && _jsxs("p", { className: `${fontMap.wixmadefor.className}`, style: { textAlign: 'center' }, children: [" Set this as your form domain url: ", window.location.href] })] }), isLoading &&
                 _jsx("div", { id: "rasp-form-div", style: {
                         padding: 0,
                         margin: 0,
@@ -120,20 +101,16 @@ export function RaspForm({ otherStyles }) {
                         width: "auto",
                         height: "auto",
                         display: "inline-block",
-                        transform: isMobile ? "none" : "translate(-50%, -25%)",
+                        transform: "translate(-50%, -25%)",
                         overflow: "visible",
                     }, children: _jsx("div", { style: {
                             display: 'flex',
                             flexDirection: "column",
                             justifyContent: 'center',
-                            borderRadius: '0.75rem',
-                            backgroundColor: "white",
-                            margin: isMobile ? '0.75rem' : '1.25rem',
-                            width: isMobile ? '90vw' : '470px',
-                            maxWidth: '470px',
-                            minHeight: isMobile ? '350px' : '400px',
-                            border: '1px solid whitesmoke',
-                            padding: isMobile ? '1.5rem' : '2rem',
+                            backgroundColor: "transparent",
+                            width: '470px',
+                            minHeight: '400px',
+                            padding: '2rem',
                             paddingTop: "0px"
-                        }, children: _jsxs("div", { style: { marginTop: "-30px" }, children: [_jsx(Skeleton, { width: isMobile ? Math.min(window.innerWidth * 0.8, 400) : 400, height: 40 }), _jsx(Skeleton, { width: isMobile ? Math.min(window.innerWidth * 0.8, 400) : 400, height: 30 }), _jsx("br", {}), _jsx(Skeleton, { width: isMobile ? Math.min(window.innerWidth * 0.8, 400) : 400, height: 70 }), _jsx(Skeleton, { width: isMobile ? Math.min(window.innerWidth * 0.8, 400) : 400, height: 100 })] }) }) })] }));
+                        }, children: _jsxs("div", { style: { marginTop: "-30px" }, children: [_jsx(Skeleton, { width: windowWidth > 400 ? 400 : 350, height: 40 }), _jsx(Skeleton, { width: windowWidth > 400 ? 400 : 350, height: 30 }), _jsx("br", {}), _jsx(Skeleton, { width: windowWidth > 400 ? 400 : 350, height: 70 }), _jsx(Skeleton, { width: windowWidth > 400 ? 400 : 350, height: 100 })] }) }) })] }));
 }

package/dist/nextjs/components/RaspProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RaspProvider.d.ts","sourceRoot":"","sources":["../../../src/nextjs/components/RaspProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAKlD,OAAO,cAAc,CAAA;AAQrB,MAAM,WAAW,iBAAiB;IAChC,gBAAgB,CAAC,EAAC;QAChB,GAAG,CAAC,EAAC,MAAM,CAAC;QACZ,IAAI,CAAC,EAAC,MAAM,CAAA;KACb,CAAA;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAGD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwiBpD,CAAA"}
+{"version":3,"file":"RaspProvider.d.ts","sourceRoot":"","sources":["../../../src/nextjs/components/RaspProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAIlD,OAAO,cAAc,CAAA;AAUrB,MAAM,WAAW,iBAAiB;IAChC,gBAAgB,CAAC,EAAC;QAChB,GAAG,CAAC,EAAC,MAAM,CAAC;QACZ,IAAI,CAAC,EAAC,MAAM,CAAA;KACb,CAAA;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAKD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA+epD,CAAA"}