@infomaximum/ui-kit 0.9.1

package/dist/components/InternalPicker/styles/Popup.styles.js

@@ -0,0 +1,73 @@
+import { getPickerTimePanelStyle } from "./TimePanel.styles.js";
+import { getPickerDatePanelStyle } from "./DatePanel.styles.js";
+import { prefixCls } from "./common.styles.js";
+const getPickerDropdownStyle = (theme) => ({
+  position: "absolute",
+  zIndex: 1050,
+  ...theme.typography.body2,
+  [`&.${prefixCls}-dropdown-hidden`]: {
+    display: "none"
+  }
+});
+const getPickerRangeWrapperStyle = () => ({
+  [`.${prefixCls}-range-wrapper`]: {
+    display: "flex"
+  }
+});
+const getPickerPanelContainerStyle = (pickerTokens, theme) => ({
+  [`.${prefixCls}-panel-container`]: {
+    display: "inline-flex",
+    borderRadius: theme.borderRadiusL,
+    background: pickerTokens.pickerBg,
+    boxShadow: theme.shadow2
+  }
+});
+const getPickerPanelsStyle = () => ({
+  [`.${prefixCls}-panels`]: {
+    display: "inline-flex"
+  }
+});
+const getPickerFooterStyle = (theme) => ({
+  [`.${prefixCls}-footer`]: {
+    borderTop: `1px solid ${theme.lineDivider}`
+  }
+});
+const getPickerRangesStyle = (theme) => ({
+  [`.${prefixCls}-ranges`]: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    padding: `${theme.paddingM}px ${theme.paddingL}px`,
+    margin: 0,
+    listStyle: "none"
+  }
+});
+const getPickerOkStyle = () => ({
+  [`.${prefixCls}-ok`]: {
+    marginLeft: "auto"
+  }
+});
+const getPickerNowBtnStyle = (pickerTokens) => ({
+  [`.${prefixCls}-now-btn`]: {
+    cursor: "pointer",
+    color: pickerTokens.pickerNow,
+    ":hover": {
+      color: pickerTokens.pickerNowHover
+    }
+  }
+});
+const getPopupStyle = (pickerTokens) => (theme) => ({
+  ...getPickerDropdownStyle(theme),
+  ...getPickerRangeWrapperStyle(),
+  ...getPickerPanelContainerStyle(pickerTokens, theme),
+  ...getPickerPanelsStyle(),
+  ...getPickerTimePanelStyle(pickerTokens, theme),
+  ...getPickerDatePanelStyle(pickerTokens, theme),
+  ...getPickerFooterStyle(theme),
+  ...getPickerRangesStyle(theme),
+  ...getPickerOkStyle(),
+  ...getPickerNowBtnStyle(pickerTokens)
+});
+export {
+  getPopupStyle
+};

package/dist/components/InternalPicker/styles/RangeSelector.styles.d.ts

@@ -0,0 +1,130 @@
+import { Theme } from '../../../themes';
+import { PickerTokens } from '..';
+export declare const getRangeSelectorStyle: (pickerTokens: PickerTokens) => (theme: Theme) => {
+    "& .picker-clear": {
+        right: number;
+        top: string;
+        transform: string;
+    };
+    ".picker-range-separator": {
+        display: string;
+        fontSize: 16;
+    };
+    ".picker-separator": {
+        display: string;
+        color: "#BFBFBF";
+    };
+    "&.picker-disabled .picker-separator": {
+        color: "#8C8C8C";
+    };
+    ".picker-active-bar": {
+        height: number;
+        bottom: number;
+        opacity: number;
+        background: "#0CB3B3";
+    };
+    "&.picker-error-status .picker-active-bar": {
+        background: "#FF4D4F";
+    };
+    "&.picker-focused .picker-active-bar": {
+        opacity: number;
+    };
+    ".picker-clear": {
+        readonly cursor: "pointer";
+        readonly display: "flex";
+        readonly position: "absolute";
+        readonly right: 0;
+        readonly fontSize: 16;
+        readonly color: `rgba(${number}, ${number}, ${number}, 0.3)`;
+        readonly opacity: 0;
+        readonly ":hover": {
+            readonly color: `rgba(${number}, ${number}, ${number}, 0.7)`;
+        };
+    };
+    "&:hover .picker-clear": {
+        readonly opacity: 1;
+    };
+    ".picker-suffix": {
+        display: string;
+        color: "#BFBFBF";
+        fontSize: 16;
+    };
+    "&:hover .picker-suffix:not(:last-child)": {
+        opacity: number;
+    };
+    "&.picker-disabled .picker-suffix": {
+        color: "#8C8C8C";
+    };
+    ".picker-input > input": {
+        "::placeholder": {
+            color: "#BFBFBF";
+        };
+        fontFamily: "Roboto";
+        fontSize: 14;
+        lineHeight: "20px";
+        padding: number;
+        width: string;
+        border: string;
+        outline: string;
+        cursor: string;
+        background: string;
+    };
+    ".picker-input > input:placeholder-shown": {
+        textOverflow: string;
+    };
+    ":not(.picker-disabled) .picker-input > input": {
+        color: "#262626";
+    };
+    ":not(.picker-disabled) .picker-input-placeholder > input": {
+        color: "#BFBFBF";
+    };
+    "&.picker-disabled .picker-input > input": {
+        color: "#8C8C8C";
+        "::placeholder": {
+            color: string;
+        };
+    };
+    ".picker-input > input[disabled]": {
+        cursor: string;
+        color: "#8C8C8C";
+    };
+    ".picker-input": {
+        readonly position: "relative";
+        readonly display: "inline-flex";
+        readonly alignItems: "center";
+        readonly columnGap: 8;
+        readonly width: "100%";
+    };
+    position: "relative";
+    display: "inline-flex";
+    width: "100%";
+    columnGap: 8;
+    boxSizing: "border-box";
+    background: "#FFFFFF";
+    borderWidth: 1;
+    borderStyle: "solid";
+    borderColor: "#D9D9D9";
+    borderRadius: 4;
+    paddingBlock: number;
+    paddingInline: number;
+    ":focus, :focus-within": {
+        readonly borderColor: "#0CB3B3";
+        readonly boxShadow: `0px 0px 4px 0px rgba(${number}, ${number}, ${number}, 0.5)`;
+    };
+    ":not(.picker-disabled):hover": {
+        readonly borderColor: "#50CCC4";
+    };
+    "&.picker-disabled": {
+        readonly cursor: "not-allowed";
+        readonly background: "#F0F0F0";
+    };
+    "&.picker-error-status": {
+        readonly borderColor: "#FF4D4F";
+        readonly ":focus, :focus-within": {
+            readonly boxShadow: `0px 0px 4px 0px rgba(${number}, ${number}, ${number}, 0.5)`;
+        };
+    };
+    ":not(.picker-disabled).picker-error-status:hover": {
+        readonly borderColor: "#FF7875";
+    };
+};

package/dist/components/InternalPicker/styles/RangeSelector.styles.js

@@ -0,0 +1,45 @@
+import { getSingleSelectorStyle } from "./SingleSelector.styles.js";
+import { prefixCls } from "./common.styles.js";
+const getPickerActiveBarStyle = (pickerTokens) => ({
+  [`.${prefixCls}-active-bar`]: {
+    height: 2,
+    bottom: -1,
+    opacity: 0,
+    background: pickerTokens.pickerActive
+  },
+  [`&.${prefixCls}-error-status .${prefixCls}-active-bar`]: {
+    background: pickerTokens.pickerBorderDanger
+  },
+  [`&.${prefixCls}-focused .${prefixCls}-active-bar`]: {
+    opacity: 1
+  }
+});
+const getPickerSeparatorStyle = (pickerTokens, theme) => ({
+  [`.${prefixCls}-range-separator`]: {
+    display: "flex",
+    fontSize: theme.iconM
+  },
+  [`.${prefixCls}-separator`]: {
+    display: "flex",
+    color: pickerTokens.pickerPlaceholder
+  },
+  [`&.${prefixCls}-disabled .${prefixCls}-separator`]: {
+    color: pickerTokens.pickerTextDisabled
+  }
+});
+const getPickerClearIconWrapperStyle = (pickerTokens) => ({
+  [`& .${prefixCls}-clear`]: {
+    right: pickerTokens.pickerPaddingHorizontal - 1,
+    top: "50%",
+    transform: "translateY(-50%)"
+  }
+});
+const getRangeSelectorStyle = (pickerTokens) => (theme) => ({
+  ...getSingleSelectorStyle(pickerTokens)(theme),
+  ...getPickerActiveBarStyle(pickerTokens),
+  ...getPickerSeparatorStyle(pickerTokens, theme),
+  ...getPickerClearIconWrapperStyle(pickerTokens)
+});
+export {
+  getRangeSelectorStyle
+};

package/dist/components/InternalPicker/styles/SingleSelector.styles.d.ts

@@ -0,0 +1,102 @@
+import { Theme } from '../../../themes';
+import { PickerTokens } from '..';
+export declare const getSingleSelectorStyle: (pickerTokens: PickerTokens) => (theme: Theme) => {
+    ".picker-clear": {
+        readonly cursor: "pointer";
+        readonly display: "flex";
+        readonly position: "absolute";
+        readonly right: 0;
+        readonly fontSize: 16;
+        readonly color: `rgba(${number}, ${number}, ${number}, 0.3)`;
+        readonly opacity: 0;
+        readonly ":hover": {
+            readonly color: `rgba(${number}, ${number}, ${number}, 0.7)`;
+        };
+    };
+    "&:hover .picker-clear": {
+        readonly opacity: 1;
+    };
+    ".picker-suffix": {
+        display: string;
+        color: "#BFBFBF";
+        fontSize: 16;
+    };
+    "&:hover .picker-suffix:not(:last-child)": {
+        opacity: number;
+    };
+    "&.picker-disabled .picker-suffix": {
+        color: "#8C8C8C";
+    };
+    ".picker-input > input": {
+        "::placeholder": {
+            color: "#BFBFBF";
+        };
+        fontFamily: "Roboto";
+        fontSize: 14;
+        lineHeight: "20px";
+        padding: number;
+        width: string;
+        border: string;
+        outline: string;
+        cursor: string;
+        background: string;
+    };
+    ".picker-input > input:placeholder-shown": {
+        textOverflow: string;
+    };
+    ":not(.picker-disabled) .picker-input > input": {
+        color: "#262626";
+    };
+    ":not(.picker-disabled) .picker-input-placeholder > input": {
+        color: "#BFBFBF";
+    };
+    "&.picker-disabled .picker-input > input": {
+        color: "#8C8C8C";
+        "::placeholder": {
+            color: string;
+        };
+    };
+    ".picker-input > input[disabled]": {
+        cursor: string;
+        color: "#8C8C8C";
+    };
+    ".picker-input": {
+        readonly position: "relative";
+        readonly display: "inline-flex";
+        readonly alignItems: "center";
+        readonly columnGap: 8;
+        readonly width: "100%";
+    };
+    position: "relative";
+    display: "inline-flex";
+    width: "100%";
+    columnGap: 8;
+    boxSizing: "border-box";
+    background: "#FFFFFF";
+    borderWidth: 1;
+    borderStyle: "solid";
+    borderColor: "#D9D9D9";
+    borderRadius: 4;
+    paddingBlock: number;
+    paddingInline: number;
+    ":focus, :focus-within": {
+        readonly borderColor: "#0CB3B3";
+        readonly boxShadow: `0px 0px 4px 0px rgba(${number}, ${number}, ${number}, 0.5)`;
+    };
+    ":not(.picker-disabled):hover": {
+        readonly borderColor: "#50CCC4";
+    };
+    "&.picker-disabled": {
+        readonly cursor: "not-allowed";
+        readonly background: "#F0F0F0";
+    };
+    "&.picker-error-status": {
+        readonly borderColor: "#FF4D4F";
+        readonly ":focus, :focus-within": {
+            readonly boxShadow: `0px 0px 4px 0px rgba(${number}, ${number}, ${number}, 0.5)`;
+        };
+    };
+    ":not(.picker-disabled).picker-error-status:hover": {
+        readonly borderColor: "#FF7875";
+    };
+};

package/dist/components/InternalPicker/styles/SingleSelector.styles.js

@@ -0,0 +1,117 @@
+import { prefixCls } from "./common.styles.js";
+const getPickerStyle = (pickerTokens, theme) => ({
+  position: "relative",
+  display: "inline-flex",
+  width: "100%",
+  columnGap: theme.marginM,
+  boxSizing: "border-box",
+  background: pickerTokens.pickerBg,
+  borderWidth: 1,
+  borderStyle: "solid",
+  borderColor: pickerTokens.pickerBorder,
+  borderRadius: theme.borderRadiusM,
+  paddingBlock: pickerTokens.pickerPaddingVertical - 1,
+  paddingInline: pickerTokens.pickerPaddingHorizontal - 1,
+  ":focus, :focus-within": {
+    borderColor: pickerTokens.pickerActive,
+    boxShadow: `0px 0px 4px 0px ${theme.fieldFocused}`
+  },
+  [`:not(.${prefixCls}-disabled):hover`]: {
+    borderColor: pickerTokens.pickerHover
+  },
+  [`&.${prefixCls}-disabled`]: {
+    cursor: "not-allowed",
+    background: pickerTokens.pickerBgDisabled
+  },
+  [`&.${prefixCls}-error-status`]: {
+    borderColor: pickerTokens.pickerBorderDanger,
+    ":focus, :focus-within": {
+      boxShadow: `0px 0px 4px 0px ${theme.fieldFocusedDanger}`
+    }
+  },
+  [`:not(.${prefixCls}-disabled).${prefixCls}-error-status:hover`]: {
+    borderColor: pickerTokens.pickerBorderDangerHover
+  }
+});
+const getPickerInputWrapperStyle = (theme) => ({
+  [`.${prefixCls}-input`]: {
+    position: "relative",
+    display: "inline-flex",
+    alignItems: "center",
+    columnGap: theme.marginM,
+    width: "100%"
+  }
+});
+const getPickerInputStyle = (pickerTokens, theme) => ({
+  [`.${prefixCls}-input > input`]: {
+    padding: 0,
+    width: "100%",
+    border: "none",
+    outline: "none",
+    cursor: "inherit",
+    background: "inherit",
+    ...theme.typography.body2,
+    "::placeholder": {
+      color: pickerTokens.pickerPlaceholder
+    }
+  },
+  [`.${prefixCls}-input > input:placeholder-shown`]: {
+    textOverflow: "ellipsis"
+  },
+  [`:not(.${prefixCls}-disabled) .${prefixCls}-input > input`]: {
+    color: pickerTokens.pickerText
+  },
+  [`:not(.${prefixCls}-disabled) .${prefixCls}-input-placeholder > input`]: {
+    color: pickerTokens.pickerPlaceholder
+  },
+  [`&.${prefixCls}-disabled .${prefixCls}-input > input`]: {
+    color: pickerTokens.pickerTextDisabled,
+    "::placeholder": {
+      color: "inherit"
+    }
+  },
+  [`.${prefixCls}-input > input[disabled]`]: {
+    cursor: "not-allowed",
+    color: pickerTokens.pickerTextDisabled
+  }
+});
+const getPickerSuffixStyle = (pickerTokens, theme) => ({
+  [`.${prefixCls}-suffix`]: {
+    display: "flex",
+    color: pickerTokens.pickerPlaceholder,
+    fontSize: theme.iconM
+  },
+  [`&:hover .${prefixCls}-suffix:not(:last-child)`]: {
+    opacity: 0
+  },
+  [`&.${prefixCls}-disabled .${prefixCls}-suffix`]: {
+    color: pickerTokens.pickerTextDisabled
+  }
+});
+const getPickerClearIconWrapperStyle = (theme) => ({
+  [`.${prefixCls}-clear`]: {
+    cursor: "pointer",
+    display: "flex",
+    position: "absolute",
+    right: 0,
+    fontSize: theme.iconM,
+    color: theme.textIcon,
+    opacity: 0,
+    ":hover": {
+      color: theme.textIconHover
+    }
+  },
+  [`&:hover .${prefixCls}-clear`]: {
+    opacity: 1
+  }
+});
+const getSingleSelectorStyle = (pickerTokens) => (theme) => ({
+  ...getPickerStyle(pickerTokens, theme),
+  ...getPickerInputWrapperStyle(theme),
+  ...getPickerInputStyle(pickerTokens, theme),
+  ...getPickerSuffixStyle(pickerTokens, theme),
+  ...getPickerClearIconWrapperStyle(theme)
+});
+export {
+  getSingleSelectorStyle
+};

package/dist/components/InternalPicker/styles/TimePanel.styles.d.ts

@@ -0,0 +1,49 @@
+import { Theme } from 'themes';
+import { PickerTokens } from '../tokens';
+export declare const getPickerTimePanelStyle: (pickerTokens: PickerTokens, theme: Theme) => {
+    ".picker-time-panel-cell": {
+        readonly marginInline: 4;
+    };
+    "&& .picker-time-panel-cell-inner": {
+        readonly cursor: "pointer";
+        readonly boxSizing: "border-box";
+        readonly width: number;
+        readonly padding: "4px 0px 4px 12px";
+        readonly borderRadius: 4;
+        readonly ":hover": {
+            readonly background: "#F5F5F5";
+        };
+    };
+    ".picker-time-panel-cell-selected .picker-time-panel-cell-inner": {
+        readonly background: "#E1FAF6";
+    };
+    ".picker-time-panel-cell-disabled .picker-time-panel-cell-inner": {
+        readonly cursor: "not-allowed";
+        readonly color: "#BFBFBF";
+    };
+    ".picker-time-panel-column": {
+        readonly scrollbarWidth: "thin";
+        readonly boxSizing: "border-box";
+        readonly listStyle: "none";
+        readonly margin: "4px 0";
+        readonly padding: 0;
+        readonly width: number;
+        readonly overflow: "hidden";
+        readonly ":hover": {
+            readonly overflowY: "auto";
+        };
+        readonly ":not(:first-of-type)": {
+            readonly borderInlineStart: "1px solid #E5E5E5";
+        };
+    };
+    ".picker-time-panel .picker-content": {
+        display: string;
+        height: number;
+        flex: string;
+    };
+    ".picker-datetime-panel .picker-time-panel": {
+        readonly display: "flex";
+        readonly flexDirection: "column";
+        readonly borderInlineStart: "1px solid #E5E5E5";
+    };
+};

package/dist/components/InternalPicker/styles/TimePanel.styles.js

@@ -0,0 +1,64 @@
+import { prefixCls } from "./common.styles.js";
+const getPickerTimePanelInnerStyle = (theme) => ({
+  [`.${prefixCls}-datetime-panel .${prefixCls}-time-panel`]: {
+    display: "flex",
+    flexDirection: "column",
+    borderInlineStart: `1px solid ${theme.lineDivider}`
+  }
+});
+const getPickerTimePanelContentStyle = () => ({
+  [`.${prefixCls}-time-panel .${prefixCls}-content`]: {
+    display: "flex",
+    height: 224,
+    flex: "auto"
+  }
+});
+const getPickerTimePanelColumnStyle = (pickerTokens, theme) => ({
+  [`.${prefixCls}-time-panel-column`]: {
+    scrollbarWidth: "thin",
+    // TODO: пока непонятно, на чьей стороне стилизация скролла, пока без задачи.
+    boxSizing: "border-box",
+    listStyle: "none",
+    margin: `${theme.paddingXS}px 0`,
+    padding: 0,
+    width: pickerTokens.pickerTimeColumnWidth,
+    overflow: "hidden",
+    ":hover": {
+      overflowY: "auto"
+    },
+    ":not(:first-of-type)": {
+      borderInlineStart: `1px solid ${theme.lineDivider}`
+    }
+  }
+});
+const getPickerTimePanelCellStyle = (pickerTokens, theme) => ({
+  [`.${prefixCls}-time-panel-cell`]: {
+    marginInline: theme.paddingXS
+  },
+  [`&& .${prefixCls}-time-panel-cell-inner`]: {
+    cursor: "pointer",
+    boxSizing: "border-box",
+    width: pickerTokens.pickerTimeColumnWidth - 2 * theme.paddingXS,
+    padding: `${pickerTokens.pickerPaddingVertical}px 0px ${pickerTokens.pickerPaddingVertical}px ${pickerTokens.pickerPaddingHorizontal}px`,
+    borderRadius: theme.borderRadiusM,
+    ":hover": {
+      background: pickerTokens.pickerCellSecondaryBgHover
+    }
+  },
+  [`.${prefixCls}-time-panel-cell-selected .${prefixCls}-time-panel-cell-inner`]: {
+    background: pickerTokens.pickerCellWithRangeBgActive
+  },
+  [`.${prefixCls}-time-panel-cell-disabled .${prefixCls}-time-panel-cell-inner`]: {
+    cursor: "not-allowed",
+    color: pickerTokens.pickerTextSecondary
+  }
+});
+const getPickerTimePanelStyle = (pickerTokens, theme) => ({
+  ...getPickerTimePanelInnerStyle(theme),
+  ...getPickerTimePanelContentStyle(),
+  ...getPickerTimePanelColumnStyle(pickerTokens, theme),
+  ...getPickerTimePanelCellStyle(pickerTokens, theme)
+});
+export {
+  getPickerTimePanelStyle
+};

package/dist/components/InternalPicker/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const prefixCls = "picker";

package/dist/components/InternalPicker/styles/common.styles.js

@@ -0,0 +1,4 @@
+const prefixCls = "picker";
+export {
+  prefixCls
+};

package/dist/components/InternalPicker/styles/index.d.ts

@@ -0,0 +1,4 @@
+export { getSingleSelectorStyle } from './SingleSelector.styles';
+export { getRangeSelectorStyle } from './RangeSelector.styles';
+export { getPopupStyle } from './Popup.styles';
+export { prefixCls } from './common.styles';

package/dist/components/InternalPicker/tokens.d.ts

@@ -0,0 +1,29 @@
+import { Theme } from '../../themes';
+export declare const getPickerTokens: (theme: Theme) => {
+    pickerHover: "#50CCC4";
+    pickerActive: "#0CB3B3";
+    pickerBorder: "#D9D9D9";
+    pickerBorderDanger: "#FF4D4F";
+    pickerBorderDangerHover: "#FF7875";
+    pickerBg: "#FFFFFF";
+    pickerBgDisabled: "#F0F0F0";
+    pickerPlaceholder: "#BFBFBF";
+    pickerText: "#262626";
+    pickerTextContrast: "#FFFFFF";
+    pickerTextDisabled: "#8C8C8C";
+    pickerTextSecondary: "#BFBFBF";
+    pickerNow: "#0CB3B3";
+    pickerNowHover: "#50CCC4";
+    pickerCellSecondaryBgHover: "#F5F5F5";
+    pickerCellWithRangeBgActive: "#E1FAF6";
+    pickerPaddingVertical: 4;
+    pickerPaddingHorizontal: 12;
+    pickerCellHeight: number;
+    pickerCellWidth: number;
+    pickerHeaderHeight: number;
+    pickerTimeCellHeight: number;
+    pickerTimeColumnWidth: number;
+    pickerWithoutTimeCellMinWidth: number;
+    pickerWithoutTimeCellHeight: number;
+};
+export type PickerTokens = ReturnType<typeof getPickerTokens>;

package/dist/components/InternalPicker/tokens.js

@@ -0,0 +1,30 @@
+const getPickerTokens = (theme) => ({
+  pickerHover: theme.primaryHover,
+  pickerActive: theme.primaryBase,
+  pickerBorder: theme.lineBorder,
+  pickerBorderDanger: theme.dangerBase,
+  pickerBorderDangerHover: theme.dangerHover,
+  pickerBg: theme.bgContainer,
+  pickerBgDisabled: theme.bgContainerDisabled,
+  pickerPlaceholder: theme.textHint,
+  pickerText: theme.textPrimary,
+  pickerTextContrast: theme.textContrast,
+  pickerTextDisabled: theme.textDisabled,
+  pickerTextSecondary: theme.textHint,
+  pickerNow: theme.textLink,
+  pickerNowHover: theme.textLinkHover,
+  pickerCellSecondaryBgHover: theme.bgContainerHover,
+  pickerCellWithRangeBgActive: theme.primaryBg,
+  pickerPaddingVertical: theme.x1,
+  pickerPaddingHorizontal: theme.x3,
+  pickerCellHeight: 24,
+  pickerCellWidth: 36,
+  pickerHeaderHeight: 40,
+  pickerTimeCellHeight: 28,
+  pickerTimeColumnWidth: 56,
+  pickerWithoutTimeCellMinWidth: 60,
+  pickerWithoutTimeCellHeight: 66
+});
+export {
+  getPickerTokens
+};

package/dist/components/Message/components/Message/Message.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { MessageProps } from './Message.types';
+export declare const Message: FC<MessageProps>;