@true-engineering/true-react-common-ui-kit 4.0.0-alpha0 → 4.0.0-alpha2

package/dist/components/ControlWrapper/ControlWrapper.styles.d.ts

@@ -1,6 +1,6 @@
 import { ITweakStyles } from '../../theme';
 import { IThemedPreloaderStyles } from '../ThemedPreloader';
-export declare const useStyles: import("../../theme").IUseStyles<"invalid" | "root" | "icon" | "disabled" | "loader" | "loading" | "label" | "requiredLabel" | "withValue" | "clearIcon" | "focused" | "minContent" | "activeLabel" | "disabledLabel" | "wrapper" | "controls" | "iconInner" | "customIcon" | "endIcon" | "activeIcon" | "placement-top" | "placement-bottom" | "placement-top-left" | "placement-top-right" | "placement-bottom-left" | "placement-bottom-right" | "placement-left" | "placement-right" | "placement-middle", unknown>;
+export declare const useStyles: import("../../theme").IUseStyles<"invalid" | "icon" | "disabled" | "loader" | "loading" | "label" | "requiredLabel" | "withValue" | "clearIcon" | "focused" | "wrapper" | "controlWrapper" | "minContent" | "activeLabel" | "disabledLabel" | "controls" | "iconInner" | "customIcon" | "endIcon" | "activeIcon" | "placement-top" | "placement-bottom" | "placement-top-left" | "placement-top-right" | "placement-bottom-left" | "placement-bottom-right" | "placement-left" | "placement-right" | "placement-middle", unknown>;
 export type IControlWrapperStyles = ITweakStyles<typeof useStyles, {
     tweakPreloader: IThemedPreloaderStyles;
 }>;

package/dist/components/Input/Input.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { IControlGroupProps } from '../ControlGroup';
+import { IWithMessagesProps } from '../WithMessages';
 import { IInputBaseProps } from './InputBase';
-export type IInputProps = IInputBaseProps & Pick<IControlGroupProps, 'infoMessage' | 'errorMessage'>;
-export declare const Input: import("react").ForwardRefExoticComponent<IInputBaseProps & Pick<IControlGroupProps, "infoMessage" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;
+export type IInputProps = IInputBaseProps & Pick<IWithMessagesProps, 'infoMessage' | 'errorMessage'>;
+export declare const Input: import("react").ForwardRefExoticComponent<IInputBaseProps & Pick<IWithMessagesProps, "infoMessage" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/Input/Input.stories.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<import("./InputBase").IInputBaseProps & Pick<import("..").IControlGroupProps, "infoMessage" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;
+    component: import("react").ForwardRefExoticComponent<import("./InputBase").IInputBaseProps & Pick<import("..").IWithMessagesProps, "infoMessage" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;
     argTypes: {
         type: {
             control: string;
@@ -22,4 +22,4 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0fc72a6d").R, import("./InputBase").IInputBaseProps & Pick<import("..").IControlGroupProps, "infoMessage" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0fc72a6d").R, import("./InputBase").IInputBaseProps & Pick<import("..").IWithMessagesProps, "infoMessage" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/Input/Input.styles.d.ts

@@ -1,8 +1,8 @@
 import { ITweakStyles } from '../../theme';
-import { IControlGroupStyles } from '../ControlGroup';
 import { IControlWrapperStyles } from '../ControlWrapper';
-export declare const useStyles: import("../../theme").IUseStyles<"input" | "inputContent" | "autoSizeWrapper" | "autoSized" | "withUnits" | "withLabel" | "fakeValue" | "units" | "focusedInput" | "disabledInput" | "invalidInput", unknown>;
+import { IWithMessagesStyles } from '../WithMessages';
+export declare const useStyles: import("../../theme").IUseStyles<"input" | "withValue" | "inputContent" | "autoSizeWrapper" | "autoSized" | "withUnits" | "withLabel" | "fakeValue" | "units" | "focusedInput" | "disabledInput" | "invalidInput", unknown>;
 export type IInputStyles = ITweakStyles<typeof useStyles, {
     tweakControlWrapper: IControlWrapperStyles;
-    tweakControlGroup: IControlGroupStyles;
+    tweakWithMessages: IWithMessagesStyles;
 }>;

package/dist/components/SearchInput/SearchInput.stories.d.ts

@@ -3,14 +3,4 @@ declare const _default: {
     component: import("react").FC<import("./SearchInput").ISearchInputProps>;
 };
 export default _default;
-export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0fc72a6d").R, Omit<import("..").IInputProps, "tweakStyles" | "label" | "isInvalid" | "type" | "isActive" | "errorMessage"> & import("../..").IDataAttributesProps & import("../..").ITweakStylesProps<Partial<import("jss").Styles<"root" | "icon", unknown, undefined>> & Partial<{
-    tweakInput: Partial<import("jss").Styles<"input" | "inputContent" | "autoSizeWrapper" | "autoSized" | "withUnits" | "withLabel" | "fakeValue" | "units" | "focusedInput" | "disabledInput" | "invalidInput", unknown, undefined>> & Partial<{
-        tweakControlWrapper: Partial<import("jss").Styles<"invalid" | "root" | "icon" | "disabled" | "loader" | "loading" | "label" | "requiredLabel" | "withValue" | "clearIcon" | "focused" | "minContent" | "activeLabel" | "disabledLabel" | "wrapper" | "controls" | "iconInner" | "customIcon" | "endIcon" | "activeIcon" | "placement-top" | "placement-bottom" | "placement-top-left" | "placement-top-right" | "placement-bottom-left" | "placement-bottom-right" | "placement-left" | "placement-right" | "placement-middle", unknown, undefined>> & Partial<{
-            tweakPreloader: Partial<import("jss").Styles<"root" | "default" | "currentColor" | "dots" | "logo", unknown, undefined>> & Partial<{
-                tweakDotsPreloader: Partial<import("jss").Styles<"root" | "dot" | "fadedDot" | "@keyframes FadedDots", unknown, undefined>> & Partial<unknown>;
-                tweakSvgPreloader: Partial<import("jss").Styles<"root", unknown, undefined>> & Partial<unknown>;
-            }>;
-        }>;
-        tweakControlGroup: Partial<import("jss").Styles<"error" | "root" | "horizontal" | "vertical" | "children" | "info" | "message", unknown, undefined>> & Partial<unknown>;
-    }>;
-}>>>;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0fc72a6d").R, Omit<import("..").IInputProps, "tweakStyles" | "label" | "isInvalid" | "type" | "isActive" | "errorMessage"> & import("../..").IDataAttributesProps & import("../..").ITweakStylesProps<import("./SearchInput.styles").ISearchInputStyles>>;

package/dist/components/SearchInput/SearchInput.styles.d.ts

@@ -1,7 +1,5 @@
-import { ITweakStyles } from '../../theme';
 import { IInputStyles } from '../Input';
-export declare const useStyles: import("../../theme").IUseStyles<"root" | "icon", unknown>;
 export declare const inputStyles: IInputStyles;
-export type ISearchInputStyles = ITweakStyles<typeof useStyles, {
-    tweakInput: IInputStyles;
-}>;
+export interface ISearchInputStyles {
+    tweakInput?: IInputStyles;
+}

package/dist/components/Select/Select.styles.d.ts

@@ -1,33 +1,33 @@
 import { type ITweakStyles } from '../../theme';
-import { IControlGroupStyles } from '../ControlGroup';
 import { type IInputStyles } from '../Input';
 import { type ISearchInputStyles } from '../SearchInput';
+import { IWithMessagesStyles } from '../WithMessages';
 import { type ISelectListStyles } from './components';
 export declare const useStyles: import("../../theme").IUseStyles<"root" | "icon" | "disabled" | "inputWrapper" | "arrow" | "listWrapper" | "withoutPopper" | "listWrapperInBody" | "activeArrow" | "counter" | "iconWrapper", unknown>;
-export declare const readonlyInputStyles: Partial<import("jss").Styles<"input" | "inputContent" | "autoSizeWrapper" | "autoSized" | "withUnits" | "withLabel" | "fakeValue" | "units" | "focusedInput" | "disabledInput" | "invalidInput", unknown, undefined>> & Partial<{
-    tweakControlWrapper: Partial<import("jss").Styles<"invalid" | "root" | "icon" | "disabled" | "loader" | "loading" | "label" | "requiredLabel" | "withValue" | "clearIcon" | "focused" | "minContent" | "activeLabel" | "disabledLabel" | "wrapper" | "controls" | "iconInner" | "customIcon" | "endIcon" | "activeIcon" | "placement-top" | "placement-bottom" | "placement-top-left" | "placement-top-right" | "placement-bottom-left" | "placement-bottom-right" | "placement-left" | "placement-right" | "placement-middle", unknown, undefined>> & Partial<{
+export declare const readonlyInputStyles: Partial<import("jss").Styles<"input" | "withValue" | "inputContent" | "autoSizeWrapper" | "autoSized" | "withUnits" | "withLabel" | "fakeValue" | "units" | "focusedInput" | "disabledInput" | "invalidInput", unknown, undefined>> & Partial<{
+    tweakControlWrapper: Partial<import("jss").Styles<"invalid" | "icon" | "disabled" | "loader" | "loading" | "label" | "requiredLabel" | "withValue" | "clearIcon" | "focused" | "wrapper" | "controlWrapper" | "minContent" | "activeLabel" | "disabledLabel" | "controls" | "iconInner" | "customIcon" | "endIcon" | "activeIcon" | "placement-top" | "placement-bottom" | "placement-top-left" | "placement-top-right" | "placement-bottom-left" | "placement-bottom-right" | "placement-left" | "placement-right" | "placement-middle", unknown, undefined>> & Partial<{
         tweakPreloader: Partial<import("jss").Styles<"root" | "default" | "currentColor" | "dots" | "logo", unknown, undefined>> & Partial<{
             tweakDotsPreloader: Partial<import("jss").Styles<"root" | "dot" | "fadedDot" | "@keyframes FadedDots", unknown, undefined>> & Partial<unknown>;
             tweakSvgPreloader: Partial<import("jss").Styles<"root", unknown, undefined>> & Partial<unknown>;
         }>;
     }>;
-    tweakControlGroup: Partial<import("jss").Styles<"error" | "root" | "horizontal" | "vertical" | "children" | "info" | "message", unknown, undefined>> & Partial<unknown>;
+    tweakWithMessages: Partial<import("jss").Styles<"error" | "horizontal" | "vertical" | "children" | "info" | "withMessages" | "message", unknown, undefined>> & Partial<unknown>;
 }>;
-export declare const readonlyMultiSelectStyles: Partial<import("jss").Styles<"input" | "inputContent" | "autoSizeWrapper" | "autoSized" | "withUnits" | "withLabel" | "fakeValue" | "units" | "focusedInput" | "disabledInput" | "invalidInput", unknown, undefined>> & Partial<{
-    tweakControlWrapper: Partial<import("jss").Styles<"invalid" | "root" | "icon" | "disabled" | "loader" | "loading" | "label" | "requiredLabel" | "withValue" | "clearIcon" | "focused" | "minContent" | "activeLabel" | "disabledLabel" | "wrapper" | "controls" | "iconInner" | "customIcon" | "endIcon" | "activeIcon" | "placement-top" | "placement-bottom" | "placement-top-left" | "placement-top-right" | "placement-bottom-left" | "placement-bottom-right" | "placement-left" | "placement-right" | "placement-middle", unknown, undefined>> & Partial<{
+export declare const readonlyMultiSelectStyles: Partial<import("jss").Styles<"input" | "withValue" | "inputContent" | "autoSizeWrapper" | "autoSized" | "withUnits" | "withLabel" | "fakeValue" | "units" | "focusedInput" | "disabledInput" | "invalidInput", unknown, undefined>> & Partial<{
+    tweakControlWrapper: Partial<import("jss").Styles<"invalid" | "icon" | "disabled" | "loader" | "loading" | "label" | "requiredLabel" | "withValue" | "clearIcon" | "focused" | "wrapper" | "controlWrapper" | "minContent" | "activeLabel" | "disabledLabel" | "controls" | "iconInner" | "customIcon" | "endIcon" | "activeIcon" | "placement-top" | "placement-bottom" | "placement-top-left" | "placement-top-right" | "placement-bottom-left" | "placement-bottom-right" | "placement-left" | "placement-right" | "placement-middle", unknown, undefined>> & Partial<{
         tweakPreloader: Partial<import("jss").Styles<"root" | "default" | "currentColor" | "dots" | "logo", unknown, undefined>> & Partial<{
             tweakDotsPreloader: Partial<import("jss").Styles<"root" | "dot" | "fadedDot" | "@keyframes FadedDots", unknown, undefined>> & Partial<unknown>;
             tweakSvgPreloader: Partial<import("jss").Styles<"root", unknown, undefined>> & Partial<unknown>;
         }>;
     }>;
-    tweakControlGroup: Partial<import("jss").Styles<"error" | "root" | "horizontal" | "vertical" | "children" | "info" | "message", unknown, undefined>> & Partial<unknown>;
+    tweakWithMessages: Partial<import("jss").Styles<"error" | "horizontal" | "vertical" | "children" | "info" | "withMessages" | "message", unknown, undefined>> & Partial<unknown>;
 }>;
 export declare const getInputStyles: ({ hasReadonlyInput, isMultiSelect, }: {
     hasReadonlyInput: boolean;
     isMultiSelect?: boolean | undefined;
 }) => IInputStyles;
 export type ISelectStyles = ITweakStyles<typeof useStyles, {
-    tweakControlGroup: IControlGroupStyles;
+    tweakWithMessages: IWithMessagesStyles;
     tweakInput: IInputStyles;
     tweakSelectList: ISelectListStyles;
     tweakSearchInput: ISearchInputStyles;

package/dist/components/TextArea/TextArea.d.ts

@@ -1,10 +1,10 @@
 import { FormEvent } from 'react';
 import { ICommonProps } from '../../types';
-import { IControlGroupProps } from '../ControlGroup';
 import { IControlWrapperProps } from '../ControlWrapper';
+import { IWithMessagesProps } from '../WithMessages';
 import { ITextAreaHTMLBaseProps } from './types';
 import { ITextAreaStyles } from './TextArea.styles';
-export interface ITextAreaProps extends ICommonProps<ITextAreaStyles>, Pick<IControlWrapperProps, 'label' | 'isInvalid' | 'isRequired' | 'isDisabled'>, Pick<IControlGroupProps, 'infoMessage' | 'errorMessage'>, Pick<ITextAreaHTMLBaseProps, 'name' | 'maxLength' | 'rows' | 'onPaste' | 'onFocus' | 'onBlur'> {
+export interface ITextAreaProps extends ICommonProps<ITextAreaStyles>, Pick<IControlWrapperProps, 'label' | 'isInvalid' | 'isRequired' | 'isDisabled'>, Pick<IWithMessagesProps, 'infoMessage' | 'errorMessage'>, Pick<ITextAreaHTMLBaseProps, 'name' | 'maxLength' | 'rows' | 'onPaste' | 'onFocus' | 'onBlur'> {
     value?: string;
     placeholder?: string;
     /** @default false */

package/dist/components/TextArea/TextArea.styles.d.ts

@@ -1,9 +1,9 @@
 import { ITweakStyles } from '../../theme';
-import { IControlGroupStyles } from '../ControlGroup';
 import { IControlWrapperStyles } from '../ControlWrapper';
-export declare const useStyles: import("../../theme").IUseStyles<"textarea" | "autoSized" | "symbolsCount" | "symbolsCountError", unknown>;
+import { IWithMessagesStyles } from '../WithMessages';
+export declare const useStyles: import("../../theme").IUseStyles<"textarea" | "autoSized" | "wrapper" | "symbolsCount" | "symbolsCountError", unknown>;
 export declare const controlWrapperStyles: IControlWrapperStyles;
 export type ITextAreaStyles = ITweakStyles<typeof useStyles, {
-    tweakControlGroup: IControlGroupStyles;
+    tweakWithMessages: IWithMessagesStyles;
     tweakControlWrapper: IControlWrapperStyles;
 }>;

package/dist/components/WithMessages/WithMessages.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+import { ICommonProps } from '../../types';
+import { IWithMessagesStyles } from './WithMessages.styles';
+export interface IWithMessagesProps extends ICommonProps<IWithMessagesStyles> {
+    children: ReactNode;
+    infoMessage?: ReactNode;
+    errorMessage?: ReactNode;
+    controlsDirection?: 'horizontal' | 'vertical';
+}
+export declare const WithMessages: import("react").ForwardRefExoticComponent<IWithMessagesProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/{ControlGroup/ControlGroup.stories.d.ts → WithMessages/WithMessages.stories.d.ts}

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<import("./ControlGroup").IControlGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+    component: import("react").ForwardRefExoticComponent<import("./WithMessages").IWithMessagesProps & import("react").RefAttributes<HTMLDivElement>>;
 };
 export default _default;
-export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0fc72a6d").R, import("./ControlGroup").IControlGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0fc72a6d").R, import("./WithMessages").IWithMessagesProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/WithMessages/WithMessages.styles.d.ts

@@ -0,0 +1,3 @@
+import { ITweakStyles } from '../../theme';
+export declare const useStyles: import("../../theme").IUseStyles<"error" | "horizontal" | "vertical" | "children" | "info" | "withMessages" | "message", unknown>;
+export type IWithMessagesStyles = ITweakStyles<typeof useStyles>;

package/dist/components/WithMessages/index.d.ts

@@ -0,0 +1,2 @@
+export * from './WithMessages';
+export type { IWithMessagesStyles } from './WithMessages.styles';

package/dist/components/index.d.ts

@@ -44,5 +44,5 @@ export * from './Tooltip';
 export * from './NewMoreMenu';
 export * from './WithPopup';
 export * from './WithTooltip';
-export * from './ControlGroup';
+export * from './WithMessages';
 export * from './ControlWrapper';

package/dist/theme/types.d.ts

@@ -1,6 +1,6 @@
 import { Styles } from 'react-jss';
 import { Classes, JssValue } from 'jss';
-import type { IAccountInfoStyles, IAddButtonStyles, IButtonStyles, ICheckboxStyles, ICloseButtonStyles, ICommonIcon, IComplexIcon, IControlGroupStyles, IControlWrapperStyles, ICssBaselineStyles, IDateInputStyles, IDatePickerHeaderStyles, IDatePickerStyles, IDescriptionStyles, IDotsPreloaderStyles, IFileInputStyles, IFileItemStyles, IFilterIntervalStyles, IFilterSelectStyles, IFiltersPaneSearchStyles, IFiltersPaneStyles, IFilterValueViewStyles, IFilterWithDatesStyles, IFilterWithPeriodStyles, IFilterWrapperStyles, IFlagStyles, IFlexibleTableCellStyles, IFlexibleTableRowStyles, IFlexibleTableStyles, IIconButtonStyles, IIconStyles, IIncrementInputStyles, IInputStyles, IListItemStyles, IListStyles, IModalStyles, IMoreMenuStyles, IMultiSelectInputStyles, IMultiSelectListStyles, IMultiSelectStyles, INewMoreMenuStyles, INotificationStyles, IPhoneInputCountryListStyles, IPhoneInputStyles, IPreloaderSvgType, IRadioButtonStyles, ISearchInputStyles, ISelectListStyles, ISelectorStyles, ISelectStyles, ISkeletonStyles, IStatusStyles, ISvgIcon, ISvgPreloaderStyles, ISwitchStyles, ITextAreaStyles, ITextButtonStyles, ITextWithInfoStyles, ITextWithTooltipStyles, IThemedPreloaderStyles, IToasterStyles, ITooltipStyles, IWithPopupStyles, IWithTooltipStyles } from '../components';
+import type { IAccountInfoStyles, IAddButtonStyles, IButtonStyles, ICheckboxStyles, ICloseButtonStyles, ICommonIcon, IComplexIcon, IWithMessagesStyles, IControlWrapperStyles, ICssBaselineStyles, IDateInputStyles, IDatePickerHeaderStyles, IDatePickerStyles, IDescriptionStyles, IDotsPreloaderStyles, IFileInputStyles, IFileItemStyles, IFilterIntervalStyles, IFilterSelectStyles, IFiltersPaneSearchStyles, IFiltersPaneStyles, IFilterValueViewStyles, IFilterWithDatesStyles, IFilterWithPeriodStyles, IFilterWrapperStyles, IFlagStyles, IFlexibleTableCellStyles, IFlexibleTableRowStyles, IFlexibleTableStyles, IIconButtonStyles, IIconStyles, IIncrementInputStyles, IInputStyles, IListItemStyles, IListStyles, IModalStyles, IMoreMenuStyles, IMultiSelectInputStyles, IMultiSelectListStyles, IMultiSelectStyles, INewMoreMenuStyles, INotificationStyles, IPhoneInputCountryListStyles, IPhoneInputStyles, IPreloaderSvgType, IRadioButtonStyles, ISearchInputStyles, ISelectListStyles, ISelectorStyles, ISelectStyles, ISkeletonStyles, IStatusStyles, ISvgIcon, ISvgPreloaderStyles, ISwitchStyles, ITextAreaStyles, ITextButtonStyles, ITextWithInfoStyles, ITextWithTooltipStyles, IThemedPreloaderStyles, IToasterStyles, ITooltipStyles, IWithPopupStyles, IWithTooltipStyles } from '../components';
 export type IStyles<C extends string, P> = Styles<C, P, Partial<Styles<C, P>>>;
 export type IUseStyles<C extends string, P = unknown> = (data?: P & {
     theme?: Partial<Styles<C, P>>;
@@ -64,7 +64,7 @@ export interface IComponentStyles {
     Toaster: IToasterStyles;
     WithPopup: IWithPopupStyles;
     NewMoreMenu: INewMoreMenuStyles;
-    ControlGroup: IControlGroupStyles;
+    WithMessages: IWithMessagesStyles;
     ControlWrapper: IControlWrapperStyles;
     WithTooltip: IWithTooltipStyles;
 }