@hhgtech/hhg-components 1.29.349-beta-2 → 1.29.350

package/build/esm/index-c52fbd75.js

@@ -0,0 +1,225 @@
+import { a as __awaiter } from './tslib.es6-3d0d57aa.js';
+import React__default, { useState, useEffect, useRef, useContext, useMemo } from 'react';
+import { Box, useMantineTheme } from '@mantine/core';
+import { I as ImageWrap } from './useScreenSize-11fc92d3.js';
+import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath } from './utils-1af61383.js';
+import styled from '@emotion/styled';
+import { PATHS } from './togetherApiPaths.js';
+import { D as DEFAULT_IMG } from './constants-e3bf1dcd.js';
+import { y as youtubeVidIdGetter } from './post-25e22605.js';
+import { L as Loading } from './index-eda053dd.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 };

package/build/esm/{index-bd5c1be3.js → index-c82dce54.js}

@@ -1,27 +1,27 @@
 import React__default from 'react';
-import { C as Container } from './index-81d8a522.js';
+import { C as Container } from './index-c4b2f711.js';
 import dayjs from 'dayjs';
-import './index-2cc0d391.js';
-import './index-91771376.js';
+import './index-8a3797fe.js';
+import './index-1ff60d24.js';
 import { Flex, Stack, Box } from '@mantine/core';
 import '@mantine/dates';
-import './index-8071431d.js';
-import './index-86c5c2a0.js';
-import './useMantineLocale-4f902908.js';
-import { T as Text } from './index-43de00be.js';
-import './index-3b39b8a1.js';
-import './index.styles-d205a442.js';
-import './translationsContext-348395fa.js';
+import './index-7c6f1a51.js';
+import './index-76eff284.js';
+import './useMantineLocale-f17968c0.js';
+import { T as Text } from './index-2e886c27.js';
+import './index-749063ff.js';
+import './index.styles-61d70f9e.js';
+import './translationsContext-d3dcfbcf.js';
 import '@mantine/hooks';
-import { M as MediaQueries } from './utils-751f26c2.js';
-import './other-f3acbf3b.js';
-import './index-3077bc1d.js';
-import { u as useScreenSize } from './useScreenSize-85657dee.js';
+import { M as MediaQueries } from './utils-24a5fc0b.js';
+import './other-ff97cf3a.js';
+import './index-eec8b1cc.js';
+import { u as useScreenSize } from './useScreenSize-11fc92d3.js';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
 import { domainLocales } from './constantsDomainLocales.js';
-import { L as Logo } from './index-7d49189c.js';
-import { M as MarryBabyText } from './index-3a050552.js';
+import { L as Logo } from './index-64de7793.js';
+import { M as MarryBabyText } from './index-1df79247.js';
 
 const StyledFooter$1 = styled.footer `
   background-color: #1b3250;

package/build/esm/{index-ad134d53.js → index-c9d2aaa2.js}

@@ -1,35 +1,35 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-3f882546.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-3d0d57aa.js';
 import React__default, { useState, useContext, useMemo, useRef, useEffect, createContext } from 'react';
 import dayjs from 'dayjs';
-import { T as Tabs } from './index-3077bc1d.js';
-import { L as Loading } from './index-3bf1efd3.js';
-import { b as formatPost, a as formatCommunity, g as formatArticle } from './dataTransform-4df32cf8.js';
+import { T as Tabs } from './index-eec8b1cc.js';
+import { L as Loading } from './index-dcb29363.js';
+import { b as formatPost, a as formatCommunity, g as formatArticle } from './dataTransform-bda7b271.js';
 import { PATHS } from './togetherApiPaths.js';
-import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, b as callApiWithAuth } from './utils-84250289.js';
+import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, b as callApiWithAuth } from './utils-1af61383.js';
 import { Plus } from '@hhgtech/icons/core';
 import { createStyles, Anchor, Accordion, Flex, useMantineTheme } from '@mantine/core';
-import { C as CommonGAssets } from './index-86c5c2a0.js';
-import { I as ImageWrap } from './useScreenSize-85657dee.js';
-import { P as PopupExpert, d as CardAuthor, C as CardAuthor$1 } from './index-09023bd8.js';
-import { S as SocialType } from './index-8071431d.js';
-import { u as useTranslations } from './index-723ff6e9.js';
+import { C as CommonGAssets } from './index-76eff284.js';
+import { I as ImageWrap } from './useScreenSize-11fc92d3.js';
+import { P as PopupExpert, d as CardAuthor, C as CardAuthor$1 } from './index-86529a88.js';
+import { S as SocialType } from './index-7c6f1a51.js';
+import { u as useTranslations } from './index-b13ff4b9.js';
 import { theme } from './miscTheme.js';
 import { CrossLogo, ArrowDown } from '@hhgtech/icons/other';
-import { A as Anchor$1 } from './index-91771376.js';
+import { A as Anchor$1 } from './index-1ff60d24.js';
 import '@mantine/dates';
-import './index-2cc0d391.js';
-import './useMantineLocale-4f902908.js';
-import { T as Text } from './index-43de00be.js';
-import { B as Button } from './index-3b39b8a1.js';
-import './index.styles-d205a442.js';
+import './index-8a3797fe.js';
+import './useMantineLocale-f17968c0.js';
+import { T as Text } from './index-2e886c27.js';
+import { B as Button } from './index-749063ff.js';
+import './index.styles-61d70f9e.js';
 import '@mantine/hooks';
-import './utils-751f26c2.js';
-import './other-f3acbf3b.js';
+import './utils-24a5fc0b.js';
+import './other-ff97cf3a.js';
 import styled from '@emotion/styled';
 import { useTogetherAuthRequiredAction } from './useTogetherAuthRequiredAction.js';
-import { d as decodeMention, b as decodePostUrl } from './post-52b2f121.js';
-import { B as Button$1 } from './index-0aa4d9e8.js';
-import './translationsContext-348395fa.js';
+import { d as decodeMention, b as decodePostUrl } from './post-25e22605.js';
+import { B as Button$1 } from './index-29d67804.js';
+import './translationsContext-d3dcfbcf.js';
 
 const StyledPostContent = styled.div `
   padding: 0.5rem 1rem 1rem;

package/build/esm/{index-8566e747.js → index-ccc8a486.js}

@@ -1,6 +1,6 @@
-import { c as cookie } from './index-93f6c20b.js';
-import { d as BEARER_TOKEN_COOKIE } from './index-2cc0d391.js';
-import { N as NodeIntentType } from './index-8071431d.js';
+import { c as cookie } from './index-cc333222.js';
+import { e as BEARER_TOKEN_COOKIE } from './index-8a3797fe.js';
+import { N as NodeIntentType } from './index-7c6f1a51.js';
 import Cookies from 'js-cookie';
 import { v4 } from 'uuid';
 import { isProduction } from './constantsIsProduction.js';

package/build/esm/{index-b180d462.js → index-cd9b1e18.js}

@@ -1,23 +1,23 @@
-import { a as __awaiter } from './tslib.es6-3f882546.js';
+import { a as __awaiter } from './tslib.es6-3d0d57aa.js';
 import React__default, { useRef, useState, useMemo } from 'react';
 import { User } from '@hhgtech/icons/core';
-import { S as Spinner } from './Spinner-475df4f2.js';
-import { a as Avatar } from './index-91771376.js';
-import { B as Button } from './index-3b39b8a1.js';
-import { T as Text } from './index-43de00be.js';
-import { u as useTranslations } from './index-723ff6e9.js';
-import './index-8071431d.js';
-import { C as CommonGAssets } from './index-86c5c2a0.js';
+import { S as Spinner } from './Spinner-79a257a6.js';
+import { a as Avatar } from './index-1ff60d24.js';
+import { B as Button } from './index-749063ff.js';
+import { T as Text } from './index-2e886c27.js';
+import { u as useTranslations } from './index-b13ff4b9.js';
+import './index-7c6f1a51.js';
+import { C as CommonGAssets } from './index-76eff284.js';
 import { theme } from './miscTheme.js';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-751f26c2.js';
+import { M as MediaQueries } from './utils-24a5fc0b.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import { ProfileNavigation } from './profileNavigation.js';
 import { NavigationLogoutPopup } from './navigationLogoutPopup.js';
-import { L as LOCALE } from './Locale-3abad08e.js';
+import { L as LOCALE } from './Locale-fee93066.js';
 
 const useCSSFocusPopupHelper = (configs) => {
-    const { allowBgScroll, enableNavTarotGame = false } = configs || {};
+    const { allowBgScroll } = configs || {};
     const ref = useRef();
     return {
         containerRef: ref,
@@ -31,16 +31,9 @@ const useCSSFocusPopupHelper = (configs) => {
         },
         onButtonMouseDown: (e) => {
             // this close popup when click, run after REact init
-            const elmSiteHeader = document.querySelector('#site-header');
-            if (enableNavTarotGame && elmSiteHeader) {
-                elmSiteHeader.style.backgroundColor = '#fff';
-            }
             if (ref.current &&
                 (document.activeElement === ref.current ||
                     ref.current.contains(document.activeElement))) {
-                if (enableNavTarotGame && elmSiteHeader) {
-                    elmSiteHeader.style.backgroundColor = 'transparent';
-                }
                 ref.current.blur();
                 document.activeElement.blur();
                 e.preventDefault();

package/build/esm/{index-655dba99.js → index-cf54a904.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-3f882546.js';
+import { _ as __rest } from './tslib.es6-3d0d57aa.js';
 import React__default from 'react';
 import { Modal as Modal$1 } from '@mantine/core';
-import { u as useStyles } from './index.styles-d205a442.js';
+import { u as useStyles } from './index.styles-61d70f9e.js';
 
 const Modal = (_a) => {
     var { styles, classNames, transitionProps } = _a, rest = __rest(_a, ["styles", "classNames", "transitionProps"]);

package/build/esm/{index-bbb0c029.js → index-d3b10ec3.js}

@@ -1,6 +1,6 @@
 import React__default from 'react';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-751f26c2.js';
+import { M as MediaQueries } from './utils-24a5fc0b.js';
 import { theme } from './miscTheme.js';
 
 const StyledPopup = styled.div `

package/build/esm/{index-3fddfa7f.js → index-dc3faa75.js}

@@ -1,11 +1,11 @@
 import React__default, { useRef, useEffect } from 'react';
 import { Portal } from '@mantine/core';
-import { t as toggleNoScroll } from './utils-751f26c2.js';
+import { t as toggleNoScroll } from './utils-24a5fc0b.js';
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-9daf7ea1.js';
-import { T as Text } from './index-43de00be.js';
+import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-6a677c4c.js';
+import { T as Text } from './index-2e886c27.js';
 
 const DURATION = '600ms';
 const generateStyleBasedOnPlacement = (placement, open) => {

package/build/esm/{index-3bf1efd3.js → index-dcb29363.js}

@@ -1,6 +1,6 @@
 import React__default from 'react';
-import { u as useTranslations } from './index-723ff6e9.js';
-import { B as Button } from './index-0aa4d9e8.js';
+import { u as useTranslations } from './index-b13ff4b9.js';
+import { B as Button } from './index-29d67804.js';
 
 var styles = {"loading":"PD6nRZX"};
 

package/build/esm/{index-d898ad6e.js → index-e4677ebe.js}

@@ -1,7 +1,7 @@
 import React__default, { useState, useEffect } from 'react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { I as ImageWrap } from './useScreenSize-85657dee.js';
+import { I as ImageWrap } from './useScreenSize-11fc92d3.js';
 
 const StyledAvatar = styled.div `
   background-color: var(--background-color, transparent);

package/build/esm/{index-4dfa5af4.js → index-e95307ee.js}

@@ -1,47 +1,48 @@
-import { a as __awaiter, _ as __rest } from './tslib.es6-3f882546.js';
+import { a as __awaiter, _ as __rest } from './tslib.es6-3d0d57aa.js';
 import React__default, { useState, useRef, useEffect, useCallback, useContext, useMemo } from 'react';
 import { Info, Ask } from '@hhgtech/icons/other';
-import { D as Dropdown } from './index-f539d727.js';
-import { u as useTranslations } from './index-723ff6e9.js';
+import { D as Dropdown } from './index-7ad01fa4.js';
+import { u as useTranslations } from './index-b13ff4b9.js';
 import innertext from 'innertext';
 import { theme } from './miscTheme.js';
-import { I as Input$1 } from './index-91771376.js';
+import { I as Input$1 } from './index-1ff60d24.js';
 import { useMantineTheme, Switch, Popover } from '@mantine/core';
 import '@mantine/dates';
-import './index-2cc0d391.js';
-import './index-8071431d.js';
-import './index-86c5c2a0.js';
-import './useMantineLocale-4f902908.js';
-import { T as Text } from './index-43de00be.js';
-import { B as Button } from './index-3b39b8a1.js';
-import './index.styles-d205a442.js';
+import './index-8a3797fe.js';
+import './index-7c6f1a51.js';
+import './index-76eff284.js';
+import './useMantineLocale-f17968c0.js';
+import { T as Text } from './index-2e886c27.js';
+import { B as Button } from './index-749063ff.js';
+import './index.styles-61d70f9e.js';
 import '@mantine/hooks';
-import { M as MediaQueries } from './utils-751f26c2.js';
-import './other-f3acbf3b.js';
-import './index-3077bc1d.js';
-import { u as useImagePicker, a as PopupFrame, d as IconCloseCircle, g as getDefaultFailNoti, e as getPostFormData, f as editPost, h as createPost } from './index-c145990e.js';
-import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, p as getCurrentHref, b as callApiWithAuth, q as callApiWithAdminAuth, r as getChatbotAiApiPath } from './utils-84250289.js';
+import { M as MediaQueries } from './utils-24a5fc0b.js';
+import './other-ff97cf3a.js';
+import './index-eec8b1cc.js';
+import { u as useImagePicker, a as PopupFrame, c as IconCloseCircle, g as getDefaultFailNoti, d as getPostFormData, e as editPost, f as createPost } from './index-91981f41.js';
+import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, p as getCurrentHref, b as callApiWithAuth, q as callApiWithAdminAuth, r as getChatbotAiApiPath } from './utils-1af61383.js';
 import styled from '@emotion/styled';
-import { b as formatPost, a as formatCommunity, c as formatTopic } from './dataTransform-4df32cf8.js';
-import { M as MAX_IMAGE_UPLOADS, B as BEARER_TOKEN_COOKIE } from './constants-1ef5e1e7.js';
-import { h as highlightBadWords, f as fixMalformedMention, r as removeFontFormat, a as removeEdittedBannedWord, w as wrapAnchorAroundUrls, g as getUrlsFromEditorString, A as ALLOW_DOMAIN_URL, e as escapeRegExp, d as decodeMention, b as decodePostUrl, c as reformatUrl, i as getMentionIdsFromString, L as LIMIT_MENTION } from './post-52b2f121.js';
-import { C as CardAuthor, L as Loading$1 } from './index-09023bd8.js';
-import { S as StyledCreatePostDescription$1, R as RichTextEditor$1, I as IconLink } from './editor-317d9124.js';
-import { I as Input } from './index-d2a1a2ef.js';
+import { b as formatPost, a as formatCommunity, c as formatTopic } from './dataTransform-bda7b271.js';
+import { M as MAX_IMAGE_UPLOADS, B as BEARER_TOKEN_COOKIE } from './constants-e3bf1dcd.js';
+import { h as highlightBadWords, f as fixMalformedMention, r as removeFontFormat, a as removeEdittedBannedWord, w as wrapAnchorAroundUrls, g as getUrlsFromEditorString, A as ALLOW_DOMAIN_URL, e as escapeRegExp, d as decodeMention, b as decodePostUrl, c as reformatUrl, i as getMentionIdsFromString, L as LIMIT_MENTION } from './post-25e22605.js';
+import { C as CardAuthor } from './index-86529a88.js';
+import { S as StyledCreatePostDescription$1, R as RichTextEditor$1, I as IconLink } from './editor-ab4e1225.js';
+import { I as Input } from './index-72e7fffe.js';
 import debounce from 'lodash/debounce';
 import ContentEditable from 'react-contenteditable';
 import { PATHS, ADMIN_PATHS } from './togetherApiPaths.js';
-import { L as Loading } from './index-aba6f2df.js';
-import { C as CardLink } from './index-ded25d29.js';
-import { B as BtnChoice } from './index-5f383396.js';
-import { L as LOCALE } from './Locale-3abad08e.js';
+import { L as Loading } from './index-3e7cea05.js';
+import { C as CardLink } from './index-c15c044c.js';
+import { B as BtnChoice } from './index-590fcd6a.js';
+import { L as LOCALE } from './Locale-fee93066.js';
 import * as ReactDOM from 'react-dom';
-import { b as IconArrowLeft } from './index-2c4bc44f.js';
-import { B as Button$1 } from './index-0aa4d9e8.js';
+import { L as Loading$1 } from './index-eda053dd.js';
+import { b as IconArrowLeft } from './index-109b0adb.js';
+import { B as Button$1 } from './index-29d67804.js';
 import { getCookie } from './miscCookieHelper.js';
-import { a as useUniqueId } from './useUniqueId-a4987374.js';
-import { U as UserAvatar } from './index-cde2a194.js';
-import { P as PopoverMenu } from './index-a9cbda6e.js';
+import { a as useUniqueId } from './useUniqueId-d85246b9.js';
+import { U as UserAvatar } from './index-8468f319.js';
+import { P as PopoverMenu } from './index-4829411b.js';
 import { Close, Check } from '@hhgtech/icons/core';
 
 const StyledCreateNewPost$1 = styled.div `

package/build/esm/index-eda053dd.js

@@ -0,0 +1,54 @@
+import React__default from 'react';
+import { B as Button } from './index-29d67804.js';
+import { u as useTranslations } from './index-b13ff4b9.js';
+import { keyframes } from '@emotion/react';
+import styled from '@emotion/styled';
+import { theme } from './miscTheme.js';
+
+const StyledLoading = styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 1em;
+  button {
+    position: relative;
+  }
+`;
+const circle = keyframes `
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+`;
+styled.div `
+  display: flex;
+  width: fit-content;
+  width: -moz-fit-content;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 1rem 2rem;
+  background: white;
+  border-radius: ${theme.borderRadius};
+  box-shadow: -1px 1px 2px rgba(67, 70, 74, 0.0001),
+    -2px 2px 5px rgba(67, 86, 100, 0.123689);
+  .loading-spinner {
+    width: 24px;
+    height: 24px;
+    margin-bottom: 0.5rem;
+    animation: ${circle} 1.2s linear infinite;
+  }
+  &[data-is-marrybaby='true'] {
+    box-shadow: none;
+  }
+`;
+
+const Loading = ({ className, size = 'md' }) => {
+    const { t } = useTranslations();
+    return (React__default.createElement(StyledLoading, { className: className },
+        React__default.createElement(Button, { size: size, color: "transparent", isLoading: true }, t('loading'))));
+};
+
+export { Loading as L };

package/build/esm/{index-a1831827.js → index-ee3bb0fc.js}

@@ -1,20 +1,20 @@
-import { _ as __rest } from './tslib.es6-3f882546.js';
+import { _ as __rest } from './tslib.es6-3d0d57aa.js';
 import React__default from 'react';
-import './index-91771376.js';
+import './index-1ff60d24.js';
 import '@mantine/core';
 import '@mantine/dates';
-import './index-2cc0d391.js';
-import './index-8071431d.js';
-import './index-86c5c2a0.js';
-import './useMantineLocale-4f902908.js';
-import { T as Text$1 } from './index-43de00be.js';
-import './index-3b39b8a1.js';
-import './index.styles-d205a442.js';
-import './translationsContext-348395fa.js';
+import './index-8a3797fe.js';
+import './index-7c6f1a51.js';
+import './index-76eff284.js';
+import './useMantineLocale-f17968c0.js';
+import { T as Text$1 } from './index-2e886c27.js';
+import './index-749063ff.js';
+import './index.styles-61d70f9e.js';
+import './translationsContext-d3dcfbcf.js';
 import '@mantine/hooks';
-import './utils-751f26c2.js';
-import './other-f3acbf3b.js';
-import './index-3077bc1d.js';
+import './utils-24a5fc0b.js';
+import './other-ff97cf3a.js';
+import './index-eec8b1cc.js';
 
 /**
  * @deprecated Consider to use import { Text } from '@hhgtech/hhg-components/mantine'

package/build/esm/{index-3077bc1d.js → index-eec8b1cc.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-3f882546.js';
+import { _ as __rest } from './tslib.es6-3d0d57aa.js';
 import React__default, { useRef, useState, useEffect } from 'react';
 import { ArrowLeft, ArrowRight } from '@hhgtech/icons/other';
 import { createStyles, rem, Tabs as Tabs$1, ScrollArea } from '@mantine/core';
-import { B as Button } from './index-3b39b8a1.js';
-import { T as Text } from './index-43de00be.js';
+import { B as Button } from './index-749063ff.js';
+import { T as Text } from './index-2e886c27.js';
 
 var useStyles = createStyles((theme, params) => {
     const { variant } = params;