@hhgtech/hhg-components 1.29.88 → 1.29.89

package/build/{index-6c2d2f25.js → index-4bf6b5da.js}

@@ -1,23 +1,25 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-f3c387c0.js');
 var React = require('react');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
 var hooks = require('@mantine/hooks');
-var index$2 = require('./index-1d528960.js');
-var utils = require('./utils-a1cfbdac.js');
+var index$2 = require('./index-1a6a94cd.js');
+var index_styles = require('./index.styles-9031f6d6.js');
 var styled = require('@emotion/styled');
 var carousel = require('@mantine/carousel');
-var index$3 = require('./index-2de1a14d.js');
-require('./index-0772398f.js');
+var index$4 = require('./index-6b95442c.js');
+require('./index-d471ff2d.js');
 var miscTheme = require('./miscTheme.js');
-var useMantineLocale = require('./useMantineLocale-992ae094.js');
-var index = require('./index-e4004288.js');
-var index$1 = require('./index-92e82d0d.js');
-var Locale = require('./Locale-e3b7ae56.js');
+var utils = require('./utils-ae9740c0.js');
+var useMantineLocale = require('./useMantineLocale-cc272195.js');
+var index = require('./index-648aac83.js');
+var index$1 = require('./index-549b9e8c.js');
+var Locale = require('./Locale-07aceee9.js');
+var index$3 = require('./index-e8dc7fdb.js');
 var cn = require('classnames');
-var useUniqueId = require('./useUniqueId-17c2097b.js');
+var useUniqueId = require('./useUniqueId-621ec272.js');
 var constantsSite = require('./constantsSite.js');
 var core$1 = require('@hhgtech/icons/core');
 
@@ -347,25 +349,8 @@ const getMantineThemeOverride = (locale, template = 'hb') => {
     };
 };
 
-const ImageWrap = (_a) => {
-    var { alt, backupSrc, src, placeholderSrc, style, ref } = _a, props = tslib_es6.__rest(_a, ["alt", "backupSrc", "src", "placeholderSrc", "style", "ref"]);
-    const [hasError, setHasError] = React.useState(false);
-    return (React__namespace["default"].createElement(StyledImage, Object.assign({ loading: "lazy", alt: alt, onError: () => !hasError && setHasError(true), src: hasError ? backupSrc || src : src || backupSrc, style: Object.assign(Object.assign({}, (placeholderSrc
-            ? {
-                backgroundImage: `url(${placeholderSrc})`,
-            }
-            : {})), style), "data-has-placeholder": !!placeholderSrc, ref: ref }, props)));
-};
-const StyledImage = styled__default["default"].img `
-  &[data-has-placeholder='true'] {
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-  }
-`;
-
-const CambodiaRoundIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "round cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
-const CambodiaSquareIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "square cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaSquare.png') }, props)));
+const CambodiaRoundIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "round cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
+const CambodiaSquareIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "square cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaSquare.png') }, props)));
 
 const EnglishRoundIcon = (props) => (React__namespace["default"].createElement("svg", Object.assign({ viewBox: "0 0 20 20", fill: "none", style: Object.assign({ borderRadius: '50%' }, props.style) }, props),
     React__namespace["default"].createElement("g", null,
@@ -412,8 +397,8 @@ const EnglishSquareIcon = (props) => (React__namespace["default"].createElement(
         React__namespace["default"].createElement("path", { d: "M9.32609 10.8334L1.08301 5.79537V7.06504L7.24826 10.8334H9.32609ZM24.0004 5.41675L15.1376 10.8334H17.2149L24.9163 6.12687V5.41675H24.0004ZM17.9191 15.1667L24.9163 19.4432V18.1735L19.9964 15.1667H17.9191ZM8.62192 15.1667L1.08301 19.7742V20.5834H1.83701L10.6992 15.1667H8.62192ZM1.08301 11.9167H24.9163V14.0834H1.08301V11.9167Z", fill: "#E53935" }),
         React__namespace["default"].createElement("path", { d: "M11.917 5.41675H14.0837V20.5834H11.917V5.41675Z", fill: "#E53935" }))));
 
-const IndiaRoundIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "round india flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
-const IndiaSquareIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "square indian flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaSquare.png') }, props)));
+const IndiaRoundIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "round india flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
+const IndiaSquareIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "square indian flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaSquare.png') }, props)));
 
 const IndonesiaRoundIcon = (_a) => {
     var rest = tslib_es6.__rest(_a, []);
@@ -495,8 +480,8 @@ const MyanmarSquareIcon = (props) => (React__namespace["default"].createElement(
     React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.6667 7.4589L16.3104 7.41087L12.5218 9.79821L11.6667 7.4589Z", fill: "white" }),
     React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.2361 7.90629L14.7225 11.8171L10.9974 9.35207L13.2361 7.90629Z", fill: "white" })));
 
-const PhilippinesRoundIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "round philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
-const PhilippinesSquareIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "square philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineSquare.png') }, props)));
+const PhilippinesRoundIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "round philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
+const PhilippinesSquareIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "square philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineSquare.png') }, props)));
 
 const TaiwanRoundIcon = (props) => (React__namespace["default"].createElement("svg", Object.assign({ viewBox: "0 0 20 20", fill: "none", style: Object.assign({ borderRadius: '50%' }, props.style) }, props),
     React__namespace["default"].createElement("g", null,
@@ -702,33 +687,6 @@ const _Select = React.forwardRef((_a, ref) => {
 const _IconSelect = () => (React__namespace["default"].createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" },
     React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.6665 9.99996C1.6665 5.39163 5.3915 1.66663 9.99984 1.66663C14.6082 1.66663 18.3332 5.39163 18.3332 9.99996C18.3332 14.6083 14.6082 18.3333 9.99984 18.3333C5.3915 18.3333 1.6665 14.6083 1.6665 9.99996ZM12.4083 13.5831C12.7333 13.9081 13.2583 13.9081 13.5833 13.5831C13.9 13.2581 13.9 12.7247 13.5833 12.4081L11.175 9.99973L13.5833 7.5914C13.9083 7.2664 13.9083 6.7414 13.5833 6.4164C13.2583 6.0914 12.7333 6.0914 12.4083 6.4164L10 8.82473L7.59167 6.4164C7.26667 6.0914 6.74167 6.0914 6.41667 6.4164C6.26063 6.57209 6.17293 6.78347 6.17293 7.0039C6.17293 7.22433 6.26063 7.43571 6.41667 7.5914L8.825 9.99973L6.41667 12.4081C6.26063 12.5638 6.17293 12.7751 6.17293 12.9956C6.17293 13.216 6.26063 13.4274 6.41667 13.5831C6.74167 13.9081 7.26667 13.9081 7.59167 13.5831L10 11.1747L12.4083 13.5831Z", fill: "#8C8C8C" })));
 
-const getIsMobile = () => {
-    return (typeof window !== 'undefined' &&
-        window.innerWidth < utils.Breakpoints.BREAK_POINT_MOBILE);
-};
-const getIsLargeMobile = () => {
-    return (typeof window !== 'undefined' &&
-        window.innerWidth >= utils.Breakpoints.BREAK_POINT_MOBILE &&
-        window.innerWidth < utils.Breakpoints.BREAK_POINT_PC);
-};
-const useScreenSize = () => {
-    const [isMobile, setIsMobile] = React.useState(getIsMobile());
-    const [isLargeMobile, setIsLargeMobile] = React.useState(getIsLargeMobile());
-    React.useEffect(() => {
-        const handleResize = () => {
-            setIsMobile(getIsMobile());
-            setIsLargeMobile(getIsLargeMobile());
-        };
-        window.addEventListener('resize', handleResize, {
-            passive: true,
-        });
-        return () => {
-            window.removeEventListener('resize', handleResize);
-        };
-    }, []);
-    return { isMobile, isLargeMobile };
-};
-
 class ErrorBoundary extends React.Component {
     constructor() {
         super(...arguments);
@@ -804,7 +762,7 @@ const StyledCarousel = styled__default["default"](Carousel) `
   }
 `;
 
-var useStyles$3 = core.createStyles((_theme, _params) => {
+var useStyles$2 = core.createStyles((_theme, _params) => {
     return {
         root: {
             color: _params.color ||
@@ -817,8 +775,8 @@ var useStyles$3 = core.createStyles((_theme, _params) => {
 
 const Anchor = (_a) => {
     var { color, styles, className } = _a, rest = tslib_es6.__rest(_a, ["color", "styles", "className"]);
-    const { classes, cx } = useStyles$3({ color }, { name: 'Anchor', styles });
-    return React__namespace["default"].createElement(index$3.Text, Object.assign({ as: "a", className: cx(classes.root, className) }, rest));
+    const { classes, cx } = useStyles$2({ color }, { name: 'Anchor', styles });
+    return React__namespace["default"].createElement(index$4.Text, Object.assign({ as: "a", className: cx(classes.root, className) }, rest));
 };
 
 const BreadcrumbItem = (_a) => {
@@ -842,7 +800,7 @@ const _Breadcrumbs = (_a) => {
     const theme = core.useMantineTheme();
     const isMarryBaby = ((_b = theme === null || theme === void 0 ? void 0 : theme.other) === null || _b === void 0 ? void 0 : _b.template) === 'mb';
     const [embla, setEmbla] = React.useState(null);
-    const { isMobile } = useScreenSize();
+    const { isMobile } = index_styles.useScreenSize();
     const [, setShouldAllowClick] = React.useState(true);
     const handleScroll = React.useCallback(() => {
         setShouldAllowClick(false);
@@ -900,36 +858,6 @@ const StyledTextArea = styled__default["default"](core.Textarea) `
   }
 `;
 
-var useStyles$2 = core.createStyles((theme) => {
-    return {
-        root: {},
-        inner: {},
-        content: {},
-        header: {
-            borderBottom: `1px solid ${theme.colors.neutral[1]}`,
-            marginRight: 0,
-            marginBottom: 0,
-            padding: '12px',
-        },
-        overlay: {},
-        title: {
-            fontSize: 16,
-            fontWeight: 700,
-            lineHeight: 1.5,
-        },
-        body: {},
-        close: {
-            cursor: 'pointer',
-            width: 'unset',
-            height: 'unset',
-            svg: {
-                width: '24px !important',
-                height: '24px !important',
-            },
-        },
-    };
-});
-
 const StyledAccordion = styled__default["default"](core.Accordion) `
   .mantine-Accordion-label {
     padding: 0;
@@ -984,7 +912,7 @@ const Avatar = (_a) => {
                     backgroundColor: avatarProps.color,
                     color: 'white',
                 },
-            } }), children ? (children) : placeholderText ? (placeholderText) : (React__namespace["default"].createElement(ImageWrap, { src: DEFAULT_AVATAR, width: size, alt: avatarProps.alt || 'avatar' }))));
+            } }), children ? (children) : placeholderText ? (placeholderText) : (React__namespace["default"].createElement(index$3.ImageWrap, { src: DEFAULT_AVATAR, width: size, alt: avatarProps.alt || 'avatar' }))));
     };
     if (withIndicator)
         return (React__namespace["default"].createElement(core.Indicator, Object.assign({ inline: true, position: "bottom-end", offset: 9 }, indicatorConfig, { styles: Object.assign({ indicator: {
@@ -1606,7 +1534,7 @@ const _Tabs = (_a) => {
         setDisableNext(((_a = viewport === null || viewport === void 0 ? void 0 : viewport.current) === null || _a === void 0 ? void 0 : _a.clientWidth) + scrollPosition.x ===
             ((_b = viewport === null || viewport === void 0 ? void 0 : viewport.current) === null || _b === void 0 ? void 0 : _b.scrollWidth));
     }, [scrollPosition]);
-    const TabTextComponent = ({ text, dataEventCategory, dataEventAction, dataEventLabel, }) => TabComponentDisplay ? (React__namespace["default"].createElement(TabComponentDisplay, null, text)) : (React__namespace["default"].createElement(index$3.Text, { size: "s3", color: "inherit", weight: "semiBold", "data-event-category": dataEventCategory, "data-event-action": dataEventAction, "data-event-label": dataEventLabel }, text));
+    const TabTextComponent = ({ text, dataEventCategory, dataEventAction, dataEventLabel, }) => TabComponentDisplay ? (React__namespace["default"].createElement(TabComponentDisplay, null, text)) : (React__namespace["default"].createElement(index$4.Text, { size: "s3", color: "inherit", weight: "semiBold", "data-event-category": dataEventCategory, "data-event-action": dataEventAction, "data-event-label": dataEventLabel }, text));
     return (React__namespace["default"].createElement(core.Tabs, Object.assign({}, props, rest), children || (React__namespace["default"].createElement(React__namespace["default"].Fragment, null,
         React__namespace["default"].createElement(core.ScrollArea, { className: cx(classes.scrollArea, `${!disablePrevious ? 'prev-bg' : ''} ${!disableNext ? 'next-bg' : ''}`), scrollbarSize: 0, viewportRef: viewport, onScrollPositionChange: onScrollPositionChange },
             React__namespace["default"].createElement(core.Tabs.List, Object.assign({ className: classes.list, ref: listRef }, listProps), dataList.map((i, idx) => (React__namespace["default"].createElement(core.Tabs.Tab, Object.assign({ ref: (e) => (tabRef.current[idx] = e), className: classes.tab, key: String(i.value), value: String(i.value) }, tabProps),
@@ -1705,7 +1633,6 @@ exports.Checkbox = Checkbox;
 exports.ChipButton = ChipButton;
 exports.DEBOUNCED_TIME = DEBOUNCED_TIME;
 exports.Flag = Flag;
-exports.ImageWrap = ImageWrap;
 exports.Input = Input;
 exports.NumberInput = NumberInput;
 exports.OTP = OTP;
@@ -1720,5 +1647,3 @@ exports.Tabs = Tabs;
 exports.emotionCache = emotionCache;
 exports.getMantineThemeOverride = getMantineThemeOverride;
 exports.themeColors = themeColors;
-exports.useScreenSize = useScreenSize;
-exports.useStyles = useStyles$2;

package/build/{index-5ddda8f4.js → index-4fd69136.js}

@@ -1,25 +1,26 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-f3c387c0.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var useHealthToolCache = require('./useHealthToolCache-cbe4b1b4.js');
-var useTranslations = require('./useTranslations-5d28e8df.js');
-var constants$1 = require('./constants-9c314450.js');
-var index$1 = require('./index-6c2d2f25.js');
+var useHealthToolCache = require('./useHealthToolCache-4b5bfb11.js');
+var useTranslations = require('./useTranslations-8a9fa84d.js');
+var constants$1 = require('./constants-81b95117.js');
+var index$1 = require('./index-4bf6b5da.js');
 require('@mantine/dates');
-require('./index-e4004288.js');
-require('./index-0772398f.js');
-require('./index-1d528960.js');
-require('./useMantineLocale-992ae094.js');
-require('./index-2de1a14d.js');
-require('./index-92e82d0d.js');
+require('./index-648aac83.js');
+require('./index-d471ff2d.js');
+require('./index-1a6a94cd.js');
+require('./useMantineLocale-cc272195.js');
+require('./index-6b95442c.js');
+require('./index-549b9e8c.js');
+require('./index.styles-9031f6d6.js');
 require('@mantine/hooks');
-require('./utils-a1cfbdac.js');
-require('./other-a7f01b3d.js');
-var index = require('./index-d39f2445.js');
-var constants = require('./constants-f9eca9ad.js');
+require('./utils-ae9740c0.js');
+require('./other-eedaf6ca.js');
+var index = require('./index-f91ed3be.js');
+var constants = require('./constants-4cad9f4d.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-6313ec6f.js → index-526cee72.js}

@@ -1,13 +1,13 @@
 'use strict';
 
 var React = require('react');
-var Locale = require('./Locale-e3b7ae56.js');
-var index$1 = require('./index-1d528960.js');
+var Locale = require('./Locale-07aceee9.js');
+var index$1 = require('./index-1a6a94cd.js');
 var styled = require('@emotion/styled');
-var utils = require('./utils-a1cfbdac.js');
-var logoIcon = require('./logoIcon-8e1ff0aa.js');
-require('./index-0772398f.js');
-var index = require('./index-6c2d2f25.js');
+var utils = require('./utils-ae9740c0.js');
+var logoIcon = require('./logoIcon-f3283bfd.js');
+require('./index-d471ff2d.js');
+var index = require('./index-e8dc7fdb.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-92e82d0d.js → index-549b9e8c.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-f3c387c0.js');
 var React = require('react');
 var core = require('@mantine/core');
 

package/build/{index-a6acde43.js → index-5b52b076.js}

@@ -1,32 +1,36 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-f3c387c0.js');
 var React = require('react');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
-var index$5 = require('./index-9f501aac.js');
-var useTranslations = require('./useTranslations-5d28e8df.js');
+var index$5 = require('./index-ce2d2850.js');
+var useTranslations = require('./useTranslations-8a9fa84d.js');
 var innertext = require('innertext');
 var miscTheme = require('./miscTheme.js');
-require('./index-6c2d2f25.js');
+require('./index-4bf6b5da.js');
 require('@mantine/dates');
-require('./index-e4004288.js');
-require('./index-0772398f.js');
-var index$6 = require('./index-1d528960.js');
-require('./useMantineLocale-992ae094.js');
-var index$1 = require('./index-2de1a14d.js');
-var index$7 = require('./index-92e82d0d.js');
+require('./index-648aac83.js');
+require('./index-d471ff2d.js');
+var index$6 = require('./index-1a6a94cd.js');
+require('./useMantineLocale-cc272195.js');
+var index$1 = require('./index-6b95442c.js');
+var index$7 = require('./index-549b9e8c.js');
+require('./index.styles-9031f6d6.js');
 require('@mantine/hooks');
-require('./utils-a1cfbdac.js');
-require('./other-a7f01b3d.js');
-var togetherComponentGlobalContext = require('./utils-1a876a51.js');
-var index = require('./index-2ce324cf.js');
+require('./utils-ae9740c0.js');
+require('./other-eedaf6ca.js');
+var togetherComponentGlobalContext = require('./utils-251b2841.js');
+var index = require('./index-becfec7a.js');
 var styled = require('@emotion/styled');
-var index$4 = require('./index-7e8732ae.js');
-var dataTransform = require('./dataTransform-945e5f4f.js');
-var constants = require('./constants-9c314450.js');
-var index$2 = require('./index-e7b871b4.js');
-var index$3 = require('./index-6ce119f5.js');
+var index$4 = require('./index-b4fd3100.js');
+var dataTransform = require('./dataTransform-9ec385e3.js');
+var constants = require('./constants-81b95117.js');
+var post = require('./post-0fec66f4.js');
+var togetherRichTextEditor = require('./editor-40386fe7.js');
+var index$2 = require('./index-1b06e81f.js');
+var togetherMoleculesCardAuthor = require('./index-922020ed.js');
+var index$3 = require('./index-0afde39e.js');
 var debounce = require('lodash/debounce');
 var ContentEditable = require('react-contenteditable');
 var togetherApiPaths = require('./togetherApiPaths.js');
@@ -204,16 +208,16 @@ const CreatePostDescription = ({ className, style, bannedWords = [], value, onCh
                 onPreviewUrlChange(null);
         }
     }, [previewUrl]);
-    return (React__default["default"].createElement(index.StyledCreatePostDescription, { className: className, style: style },
+    return (React__default["default"].createElement(togetherRichTextEditor.StyledCreatePostDescription, { className: className, style: style },
         React__default["default"].createElement(index$1.Text, { size: "p4", className: "description-label" }, t('createPost.popup.description')),
         React__default["default"].createElement("div", { className: `textarea-control` },
             React__default["default"].createElement("div", { className: "textarea-wrapper" },
-                React__default["default"].createElement(index.RichTextEditor, { html: value || '', onChange: onChange, bannedWords: bannedWords, onImagePickerClick: () => { var _a; return (_a = imagePicker.current) === null || _a === void 0 ? void 0 : _a.click(); }, onPreviewUrlChange: setPreviewUrl, onInvalidUrlsChange: onInvalidUrlsChange, isReplying: isReplying }))),
+                React__default["default"].createElement(togetherRichTextEditor.RichTextEditor, { html: value || '', onChange: onChange, bannedWords: bannedWords, onImagePickerClick: () => { var _a; return (_a = imagePicker.current) === null || _a === void 0 ? void 0 : _a.click(); }, onPreviewUrlChange: setPreviewUrl, onInvalidUrlsChange: onInvalidUrlsChange, isReplying: isReplying }))),
         React__default["default"].createElement(index$1.Text, { size: "p4", className: "count-string" },
             t('character'),
             ": ",
             innertext__default["default"](value || '').length),
-        (!imageSrcs || imageSrcs.length === 0) && previewUrl && (React__default["default"].createElement("div", { className: "link-preview-wrapper" }, previewUrl.isFetching ? (React__default["default"].createElement(index.Loading, null)) : (React__default["default"].createElement(React__default["default"].Fragment, null,
+        (!imageSrcs || imageSrcs.length === 0) && previewUrl && (React__default["default"].createElement("div", { className: "link-preview-wrapper" }, previewUrl.isFetching ? (React__default["default"].createElement(togetherMoleculesCardAuthor.Loading, null)) : (React__default["default"].createElement(React__default["default"].Fragment, null,
             React__default["default"].createElement(index$2.CardLink, { title: previewUrl.title, url: previewUrl.url || '#', image: previewUrl.image, noRefetch: true }),
             React__default["default"].createElement("img", { src: index.IconCloseCircle, className: "icon-close", onClick: () => setPreviewUrl(null), loading: "lazy" }))))),
         React__default["default"].createElement("input", { ref: imagePicker, type: "file", accept: "image/png, image/gif, image/jpeg", multiple: true, style: { display: 'none' }, onChange: onSelectImages }),
@@ -290,7 +294,7 @@ const inputModify = (value, opts) => {
         return value;
     const { limit, bannedWords = [] } = opts;
     const shorten = typeof limit === 'number' && limit >= 0 ? value.substring(0, limit) : value;
-    const processedValue = index.highlightBadWords(shorten, bannedWords);
+    const processedValue = post.highlightBadWords(shorten, bannedWords);
     return processedValue;
 };
 const CreatePostTitle = ({ className, style, bannedWords = [], value, onChange, }) => {
@@ -319,7 +323,7 @@ const CreatePostTitle = ({ className, style, bannedWords = [], value, onChange,
         if (bannedString) {
             const titleText = (_a = titleRef.current) === null || _a === void 0 ? void 0 : _a.innerText;
             if (titleText) {
-                const titleValueWithBanned = index.highlightBadWords(titleText, bannedWords);
+                const titleValueWithBanned = post.highlightBadWords(titleText, bannedWords);
                 if (titleValueWithBanned !== titleText) {
                     onChange && onChange(titleValueWithBanned);
                     setTitleValue(titleValueWithBanned);
@@ -480,7 +484,7 @@ const TopicSelectList = ({ className, style, topics: topicsProp, communityId, on
                     setSelectedTopics(_selected.slice());
                 }
             }, dataEventAction: dataEventAction, dataEventCategory: dataEventCategory, dataEventLabel: dataEventLabel }))),
-        (isLoading || isLoadingTopics) && React__default["default"].createElement(index.Loading, { className: "topic-spinner" })));
+        (isLoading || isLoadingTopics) && React__default["default"].createElement(togetherMoleculesCardAuthor.Loading, { className: "topic-spinner" })));
 };
 const TopicItem = (_a) => {
     var { topic, disabled, selected, onClick } = _a, rest = tslib_es6.__rest(_a, ["topic", "disabled", "selected", "onClick"]);
@@ -536,17 +540,17 @@ const CreateNewPostContent = ({ className, style, onPostCreatedEdited, onClose,
     // HANDLE etra action when OPEN AND CLOSE
     React.useEffect(() => {
         if (editPostData) {
-            const post = editPostData;
-            setTitleValue(post.title || '');
-            setDescriptionValue(index.decodeMention(index.decodePostUrl(post.description || '', 'edit'), post.mentions));
+            const post$1 = editPostData;
+            setTitleValue(post$1.title || '');
+            setDescriptionValue(post.decodeMention(post.decodePostUrl(post$1.description || '', 'edit'), post$1.mentions));
             setCommunityValue({
-                label: post.community.name,
-                value: `${post.community.id || ''}-${post.community.mappedCategoryId || ''}`,
+                label: post$1.community.name,
+                value: `${post$1.community.id || ''}-${post$1.community.mappedCategoryId || ''}`,
             });
-            setSelectedTopics(post.topics || []);
-            setImageFiles(post.photos || []);
-            setIsAnonymous(!!post.isAnonymous || false);
-            setIsAskDoctor(!!post.isAskDoctor || false);
+            setSelectedTopics(post$1.topics || []);
+            setImageFiles(post$1.photos || []);
+            setIsAnonymous(!!post$1.isAnonymous || false);
+            setIsAskDoctor(!!post$1.isAskDoctor || false);
         }
         else {
             if (defaultCommunity) {

package/build/{index-8b8263ed.js → index-5dbd317c.js}

@@ -1,27 +1,28 @@
 'use strict';
 
 var React = require('react');
-var index$1 = require('./index-20a5cee0.js');
+var index = require('./index-c6b0831a.js');
 var dayjs = require('dayjs');
-require('./index-e4004288.js');
-var index = require('./index-6c2d2f25.js');
+require('./index-648aac83.js');
+require('./index-4bf6b5da.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-require('./index-0772398f.js');
-require('./index-1d528960.js');
-require('./useMantineLocale-992ae094.js');
-var index$2 = require('./index-2de1a14d.js');
-require('./index-92e82d0d.js');
-require('./translationsContext-951038ad.js');
+require('./index-d471ff2d.js');
+require('./index-1a6a94cd.js');
+require('./useMantineLocale-cc272195.js');
+var index$1 = require('./index-6b95442c.js');
+require('./index-549b9e8c.js');
+var index_styles = require('./index.styles-9031f6d6.js');
+require('./translationsContext-cd046df4.js');
 require('string-format');
 require('@mantine/hooks');
-var utils = require('./utils-a1cfbdac.js');
-require('./other-a7f01b3d.js');
+var utils = require('./utils-ae9740c0.js');
+require('./other-eedaf6ca.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
-var index$4 = require('./index-6313ec6f.js');
-var index$3 = require('./index-9cc21262.js');
+var index$3 = require('./index-526cee72.js');
+var index$2 = require('./index-fbb369ff.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -237,34 +238,34 @@ const StyledFlag = styled__default["default"].img `
 const Flag = ({ url, dataEventCategory, dataEventAction, dataEventLabel, }) => {
     return (React__default["default"].createElement(StyledFlag, { loading: "lazy", className: "country-flag", src: url, alt: "Country Flag", "data-event-category": dataEventCategory, "data-event-action": dataEventAction, "data-content-label": dataEventLabel }));
 };
-const FooterMenuColumn = ({ title, items, locale, index: index$1, }) => {
-    const { isMobile } = index.useScreenSize();
+const FooterMenuColumn = ({ title, items, locale, index, }) => {
+    const { isMobile } = index_styles.useScreenSize();
     return (React__default["default"].createElement("div", { className: "footer-menu-column" },
-        title ? (React__default["default"].createElement(index$2.Text, { size: isMobile ? 's4' : 's3', className: "footer-menu-title", weight: isMobile ? 'regular' : 'semiBold', color: "neutral.6" }, title)) : null,
-        React__default["default"].createElement("div", { className: "footer-menu-link-wrapper" }, items === null || items === void 0 ? void 0 : items.map((informationLink, idx) => (React__default["default"].createElement(index$2.Text, { size: isMobile ? 'p3' : 'p4', as: "a", "data-event-category": "Footer", "data-event-action": informationLink.title, "data-event-label": `https://${constantsDomainLocales.domainLocales[locale]}${informationLink.url}`, className: "footer-menu-link", 
+        title ? (React__default["default"].createElement(index$1.Text, { size: isMobile ? 's4' : 's3', className: "footer-menu-title", weight: isMobile ? 'regular' : 'semiBold', color: "neutral.6" }, title)) : null,
+        React__default["default"].createElement("div", { className: "footer-menu-link-wrapper" }, items === null || items === void 0 ? void 0 : items.map((informationLink, idx) => (React__default["default"].createElement(index$1.Text, { size: isMobile ? 'p3' : 'p4', as: "a", "data-event-category": "Footer", "data-event-action": informationLink.title, "data-event-label": `https://${constantsDomainLocales.domainLocales[locale]}${informationLink.url}`, className: "footer-menu-link", 
             // @ts-ignore
-            href: informationLink.url, key: idx, color: "#fff", weight: isMobile && index$1 === 0 ? 'semiBold' : 'regular' }, informationLink.title))))));
+            href: informationLink.url, key: idx, color: "#fff", weight: isMobile && index === 0 ? 'semiBold' : 'regular' }, informationLink.title))))));
 };
 const DiscoverFooter = ({ className, footerInfo, locale }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-    const { isMobile } = index.useScreenSize();
+    const { isMobile } = index_styles.useScreenSize();
     const footerMenu = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.menu;
     const verifiedIcons = ((_b = (_a = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.general) === null || _a === void 0 ? void 0 : _a.verified) === null || _b === void 0 ? void 0 : _b.filter(Boolean)) || [];
     return (React__default["default"].createElement(StyledFooter$1, { className: className },
-        React__default["default"].createElement(index$1.Container, null,
+        React__default["default"].createElement(index.Container, null,
             React__default["default"].createElement("div", { className: "inner" },
                 React__default["default"].createElement("a", { href: "/" },
                     React__default["default"].createElement("img", { loading: "lazy", className: "footer-logo", src: (_c = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.general) === null || _c === void 0 ? void 0 : _c.logo, alt: "Logo", "data-is-sehat": locale === 'id-ID' })),
                 React__default["default"].createElement("div", { className: "columns" },
                     React__default["default"].createElement("div", { className: "newsletter" },
-                        React__default["default"].createElement(index$2.Text, { size: isMobile ? 's3' : 's4', weight: "semiBold", color: "neutral.0" }, (_d = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.general) === null || _d === void 0 ? void 0 : _d.content),
+                        React__default["default"].createElement(index$1.Text, { size: isMobile ? 's3' : 's4', weight: "semiBold", color: "neutral.0" }, (_d = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.general) === null || _d === void 0 ? void 0 : _d.content),
                         React__default["default"].createElement("div", { className: "social" },
-                            React__default["default"].createElement(index$2.Text, { size: "p4", color: "neutral.6" }, (_e = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.social) === null || _e === void 0 ? void 0 : _e.title),
+                            React__default["default"].createElement(index$1.Text, { size: "p4", color: "neutral.6" }, (_e = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.social) === null || _e === void 0 ? void 0 : _e.title),
                             React__default["default"].createElement("div", { className: "icons" }, (_g = (_f = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.social) === null || _f === void 0 ? void 0 : _f.socials) === null || _g === void 0 ? void 0 : _g.map((social, idx) => (React__default["default"].createElement("a", { key: idx, "data-event-category": "Footer", "data-event-action": `Follow us - ${social.name}`, "data-content-label": social.url, href: social.url },
                                 React__default["default"].createElement("img", { loading: "lazy", "data-event-category": "Footer", "data-event-action": `Follow us - ${social.name}`, "data-content-label": social.url, src: social.icon, alt: "Logo Social", className: "social-icon", width: "24", height: "24" }))))))),
                     React__default["default"].createElement("div", { className: "footer-menu" }, footerMenu && (React__default["default"].createElement(React__default["default"].Fragment, null, footerMenu === null || footerMenu === void 0 ? void 0 : footerMenu.map((menu, idx) => (React__default["default"].createElement(FooterMenuColumn, { title: menu.menu_title, items: menu.items, locale: locale, key: idx, index: idx }))))))),
                 React__default["default"].createElement("div", { className: "otherSites" },
-                    React__default["default"].createElement(index$2.Text, { size: "p4", className: "linkTitle", color: "neutral.6", weight: "regular" }, (_h = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.branch) === null || _h === void 0 ? void 0 : _h.title),
+                    React__default["default"].createElement(index$1.Text, { size: "p4", className: "linkTitle", color: "neutral.6", weight: "regular" }, (_h = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.branch) === null || _h === void 0 ? void 0 : _h.title),
                     React__default["default"].createElement("div", { className: "flags" }, (_k = (_j = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.branch) === null || _j === void 0 ? void 0 : _j.branch) === null || _k === void 0 ? void 0 : _k.map((flagLink, idx) => (React__default["default"].createElement("a", { href: flagLink.url, key: idx, "data-event-category": "Footer", "data-event-action": flagLink.name, "data-event-label": flagLink.url },
                         React__default["default"].createElement(Flag, { url: flagLink.flag, dataEventCategory: "Footer", dataEventAction: flagLink.name, dataEventLabel: flagLink.url })))))),
                 React__default["default"].createElement("div", { className: "copyright" },
@@ -272,7 +273,7 @@ const DiscoverFooter = ({ className, footerInfo, locale }) => {
                         ? verifiedIcons.map((verify, index) => (React__default["default"].createElement("a", { href: verify.url, key: index, className: "copyright-image" },
                             React__default["default"].createElement("img", { loading: "lazy", src: verify.image, alt: "DMCA Icon" }))))
                         : null),
-                    React__default["default"].createElement(index$2.Text, { size: 'n1', className: "copyright-content", as: "div", color: "neutral.6", weight: "regular" },
+                    React__default["default"].createElement(index$1.Text, { size: 'n1', className: "copyright-content", as: "div", color: "neutral.6", weight: "regular" },
                         React__default["default"].createElement("div", { dangerouslySetInnerHTML: {
                                 __html: (_l = footerInfo === null || footerInfo === void 0 ? void 0 : footerInfo.general) === null || _l === void 0 ? void 0 : _l.copyright.replace(/{currentYear}/gi, dayjs__default["default"]().get('year').toString()),
                             } })))))));
@@ -389,13 +390,13 @@ const MarryBabyFooter = ({ logoType = 'marryBaby', footerMenu, background, }) =>
     return (React__default["default"].createElement(StyledFooter, { style: {
             backgroundColor: background ? background : 'none',
         } },
-        React__default["default"].createElement(index$1.Container, null,
+        React__default["default"].createElement(index.Container, null,
             React__default["default"].createElement(StyledMenuContainer, null, menu === null || menu === void 0 ? void 0 : menu.map(({ menu_title, items }, idx) => (React__default["default"].createElement(StyledWrapMenuItem, { key: `mbf${idx}` },
-                React__default["default"].createElement(index$3.MarryBabyText, { className: "title", type: "subtitle-1", color: miscTheme.theme.mbColors.pink }, menu_title), items === null || items === void 0 ? void 0 :
+                React__default["default"].createElement(index$2.MarryBabyText, { className: "title", type: "subtitle-1", color: miscTheme.theme.mbColors.pink }, menu_title), items === null || items === void 0 ? void 0 :
                 items.map(({ title, url }, id) => (React__default["default"].createElement("a", { "data-event-category": "Footer", "data-event-action": "Click", "data-event-label": `${url}`, className: "link", href: url, key: `footer-links-${id}` },
                     React__default["default"].createElement(StyledWrapItems, { key: `mbitem${id}` },
-                        React__default["default"].createElement(index$3.MarryBabyText, { type: "bodytext-2", color: miscTheme.theme.mbColors.gray }, title)))))))))),
-        React__default["default"].createElement(index$1.Container, null,
+                        React__default["default"].createElement(index$2.MarryBabyText, { type: "bodytext-2", color: miscTheme.theme.mbColors.gray }, title)))))))))),
+        React__default["default"].createElement(index.Container, null,
             React__default["default"].createElement(StyledWrapInfo, null,
                 React__default["default"].createElement(core.Flex, { gap: '24px', sx: (theme) => ({
                         [theme.fn.largerThan('sm')]: {
@@ -409,22 +410,22 @@ const MarryBabyFooter = ({ logoType = 'marryBaby', footerMenu, background, }) =>
                         },
                     }) },
                     React__default["default"].createElement(core.Stack, { spacing: '24px', className: "info-item" },
-                        React__default["default"].createElement(index$4.Logo, { className: "logo", type: logoType }),
-                        React__default["default"].createElement(index$2.Text, { size: "p4", as: "div" },
+                        React__default["default"].createElement(index$3.Logo, { className: "logo", type: logoType }),
+                        React__default["default"].createElement(index$1.Text, { size: "p4", as: "div" },
                             React__default["default"].createElement("div", { dangerouslySetInnerHTML: {
                                     __html: general === null || general === void 0 ? void 0 : general.content,
                                 } })),
                         React__default["default"].createElement(StyledSocialLink, null, socials === null || socials === void 0 ? void 0 : socials.map(({ icon, name, url }, id) => (React__default["default"].createElement("a", { key: `social${id}`, target: "_blank", rel: "noreferrer", "data-event-category": "Footer", "data-event-action": `Follow us - ${name}`, "data-content-label": name, href: url },
                             React__default["default"].createElement("img", { className: "social-logo", loading: "lazy", src: icon, alt: name })))))),
                     React__default["default"].createElement(core.Box, { className: "info-item", sx: { paddingTop: '7px' } },
-                        React__default["default"].createElement(index$2.Text, { size: "p4", as: "div" },
+                        React__default["default"].createElement(index$1.Text, { size: "p4", as: "div" },
                             React__default["default"].createElement("div", { dangerouslySetInnerHTML: {
                                     __html: general === null || general === void 0 ? void 0 : general.information,
                                 } })))))),
         React__default["default"].createElement(StyledWrapCopyRight, null,
-            React__default["default"].createElement(index$1.Container, null,
+            React__default["default"].createElement(index.Container, null,
                 React__default["default"].createElement("div", { className: "content" },
-                    React__default["default"].createElement(index$2.Text, { size: "p5", color: "#fff", as: "div" },
+                    React__default["default"].createElement(index$1.Text, { size: "p5", color: "#fff", as: "div" },
                         React__default["default"].createElement("div", { dangerouslySetInnerHTML: {
                                 __html: general === null || general === void 0 ? void 0 : general.copyright.replace(/{currentYear}/gi, dayjs__default["default"]().get('year').toString()),
                             } })),