mirror/formbricks-formbricks
1
0
Fork 0
mirror of https://github.com/formbricks/formbricks.git synced 2026-02-14 11:00:34 -06:00
Code Issues Packages Projects Releases 100 Wiki Activity

fix: click outside is working even if the placement is not center (#4925)

Browse Source
This commit is contained in:
Anshuman Pandey
2025-03-12 18:27:15 +05:30
committed by GitHub
parent 4870dc8d45
commit 1529f5d478
10 changed files with 7 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/js-core/src/lib/widget.ts
View File

@@ -74,6 +74,7 @@ const renderWidget = async (
setIsSurveyRunning(true);
return;
}
languageCode = displayLanguage;
}

9
packages/lib/messages/de-DE.json
View File

@@ -1751,9 +1751,6 @@
"how_to_create_a_panel_step_3_description": "Richte in deiner Formbricks-Umfrage versteckte Felder ein, um nachzuverfolgen, welcher Teilnehmer welche Antwort gegeben hat.",
"how_to_create_a_panel_step_4": "Schritt 4: Starte deine Studie",
"how_to_create_a_panel_step_4_description": "Sobald alles eingerichtet ist, kannst Du deine Studie starten. Innerhalb weniger Stunden wirst Du die ersten Antworten erhalten.",
"how_to_embed_a_survey_on_your_react_native_app": "Wie man eine Umfrage in deine React Native App einbettet",
"how_to_embed_a_survey_on_your_web_app": "Wie man eine Umfrage in seine App einbettet",
"identify_users_and_set_attributes": "Benutzer identifizieren und Attribute festlegen",
"impressions": "Eindrücke",
"impressions_tooltip": "Anzahl der Aufrufe der Umfrage.",
"includes_all": "Beinhaltet alles",
@@ -1768,7 +1765,6 @@
"last_month": "Letztes Monat",
"last_quarter": "Letztes Quartal",
"last_year": "Letztes Jahr",
"learn_how_to": "Lerne, wie man",
"link_to_public_results_copied": "Link zu öffentlichen Ergebnissen kopiert",
"make_sure_the_survey_type_is_set_to": "Stelle sicher, dass der Umfragetyp richtig eingestellt ist",
"mobile_app": "Mobile App",
@@ -1783,7 +1779,6 @@
"send_preview": "Vorschau senden",
"send_to_panel": "An das Panel senden",
"setup_instructions": "Einrichtung",
"setup_instructions_for_react_native_apps": "Einrichtung für React Native Apps",
"setup_integrations": "Integrationen einrichten",
"share_results": "Ergebnisse teilen",
"share_the_link": "Teile den Link",
@@ -1802,10 +1797,7 @@
"this_quarter": "Dieses Quartal",
"this_year": "Dieses Jahr",
"time_to_complete": "Zeit zur Fertigstellung",
"to_connect_your_app_with_formbricks": "um deine App mit Formbricks zu verbinden",
"to_connect_your_web_app_with_formbricks": "um deine Web-App mit Formbricks zu verbinden",
"to_connect_your_website_with_formbricks": "deine Website mit Formbricks zu verbinden",
"to_run_highly_targeted_surveys": "granular zielgerichtete Umfragen durchführen",
"ttc_tooltip": "Durchschnittliche Zeit bis zum Abschluss der Umfrage.",
"unknown_question_type": "Unbekannter Fragetyp",
"unpublish_from_web": "Aus dem Web entfernen",
@@ -1815,7 +1807,6 @@
"view_site": "Seite ansehen",
"waiting_for_response": "Warte auf eine Antwort \uD83E\uDDD8‍♂️",
"web_app": "Web-App",
"were_working_on_sdks_for_flutter_swift_and_kotlin": "Wir arbeiten an SDKs für Flutter, Swift und Kotlin.",
"what_is_a_panel": "Was ist ein Panel?",
"what_is_a_panel_answer": "Ein Panel ist eine Gruppe von Teilnehmern, die basierend auf Merkmalen wie Alter, Beruf, Geschlecht usw. ausgewählt werden.",
"what_is_prolific": "Was ist Prolific?",

9
packages/lib/messages/en-US.json
View File

@@ -1751,9 +1751,6 @@
"how_to_create_a_panel_step_3_description": "Set up hidden fields in your Formbricks survey to track which participant provided which answer.",
"how_to_create_a_panel_step_4": "Step 4: Launch your study",
"how_to_create_a_panel_step_4_description": "Once everything is setup, you can launch your study. Within a few hours you’ll receive the first responses.",
"how_to_embed_a_survey_on_your_react_native_app": "How to embed a survey on your React Native app",
"how_to_embed_a_survey_on_your_web_app": "How to embed a survey on your web app",
"identify_users_and_set_attributes": "identify users and set attributes",
"impressions": "Impressions",
"impressions_tooltip": "Number of times the survey has been viewed.",
"includes_all": "Includes all",
@@ -1768,7 +1765,6 @@
"last_month": "Last month",
"last_quarter": "Last quarter",
"last_year": "Last year",
"learn_how_to": "Learn how to",
"link_to_public_results_copied": "Link to public results copied",
"make_sure_the_survey_type_is_set_to": "Make sure the survey type is set to",
"mobile_app": "Mobile app",
@@ -1783,7 +1779,6 @@
"send_preview": "Send preview",
"send_to_panel": "Send to panel",
"setup_instructions": "Setup instructions",
"setup_instructions_for_react_native_apps": "Setup instructions for React Native apps",
"setup_integrations": "Setup integrations",
"share_results": "Share results",
"share_the_link": "Share the link",
@@ -1802,10 +1797,7 @@
"this_quarter": "This quarter",
"this_year": "This year",
"time_to_complete": "Time to Complete",
"to_connect_your_app_with_formbricks": "to connect your app with Formbricks",
"to_connect_your_web_app_with_formbricks": "to connect your web app with Formbricks",
"to_connect_your_website_with_formbricks": "to connect your website with Formbricks",
"to_run_highly_targeted_surveys": "to run highly targeted surveys.",
"ttc_tooltip": "Average time to complete the survey.",
"unknown_question_type": "Unknown Question Type",
"unpublish_from_web": "Unpublish from web",
@@ -1815,7 +1807,6 @@
"view_site": "View site",
"waiting_for_response": "Waiting for a response \uD83E\uDDD8‍♂️",
"web_app": "Web app",
"were_working_on_sdks_for_flutter_swift_and_kotlin": "We're working on SDKs for Flutter, Swift and Kotlin.",
"what_is_a_panel": "What is a panel?",
"what_is_a_panel_answer": "A panel is a group of participants selected based on characteristics such as age, profession, gender, etc.",
"what_is_prolific": "What is Prolific?",

9
packages/lib/messages/fr-FR.json
View File

@@ -1751,9 +1751,6 @@
"how_to_create_a_panel_step_3_description": "Configurez des champs cachés dans votre enquête Formbricks pour suivre quel participant a fourni quelle réponse.",
"how_to_create_a_panel_step_4": "Étape 4 : Lancez votre étude",
"how_to_create_a_panel_step_4_description": "Une fois que tout est configuré, vous pouvez lancer votre étude. Dans quelques heures, vous recevrez les premières réponses.",
"how_to_embed_a_survey_on_your_react_native_app": "Comment intégrer un sondage dans votre application React Native",
"how_to_embed_a_survey_on_your_web_app": "Comment intégrer une enquête dans votre application web",
"identify_users_and_set_attributes": "identifier les utilisateurs et définir des attributs",
"impressions": "Impressions",
"impressions_tooltip": "Nombre de fois que l'enquête a été consultée.",
"includes_all": "Comprend tous",
@@ -1768,7 +1765,6 @@
"last_month": "Le mois dernier",
"last_quarter": "dernier trimestre",
"last_year": "l'année dernière",
"learn_how_to": "Apprenez à",
"link_to_public_results_copied": "Lien vers les résultats publics copié",
"make_sure_the_survey_type_is_set_to": "Assurez-vous que le type d'enquête est défini sur",
"mobile_app": "Application mobile",
@@ -1783,7 +1779,6 @@
"send_preview": "Envoyer un aperçu",
"send_to_panel": "Envoyer au panneau",
"setup_instructions": "Instructions d'installation",
"setup_instructions_for_react_native_apps": "Instructions d'installation pour les applications React Native",
"setup_integrations": "Configurer les intégrations",
"share_results": "Partager les résultats",
"share_the_link": "Partager le lien",
@@ -1802,10 +1797,7 @@
"this_quarter": "Ce trimestre",
"this_year": "Cette année",
"time_to_complete": "Temps à compléter",
"to_connect_your_app_with_formbricks": "pour connecter votre application à Formbricks",
"to_connect_your_web_app_with_formbricks": "pour connecter votre application web à Formbricks",
"to_connect_your_website_with_formbricks": "connecter votre site web à Formbricks",
"to_run_highly_targeted_surveys": "réaliser des enquêtes très ciblées.",
"ttc_tooltip": "Temps moyen pour compléter l'enquête.",
"unknown_question_type": "Type de question inconnu",
"unpublish_from_web": "Désactiver la publication sur le web",
@@ -1815,7 +1807,6 @@
"view_site": "Voir le site",
"waiting_for_response": "En attente d'une réponse \uD83E\uDDD8‍♂️",
"web_app": "application web",
"were_working_on_sdks_for_flutter_swift_and_kotlin": "Nous travaillons sur des SDK pour Flutter, Swift et Kotlin.",
"what_is_a_panel": "Qu'est-ce qu'un panneau ?",
"what_is_a_panel_answer": "Un panel est un groupe de participants sélectionnés en fonction de caractéristiques telles que l'âge, la profession, le sexe, etc.",
"what_is_prolific": "Qu'est-ce que Prolific ?",

9
packages/lib/messages/pt-BR.json
View File

@@ -1751,9 +1751,6 @@
"how_to_create_a_panel_step_3_description": "Configure campos ocultos na sua pesquisa do Formbricks para rastrear qual participante forneceu qual resposta.",
"how_to_create_a_panel_step_4": "Passo 4: Lançar seu estudo",
"how_to_create_a_panel_step_4_description": "Depois que tudo estiver configurado, você pode iniciar seu estudo. Em algumas horas, você vai receber as primeiras respostas.",
"how_to_embed_a_survey_on_your_react_native_app": "Como incorporar uma pesquisa no seu app React Native",
"how_to_embed_a_survey_on_your_web_app": "Como incorporar uma pesquisa no seu app web",
"identify_users_and_set_attributes": "identificar usuários e definir atributos",
"impressions": "Impressões",
"impressions_tooltip": "Número de vezes que a pesquisa foi visualizada.",
"includes_all": "Inclui tudo",
@@ -1768,7 +1765,6 @@
"last_month": "Último mês",
"last_quarter": "Último trimestre",
"last_year": "Último ano",
"learn_how_to": "Aprenda como",
"link_to_public_results_copied": "Link pros resultados públicos copiado",
"make_sure_the_survey_type_is_set_to": "Certifique-se de que o tipo de pesquisa esteja definido como",
"mobile_app": "app de celular",
@@ -1783,7 +1779,6 @@
"send_preview": "Enviar prévia",
"send_to_panel": "Enviar para o painel",
"setup_instructions": "Instruções de configuração",
"setup_instructions_for_react_native_apps": "Instruções de configuração para apps React Native",
"setup_integrations": "Configurar integrações",
"share_results": "Compartilhar resultados",
"share_the_link": "Compartilha o link",
@@ -1802,10 +1797,7 @@
"this_quarter": "Este trimestre",
"this_year": "Este ano",
"time_to_complete": "Tempo para Concluir",
"to_connect_your_app_with_formbricks": "conectar seu app com o Formbricks",
"to_connect_your_web_app_with_formbricks": "conectar seu app web com o Formbricks",
"to_connect_your_website_with_formbricks": "conectar seu site com o Formbricks",
"to_run_highly_targeted_surveys": "fazer pesquisas altamente direcionadas.",
"ttc_tooltip": "Tempo médio para completar a pesquisa.",
"unknown_question_type": "Tipo de pergunta desconhecido",
"unpublish_from_web": "Despublicar da web",
@@ -1815,7 +1807,6 @@
"view_site": "Ver site",
"waiting_for_response": "Aguardando uma resposta \uD83E\uDDD8‍♂️",
"web_app": "aplicativo web",
"were_working_on_sdks_for_flutter_swift_and_kotlin": "Estamos trabalhando em SDKs para Flutter, Swift e Kotlin.",
"what_is_a_panel": "O que é um painel?",
"what_is_a_panel_answer": "Um painel é um grupo de participantes selecionados com base em características como idade, profissão, gênero, etc.",
"what_is_prolific": "O que é Prolific?",

9
packages/lib/messages/pt-PT.json
View File

@@ -1751,9 +1751,6 @@
"how_to_create_a_panel_step_3_description": "Configure campos ocultos no seu inquérito Formbricks para rastrear qual participante forneceu qual resposta.",
"how_to_create_a_panel_step_4": "Passo 4: Lançar o seu estudo",
"how_to_create_a_panel_step_4_description": "Depois de tudo configurado, pode lançar o seu estudo. Dentro de algumas horas, receberá as primeiras respostas.",
"how_to_embed_a_survey_on_your_react_native_app": "Como incorporar um questionário na sua aplicação React Native",
"how_to_embed_a_survey_on_your_web_app": "Como incorporar um questionário na sua aplicação web",
"identify_users_and_set_attributes": "identificar utilizadores e definir atributos",
"impressions": "Impressões",
"impressions_tooltip": "Número de vezes que o inquérito foi visualizado.",
"includes_all": "Inclui tudo",
@@ -1768,7 +1765,6 @@
"last_month": "Último mês",
"last_quarter": "Último trimestre",
"last_year": "Ano passado",
"learn_how_to": "Saiba como",
"link_to_public_results_copied": "Link para resultados públicos copiado",
"make_sure_the_survey_type_is_set_to": "Certifique-se de que o tipo de inquérito está definido para",
"mobile_app": "Aplicação móvel",
@@ -1783,7 +1779,6 @@
"send_preview": "Enviar pré-visualização",
"send_to_panel": "Enviar para painel",
"setup_instructions": "Instruções de configuração",
"setup_instructions_for_react_native_apps": "Instruções de configuração para aplicações React Native",
"setup_integrations": "Configurar integrações",
"share_results": "Partilhar resultados",
"share_the_link": "Partilhar o link",
@@ -1802,10 +1797,7 @@
"this_quarter": "Este trimestre",
"this_year": "Este ano",
"time_to_complete": "Tempo para Concluir",
"to_connect_your_app_with_formbricks": "para ligar a sua aplicação ao Formbricks",
"to_connect_your_web_app_with_formbricks": "para ligar a sua aplicação web ao Formbricks",
"to_connect_your_website_with_formbricks": "para ligar o seu website ao Formbricks",
"to_run_highly_targeted_surveys": "para realizar inquéritos altamente direcionados.",
"ttc_tooltip": "Tempo médio para concluir o inquérito.",
"unknown_question_type": "Tipo de Pergunta Desconhecido",
"unpublish_from_web": "Despublicar da web",
@@ -1815,7 +1807,6 @@
"view_site": "Ver site",
"waiting_for_response": "A aguardar uma resposta \uD83E\uDDD8‍♂️",
"web_app": "Aplicação web",
"were_working_on_sdks_for_flutter_swift_and_kotlin": "Estamos a trabalhar em SDKs para Flutter, Swift e Kotlin.",
"what_is_a_panel": "O que é um painel?",
"what_is_a_panel_answer": "Um painel é um grupo de participantes selecionados com base em características como idade, profissão, género, etc.",
"what_is_prolific": "O que é o Prolific?",

9
packages/lib/messages/zh-Hant-TW.json
View File

@@ -1751,9 +1751,6 @@
"how_to_create_a_panel_step_3_description": "在您的 Formbricks 問卷中設定隱藏欄位，以追蹤哪個參與者提供了哪個答案。",
"how_to_create_a_panel_step_4": "步驟 4：啟動您的研究",
"how_to_create_a_panel_step_4_description": "設定完成後，您可以啟動您的研究。在幾個小時內，您就會收到第一個回應。",
"how_to_embed_a_survey_on_your_react_native_app": "如何在您的 React Native 應用程式中嵌入問卷",
"how_to_embed_a_survey_on_your_web_app": "如何在您的 Web 應用程式中嵌入問卷",
"identify_users_and_set_attributes": "識別使用者並設定屬性",
"impressions": "曝光數",
"impressions_tooltip": "問卷已檢視的次數。",
"includes_all": "包含全部",
@@ -1768,7 +1765,6 @@
"last_month": "上個月",
"last_quarter": "上一季",
"last_year": "去年",
"learn_how_to": "瞭解如何",
"link_to_public_results_copied": "已複製公開結果的連結",
"make_sure_the_survey_type_is_set_to": "請確保問卷類型設定為",
"mobile_app": "行動應用程式",
@@ -1783,7 +1779,6 @@
"send_preview": "發送預覽",
"send_to_panel": "發送到小組",
"setup_instructions": "設定說明",
"setup_instructions_for_react_native_apps": "React Native 應用程式的設定說明",
"setup_integrations": "設定整合",
"share_results": "分享結果",
"share_the_link": "分享連結",
@@ -1802,10 +1797,7 @@
"this_quarter": "本季",
"this_year": "今年",
"time_to_complete": "完成時間",
"to_connect_your_app_with_formbricks": "以將您的應用程式與 Formbricks 連線",
"to_connect_your_web_app_with_formbricks": "以將您的 Web 應用程式與 Formbricks 連線",
"to_connect_your_website_with_formbricks": "以將您的網站與 Formbricks 連線",
"to_run_highly_targeted_surveys": "以執行高度目標化的問卷。",
"ttc_tooltip": "完成問卷的平均時間。",
"unknown_question_type": "未知的問題類型",
"unpublish_from_web": "從網站取消發布",
@@ -1815,7 +1807,6 @@
"view_site": "檢視網站",
"waiting_for_response": "正在等待回應 \uD83E\uDDD8‍♂️",
"web_app": "Web 應用程式",
"were_working_on_sdks_for_flutter_swift_and_kotlin": "我們正在開發適用於 Flutter、Swift 和 Kotlin 的 SDK。",
"what_is_a_panel": "什麼是小組？",
"what_is_a_panel_answer": "小組是一組根據年齡、職業、性別等特徵選取的參與者。",
"what_is_prolific": "什麼是 Prolific？",

1
packages/surveys/src/components/general/render-survey.tsx
View File

@@ -26,6 +26,7 @@ export function RenderSurvey(props: SurveyContainerProps) {
{/* @ts-expect-error -- TODO: fix this */}
<Survey
{...props}
clickOutside={props.placement === "center" ? props.clickOutside : true}
onClose={close}
onFinished={() => {
props.onFinished?.();

6
packages/surveys/src/components/wrappers/survey-container.tsx
View File

@@ -32,7 +32,8 @@ export function SurveyContainer({
}, [isOpen]);
useEffect(() => {
if (!isCenter && !isModal) return;
if (!isModal) return;
if (!isCenter) return;
const handleClickOutside = (e: MouseEvent) => {
if (
@@ -49,7 +50,7 @@ export function SurveyContainer({
return () => {
document.removeEventListener("mousedown", handleClickOutside);
};
}, [show, clickOutside, onClose, isCenter]);
}, [show, clickOutside, onClose, isCenter, isModal]);
const getPlacementStyle = (placement: TPlacement): string => {
switch (placement) {
@@ -77,6 +78,7 @@ export function SurveyContainer({
</div>
);
}
return (
<div id="fbjs" className="fb-formbricks-form">
<div

2
packages/surveys/src/index.ts
View File

@@ -32,7 +32,7 @@ export const renderSurvey = (props: SurveyContainerProps) => {
throw new Error(`renderSurvey: Element with id ${containerId} not found.`);
}
const { placement, darkOverlay, onClose, ...surveyInlineProps } = props;
const { placement, darkOverlay, onClose, clickOutside, ...surveyInlineProps } = props;
render(h(RenderSurvey, surveyInlineProps), element);
} else {