@hhgtech/hhg-components
Version:
Hello Health Group common components
125 lines (115 loc) • 7.28 kB
JavaScript
import { g as getMantineThemeOverride, h as StyledTextArea, D as DEBOUNCED_TIME, i as StyledSliderWrapper, j as StyledSlider } from './index-5d405c0d.js';
export { k as Accordion, A as Anchor, b as AspectRatio, a as Avatar, B as Breadcrumbs, l as Carousel, c as CentralCarousel, d as Checkbox, e as ChipButton, I as Input, O as OTP, P as Phone, n as Popover, R as Radio, S as Select, m as emotionCache, g as getMantineThemeOverride, t as themeColors } from './index-5d405c0d.js';
export { D as DatePicker } from './index-afb403a9.js';
export { T as Text } from './index-9f5659e8.js';
import { B as Button } from './index-c68a0fa7.js';
export { B as Button } from './index-c68a0fa7.js';
export { I as Indicator } from './index-e77867c5.js';
import React__default, { useState, useEffect } from 'react';
export { M as Modal } from './index-5d32e000.js';
import { _ as __rest } from './tslib.es6-ea4dfe68.js';
import { MantineProvider as MantineProvider$1, Badge as Badge$1, LoadingOverlay as LoadingOverlay$1, clsx, Title, Text, Button as Button$1 } from '@mantine/core';
import { theme } from './miscTheme.js';
export { S as Spoiler } from './index-c52eb102.js';
import { useDebouncedValue } from '@mantine/hooks';
export { S as Switch } from './index-69c990dc.js';
import { u as useMantineLocale, N as NotificationsHandler } from './useMantineLocale-0c6bea99.js';
export { M as MAPPED_LOCALE, g as getHeadingStyles, s as showNotification, u as useMantineLocale } from './useMantineLocale-0c6bea99.js';
export { O as OTHER_THEME_CONFIG } from './other-4ccb5568.js';
export { T as Tabs } from './index-c2190f6e.js';
import '@hhgtech/icons/other';
import './index-ebe66e27.js';
import './constantsDomainLocales.js';
import './Locale-f270bd9d.js';
import './constantsIsProduction.js';
import './useScreenSize-981e5b51.js';
import '@emotion/styled';
import './utils-cb7242c7.js';
import '@mantine/carousel';
import './index-90813715.js';
import './index-5e947517.js';
import 'date-fns/locale';
import './constantsSite.js';
import './constantsRiskScreener.js';
import 'classnames';
import './useUniqueId-4305c9aa.js';
import '@hhgtech/icons/core';
import '@mantine/dates';
import './index.styles-770020ac.js';
import './index-9d21b711.js';
import './translationsContext-3a9e3453.js';
import '@mantine/notifications';
import 'dayjs';
const MantineProvider = (_a) => {
var { children, locale, template = 'hb' } = _a, props = __rest(_a, ["children", "locale", "template"]);
useMantineLocale(locale);
return (React__default.createElement(MantineProvider$1, Object.assign({ theme: getMantineThemeOverride(locale, template) }, props),
children,
React__default.createElement(NotificationsHandler, null)));
};
const TextArea = (props) => {
return React__default.createElement(StyledTextArea, Object.assign({ minRows: 2, maxRows: 4 }, props));
};
const Badge = (_a) => {
var { color = theme.colors.primaryBase, styles } = _a, rest = __rest(_a, ["color", "styles"]);
return (React__default.createElement(Badge$1, Object.assign({ variant: "filled", color: color, styles: Object.assign({ root: {
borderRadius: '2px',
background: color,
textTransform: 'unset',
} }, styles) }, rest)));
};
function useLockBodyScroll(visible = false) {
React__default.useEffect(() => {
if (visible) {
const originalStyle = window.getComputedStyle(document.body).overflow;
document.body.style.overflow = 'hidden';
return () => {
document.body.style.overflow = originalStyle;
};
}
}, [visible]);
}
const LoadingOverlay = (props) => {
useLockBodyScroll(props.visible);
return (React__default.createElement(LoadingOverlay$1, Object.assign({ loaderProps: {
color: theme.colors.primaryBase,
} }, props)));
};
const Slider = (_a) => {
var { color, withControl, onChange, value, min, max, isStatic, containerClassName, containerStyle } = _a, props = __rest(_a, ["color", "withControl", "onChange", "value", "min", "max", "isStatic", "containerClassName", "containerStyle"]);
const [currentValue, setCurrentValue] = useState(value || min || 0);
const [debounced] = useDebouncedValue(currentValue, DEBOUNCED_TIME);
const increase = () => {
setCurrentValue((p) => (max && p === max ? p : p + 1));
};
const decrease = () => {
setCurrentValue((p) => (min && p === min ? p : p - 1));
};
useEffect(() => {
onChange === null || onChange === void 0 ? void 0 : onChange(debounced);
}, [debounced]);
useEffect(() => {
setCurrentValue(value);
}, [value]);
return (React__default.createElement(StyledSliderWrapper, { className: containerClassName, style: containerStyle },
withControl && (React__default.createElement(Button, { type: "button", size: "sm", variant: "ghost", onClick: decrease },
React__default.createElement("svg", { width: "10", height: "10", fill: "none", viewBox: "0 0 12 3" },
React__default.createElement("path", { d: "M1 1.004h8", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })))),
React__default.createElement(StyledSlider, Object.assign({ thumbSize: 21, labelAlwaysOn: true, radius: "xl", color: color, value: currentValue, onChange: !isStatic ? setCurrentValue : () => null, min: min, max: max }, props, { className: 'hhg-mantine-slider ' + (props.className || '') })),
withControl && (React__default.createElement(Button, { type: "button", size: "sm", variant: "ghost", onClick: increase },
React__default.createElement("svg", { width: "16", height: "20", fill: "none", viewBox: "0 0 16 16" },
React__default.createElement("path", { d: "M8 4v8M4 8h8", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }))))));
};
var styles = {"container":"MON6sfi","iconContainer":"pS-tJD7","icon":"s3tJ9-5","title":"fNsZr1b","description":"uuxV74v","button":"YohjTDU"};
function Result(props) {
const { icon, title, description, button, buttonProps, style, className } = props;
const _a = buttonProps || {}, { size = 'lg', variant = 'outline' } = _a, restButtonProps = __rest(_a, ["size", "variant"]);
const Icon = icon;
return (React__default.createElement("div", { className: clsx('result', styles.container, className), style: style },
Icon && (React__default.createElement("div", { className: clsx('resultIconContainer', styles.iconContainer) },
React__default.createElement(Icon, { className: clsx('resultIcon', styles.icon) }))),
React__default.createElement(Title, { order: 3, size: "h3", className: clsx('resultTitle', styles.title) }, title),
React__default.createElement(Text, { className: clsx('resultDescription', styles.description) }, description),
button && (React__default.createElement(Button$1, Object.assign({}, restButtonProps, { size: size, variant: variant, className: clsx('resultButton', styles.button, restButtonProps.className) }), button))));
}
export { Badge, LoadingOverlay, MantineProvider, Result, Slider, TextArea };