@hhgtech/hhg-components 1.29.88 → 1.29.90

package/build/esm/{index-a2704991.js → index-21c80677.js}

@@ -1,22 +1,24 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-3970c414.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-fd8cab49.js';
 import * as React from 'react';
-import React__default, { useState, forwardRef, useEffect, Component, useCallback, createContext, useContext, useRef, useMemo, useImperativeHandle } from 'react';
+import React__default, { forwardRef, Component, useState, useCallback, useEffect, createContext, useContext, useRef, useMemo, useImperativeHandle } from 'react';
 import { ArrowDown, ArrowLeft, ArrowRight } from '@hhgtech/icons/other';
 import { em, Autocomplete, Image, ActionIcon, Select as Select$1, createStyles, AspectRatio as AspectRatio$1, useMantineTheme, Box, Breadcrumbs as Breadcrumbs$1, Textarea, Accordion as Accordion$1, Indicator, Avatar as Avatar$1, FileInput as FileInput$1, createEmotionCache, NumberInput as NumberInput$1, PasswordInput as PasswordInput$1, TextInput, Input as Input$1, Checkbox as Checkbox$1, Slider, Radio as Radio$1, Flex, rem, Tabs as Tabs$1, ScrollArea, Popover as Popover$1, Chip } from '@mantine/core';
 import { useUncontrolled, useDebouncedValue, useViewportSize, useResizeObserver, useDisclosure, useClickOutside } from '@mantine/hooks';
-import { C as CommonGAssets } from './index-24f2f569.js';
-import { B as Breakpoints } from './utils-cee25689.js';
+import { C as CommonGAssets } from './index-d4eef69b.js';
+import { u as useScreenSize } from './index.styles-793c0b30.js';
 import styled from '@emotion/styled';
 import { Carousel as Carousel$1 } from '@mantine/carousel';
-import { T as Text } from './index-7d97103f.js';
-import './index-5a81cbdd.js';
+import { T as Text } from './index-5d2f2783.js';
+import './index-e7128232.js';
 import { theme } from './miscTheme.js';
-import { G as GlobalHeadingStyle } from './useMantineLocale-2ece6eac.js';
-import { I as ISO_FORMAT } from './index-69ca7b6a.js';
-import { A as ANIMATION_DURATION, B as Button } from './index-2f06b1d8.js';
-import { L as LOCALE } from './Locale-81beb37e.js';
+import { B as Breakpoints } from './utils-1dbd61fa.js';
+import { G as GlobalHeadingStyle } from './useMantineLocale-bef42461.js';
+import { I as ISO_FORMAT } from './index-d5543323.js';
+import { A as ANIMATION_DURATION, B as Button } from './index-51179764.js';
+import { L as LOCALE } from './Locale-ecfc005f.js';
+import { I as ImageWrap } from './index-d034201a.js';
 import cn from 'classnames';
-import { a as useUniqueId } from './useUniqueId-d714426d.js';
+import { a as useUniqueId } from './useUniqueId-d61a7b61.js';
 import { siteOptions } from './constantsSite.js';
 import { Check, Plus } from '@hhgtech/icons/core';
 
@@ -322,23 +324,6 @@ const getMantineThemeOverride = (locale, template = 'hb') => {
     };
 };
 
-const ImageWrap = (_a) => {
-    var { alt, backupSrc, src, placeholderSrc, style, ref } = _a, props = __rest(_a, ["alt", "backupSrc", "src", "placeholderSrc", "style", "ref"]);
-    const [hasError, setHasError] = useState(false);
-    return (React__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.img `
-  &[data-has-placeholder='true'] {
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-  }
-`;
-
 const CambodiaRoundIcon = (props) => (React__default.createElement(ImageWrap, Object.assign({ alt: "round cambodia flag", src: CommonGAssets.getAssetPath('flags/cambodiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
 const CambodiaSquareIcon = (props) => (React__default.createElement(ImageWrap, Object.assign({ alt: "square cambodia flag", src: CommonGAssets.getAssetPath('flags/cambodiaSquare.png') }, props)));
 
@@ -677,33 +662,6 @@ const _Select = forwardRef((_a, ref) => {
 const _IconSelect = () => (React__default.createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" },
     React__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 < Breakpoints.BREAK_POINT_MOBILE);
-};
-const getIsLargeMobile = () => {
-    return (typeof window !== 'undefined' &&
-        window.innerWidth >= Breakpoints.BREAK_POINT_MOBILE &&
-        window.innerWidth < Breakpoints.BREAK_POINT_PC);
-};
-const useScreenSize = () => {
-    const [isMobile, setIsMobile] = useState(getIsMobile());
-    const [isLargeMobile, setIsLargeMobile] = useState(getIsLargeMobile());
-    useEffect(() => {
-        const handleResize = () => {
-            setIsMobile(getIsMobile());
-            setIsLargeMobile(getIsLargeMobile());
-        };
-        window.addEventListener('resize', handleResize, {
-            passive: true,
-        });
-        return () => {
-            window.removeEventListener('resize', handleResize);
-        };
-    }, []);
-    return { isMobile, isLargeMobile };
-};
-
 class ErrorBoundary extends Component {
     constructor() {
         super(...arguments);
@@ -779,7 +737,7 @@ const StyledCarousel = styled(Carousel) `
   }
 `;
 
-var useStyles$3 = createStyles((_theme, _params) => {
+var useStyles$2 = createStyles((_theme, _params) => {
     return {
         root: {
             color: _params.color ||
@@ -792,7 +750,7 @@ var useStyles$3 = createStyles((_theme, _params) => {
 
 const Anchor = (_a) => {
     var { color, styles, className } = _a, rest = __rest(_a, ["color", "styles", "className"]);
-    const { classes, cx } = useStyles$3({ color }, { name: 'Anchor', styles });
+    const { classes, cx } = useStyles$2({ color }, { name: 'Anchor', styles });
     return React__default.createElement(Text, Object.assign({ as: "a", className: cx(classes.root, className) }, rest));
 };
 
@@ -875,36 +833,6 @@ const StyledTextArea = styled(Textarea) `
   }
 `;
 
-var useStyles$2 = 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(Accordion$1) `
   .mantine-Accordion-label {
     padding: 0;
@@ -1668,4 +1596,4 @@ const _ChipButton = (_a) => {
 const ChipButton = _ChipButton;
 ChipButton.Group = Chip.Group;
 
-export { Anchor as A, Breadcrumbs as B, CaretDown as C, DEBOUNCED_TIME as D, Flag as F, ImageWrap as I, NumberInput as N, OTP as O, Phone as P, Radio as R, Select as S, Tabs as T, Avatar as a, AspectRatio as b, Input as c, CentralCarousel as d, Checkbox as e, ChipButton as f, useStyles$2 as g, getMantineThemeOverride as h, StyledTextArea as i, StyledSliderWrapper as j, StyledSlider as k, Accordion as l, Carousel as m, emotionCache as n, Popover as o, themeColors as t, useScreenSize as u };
+export { Anchor as A, Breadcrumbs as B, CaretDown as C, DEBOUNCED_TIME as D, Flag as F, Input as I, NumberInput as N, OTP as O, Phone as P, Radio as R, Select as S, Tabs as T, Avatar as a, AspectRatio as b, CentralCarousel as c, Checkbox as d, ChipButton as e, StyledTextArea as f, getMantineThemeOverride as g, StyledSliderWrapper as h, StyledSlider as i, Accordion as j, Carousel as k, emotionCache as l, Popover as m, themeColors as t };

package/build/esm/{index-8570e132.js → index-296a1099.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-3970c414.js';
+import { _ as __rest } from './tslib.es6-fd8cab49.js';
 import React__default from 'react';
 import { useMantineTheme } from '@mantine/core';
-import { T as Text } from './index-7d97103f.js';
+import { T as Text } from './index-5d2f2783.js';
 
 /**
  * @deprecated Consider to use import { Title } from '@mantine/core'