@hhgtech/hhg-components 1.29.539 → 1.29.540

package/build/{transform-73cee9bd.js → transform-7b92856c.js}

@@ -1,68 +1,68 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-f69eecff.js');
+var tslib_es6 = require('./tslib.es6-013bd4e3.js');
 var React = require('react');
-var index$4 = require('./index-6a36d6ed.js');
+var index$4 = require('./index-25eadff1.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-var index$6 = require('./index-e01cefde.js');
-require('./index-96518f17.js');
-var index$a = require('./index-3e6f73bf.js');
-require('./index-08dbe8c9.js');
-var index$2 = require('./index-b26310a7.js');
-var index$g = require('./index-3a17b572.js');
-var index$e = require('./index-cc53557f.js');
-require('./index.styles-30554d5b.js');
-require('./translationsContext-f163c180.js');
+var index$6 = require('./index-2d40ddb9.js');
+require('./index-3dc5f860.js');
+var index$a = require('./index-94ccc312.js');
+require('./index-828c8a0e.js');
+var index$2 = require('./index-112161ad.js');
+var index$g = require('./index-2d97b370.js');
+var index$e = require('./index-91517a02.js');
+require('./index.styles-585b1fb1.js');
+require('./translationsContext-55e611dd.js');
 var hooks = require('@mantine/hooks');
-var utils = require('./utils-8ba2afed.js');
-require('./index-c0ab322f.js');
-var SiteWideBanner = require('./SiteWideBanner-f5b1366b.js');
+var utils = require('./utils-7ce29aa4.js');
+require('./index-4662498f.js');
+var SiteWideBanner = require('./SiteWideBanner-316c186d.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var index$3 = require('./index-11746412.js');
+var index$3 = require('./index-a2b022b1.js');
 var dateFns = require('date-fns');
 var DayPickerInput = require('react-day-picker/DayPickerInput');
-var index$5 = require('./index-d9eaccab.js');
+var index$5 = require('./index-9f1f35ed.js');
 var throttle = require('lodash/throttle');
 var parse = require('html-react-parser');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
-var useOutsideClick = require('./useOutsideClick-c407d186.js');
+var useOutsideClick = require('./useOutsideClick-f4defd63.js');
 var enUS = require('date-fns/locale/en-US');
 var id = require('date-fns/locale/id');
 var vi = require('date-fns/locale/vi');
 var zhTW = require('date-fns/locale/zh-TW');
-var index$9 = require('./index-8cc2d533.js');
-var index$7 = require('./index-740da507.js');
-var index$8 = require('./index-3fd6fbaf.js');
+var index$9 = require('./index-1da9cfd2.js');
+var index$7 = require('./index-c4d9dada.js');
+var index$8 = require('./index-634b3738.js');
 var classNames = require('classnames');
-var index$b = require('./index-045b7d90.js');
+var index$b = require('./index-572143c9.js');
 var miscGetSocialList = require('./miscGetSocialList.js');
-var index$d = require('./index-539432c2.js');
-var index$c = require('./index-9119be36.js');
-var index$h = require('./index-1124e908.js');
-var index$i = require('./index-4244f0ea.js');
-var dataTransform = require('./dataTransform-4a0f7576.js');
+var index$d = require('./index-e7d362d0.js');
+var index$c = require('./index-4b86dedd.js');
+var index$h = require('./index-abb1f286.js');
+var index$i = require('./index-5147f711.js');
+var dataTransform = require('./dataTransform-df0064ae.js');
 var togetherApiPaths = require('./togetherApiPaths.js');
-var togetherComponentGlobalContext = require('./utils-84c4a27d.js');
+var togetherComponentGlobalContext = require('./utils-0565614b.js');
 var innertext = require('innertext');
-var Locale = require('./Locale-6880b670.js');
-var index$f = require('./index-8738c4ae.js');
-var constants = require('./constants-d60c6682.js');
+var Locale = require('./Locale-df39a3a9.js');
+var index$f = require('./index-345f9dd4.js');
+var constants = require('./constants-6b667238.js');
 var dayjs = require('dayjs');
 var moleculesArticleCard = require('./moleculesArticleCard.js');
 var uuid = require('uuid');
 var arrow = require('@hhgtech/icons/arrow');
 var other = require('@hhgtech/icons/other');
 var Lottie = require('lottie-light-react');
-var index$j = require('./index-79feeb5b.js');
-var index$k = require('./index-fb6f4fd3.js');
+var index$j = require('./index-beb41c97.js');
+var index$k = require('./index-ff2ce518.js');
 var get = require('lodash/get');
 var debounce = require('lodash/debounce');
-var index$l = require('./index-0f295a50.js');
+var index$l = require('./index-d66308dc.js');
 var carousel = require('@mantine/carousel');
-var constants$1 = require('./constants-190178e7.js');
+var constants$1 = require('./constants-0c322c9a.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{translationsProvider-3c4e6953.js → translationsProvider-9a001c79.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var translationsContext = require('./translationsContext-f163c180.js');
+var translationsContext = require('./translationsContext-55e611dd.js');
 var i18nValues_enPH = require('./i18n-values/en-PH.js');
 var i18nValues_hiIN = require('./i18n-values/hi-IN.js');
 var i18nValues_idID = require('./i18n-values/id-ID.js');

package/build/{treePopoverMenu-df48c936.js → treePopoverMenu-0ed31434.js}

@@ -1,31 +1,31 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-f69eecff.js');
+var tslib_es6 = require('./tslib.es6-013bd4e3.js');
 var React = require('react');
-var index = require('./index-3fd6fbaf.js');
-var index$3 = require('./index-efb80488.js');
-require('./index-6a36d6ed.js');
+var index = require('./index-634b3738.js');
+var index$3 = require('./index-c0decf6a.js');
+require('./index-25eadff1.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-var index$4 = require('./index-e01cefde.js');
-require('./index-96518f17.js');
-require('./index-3e6f73bf.js');
-require('./index-08dbe8c9.js');
-var index$2 = require('./index-b26310a7.js');
-require('./index-3a17b572.js');
+var index$4 = require('./index-2d40ddb9.js');
+require('./index-3dc5f860.js');
+require('./index-94ccc312.js');
+require('./index-828c8a0e.js');
+var index$2 = require('./index-112161ad.js');
+require('./index-2d97b370.js');
 var miscTheme = require('./miscTheme.js');
-require('./index-cc53557f.js');
-require('./index.styles-30554d5b.js');
+require('./index-91517a02.js');
+require('./index.styles-585b1fb1.js');
 require('@mantine/hooks');
-var utils = require('./utils-8ba2afed.js');
-require('./index-c0ab322f.js');
-var index$1 = require('./index-740da507.js');
-var togetherComponentGlobalContext = require('./utils-84c4a27d.js');
+var utils = require('./utils-7ce29aa4.js');
+require('./index-4662498f.js');
+var index$1 = require('./index-c4d9dada.js');
+var togetherComponentGlobalContext = require('./utils-0565614b.js');
 var dateFns = require('date-fns');
-var Locale = require('./Locale-6880b670.js');
+var Locale = require('./Locale-df39a3a9.js');
 var styled = require('@emotion/styled');
-var index$6 = require('./index-0350c39c.js');
-var index$5 = require('./index-8bab3807.js');
+var index$6 = require('./index-c7c478bc.js');
+var index$5 = require('./index-9ce5dd88.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/types.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-96518f17.js');
-var Locale = require('./Locale-6880b670.js');
+var index = require('./index-3dc5f860.js');
+var Locale = require('./Locale-df39a3a9.js');
 
 
 

package/build/{useCartCareService-f7dca065.js → useCartCareService-e7c14af5.js}

@@ -3,7 +3,7 @@
 var React = require('react');
 var zustand = require('zustand');
 var middleware = require('zustand/middleware');
-var index = require('./index-e01cefde.js');
+var index = require('./index-2d40ddb9.js');
 
 const useIsInit = () => {
     const [isInit, setIsInit] = React.useState(true);

package/build/{useHealthToolCache-f12a0e82.js → useHealthToolCache-6f8a7565.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-f69eecff.js');
+var tslib_es6 = require('./tslib.es6-013bd4e3.js');
 var React = require('react');
 var miscGetDynamicHealthTool = require('./miscGetDynamicHealthTool.js');
 

package/build/{usePhoneValidator-e74c4e7e.js → usePhoneValidator-bc77c291.js}

@@ -1,12 +1,12 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-f69eecff.js');
+var tslib_es6 = require('./tslib.es6-013bd4e3.js');
 var React = require('react');
 var miscCookieHelper = require('./miscCookieHelper.js');
-var useUniqueId = require('./useUniqueId-8c338e50.js');
-require('./index-96518f17.js');
-var index = require('./index-3fd6fbaf.js');
-var Locale = require('./Locale-6880b670.js');
+var useUniqueId = require('./useUniqueId-5055ba59.js');
+require('./index-3dc5f860.js');
+var index = require('./index-634b3738.js');
+var Locale = require('./Locale-df39a3a9.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/build/{usePlacesAutocomplete-7a8daa58.js → usePlacesAutocomplete-8ba1a1c5.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-f69eecff.js');
+var tslib_es6 = require('./tslib.es6-013bd4e3.js');
 var React = require('react');
 
 const formatAutoCompleteAddress = (addresses) => {

package/build/useTogetherAuthRequiredAction.js

@@ -4,23 +4,23 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var miscCookieHelper = require('./miscCookieHelper.js');
-var store = require('./store-ca3305fb.js');
-var togetherComponentGlobalContext = require('./utils-84c4a27d.js');
-var constants = require('./constants-d60c6682.js');
-require('./tslib.es6-f69eecff.js');
+var store = require('./store-51c2c500.js');
+var togetherComponentGlobalContext = require('./utils-0565614b.js');
+var constants = require('./constants-6b667238.js');
+require('./tslib.es6-013bd4e3.js');
 require('zustand');
-require('./index-de12a847.js');
+require('./index-5a0369db.js');
 require('./constantsIsProduction.js');
-require('./normalizeLink-5099e9b5.js');
+require('./normalizeLink-7918a385.js');
 require('./constantsDomainLocales.js');
-require('./Locale-6880b670.js');
-require('./index-e01cefde.js');
+require('./Locale-df39a3a9.js');
+require('./index-2d40ddb9.js');
 require('date-fns/locale');
-require('./index-96518f17.js');
+require('./index-3dc5f860.js');
 require('./constantsSite.js');
 require('./constantsRiskScreener.js');
 require('react-phone-number-input');
-require('./index-a6dd4a11.js');
+require('./index-50917a1e.js');
 require('slugify');
 require('string-format');
 require('./togetherApiPaths.js');

package/build/{utils-84c4a27d.js → utils-0565614b.js}

@@ -1,14 +1,14 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-f69eecff.js');
-var index = require('./index-a6dd4a11.js');
+var tslib_es6 = require('./tslib.es6-013bd4e3.js');
+var index = require('./index-50917a1e.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
 var slugify = require('slugify');
 var constantsIsProduction = require('./constantsIsProduction.js');
 var formatString = require('string-format');
 var React = require('react');
 var togetherApiPaths = require('./togetherApiPaths.js');
-var constants = require('./constants-d60c6682.js');
+var constants = require('./constants-6b667238.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{utils-8f2896fa.js → utils-1287893e.js}

@@ -1,11 +1,11 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-e01cefde.js');
+var index = require('./index-2d40ddb9.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var utils = require('./utils-8ba2afed.js');
+var utils = require('./utils-7ce29aa4.js');
 var Skeleton = require('react-loading-skeleton');
 var formatString = require('string-format');
 var constantsDomainLocales = require('./constantsDomainLocales.js');

package/build/{utils-914fec69.js → utils-28dee61e.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-require('./index-96518f17.js');
-var Locale = require('./Locale-6880b670.js');
+require('./index-3dc5f860.js');
+var Locale = require('./Locale-df39a3a9.js');
 
 // https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2
 const MAPPED_LOCALE = {

package/build/{utils-be44f579.js → utils-3fefa6a3.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var healthTools = require('./healthTools-895677c3.js');
-var index = require('./index-de12a847.js');
-var store = require('./store-ca3305fb.js');
-var index$1 = require('./index-96518f17.js');
-var Locale = require('./Locale-6880b670.js');
+var healthTools = require('./healthTools-65d8e2a8.js');
+var index = require('./index-5a0369db.js');
+var store = require('./store-51c2c500.js');
+var index$1 = require('./index-3dc5f860.js');
+var Locale = require('./Locale-df39a3a9.js');
 
 const isFeatureWhatsAppEnabled = [
     Locale.LOCALE.Indonesia,

package/build/{utils-7bfd0e41.js → utils-f7df4d96.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var constants$1 = require('./constants-e0f9645c.js');
-require('./index-e01cefde.js');
-var index = require('./index-96518f17.js');
+var constants$1 = require('./constants-77b140a6.js');
+require('./index-2d40ddb9.js');
+var index = require('./index-3dc5f860.js');
 var formatString = require('string-format');
-var constants = require('./constants-190178e7.js');
+var constants = require('./constants-0c322c9a.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/vaccination.js

@@ -2,42 +2,42 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-f69eecff.js');
+var tslib_es6 = require('./tslib.es6-013bd4e3.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index$5 = require('./index-6a36d6ed.js');
+var index$5 = require('./index-25eadff1.js');
 require('@mantine/dates');
-require('./index-e01cefde.js');
-var index$7 = require('./index-96518f17.js');
-require('./index-3e6f73bf.js');
-var index$3 = require('./index-08dbe8c9.js');
-var index$2 = require('./index-b26310a7.js');
-var index$1 = require('./index-3a17b572.js');
+require('./index-2d40ddb9.js');
+var index$7 = require('./index-3dc5f860.js');
+require('./index-94ccc312.js');
+var index$3 = require('./index-828c8a0e.js');
+var index$2 = require('./index-112161ad.js');
+var index$1 = require('./index-2d97b370.js');
 var miscTheme = require('./miscTheme.js');
-require('./index-cc53557f.js');
-require('./index.styles-30554d5b.js');
-var index = require('./index-3fd6fbaf.js');
+require('./index-91517a02.js');
+require('./index.styles-585b1fb1.js');
+var index = require('./index-634b3738.js');
 var hooks = require('@mantine/hooks');
-var utils = require('./utils-8ba2afed.js');
-require('./index-c0ab322f.js');
+var utils = require('./utils-7ce29aa4.js');
+require('./index-4662498f.js');
 var styled = require('@emotion/styled');
-var index$4 = require('./index-f34c95b8.js');
-require('./translationsContext-f163c180.js');
+var index$4 = require('./index-0ffcf0bc.js');
+require('./translationsContext-55e611dd.js');
 var other = require('@hhgtech/icons/other');
-var index$6 = require('./index-740da507.js');
-var index$8 = require('./index-4244f0ea.js');
+var index$6 = require('./index-c4d9dada.js');
+var index$8 = require('./index-5147f711.js');
 var form = require('@mantine/form');
 var dayjs = require('dayjs');
 var customParseFormat = require('dayjs/plugin/customParseFormat');
-var index$a = require('./index-08d1e419.js');
-var index$9 = require('./index-0350c39c.js');
+var index$a = require('./index-77852a6c.js');
+var index$9 = require('./index-c7c478bc.js');
 require('@mantine/carousel');
-require('./shared-4258d7ff.js');
+require('./shared-f8a229fc.js');
 require('classnames');
 require('uuid');
-require('./useUniqueId-8c338e50.js');
+require('./useUniqueId-5055ba59.js');
 require('./constantsSite.js');
-require('./Locale-6880b670.js');
+require('./Locale-df39a3a9.js');
 require('@emotion/react');
 require('@hhgtech/icons/core');
 require('date-fns/locale');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hhgtech/hhg-components",
-  "version": "1.29.539",
+  "version": "1.29.540",
   "main": "build/index.js",
   "module": "build/esm/index.js",
   "files": [

package/build/esm/index-c2cf902b.js

@@ -1,225 +0,0 @@
-import { a as __awaiter } from './tslib.es6-f0d09e2c.js';
-import React__default, { useState, useEffect, useRef, useContext, useMemo } from 'react';
-import { Box, useMantineTheme } from '@mantine/core';
-import { I as ImageWrap } from './index-8a721ff4.js';
-import { T as TogetherComponentGlobalContext, c as callApi, f as getApiPath } from './utils-8841c559.js';
-import styled from '@emotion/styled';
-import { PATHS } from './togetherApiPaths.js';
-import { a as DEFAULT_IMG } from './constants-27ab1ac9.js';
-import { y as youtubeVidIdGetter } from './post-552f19bf.js';
-import { L as Loading } from './index-9214d6d0.js';
-
-const StyledSocialLinkPreview = styled.div `
-  .link-info-container {
-    padding: 0.5rem 1rem;
-    background: ${(props) => props.color || '#f4faff'};
-  }
-  .link-image-wrapper {
-    position: relative;
-    overflow: hidden;
-    width: 100%;
-    padding-top: 56.25%;
-    &.fetching {
-      background: lightgray;
-    }
-    .loading-spinner {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-    }
-    .link-image {
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
-      object-position: center;
-    }
-  }
-  a {
-    text-decoration: none;
-  }
-  &[data-is-marrybaby='true'] {
-    overflow: hidden;
-    border-radius: 1rem;
-  }
-`;
-
-const useExternalScript = ({ url, onLoad, onError }) => {
-    const [state, setState] = useState(url ? 'loading' : 'idle');
-    useEffect(() => {
-        if (!url) {
-            setState('idle');
-            return;
-        }
-        let script = document.querySelector(`script[src="${url}"]`);
-        const handleLoadScript = () => {
-            setState('ready');
-            onLoad === null || onLoad === void 0 ? void 0 : onLoad();
-        };
-        const handleErrorScript = () => {
-            setState('error');
-            onError === null || onError === void 0 ? void 0 : onError();
-        };
-        if (!script) {
-            script = document.createElement('script');
-            script.type = 'application/javascript';
-            script.src = url;
-            script.async = true;
-            document.body.appendChild(script);
-            script.addEventListener('load', handleLoadScript);
-            script.addEventListener('error', handleErrorScript);
-        }
-        script.addEventListener('load', handleLoadScript);
-        script.addEventListener('error', handleErrorScript);
-        return () => {
-            script.removeEventListener('load', handleLoadScript);
-            script.removeEventListener('error', handleErrorScript);
-        };
-    }, [url]);
-    return state;
-};
-
-const YoutubePlyr = ({ id, autoplay }) => {
-    const ref = useRef(null);
-    const state = useExternalScript({ url: 'https://cdn.plyr.io/3.7.8/plyr.js' });
-    useEffect(() => {
-        if (!document.getElementById('hhg-plyr-player')) {
-            const link = document.createElement('link');
-            link.rel = 'stylesheet';
-            link.type = 'text/css';
-            link.href = 'https://cdn.plyr.io/3.7.8/plyr.css';
-            link.id = 'hhg-plyr-player';
-            document.head.appendChild(link);
-        }
-        if (state === 'ready' || typeof Plyr !== 'undefined') {
-            new Plyr(ref.current.querySelector('[data-id="player"]'), {
-                autoplay,
-                muted: true,
-            });
-        }
-    }, [state]);
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(Box, { ref: ref, sx: {
-                position: 'absolute',
-                top: 0,
-                left: 0,
-                right: 0,
-                bottom: 0,
-                backgroundColor: '#000',
-                '&, > div': {
-                    width: '100%',
-                    height: '100%',
-                },
-            } },
-            React__default.createElement("div", { "data-id": "player" },
-                React__default.createElement("iframe", { width: "100%", height: "100%", src: `https://www.youtube.com/embed/${id}?&mute=1&enablejsapi=1&rel=0`, allowFullScreen: true, frameBorder: "0" })))));
-};
-
-const SocialLinkPreview = ({ url, image, className, style, baseUrl = '', autoPlay = true, onPushStatus, }) => {
-    const { data: { locale }, } = useContext(TogetherComponentGlobalContext);
-    const [previewData, setPreviewData] = useState(null);
-    useEffect(() => {
-        (() => __awaiter(void 0, void 0, void 0, function* () {
-            if (image)
-                return;
-            if (!url)
-                return setPreviewData(null);
-            setPreviewData((_data) => (Object.assign(Object.assign({}, _data), { isFetching: true })));
-            // fetch('./api/fetch-meta?url=' + encodeURIComponent(url))
-            //   .then((res) => res.json())
-            //   .then((res) =>
-            //     setPreviewData({
-            //       url,
-            //       image: res?.image || res?.logo,
-            //     }),
-            //   )
-            callApi(getApiPath(PATHS.FETCH_PREVIEW, {
-                _locale: locale,
-            }, undefined, baseUrl), 'POST', {
-                data: {
-                    link: url,
-                },
-                headers: {
-                    'Content-Type': 'application/json',
-                },
-            }, !!baseUrl)
-                .then((res) => {
-                var _a, _b;
-                setPreviewData({
-                    url,
-                    image: ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.image) || ((_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.logo),
-                });
-            })
-                .catch(() => {
-                setPreviewData(null);
-            });
-        }))();
-    }, [url, image]);
-    const displayImage = image || (previewData === null || previewData === void 0 ? void 0 : previewData.image);
-    const displayUrl = (previewData === null || previewData === void 0 ? void 0 : previewData.url) || url;
-    const youtubeVidId = useMemo(() => {
-        return youtubeVidIdGetter(displayUrl);
-    }, [displayUrl]);
-    const facebookVidId = useMemo(() => {
-        return (displayUrl.includes('facebook.com') || displayUrl.includes('fb.watch'));
-    }, [displayUrl]);
-    const responsiveWidth = useRef(0);
-    const responsiveHeight = useRef(0);
-    const [forceRerenderFB, setForceRerenderFB] = useState(false);
-    // FACEBOOK Video is not responsive for desktop browser
-    // => hack: set size to same as container, if size change too large, re-render facebook iframe with new config
-    useEffect(() => {
-        const handleResize = () => {
-            var _a;
-            const containerRect = (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
-            let toChangeSize = false;
-            if (containerRect &&
-                (!responsiveWidth.current ||
-                    Math.abs((responsiveWidth.current - containerRect.width) /
-                        (containerRect === null || containerRect === void 0 ? void 0 : containerRect.width)) > 0.2)) {
-                responsiveWidth.current = Math.floor(containerRect.width);
-                toChangeSize = true;
-            }
-            if (containerRect &&
-                (!responsiveHeight.current ||
-                    Math.abs((responsiveHeight.current - containerRect.height) /
-                        (containerRect === null || containerRect === void 0 ? void 0 : containerRect.height)) > 0.2)) {
-                responsiveHeight.current = Math.floor(containerRect.height);
-                toChangeSize = true;
-            }
-            if (toChangeSize) {
-                setForceRerenderFB((v) => !v);
-            }
-        };
-        handleResize();
-        window.addEventListener('resize', handleResize, {
-            passive: true,
-        });
-        return () => {
-            window.removeEventListener('resize', handleResize);
-        };
-    }, []);
-    useEffect(() => {
-        if ((previewData === null || previewData === void 0 ? void 0 : previewData.image) && (previewData === null || previewData === void 0 ? void 0 : previewData.url)) {
-            onPushStatus === null || onPushStatus === void 0 ? void 0 : onPushStatus(true);
-        }
-    }, [previewData]);
-    const containerRef = useRef(null);
-    const _theme = useMantineTheme();
-    return (React__default.createElement(StyledSocialLinkPreview, { className: `${className} no-replace-click`, style: style, ref: containerRef, color: _theme.colors[_theme.primaryColor][0] }, !image && (youtubeVidId || facebookVidId) ? (React__default.createElement("div", { className: "link-image-wrapper" }, youtubeVidId ? (React__default.createElement(YoutubePlyr, { id: youtubeVidId, autoplay: autoPlay })) : facebookVidId ? (React__default.createElement("iframe", { key: String(forceRerenderFB), src: `https://www.facebook.com/plugins/video.php?href=${encodeURIComponent(displayUrl)}&autoplay=${autoPlay ? 1 : 0}&show_text=false&t=0&width=${responsiveWidth.current}&height=${responsiveHeight.current}`, style: {
-            position: 'absolute',
-            top: '50%',
-            left: '50%',
-            border: 'none',
-            overflow: 'hidden',
-            height: responsiveHeight.current,
-            width: responsiveWidth.current,
-            transform: 'translate(-50%, -50%)',
-        }, scrolling: "no", frameBorder: "0", allowFullScreen: true, allow: "autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share", loading: "lazy" })) : null)) : (React__default.createElement("a", { href: displayUrl, target: "_blank", rel: "noreferrer" },
-        React__default.createElement("div", { className: `link-image-wrapper ${(previewData === null || previewData === void 0 ? void 0 : previewData.isFetching) ? 'fetching' : ''}` }, (previewData === null || previewData === void 0 ? void 0 : previewData.isFetching) ? (React__default.createElement(Loading, { className: "loading-spinner" })) : (React__default.createElement(ImageWrap, { className: "link-image", src: displayImage || DEFAULT_IMG, backupSrc: DEFAULT_IMG, alt: displayUrl })))))));
-};
-
-export { SocialLinkPreview as S };