@moysklad/uikit 28.1.0 → 31.20.0

package/dist/components/ViewersStack/components/Counter/Counter.js

@@ -0,0 +1,27 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { cn } from "../../../../common/index.js";
+import { Text, TextColor } from "../../../Text/Text.js";
+import common_module from "../common.module.js";
+import Counter_module from "./Counter.module.js";
+const Counter = ({ count, animated, className, ...restProps })=>{
+    const label = `+${count}`;
+    return /*#__PURE__*/ jsxs("div", {
+        ...restProps,
+        className: cn(common_module.wrapper, className),
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: cn(Counter_module.container, animated && common_module.animated),
+                "data-text": label
+            }),
+            /*#__PURE__*/ jsx(Text.Caption, {
+                testId: "counter",
+                colorToken: TextColor.primary,
+                className: common_module.text,
+                children: label
+            })
+        ]
+    });
+};
+Counter.displayName = 'Counter';
+export { Counter };

package/dist/components/ViewersStack/components/Counter/Counter.module.js

@@ -0,0 +1,5 @@
+import "./Counter_module.css";
+const Counter_module = {
+    container: "container-AMsfBs"
+};
+export default Counter_module;

package/dist/components/ViewersStack/components/Counter/Counter_module.css

@@ -0,0 +1,20 @@
+.container-AMsfBs {
+  background-color: var(--border-normal);
+  border: 1px solid var(--border-normal);
+  border-radius: 14px;
+  justify-content: center;
+  align-items: center;
+  height: 20px;
+  padding: 0 4px;
+  display: inline-flex;
+  position: relative;
+}
+
+.container-AMsfBs:after {
+  content: attr(data-text);
+  visibility: hidden;
+  white-space: nowrap;
+  font-size: 12px;
+  display: block;
+}
+

package/dist/components/ViewersStack/components/ViewersTooltip/ViewersTooltip.d.ts

@@ -0,0 +1,15 @@
+import { type PropsWithChildren } from 'react';
+import { type TooltipProps } from '../../../Tooltip/Tooltip';
+import type { ColoredViewer } from '../../types';
+type OmittedTooltipProps = 'visible' | 'onVisibleChange' | 'overlay' | 'trigger' | 'hideCloseButton' | 'placement' | 'offset';
+type ViewersTooltipCoreProps = Omit<TooltipProps, OmittedTooltipProps> & {
+    viewers: ColoredViewer | ColoredViewer[];
+    placement?: TooltipProps['placement'];
+    offset?: TooltipProps['offset'];
+};
+export type ViewersTooltipProps = PropsWithChildren<ViewersTooltipCoreProps>;
+export declare const ViewersTooltip: {
+    ({ children, viewers, overlayClassName, placement, offset, testId, ...restProps }: ViewersTooltipProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/components/ViewersStack/components/ViewersTooltip/ViewersTooltip.js

@@ -0,0 +1,41 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { cn } from "../../../../common/index.js";
+import { Placement, Tooltip } from "../../../Tooltip/Tooltip.js";
+import { ViewersTooltipOverlayItem } from "../ViewersTooltipOverlayItem/ViewersTooltipOverlayItem.js";
+import ViewersTooltip_module from "./ViewersTooltip.module.js";
+const ViewersTooltip = ({ children, viewers, overlayClassName, placement = Placement.BOTTOM_LEFT, offset = [
+    -10,
+    0
+], testId, ...restProps })=>{
+    const [visible, setVisible] = useState(false);
+    const list = useMemo(()=>{
+        if (Array.isArray(viewers)) return viewers;
+        return [
+            viewers
+        ];
+    }, [
+        viewers
+    ]);
+    return /*#__PURE__*/ jsx(Tooltip, {
+        ...restProps,
+        trigger: "hover",
+        visible: visible,
+        onVisibleChange: setVisible,
+        offset: offset,
+        placement: placement,
+        testId: testId,
+        hideCloseButton: true,
+        overlayClassName: cn(ViewersTooltip_module.overlay, overlayClassName),
+        overlay: /*#__PURE__*/ jsx("div", {
+            className: ViewersTooltip_module.overlayItems,
+            "data-test-id": "overlay-items",
+            children: list.map((viewer, index)=>/*#__PURE__*/ jsx(ViewersTooltipOverlayItem, {
+                    ...viewer
+                }, `${viewer.id}-${index}`))
+        }),
+        children: children
+    });
+};
+ViewersTooltip.displayName = 'ViewersTooltip';
+export { ViewersTooltip };

package/dist/components/ViewersStack/components/ViewersTooltip/ViewersTooltip.module.js

@@ -0,0 +1,6 @@
+import "./ViewersTooltip_module.css";
+const ViewersTooltip_module = {
+    overlay: "overlay-trbx8j",
+    overlayItems: "overlayItems-g_vTzt"
+};
+export default ViewersTooltip_module;

package/dist/components/ViewersStack/components/ViewersTooltip/ViewersTooltip_module.css

@@ -0,0 +1,14 @@
+.overlay-trbx8j {
+  width: fit-content;
+}
+
+.overlayItems-g_vTzt {
+  flex-direction: column;
+  justify-content: start;
+  gap: 8px;
+  max-width: 256px;
+  max-height: 400px;
+  display: flex;
+  overflow: auto;
+}
+

package/dist/components/ViewersStack/components/ViewersTooltipOverlayItem/ViewersTooltipOverlayItem.d.ts

@@ -0,0 +1,6 @@
+import { type ColoredViewer } from '../../types';
+export declare const isOverflowed: <T extends HTMLElement>(element: T) => boolean;
+export declare const ViewersTooltipOverlayItem: {
+    ({ id, label, image, color, }: ColoredViewer): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/ViewersStack/components/ViewersTooltipOverlayItem/ViewersTooltipOverlayItem.js

@@ -0,0 +1,53 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRef, useState } from "react";
+import { cn } from "../../../../common/index.js";
+import { Hint } from "../../../Hint/Hint.js";
+import { Text, TextColor } from "../../../Text/Text.js";
+import { Placement } from "../../../Tooltip/Tooltip.js";
+import { Size } from "../../types.js";
+import { Avatar } from "../Avatar/Avatar.js";
+import ViewersTooltipOverlayItem_module from "./ViewersTooltipOverlayItem.module.js";
+const isOverflowed = (element)=>element.scrollWidth > element.clientWidth;
+const ViewersTooltipOverlayItem = ({ id, label, image, color })=>{
+    const labelRef = useRef(null);
+    const [hintVisibility, setHintVisibility] = useState(false);
+    const handleVisibleChange = (visible)=>{
+        if (!labelRef.current) return;
+        if (visible && isOverflowed(labelRef.current)) setHintVisibility(true);
+        if (!visible) setHintVisibility(false);
+    };
+    return /*#__PURE__*/ jsxs("div", {
+        className: ViewersTooltipOverlayItem_module.container,
+        "data-test-id": "overlay-item",
+        children: [
+            /*#__PURE__*/ jsx(Avatar, {
+                size: Size.L,
+                color: color,
+                image: image,
+                label: label,
+                testId: `${id}-avatar`
+            }),
+            /*#__PURE__*/ jsx(Hint, {
+                mouseEnterDelay: 0.3,
+                mouseLeaveDelay: 0,
+                zIndex: 100,
+                visible: hintVisibility,
+                placement: Placement.BOTTOM,
+                onVisibleChange: handleVisibleChange,
+                overlay: /*#__PURE__*/ jsx(Text.Body, {
+                    testId: `${id}-label-hint-text`,
+                    colorToken: TextColor.invert,
+                    children: label
+                }),
+                children: /*#__PURE__*/ jsx(Text.Body, {
+                    className: cn(ViewersTooltipOverlayItem_module.ellipsis, ViewersTooltipOverlayItem_module.paddingRight),
+                    ref: labelRef,
+                    testId: `${id}-label`,
+                    children: label
+                })
+            })
+        ]
+    });
+};
+ViewersTooltipOverlayItem.displayName = 'ViewersTooltipOverlayItem';
+export { ViewersTooltipOverlayItem, isOverflowed };

package/dist/components/ViewersStack/components/ViewersTooltipOverlayItem/ViewersTooltipOverlayItem.module.js

@@ -0,0 +1,7 @@
+import "./ViewersTooltipOverlayItem_module.css";
+const ViewersTooltipOverlayItem_module = {
+    container: "container-o_NQY9",
+    ellipsis: "ellipsis-owqt58",
+    paddingRight: "paddingRight-aaAaAO"
+};
+export default ViewersTooltipOverlayItem_module;

package/dist/components/ViewersStack/components/ViewersTooltipOverlayItem/ViewersTooltipOverlayItem_module.css

@@ -0,0 +1,18 @@
+.container-o_NQY9 {
+  cursor: default;
+  justify-content: start;
+  align-items: center;
+  gap: 8px;
+  display: flex;
+}
+
+.ellipsis-owqt58 {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.paddingRight-aaAaAO {
+  padding-right: 8px;
+}
+

package/dist/components/ViewersStack/components/common.module.js

@@ -0,0 +1,7 @@
+import "./common_module.css";
+const common_module = {
+    wrapper: "wrapper-PSBfa1",
+    text: "text-sRc9nc",
+    animated: "animated-R8DWjF"
+};
+export default common_module;

package/dist/components/ViewersStack/components/common_module.css

@@ -0,0 +1,27 @@
+.wrapper-PSBfa1 {
+  justify-content: center;
+  align-items: center;
+  display: flex;
+  position: relative;
+}
+
+.text-sRc9nc {
+  pointer-events: none;
+  z-index: calc(var(--scaled-item-z-index) - 1);
+  position: absolute;
+}
+
+.wrapper-PSBfa1:hover .text-sRc9nc {
+  z-index: var(--scaled-item-z-index);
+}
+
+.animated-R8DWjF {
+  transform-origin: center;
+  transition: transform .2s ease-in-out;
+}
+
+.animated-R8DWjF:hover {
+  z-index: var(--scaled-item-z-index);
+  transform: scale(1.1);
+}
+

package/dist/components/ViewersStack/types.d.ts

@@ -0,0 +1,22 @@
+import type { ValueOf } from '../../common';
+export declare const Size: {
+    readonly M: "m";
+    readonly L: "l";
+};
+export type SizeValue = ValueOf<typeof Size>;
+export declare const Color: {
+    readonly GREEN: "green";
+    readonly YELLOW: "yellow";
+    readonly PINK: "pink";
+    readonly VIOLET: "violet";
+};
+export type ColorValue = ValueOf<typeof Color>;
+export declare const COLORS: ColorValue[];
+export type Viewer = {
+    id: string;
+    label: string;
+    image?: string;
+};
+export type ColoredViewer = Viewer & {
+    color?: ColorValue;
+};

package/dist/components/ViewersStack/types.js

@@ -0,0 +1,17 @@
+const Size = {
+    M: 'm',
+    L: 'l'
+};
+const Color = {
+    GREEN: 'green',
+    YELLOW: 'yellow',
+    PINK: 'pink',
+    VIOLET: 'violet'
+};
+const COLORS = [
+    Color.GREEN,
+    Color.YELLOW,
+    Color.PINK,
+    Color.VIOLET
+];
+export { COLORS, Color, Size };

package/dist/components/ViewersStack/utils.d.ts

@@ -0,0 +1,3 @@
+import type { CSSProperties } from 'react';
+export declare const getColorById: <T = string>(id: string, colors: T[]) => T;
+export declare const getScaledItemZIndexStyle: (tooltipZIndex: number) => CSSProperties;

package/dist/components/ViewersStack/utils.js

@@ -0,0 +1,17 @@
+const generateHash = (input)=>{
+    let hash = 0;
+    for (const char of input){
+        hash = (hash << 5) - hash + char.charCodeAt(0);
+        hash |= 0;
+    }
+    return hash;
+};
+const getColorById = (id, colors)=>{
+    const hash = generateHash(id);
+    const colorIndex = Math.abs(hash) % colors.length;
+    return colors[colorIndex];
+};
+const getScaledItemZIndexStyle = (tooltipZIndex)=>({
+        '--scaled-item-z-index': tooltipZIndex - 1
+    });
+export { getColorById, getScaledItemZIndexStyle };

package/dist/components/_shared/CustomDatepickerDropdownContent/CustomDatepickerDropdownContent.d.ts

@@ -0,0 +1,12 @@
+import { type ReactNode } from 'react';
+interface CustomDatepickerDropdownContentProps {
+    testId?: string;
+    label?: string;
+    helperText?: string;
+    error?: boolean;
+    input: ReactNode;
+    calendar: ReactNode;
+    onOpen?: () => void;
+}
+export declare const CustomDatepickerDropdownContent: (props: CustomDatepickerDropdownContentProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/{LabelValueDate/DropdownContent/index.js → _shared/CustomDatepickerDropdownContent/CustomDatepickerDropdownContent.js}

@@ -1,26 +1,26 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect } from "react";
-import { Info } from "../../Info/Info.js";
+import { Info } from "../Info/Info.js";
 import { Label } from "../../Label/Label.js";
-import DropdownContent_module from "./DropdownContent.module.js";
-const DropdownContent = (props)=>{
+import CustomDatepickerDropdownContent_module from "./CustomDatepickerDropdownContent.module.js";
+const CustomDatepickerDropdownContent = (props)=>{
     useEffect(()=>{
         props.onOpen?.();
     }, []);
     return /*#__PURE__*/ jsxs("div", {
-        className: DropdownContent_module.dropdown,
+        className: CustomDatepickerDropdownContent_module.dropdown,
         children: [
             /*#__PURE__*/ jsx("div", {
-                className: DropdownContent_module.inputSizer,
+                className: CustomDatepickerDropdownContent_module.inputSizer,
                 children: /*#__PURE__*/ jsxs("div", {
-                    className: DropdownContent_module.inputWithLabel,
+                    className: CustomDatepickerDropdownContent_module.inputWithLabel,
                     children: [
-                        /*#__PURE__*/ jsx(Label, {
+                        !!props.label && /*#__PURE__*/ jsx(Label, {
                             label: props.label,
                             testId: props.testId
                         }),
                         /*#__PURE__*/ jsx("div", {
-                            className: DropdownContent_module.inputWrapper,
+                            className: CustomDatepickerDropdownContent_module.inputWrapper,
                             children: props.input
                         }),
                         /*#__PURE__*/ jsx(Info, {
@@ -33,10 +33,10 @@ const DropdownContent = (props)=>{
                 })
             }),
             /*#__PURE__*/ jsx("div", {
-                className: DropdownContent_module.divider
+                className: CustomDatepickerDropdownContent_module.divider
             }),
             props.calendar
         ]
     });
 };
-export { DropdownContent };
+export { CustomDatepickerDropdownContent };

package/dist/components/_shared/CustomDatepickerDropdownContent/CustomDatepickerDropdownContent.module.js

@@ -0,0 +1,9 @@
+import "./CustomDatepickerDropdownContent_module.css";
+const CustomDatepickerDropdownContent_module = {
+    dropdown: "dropdown-TsKcn7",
+    inputSizer: "inputSizer-vY03AZ",
+    inputWithLabel: "inputWithLabel-pR32GD",
+    inputWrapper: "inputWrapper-BS39ha",
+    divider: "divider-fqPGeS"
+};
+export default CustomDatepickerDropdownContent_module;

package/dist/components/{LabelValueDate/DropdownContent/DropdownContent_module.css → _shared/CustomDatepickerDropdownContent/CustomDatepickerDropdownContent_module.css}

@@ -1,12 +1,12 @@
-.dropdown-ai9ycV {
+.dropdown-TsKcn7 {
   padding: 4px;
 }
 
-.inputSizer-WLN8cJ {
+.inputSizer-vY03AZ {
   display: flex;
 }
 
-.inputWithLabel-Dk82Xo {
+.inputWithLabel-pR32GD {
   flex-direction: column;
   flex: 1;
   gap: 4px;
@@ -16,18 +16,18 @@
   overflow: hidden;
 }
 
-.inputWrapper-YGluDz {
+.inputWrapper-BS39ha {
   width: fit-content;
   position: relative;
 }
 
-.divider-KB4Z9E {
+.divider-fqPGeS {
   box-sizing: border-box;
   width: 100%;
   padding: 6px;
 }
 
-.divider-KB4Z9E:after {
+.divider-fqPGeS:after {
   background-color: var(--border-normal, #d1d6df);
   content: "";
   height: 1px;

package/dist/components/_shared/FieldLabel/FieldLabel.constants.d.ts

@@ -0,0 +1 @@
+export declare const OPEN_BUTTONS: string[];

package/dist/components/_shared/FieldLabel/FieldLabel.constants.js

@@ -0,0 +1,5 @@
+const OPEN_BUTTONS = [
+    ' ',
+    'Enter'
+];
+export { OPEN_BUTTONS };

package/dist/components/_shared/FieldLabel/FieldLabel.d.ts

@@ -0,0 +1,18 @@
+import { type LabelHTMLAttributes, type Ref } from 'react';
+import type { IHasTestId } from '../../../common';
+import { type HelpProps, type HelpSizeValue } from '../../Help/Help';
+import { type TextProps } from '../../Text/Text';
+export interface FieldLabelProps extends IHasTestId, Pick<TextProps, 'colorToken' | 'variant'>, Omit<LabelHTMLAttributes<HTMLLabelElement>, 'children' | 'className' | 'color'> {
+    label?: string;
+    labelRef?: Ref<HTMLLabelElement>;
+    required?: boolean;
+    helpProps?: Omit<HelpProps, 'testId'>;
+    helpSize?: HelpSizeValue;
+    className?: string;
+    helpButtonClassName?: string;
+    onOverflowChange?: (isOverflowing: boolean) => void;
+}
+export declare const FieldLabel: {
+    ({ label, labelRef: labelRefProp, required, variant, colorToken, helpProps, helpSize, className, helpButtonClassName, testId, onOverflowChange, ...restProps }: FieldLabelProps): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};

package/dist/components/_shared/FieldLabel/FieldLabel.js

@@ -0,0 +1,83 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { cn } from "../../../common/css/cn.js";
+import { mergeRefs } from "../../../common/react/mergeRefs.js";
+import { getOptionalTestId } from "../../../common/testId/index.js";
+import { HelpSize } from "../../Help/Help.js";
+import { Hint } from "../../Hint/Hint.js";
+import { Text, TextColor, TextTag, TextVariant } from "../../Text/Text.js";
+import { TextAtom } from "../../Text/Text.atom.js";
+import { useIsElementOverflowing } from "../../../hooks/useIsElementOverflowing/index.js";
+import { HelpButton } from "./components/index.js";
+import FieldLabel_module from "./FieldLabel.module.js";
+const FieldLabel = ({ label, labelRef: labelRefProp, required, variant = TextVariant.body, colorToken = TextColor.primary, helpProps, helpSize = HelpSize.M, className, helpButtonClassName, testId, onOverflowChange, ...restProps })=>{
+    const { ref: labelRef, isOverflowing: isOverflowingLabel, getIsOverflowing: getIsLabelOverflowing } = useIsElementOverflowing([
+        label
+    ]);
+    const [isHintVisible, setIsHintVisible] = useState(false);
+    useEffect(()=>{
+        onOverflowChange?.(isOverflowingLabel);
+    }, [
+        isOverflowingLabel,
+        onOverflowChange
+    ]);
+    const helpPopup = helpProps?.popup;
+    if (!label) return null;
+    const handleVisibilityChange = (visible)=>{
+        if (visible && !getIsLabelOverflowing()) return;
+        setIsHintVisible(visible);
+    };
+    return /*#__PURE__*/ jsxs("div", {
+        "data-test-id": getOptionalTestId(testId, 'label-container'),
+        className: cn(FieldLabel_module.container, className),
+        children: [
+            /*#__PURE__*/ jsxs("div", {
+                className: FieldLabel_module.textWithRequiredMark,
+                children: [
+                    /*#__PURE__*/ jsx(Hint, {
+                        visible: isHintVisible,
+                        onVisibleChange: handleVisibilityChange,
+                        overlay: /*#__PURE__*/ jsx(Text.Body, {
+                            testId: getOptionalTestId(testId, 'label-hint-text'),
+                            colorToken: "invert",
+                            className: FieldLabel_module.hintText,
+                            children: label
+                        }),
+                        overlayClassName: FieldLabel_module.hint,
+                        children: /*#__PURE__*/ jsx(Text, {
+                            ...restProps,
+                            as: restProps.htmlFor ? TextTag.label : TextTag.span,
+                            ref: mergeRefs([
+                                labelRef,
+                                labelRefProp
+                            ]),
+                            variant: variant,
+                            testId: getOptionalTestId(testId, 'label'),
+                            className: cn(FieldLabel_module.overflowText, FieldLabel_module.labelText),
+                            colorToken: colorToken,
+                            children: label
+                        })
+                    }),
+                    required && /*#__PURE__*/ jsx(TextAtom, {
+                        as: TextTag.span,
+                        variant: variant,
+                        testId: getOptionalTestId(testId, 'required-mark'),
+                        className: FieldLabel_module.requiredMark,
+                        children: "*"
+                    })
+                ]
+            }),
+            helpPopup ? /*#__PURE__*/ jsx(HelpButton, {
+                helpProps: {
+                    ...helpProps,
+                    popup: helpPopup,
+                    testId: getOptionalTestId(testId, 'help')
+                },
+                size: helpSize,
+                className: helpButtonClassName
+            }) : null
+        ]
+    });
+};
+FieldLabel.displayName = 'FieldLabel';
+export { FieldLabel };

package/dist/components/_shared/FieldLabel/FieldLabel.module.js

@@ -0,0 +1,11 @@
+import "./FieldLabel_module.css";
+const FieldLabel_module = {
+    container: "container-Oy3B6y",
+    textWithRequiredMark: "textWithRequiredMark-RgeNds",
+    labelText: "labelText-DXFBW5",
+    requiredMark: "requiredMark-DNwhjO",
+    overflowText: "overflowText-pVcM4P",
+    hint: "hint-nBYA67",
+    hintText: "hintText-ZiFJHZ"
+};
+export default FieldLabel_module;

package/dist/components/_shared/FieldLabel/FieldLabel_module.css

@@ -0,0 +1,42 @@
+.container-Oy3B6y {
+  justify-content: flex-start;
+  align-items: center;
+  gap: 4px;
+  display: flex;
+}
+
+.textWithRequiredMark-RgeNds {
+  align-items: center;
+  display: flex;
+  overflow: hidden;
+}
+
+.labelText-DXFBW5 {
+  flex: 1;
+}
+
+.requiredMark-DNwhjO {
+  color: var(--elements-critical, #e50347);
+}
+
+.overflowText-pVcM4P {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.overflowText-pVcM4P:after {
+  content: "";
+  display: block;
+}
+
+.hint-nBYA67 {
+  box-sizing: border-box;
+  overflow-wrap: break-word;
+  max-width: 300px;
+}
+
+.hintText-ZiFJHZ {
+  overflow-wrap: break-word;
+}
+

package/dist/components/_shared/FieldLabel/components/HelpButton.d.ts

@@ -0,0 +1,8 @@
+import { type HelpProps, type HelpSizeValue } from '../../../Help/Help';
+interface HelpButtonProps {
+    size: HelpSizeValue;
+    helpProps: HelpProps;
+    className?: string;
+}
+export declare const HelpButton: ({ size, helpProps, className }: HelpButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/_shared/FieldLabel/components/HelpButton.js

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../../../common/css/cn.js";
+import { Help } from "../../../Help/Help.js";
+import HelpButton_module from "./HelpButton.module.js";
+const HelpButton = ({ size, helpProps, className })=>/*#__PURE__*/ jsx("div", {
+        className: cn(HelpButton_module.container, className),
+        onClick: (event)=>{
+            event.stopPropagation();
+        },
+        children: /*#__PURE__*/ jsx(Help, {
+            ...helpProps,
+            size: size
+        })
+    });
+export { HelpButton };

package/dist/components/_shared/FieldLabel/components/HelpButton.module.js

@@ -0,0 +1,5 @@
+import "./HelpButton_module.css";
+const HelpButton_module = {
+    container: "container-fOhKnl"
+};
+export default HelpButton_module;

package/dist/components/_shared/FieldLabel/components/HelpButton_module.css

@@ -0,0 +1,8 @@
+.container-fOhKnl {
+  -webkit-user-select: none;
+  user-select: none;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+

package/dist/components/_shared/FieldLabel/components/index.d.ts

@@ -0,0 +1 @@
+export * from './HelpButton';

package/dist/components/_shared/FieldLabel/components/index.js

@@ -0,0 +1 @@
+export * from "./HelpButton.js";