@posthog/browser-common 0.9.5 → 0.9.6

package/dist/surveys/surveys-extension-utils.mjs

@@ -0,0 +1,608 @@
+import { FeatureFlagsCommonExtension } from "../extension-tokens.mjs";
+import { getTargetingUrl } from "../utils/url-targeting-utils.mjs";
+import { getSurveyReplayUrl } from "../survey-render-context.mjs";
+import { cloneElement, createContext } from "preact";
+import { SurveyEventName, SurveyEventProperties, SurveyPosition, SurveyType, SurveyWidgetType } from "../survey-constants.mjs";
+import { SURVEY_IN_PROGRESS_PREFIX, SURVEY_LOGGER, getSurveyAbandonedKey, getSurveyInteractionProperty, getSurveySeenKey, getSurveyStorageKey } from "../utils/survey-utils.mjs";
+import { isNullish, isUndefined } from "@posthog/core";
+import { buildSurveyResponseEventProperties, canSurveyActivateRepeatedly, getDisplayOrderChoices, getSurveyResponseKey, propertyComparisons, shuffle } from "@posthog/core/surveys";
+import { prepareStylesheet } from "../utils/stylesheet-loader.mjs";
+import { surveyStyles } from "./survey-styles.mjs";
+import { useContext } from "preact/hooks";
+import { doesDeviceTypeMatch, hasPeriodPassed } from "../utils/matcher-utils.mjs";
+const Z_INDEX_SURVEYS = 2147483645;
+function getFontFamily(fontFamily) {
+    if ('inherit' === fontFamily) return 'inherit';
+    const defaultFontStack = 'BlinkMacSystemFont, "Inter", "Segoe UI", "Roboto", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"';
+    return fontFamily ? `${fontFamily}, ${defaultFontStack}` : `-apple-system, ${defaultFontStack}`;
+}
+const BLACK_TEXT_COLOR = '#020617';
+const defaultSurveyAppearance = {
+    fontFamily: 'inherit',
+    backgroundColor: '#eeeded',
+    submitButtonColor: 'black',
+    submitButtonTextColor: 'white',
+    ratingButtonColor: 'white',
+    ratingButtonActiveColor: 'black',
+    borderColor: '#c9c6c6',
+    whiteLabel: false,
+    displayThankYouMessage: true,
+    thankYouMessageHeader: 'Thank you for your feedback!',
+    position: SurveyPosition.Right,
+    widgetType: SurveyWidgetType.Tab,
+    widgetLabel: 'Feedback',
+    widgetColor: 'black',
+    zIndex: String(Z_INDEX_SURVEYS),
+    disabledButtonOpacity: '0.6',
+    maxWidth: '300px',
+    textSubtleColor: '#939393',
+    boxPadding: '20px 24px',
+    boxShadow: '0 4px 12px rgba(0, 0, 0, 0.15)',
+    borderRadius: '10px',
+    shuffleQuestions: false,
+    outlineColor: 'rgba(59, 130, 246, 0.8)',
+    inputBackground: 'white',
+    inputTextColor: BLACK_TEXT_COLOR,
+    scrollbarThumbColor: 'var(--ph-survey-border-color)',
+    scrollbarTrackColor: 'var(--ph-survey-background-color)'
+};
+const BOTTOM_BORDER_SURVEY_POSITIONS = [
+    SurveyPosition.Center,
+    SurveyPosition.Left,
+    SurveyPosition.Right
+];
+const addSurveyCSSVariablesToElement = (element, type, appearance)=>{
+    const effectiveAppearance = {
+        ...defaultSurveyAppearance,
+        ...appearance
+    };
+    const hostStyle = element.style;
+    const surveyHasBottomBorder = !BOTTOM_BORDER_SURVEY_POSITIONS.includes(effectiveAppearance.position) || type === SurveyType.Widget && appearance?.widgetType === SurveyWidgetType.Tab;
+    hostStyle.setProperty('--ph-survey-font-family', getFontFamily(effectiveAppearance.fontFamily));
+    hostStyle.setProperty('--ph-survey-box-padding', effectiveAppearance.boxPadding);
+    hostStyle.setProperty('--ph-survey-max-width', effectiveAppearance.maxWidth);
+    hostStyle.setProperty('--ph-survey-z-index', effectiveAppearance.zIndex);
+    hostStyle.setProperty('--ph-survey-border-color', effectiveAppearance.borderColor);
+    if (surveyHasBottomBorder) {
+        hostStyle.setProperty('--ph-survey-border-radius', effectiveAppearance.borderRadius);
+        hostStyle.setProperty('--ph-survey-border-bottom', '1.5px solid var(--ph-survey-border-color)');
+    } else {
+        hostStyle.setProperty('--ph-survey-border-bottom', 'none');
+        hostStyle.setProperty('--ph-survey-border-radius', `${effectiveAppearance.borderRadius} ${effectiveAppearance.borderRadius} 0 0`);
+    }
+    hostStyle.setProperty('--ph-survey-background-color', effectiveAppearance.backgroundColor);
+    hostStyle.setProperty('--ph-survey-box-shadow', effectiveAppearance.boxShadow);
+    hostStyle.setProperty('--ph-survey-disabled-button-opacity', effectiveAppearance.disabledButtonOpacity);
+    hostStyle.setProperty('--ph-survey-submit-button-color', effectiveAppearance.submitButtonColor);
+    hostStyle.setProperty('--ph-survey-submit-button-text-color', appearance?.submitButtonTextColor || getContrastingTextColor(effectiveAppearance.submitButtonColor));
+    hostStyle.setProperty('--ph-survey-rating-bg-color', effectiveAppearance.ratingButtonColor);
+    hostStyle.setProperty('--ph-survey-rating-active-bg-color', effectiveAppearance.ratingButtonActiveColor);
+    hostStyle.setProperty('--ph-survey-rating-active-text-color', getContrastingTextColor(effectiveAppearance.ratingButtonActiveColor));
+    hostStyle.setProperty('--ph-survey-text-primary-color', appearance?.textColor || getContrastingTextColor(effectiveAppearance.backgroundColor));
+    hostStyle.setProperty('--ph-survey-text-subtle-color', effectiveAppearance.textSubtleColor);
+    hostStyle.setProperty('--ph-widget-color', effectiveAppearance.widgetColor);
+    hostStyle.setProperty('--ph-widget-text-color', getContrastingTextColor(effectiveAppearance.widgetColor));
+    hostStyle.setProperty('--ph-widget-z-index', effectiveAppearance.zIndex);
+    const userInputBg = appearance?.inputBackground || appearance?.inputBackgroundColor;
+    let inputBgColor = userInputBg || effectiveAppearance.inputBackground;
+    if (!userInputBg && 'white' === effectiveAppearance.backgroundColor) inputBgColor = '#f8f8f8';
+    hostStyle.setProperty('--ph-survey-input-background', inputBgColor);
+    const inputTextColor = appearance?.inputTextColor || getContrastingTextColor(inputBgColor);
+    hostStyle.setProperty('--ph-survey-input-text-color', inputTextColor);
+    hostStyle.setProperty('--ph-survey-rating-text-color', inputTextColor);
+    hostStyle.setProperty('--ph-survey-scrollbar-thumb-color', effectiveAppearance.scrollbarThumbColor);
+    hostStyle.setProperty('--ph-survey-scrollbar-track-color', effectiveAppearance.scrollbarTrackColor);
+    hostStyle.setProperty('--ph-survey-outline-color', effectiveAppearance.outlineColor);
+};
+function nameToHex(name) {
+    return ({
+        aliceblue: '#f0f8ff',
+        antiquewhite: '#faebd7',
+        aqua: '#00ffff',
+        aquamarine: '#7fffd4',
+        azure: '#f0ffff',
+        beige: '#f5f5dc',
+        bisque: '#ffe4c4',
+        black: '#000000',
+        blanchedalmond: '#ffebcd',
+        blue: '#0000ff',
+        blueviolet: '#8a2be2',
+        brown: '#a52a2a',
+        burlywood: '#deb887',
+        cadetblue: '#5f9ea0',
+        chartreuse: '#7fff00',
+        chocolate: '#d2691e',
+        coral: '#ff7f50',
+        cornflowerblue: '#6495ed',
+        cornsilk: '#fff8dc',
+        crimson: '#dc143c',
+        cyan: '#00ffff',
+        darkblue: '#00008b',
+        darkcyan: '#008b8b',
+        darkgoldenrod: '#b8860b',
+        darkgray: '#a9a9a9',
+        darkgreen: '#006400',
+        darkkhaki: '#bdb76b',
+        darkmagenta: '#8b008b',
+        darkolivegreen: '#556b2f',
+        darkorange: '#ff8c00',
+        darkorchid: '#9932cc',
+        darkred: '#8b0000',
+        darksalmon: '#e9967a',
+        darkseagreen: '#8fbc8f',
+        darkslateblue: '#483d8b',
+        darkslategray: '#2f4f4f',
+        darkturquoise: '#00ced1',
+        darkviolet: '#9400d3',
+        deeppink: '#ff1493',
+        deepskyblue: '#00bfff',
+        dimgray: '#696969',
+        dodgerblue: '#1e90ff',
+        firebrick: '#b22222',
+        floralwhite: '#fffaf0',
+        forestgreen: '#228b22',
+        fuchsia: '#ff00ff',
+        gainsboro: '#dcdcdc',
+        ghostwhite: '#f8f8ff',
+        gold: '#ffd700',
+        goldenrod: '#daa520',
+        gray: '#808080',
+        green: '#008000',
+        greenyellow: '#adff2f',
+        honeydew: '#f0fff0',
+        hotpink: '#ff69b4',
+        'indianred ': '#cd5c5c',
+        indigo: '#4b0082',
+        ivory: '#fffff0',
+        khaki: '#f0e68c',
+        lavender: '#e6e6fa',
+        lavenderblush: '#fff0f5',
+        lawngreen: '#7cfc00',
+        lemonchiffon: '#fffacd',
+        lightblue: '#add8e6',
+        lightcoral: '#f08080',
+        lightcyan: '#e0ffff',
+        lightgoldenrodyellow: '#fafad2',
+        lightgrey: '#d3d3d3',
+        lightgreen: '#90ee90',
+        lightpink: '#ffb6c1',
+        lightsalmon: '#ffa07a',
+        lightseagreen: '#20b2aa',
+        lightskyblue: '#87cefa',
+        lightslategray: '#778899',
+        lightsteelblue: '#b0c4de',
+        lightyellow: '#ffffe0',
+        lime: '#00ff00',
+        limegreen: '#32cd32',
+        linen: '#faf0e6',
+        magenta: '#ff00ff',
+        maroon: '#800000',
+        mediumaquamarine: '#66cdaa',
+        mediumblue: '#0000cd',
+        mediumorchid: '#ba55d3',
+        mediumpurple: '#9370d8',
+        mediumseagreen: '#3cb371',
+        mediumslateblue: '#7b68ee',
+        mediumspringgreen: '#00fa9a',
+        mediumturquoise: '#48d1cc',
+        mediumvioletred: '#c71585',
+        midnightblue: '#191970',
+        mintcream: '#f5fffa',
+        mistyrose: '#ffe4e1',
+        moccasin: '#ffe4b5',
+        navajowhite: '#ffdead',
+        navy: '#000080',
+        oldlace: '#fdf5e6',
+        olive: '#808000',
+        olivedrab: '#6b8e23',
+        orange: '#ffa500',
+        orangered: '#ff4500',
+        orchid: '#da70d6',
+        palegoldenrod: '#eee8aa',
+        palegreen: '#98fb98',
+        paleturquoise: '#afeeee',
+        palevioletred: '#d87093',
+        papayawhip: '#ffefd5',
+        peachpuff: '#ffdab9',
+        peru: '#cd853f',
+        pink: '#ffc0cb',
+        plum: '#dda0dd',
+        powderblue: '#b0e0e6',
+        purple: '#800080',
+        red: '#ff0000',
+        rosybrown: '#bc8f8f',
+        royalblue: '#4169e1',
+        saddlebrown: '#8b4513',
+        salmon: '#fa8072',
+        sandybrown: '#f4a460',
+        seagreen: '#2e8b57',
+        seashell: '#fff5ee',
+        sienna: '#a0522d',
+        silver: '#c0c0c0',
+        skyblue: '#87ceeb',
+        slateblue: '#6a5acd',
+        slategray: '#708090',
+        snow: '#fffafa',
+        springgreen: '#00ff7f',
+        steelblue: '#4682b4',
+        tan: '#d2b48c',
+        teal: '#008080',
+        thistle: '#d8bfd8',
+        tomato: '#ff6347',
+        turquoise: '#40e0d0',
+        violet: '#ee82ee',
+        wheat: '#f5deb3',
+        white: '#ffffff',
+        whitesmoke: '#f5f5f5',
+        yellow: '#ffff00',
+        yellowgreen: '#9acd32'
+    })[name.toLowerCase()];
+}
+function hex2rgb(c) {
+    if (c.startsWith('#')) {
+        let hexColor = c.replace(/^#/, '');
+        if (/^[0-9A-Fa-f]{3}$/.test(hexColor)) hexColor = hexColor[0] + hexColor[0] + hexColor[1] + hexColor[1] + hexColor[2] + hexColor[2];
+        if (!/^[0-9A-Fa-f]{6}$/.test(hexColor)) return 'rgb(255, 255, 255)';
+        const r = parseInt(hexColor.slice(0, 2), 16);
+        const g = parseInt(hexColor.slice(2, 4), 16);
+        const b = parseInt(hexColor.slice(4, 6), 16);
+        return `rgb(${r},${g},${b})`;
+    }
+    return 'rgb(255, 255, 255)';
+}
+function hexToRgba(hex, opacity) {
+    const rgb = hex2rgb(hex);
+    const match = rgb.match(/^rgb\((\d+),(\d+),(\d+)\)$/);
+    if (!match) return hex;
+    return `rgba(${match[1]}, ${match[2]}, ${match[3]}, ${opacity})`;
+}
+function getContrastingTextColor(color = defaultSurveyAppearance.backgroundColor) {
+    let rgb;
+    if ('#' === color[0]) rgb = hex2rgb(color);
+    if (color.startsWith('rgb')) rgb = color;
+    const nameColorToHex = nameToHex(color);
+    if (nameColorToHex) rgb = hex2rgb(nameColorToHex);
+    if (!rgb) return BLACK_TEXT_COLOR;
+    const colorMatch = rgb.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/);
+    if (colorMatch) {
+        const r = parseInt(colorMatch[1]);
+        const g = parseInt(colorMatch[2]);
+        const b = parseInt(colorMatch[3]);
+        const hsp = Math.sqrt(r * r * 0.299 + g * g * 0.587 + b * b * 0.114);
+        return hsp > 127.5 ? BLACK_TEXT_COLOR : 'white';
+    }
+    return BLACK_TEXT_COLOR;
+}
+function getSurveyStylesheet(posthog) {
+    const stylesheet = prepareStylesheet(document, 'string' == typeof surveyStyles ? surveyStyles : '', posthog?.config.prepareStylesheet);
+    stylesheet?.setAttribute('data-ph-survey-style', 'true');
+    return stylesheet;
+}
+const retrieveSurveyShadow = (survey, posthog, element)=>{
+    const widgetClassName = getSurveyContainerClass(survey);
+    const existingDiv = document.querySelector(`.${widgetClassName}`);
+    if (existingDiv && existingDiv.shadowRoot) return {
+        shadow: existingDiv.shadowRoot,
+        isNewlyCreated: false
+    };
+    const div = document.createElement('div');
+    addSurveyCSSVariablesToElement(div, survey.type, survey.appearance);
+    div.className = widgetClassName;
+    const shadow = div.attachShadow({
+        mode: 'open'
+    });
+    const stylesheet = getSurveyStylesheet(posthog);
+    if (stylesheet) {
+        const existingStylesheet = shadow.querySelector('style');
+        if (existingStylesheet) shadow.removeChild(existingStylesheet);
+        shadow.appendChild(stylesheet);
+    }
+    (element ? element : document.body).appendChild(div);
+    return {
+        shadow,
+        isNewlyCreated: true
+    };
+};
+const setSurveySeen = (survey)=>{
+    try {
+        const key = getSurveySeenKey(survey);
+        if (!localStorage.getItem(key)) localStorage.setItem(key, 'true');
+    } catch (error) {
+        SURVEY_LOGGER.error('Failed to persist survey seen state', error);
+    }
+};
+const sendSurveyEvent = ({ responses, survey, surveySubmissionId, posthog, isSurveyCompleted, properties, surveyLanguage, questionSnapshots })=>{
+    if (!posthog) return void SURVEY_LOGGER.error('[survey sent] event not captured, PostHog instance not found.');
+    if (!posthog.client?.canCapture) return;
+    setSurveySeen(survey);
+    if (isSurveyCompleted) clearInProgressSurveyState(survey);
+    posthog.client?.capture(SurveyEventName.SENT, {
+        [SurveyEventProperties.SURVEY_NAME]: survey.name,
+        [SurveyEventProperties.SURVEY_ID]: survey.id,
+        [SurveyEventProperties.SURVEY_ITERATION]: survey.current_iteration,
+        [SurveyEventProperties.SURVEY_ITERATION_START_DATE]: survey.current_iteration_start_date,
+        sessionRecordingUrl: getSurveyReplayUrl(posthog),
+        ...buildSurveyResponseEventProperties({
+            event: 'sent',
+            survey,
+            responses,
+            submissionId: surveySubmissionId,
+            completed: isSurveyCompleted,
+            ...!isUndefined(surveyLanguage) && {
+                surveyLanguage
+            },
+            ...!isUndefined(questionSnapshots) && {
+                questionSnapshots
+            }
+        }),
+        ...properties,
+        $set: {
+            [getSurveyInteractionProperty(survey, 'responded')]: true
+        }
+    });
+    if (isSurveyCompleted) {
+        window.dispatchEvent(new CustomEvent('PHSurveySent', {
+            detail: {
+                surveyId: survey.id
+            }
+        }));
+        posthog.client?.getExtension(FeatureFlagsCommonExtension)?.reloadFeatureFlags();
+    }
+};
+const _buildSurveyEventProperties = (event, survey, inProgressSurvey, posthog)=>({
+        [SurveyEventProperties.SURVEY_NAME]: survey.name,
+        [SurveyEventProperties.SURVEY_ID]: survey.id,
+        [SurveyEventProperties.SURVEY_ITERATION]: survey.current_iteration,
+        [SurveyEventProperties.SURVEY_ITERATION_START_DATE]: survey.current_iteration_start_date,
+        sessionRecordingUrl: getSurveyReplayUrl(posthog),
+        ...buildSurveyResponseEventProperties({
+            event,
+            survey,
+            ...!isUndefined(inProgressSurvey?.responses) && {
+                responses: inProgressSurvey.responses
+            },
+            ...!isUndefined(inProgressSurvey?.surveySubmissionId) && {
+                submissionId: inProgressSurvey.surveySubmissionId
+            },
+            ...!isUndefined(inProgressSurvey?.surveyLanguage) && {
+                surveyLanguage: inProgressSurvey.surveyLanguage
+            },
+            ...!isUndefined(inProgressSurvey?.questionSnapshots) && {
+                questionSnapshots: inProgressSurvey.questionSnapshots
+            }
+        })
+    });
+const dismissedSurveyEvent = (survey, posthog, readOnly, surveyLanguage)=>{
+    if (!posthog) return void SURVEY_LOGGER.error('[survey dismissed] event not captured, PostHog instance not found.');
+    if (readOnly) return;
+    const inProgressSurvey = getInProgressSurveyState(survey);
+    const effectiveLanguage = inProgressSurvey ? inProgressSurvey.surveyLanguage : surveyLanguage;
+    const properties = {
+        ..._buildSurveyEventProperties('dismissed', survey, inProgressSurvey, posthog),
+        ...effectiveLanguage && {
+            [SurveyEventProperties.SURVEY_LANGUAGE]: effectiveLanguage
+        },
+        $set: {
+            [getSurveyInteractionProperty(survey, 'dismissed')]: true
+        }
+    };
+    clearInProgressSurveyState(survey);
+    setSurveySeen(survey);
+    posthog.client?.capture(SurveyEventName.DISMISSED, properties);
+    window.dispatchEvent(new CustomEvent('PHSurveyClosed', {
+        detail: {
+            surveyId: survey.id
+        }
+    }));
+};
+const sendSurveyAbandonedEvent = (survey, posthog)=>{
+    if (!posthog) return void SURVEY_LOGGER.error('[survey abandoned] event not captured, PostHog instance not found.');
+    if (!posthog.client?.canCapture) return;
+    const abandonedKey = getSurveyAbandonedKey(survey);
+    try {
+        if ('true' === localStorage.getItem(abandonedKey)) return;
+    } catch  {
+        return;
+    }
+    const inProgressSurvey = getInProgressSurveyState(survey);
+    if (!inProgressSurvey) return;
+    try {
+        localStorage.setItem(abandonedKey, 'true');
+    } catch  {}
+    posthog.client?.capture(SurveyEventName.ABANDONED, _buildSurveyEventProperties('abandoned', survey, inProgressSurvey, posthog), {
+        delivery: 'unload'
+    });
+};
+const reverseIfUnshuffled = (unshuffled, shuffled)=>{
+    if (unshuffled.length === shuffled.length && unshuffled.every((val, index)=>val === shuffled[index])) return shuffled.reverse();
+    return shuffled;
+};
+const hasBranching = (survey)=>survey.questions.some((question)=>!!question.branching?.type);
+const restorePersistedOrder = (survey, questionOrder)=>{
+    if (!questionOrder || questionOrder.length !== survey.questions.length) return null;
+    const questionsById = new Map(survey.questions.map((question)=>[
+            question.id,
+            question
+        ]));
+    const restored = [];
+    for (const id of questionOrder){
+        const question = questionsById.get(id);
+        if (!question) return null;
+        restored.push(question);
+    }
+    return restored;
+};
+const getQuestionOrder = (questions)=>{
+    const ids = questions.map((question)=>question.id);
+    return ids.every((id)=>!!id) ? ids : void 0;
+};
+const getDisplayOrderQuestions = (survey, inProgressState)=>{
+    if (hasBranching(survey)) return survey.questions;
+    if (inProgressState) return restorePersistedOrder(survey, inProgressState.questionOrder) ?? survey.questions;
+    if (!survey.appearance || !survey.appearance.shuffleQuestions || survey.enable_partial_responses) return survey.questions;
+    return reverseIfUnshuffled(survey.questions, shuffle(survey.questions));
+};
+const canActivateRepeatedly = (survey)=>canSurveyActivateRepeatedly(survey) || isSurveyInProgress(survey);
+const getSurveySeen = (survey)=>{
+    let surveySeen = null;
+    try {
+        surveySeen = localStorage.getItem(getSurveySeenKey(survey));
+    } catch (error) {
+        SURVEY_LOGGER.error('localStorage error: ' + error);
+    }
+    if (surveySeen) return !canActivateRepeatedly(survey);
+    return false;
+};
+const LAST_SEEN_SURVEY_DATE_KEY = 'lastSeenSurveyDate';
+const hasWaitPeriodPassed = (waitPeriodInDays)=>{
+    let lastSeenSurveyDate = null;
+    try {
+        lastSeenSurveyDate = localStorage.getItem(LAST_SEEN_SURVEY_DATE_KEY);
+    } catch (error) {
+        SURVEY_LOGGER.error('localStorage error: ' + error);
+    }
+    return hasPeriodPassed(waitPeriodInDays, lastSeenSurveyDate);
+};
+const SurveyContext = createContext({
+    isPreviewMode: false,
+    previewPageIndex: 0,
+    onPopupSurveyDismissed: ()=>{},
+    isPopup: true,
+    onPreviewSubmit: ()=>{},
+    onPreviewBack: ()=>{},
+    surveySubmissionId: '',
+    properties: void 0,
+    surveyLanguage: null
+});
+const useSurveyContext = ()=>useContext(SurveyContext);
+const renderChildrenAsTextOrHtml = ({ component, children, renderAsHtml, style })=>renderAsHtml ? cloneElement(component, {
+        dangerouslySetInnerHTML: {
+            __html: children
+        },
+        style
+    }) : cloneElement(component, {
+        children,
+        style
+    });
+function defaultMatchType(matchType) {
+    return matchType ?? 'icontains';
+}
+function doesSurveyUrlMatch(survey, posthog) {
+    if (!survey.conditions?.url) return true;
+    const href = getTargetingUrl(posthog) ?? ("u" > typeof window ? window.location.href : void 0);
+    if (!href) return false;
+    const targets = [
+        survey.conditions.url
+    ];
+    const matchType = defaultMatchType(survey.conditions?.urlMatchType);
+    return propertyComparisons[matchType](targets, [
+        href
+    ]);
+}
+function doesSurveyDeviceTypesMatch(survey) {
+    return doesDeviceTypeMatch(survey.conditions?.deviceTypes, survey.conditions?.deviceTypesMatchType);
+}
+function doesSurveyMatchSelector(survey) {
+    if (!survey.conditions?.selector) return true;
+    return !!document?.querySelector(survey.conditions.selector);
+}
+const getInProgressSurveyStateKey = (survey)=>getSurveyStorageKey(SURVEY_IN_PROGRESS_PREFIX, survey);
+const inMemoryInProgressSurveyState = {};
+const clearAllInMemoryInProgressSurveyState = ()=>{
+    for (const key of Object.keys(inMemoryInProgressSurveyState))delete inMemoryInProgressSurveyState[key];
+};
+const setInProgressSurveyState = (survey, state)=>{
+    const key = getInProgressSurveyStateKey(survey);
+    try {
+        localStorage.setItem(key, JSON.stringify(state));
+        delete inMemoryInProgressSurveyState[key];
+    } catch (e) {
+        SURVEY_LOGGER.error('Error setting in-progress survey state in localStorage', e);
+        inMemoryInProgressSurveyState[key] = state;
+    }
+};
+const getInProgressSurveyState = (survey)=>{
+    const key = getInProgressSurveyStateKey(survey);
+    const inMemoryState = inMemoryInProgressSurveyState[key];
+    if (inMemoryState) return inMemoryState;
+    try {
+        const stateString = localStorage.getItem(key);
+        if (stateString) return JSON.parse(stateString);
+    } catch (e) {
+        SURVEY_LOGGER.error('Error getting in-progress survey state from localStorage', e);
+    }
+    return null;
+};
+const isSurveyInProgress = (survey)=>{
+    const state = getInProgressSurveyState(survey);
+    return !isNullish(state?.surveySubmissionId);
+};
+const clearInProgressSurveyState = (survey)=>{
+    const key = getInProgressSurveyStateKey(survey);
+    delete inMemoryInProgressSurveyState[key];
+    try {
+        localStorage.removeItem(key);
+    } catch (e) {
+        SURVEY_LOGGER.error('Error clearing in-progress survey state from localStorage', e);
+    }
+};
+function getSurveyContainerClass(survey, asSelector = false) {
+    const className = `PostHogSurvey-${survey.id}`;
+    return asSelector ? `.${className}` : className;
+}
+function getPopoverPosition(type, position = SurveyPosition.Right, surveyWidgetType) {
+    if (type === SurveyType.ExternalSurvey) return {};
+    switch(position){
+        case SurveyPosition.TopLeft:
+            return {
+                top: '0',
+                left: '0',
+                transform: 'translate(30px, 30px)'
+            };
+        case SurveyPosition.TopRight:
+            return {
+                top: '0',
+                right: '0',
+                transform: 'translate(-30px, 30px)'
+            };
+        case SurveyPosition.TopCenter:
+            return {
+                top: '0',
+                left: '50%',
+                transform: 'translate(-50%, 30px)'
+            };
+        case SurveyPosition.MiddleLeft:
+            return {
+                top: '50%',
+                left: '0',
+                transform: 'translate(30px, -50%)'
+            };
+        case SurveyPosition.MiddleRight:
+            return {
+                top: '50%',
+                right: '0',
+                transform: 'translate(-30px, -50%)'
+            };
+        case SurveyPosition.MiddleCenter:
+            return {
+                top: '50%',
+                left: '50%',
+                transform: 'translate(-50%, -50%)'
+            };
+        case SurveyPosition.Left:
+            return {
+                left: '30px'
+            };
+        case SurveyPosition.Center:
+            return {
+                left: '50%',
+                transform: 'translateX(-50%)'
+            };
+        default:
+        case SurveyPosition.Right:
+            return {
+                right: type === SurveyType.Widget && surveyWidgetType === SurveyWidgetType.Tab ? '60px' : '30px'
+            };
+    }
+}
+export { SurveyContext, addSurveyCSSVariablesToElement, canActivateRepeatedly, clearAllInMemoryInProgressSurveyState, clearInProgressSurveyState, defaultSurveyAppearance, dismissedSurveyEvent, doesSurveyDeviceTypesMatch, doesSurveyMatchSelector, doesSurveyUrlMatch, getContrastingTextColor, getDisplayOrderChoices, getDisplayOrderQuestions, getFontFamily, getInProgressSurveyState, getPopoverPosition, getQuestionOrder, getSurveyContainerClass, getSurveyResponseKey, getSurveySeen, getSurveyStylesheet, hasWaitPeriodPassed, hex2rgb, hexToRgba, isSurveyInProgress, renderChildrenAsTextOrHtml, retrieveSurveyShadow, sendSurveyAbandonedEvent, sendSurveyEvent, setInProgressSurveyState, shuffle, useSurveyContext };

package/dist/surveys-config.d.ts

@@ -0,0 +1,60 @@
+import type { Properties } from '@posthog/types';
+import type { Survey, SurveyCallback, DisplaySurveyPopoverOptions } from './types/surveys';
+export declare const SURVEYS = "$surveys";
+export declare const SURVEYS_LOADED_AT = "$surveys_loaded_at";
+export declare const SURVEYS_CACHE_TTL_MS: number;
+export declare const SURVEYS_REFRESH_BACKOFF_MS: number;
+export declare const LOAD_EXT_NOT_FOUND = "PostHog loadExternalDependency extension not found.";
+export interface SurveysConfig {
+    disableSurveys: boolean;
+    cookielessMode: boolean;
+    advancedEnableSurveys: boolean;
+    requestTimeoutMs: number;
+    prefillFromUrl?: boolean | undefined;
+    automaticDisplay?: boolean | undefined;
+    featureFlagEvaluation?: boolean | undefined;
+    overrideLanguage?: string | null | undefined;
+    uiHost?: string | undefined;
+    get_current_url?: ((url: string) => string) | undefined;
+    prepareStylesheet?: ((stylesheet: HTMLStyleElement) => HTMLStyleElement | null) | undefined;
+}
+/** Rendering and eligibility operations used by the surveys lifecycle. */
+export interface SurveysManager {
+    clearInMemoryInProgressSurveyState?(): void;
+    getActiveMatchingSurveys(callback: SurveyCallback, forceReload?: boolean): void;
+    checkSurveyEligibility(survey: Survey): {
+        eligible: boolean;
+        reason?: string | undefined;
+    };
+    checkSurveyRenderability(survey: Survey): {
+        eligible: boolean;
+        reason?: string | undefined;
+    };
+    renderSurvey(survey: Survey, element: Element, properties?: Properties): void;
+    handlePopoverSurvey(survey: Survey, options?: DisplaySurveyPopoverOptions): void;
+    cancelSurvey(surveyId: string): void;
+    handlePageUnload?(): void;
+    startAutomaticDisplay?(): void;
+    dispose?(): void;
+}
+/** Trigger state owned by the host's event/action receiver. */
+export interface SurveysEventReceiver {
+    register(surveys: Survey[]): void;
+    replace(surveys: Survey[]): void;
+    reset(): void;
+    dispose(): void;
+    getSurveys(): string[];
+    getActivationTimestamp(surveyId: string): number | undefined;
+}
+export interface SurveysExtensionHost {
+    generateSurveys?: ((isSurveysEnabled: boolean) => SurveysManager) | undefined;
+    loadExternalDependency?: ((callback: (error?: unknown) => void) => void) | undefined;
+}
+export interface SurveysConfigSource {
+    get(): Readonly<SurveysConfig>;
+    getExtensions(): SurveysExtensionHost | undefined;
+    onMatchingConditionsChanged?(callback: () => void): () => void;
+}
+export declare const SURVEYS_ACTIVATED = "$surveys_activated";
+export declare const SURVEYS_ACTIVATED_SESSION = "$surveys_activated_session";
+export declare const SURVEYS_ACTIVATED_TIMESTAMPS = "$surveys_activated_timestamps";