@true-engineering/true-react-common-ui-kit 2.3.1 → 2.4.0

package/src/components/FlexibleTable/FlexibleTable.stories.tsx

@@ -1,7 +1,6 @@
 import { FC } from 'react';
 import { ComponentStory } from '@storybook/react';
 import { FlexibleTable } from './FlexibleTable';
-import content from './fixture-test';
 import { FlexibleTableConfigType } from './types';
 
 export default {
@@ -49,6 +48,261 @@ const config: FlexibleTableConfigType<ITableContent> = {
   },
 };
 
+const content = [
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: [],
+    parentContractWrongAssignment: 'N',
+    currency: 'RUR',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2000632',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00168_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: [],
+    parentContractWrongAssignment: 'N',
+    currency: 'RUR',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2000262',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['SOME_CODE_1'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2000392',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE_1',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00168_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: 'PARENT/CONTRACT',
+    childContracts: [],
+    parentContractWrongAssignment: 'N',
+    currency: 'RUR',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: 'PARENT/CONTRACT',
+    childContracts: [],
+    parentContractWrongAssignment: 'N',
+    currency: 'RUR',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2000632',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00168_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: 'PARENT/CONTRACT',
+    childContracts: [],
+    parentContractWrongAssignment: 'N',
+    currency: 'RUR',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2000262',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['1-073-СТ/2010'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2000392',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00168_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: 'PARENT/CONTRACT',
+    childContracts: [],
+    parentContractWrongAssignment: 'N',
+    currency: 'RUR',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['1', '2', '3', '4', '5', '6'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['1', '2', '3', '4', '5', '6'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['1', '2', '3', '4', '5', '6'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['1', '2', '3', '4', '5', '6'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['1', '2', '3', '4', '5', '6'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+  {
+    contractCode: 'SOME_CODE',
+    validFrom: new Date('2015-05-18'),
+    validTo: new Date('2020-05-18'),
+    title: 'Название',
+    signDate: new Date('2020-05-18'),
+    partner: 'SE_00206_CR',
+    partnerDescription: 'TEST PARTNER DESCRIPTION',
+    parentContract: '',
+    childContracts: ['1', '2', '3', '4', '5', '6'],
+    parentContractWrongAssignment: 'N',
+    currency: 'U00',
+    entityCode: 'TEST_ENITY_CODE',
+    contractCode1C: '2001199',
+    taxCode: '20%',
+    taxPercentage: 20,
+    status: 'Active',
+  },
+];
+
 const Template: ComponentStory<typeof FlexibleTable<ITableContent>> = (args) => (
   <FlexibleTable<ITableContent>
     {...args}

package/src/components/FlexibleTable/FlexibleTable.tsx

@@ -1,12 +1,12 @@
-import React, { RefObject, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { ReactNode, RefObject, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import clsx from 'clsx';
 import { addDataAttributes } from '../../helpers';
 import { useTheme } from '../../hooks';
 import { ICommonProps } from '../../types';
 import { ThemedPreloader } from '../ThemedPreloader';
-import { FlexibleTableStyles, styles } from './FlexibleTable.styles';
-import TableRow from './TableRow';
+import { TableRow } from './components';
 import { FlexibleTableConfigType, IInfinityScrollConfig, ITitleComponent } from './types';
+import { FlexibleTableStyles, styles } from './FlexibleTable.styles';
 
 // TODO: Заменить Record<string, any> на Record<string, unknown>
 export interface IFlexibleTableProps<Values extends Record<string, any>> extends ICommonProps {
@@ -26,8 +26,8 @@ export interface IFlexibleTableProps<Values extends Record<string, any>> extends
   onRowHover?: (id?: string) => void;
   rowAttributes?: Array<keyof Values>;
   refForScroll?: RefObject<HTMLDivElement>;
-  nothingFoundContent?: React.ReactNode;
-  expandableRowComponent?: (item: Values, isOpen: boolean, close: () => void) => React.ReactNode;
+  nothingFoundContent?: ReactNode;
+  expandableRowComponent?: (item: Values, isOpen: boolean, close: () => void) => ReactNode;
   testId?: string;
 }
 

package/src/components/FlexibleTable/{TableRow.tsx → components/TableRow/TableRow.tsx}

@@ -1,12 +1,12 @@
-import React, { ReactNode, useState } from 'react';
+import { ReactNode, useState, memo } from 'react';
 import clsx from 'clsx';
-import { addDataAttributes } from '../../helpers';
-import { ICommonProps, IDataAttributes } from '../../types';
-import TableValue from './TableValue';
-import { FlexibleTableConfigType, INestedComponent } from './types';
+import { addDataAttributes } from '../../../../helpers';
+import { ICommonProps, IDataAttributes } from '../../../../types';
+import { FlexibleTableConfigType, INestedComponent } from '../../types';
+import TableValue from '../TableValue/TableValue';
 
 // TODO: Заменить Record<string, any> на Record<string, unknown>
-interface ITableRowProps<Values extends Record<string, any>> extends ICommonProps {
+export interface ITableRowProps<Values extends Record<string, any>> extends ICommonProps {
   item: Values;
   uniqueField?: keyof Values;
   isFirstColumnSticky?: boolean;
@@ -14,7 +14,7 @@ interface ITableRowProps<Values extends Record<string, any>> extends ICommonProp
   config?: FlexibleTableConfigType<Values>;
   enabledColumns?: Array<keyof Values>;
   rowAttributes?: Array<keyof Values>;
-  expandableRowComponent?: (item: Values, isOpen: boolean, close: () => void) => React.ReactNode;
+  expandableRowComponent?: (item: Values, isOpen: boolean, close: () => void) => ReactNode;
   // TODO: Заменить string на Generic Values[uniqueField]
   onRowHover?: (id?: string) => void;
   onRowClick?: (id: string) => void;
@@ -32,7 +32,7 @@ interface ITableRowProps<Values extends Record<string, any>> extends ICommonProp
   };
 }
 
-function TableRow<Values extends Record<string, any>>({
+function TableRowInner<Values extends Record<string, any>>({
   item,
   uniqueField,
   isFirstColumnSticky,
@@ -149,4 +149,4 @@ function TableRow<Values extends Record<string, any>>({
   );
 }
 
-export default React.memo(TableRow) as typeof TableRow;
+export const TableRow = memo(TableRowInner) as typeof TableRowInner;

package/src/components/FlexibleTable/components/TableRow/index.ts

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

package/src/components/FlexibleTable/{TableValue.tsx → components/TableValue/TableValue.tsx}

@@ -1,10 +1,11 @@
 import { ReactNode } from 'react';
 import clsx from 'clsx';
 import { format } from 'date-fns';
-import type { ICommonProps } from '../../types';
-import type { FlexibleTableConfigType } from './types';
+import type { ICommonProps } from '../../../../types';
+import { DEFAULT_DATE_FORMAT } from '../../constants';
+import type { FlexibleTableConfigType } from '../../types';
 
-interface ITableValueProps<Values extends Record<string, any>> extends ICommonProps {
+export interface ITableValueProps<Values extends Record<string, any>> extends ICommonProps {
   item: Values;
   columnName: keyof Values;
   config?: FlexibleTableConfigType<Values>;
@@ -21,8 +22,6 @@ interface ITableValueProps<Values extends Record<string, any>> extends ICommonPr
   onSetNestedComponent: (component?: ReactNode) => void;
 }
 
-const DEFAULT_DATE_FORMAT = 'dd.MM.yyyy';
-
 function TableValue<Values extends Record<string, any>>({
   item,
   columnName,

package/src/components/FlexibleTable/components/TableValue/index.ts

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

package/src/components/FlexibleTable/components/index.ts

@@ -0,0 +1,2 @@
+export * from './TableRow';
+export * from './TableValue';

package/src/components/FlexibleTable/constants.ts

@@ -0,0 +1 @@
+export const DEFAULT_DATE_FORMAT = 'dd.MM.yyyy';

package/src/components/Icon/Icon.stories.tsx

@@ -1,8 +1,9 @@
-import { Icon, IIconType } from './Icon';
+import { Icon } from './Icon';
 import { complexIcons } from './complexIcons';
-import { icons } from './icons';
+import { iconsList } from './icons-list';
+import { IIconType } from './types';
 
-const types: IIconType[] = [...Object.keys(icons), ...Object.keys(complexIcons)] as IIconType[];
+const types: IIconType[] = [...Object.keys(iconsList), ...Object.keys(complexIcons)] as IIconType[];
 
 export default {
   title: 'Icon',

package/src/components/Icon/Icon.tsx

@@ -1,23 +1,18 @@
-import React from 'react';
+import { FC } from 'react';
 import { addDataAttributes } from '../../helpers';
 import { useTheme } from '../../hooks';
 import { ICommonProps } from '../../types';
-import ComplexIconBoilerplate from './ComplexIconBoilerplate';
+import { ComplexIconBoilerplate, IconBoilerplate } from './components';
+import { isComplexIcon } from './helpers';
+import { IIconType } from './types';
 import { IconStyles, styles } from './Icon.styles';
-import { IconBoilerplate } from './IconBoilerplate';
-import { complexIcons, IComplexIcon } from './complexIcons';
-import { ICommonIcon } from './icons';
-
-export type IIconType = ICommonIcon | IComplexIcon;
 
 export interface IIconProps extends ICommonProps {
   tweakStyles?: IconStyles;
   type: IIconType;
 }
 
-const isComplexIcon = (type: IIconType): type is IComplexIcon => type in complexIcons;
-
-export const Icon: React.FC<IIconProps> = ({ type, data, tweakStyles }) => {
+export const Icon: FC<IIconProps> = ({ type, data, tweakStyles }) => {
   const { classes } = useTheme('Icon', styles, tweakStyles);
 
   return (

package/src/components/Icon/complexIcons/icons.ts

@@ -3,5 +3,3 @@ import avatarGreen from './avatarGreen.svg?raw';
 export const complexIcons = {
   avatar: avatarGreen,
 };
-
-export type IComplexIcon = keyof typeof complexIcons;

package/src/components/Icon/{ComplexIconBoilerplate.tsx → components/ComplexIconBoilerplate/ComplexIconBoilerplate.tsx}

@@ -1,17 +1,16 @@
 import { FC, useContext, useMemo } from 'react';
-import { ThemeContext } from '../../hooks';
-import { complexIcons, IComplexIcon } from './complexIcons';
+import { ThemeContext } from '../../../../hooks';
+import { complexIcons } from '../../complexIcons';
+import { IComplexIcon } from '../../types';
 
-interface IComplexIconBoilerplateProps {
+export interface IComplexIconBoilerplateProps {
   type: IComplexIcon;
 }
 
-const ComplexIconBoilerplate: FC<IComplexIconBoilerplateProps> = ({ type }) => {
+export const ComplexIconBoilerplate: FC<IComplexIconBoilerplateProps> = ({ type }) => {
   const { theme } = useContext(ThemeContext);
   const icons = useMemo(() => ({ ...complexIcons, ...theme.complexIcons }), []);
   const ComplexIcon = icons[type];
 
   return <div dangerouslySetInnerHTML={{ __html: ComplexIcon }} />;
 };
-
-export default ComplexIconBoilerplate;

package/src/components/Icon/components/ComplexIconBoilerplate/index.ts

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

package/src/components/Icon/{IconBoilerplate.tsx → components/IconBolerplate/IconBoilerplate.tsx}

@@ -1,6 +1,7 @@
 import { FC, useContext, useMemo } from 'react';
-import { ThemeContext } from '../../hooks';
-import { ICommonIcon, icons as commonIcons } from './icons';
+import { ThemeContext } from '../../../../hooks';
+import { iconsList as commonIcons } from '../../icons-list';
+import { ICommonIcon } from '../../types';
 
 export interface IIconBoilerplateProps {
   type: ICommonIcon;

package/src/components/Icon/components/IconBolerplate/index.ts

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

package/src/components/Icon/components/index.ts

@@ -0,0 +1,2 @@
+export * from './ComplexIconBoilerplate';
+export * from './IconBolerplate';

package/src/components/Icon/helpers.ts

@@ -0,0 +1,9 @@
+import { complexIcons } from './complexIcons';
+import { IComplexIcon, IIconType, ISvgIcon } from './types';
+
+export const isComplexIcon = (type: IIconType): type is IComplexIcon => type in complexIcons;
+
+/**
+ * Эта функция позволяет корректно определить ключи в типе
+ */
+export const checkIcons = <P extends string>(ico: Record<P, ISvgIcon>) => ico;

package/src/components/Icon/{icons/icons.ts → icons-list.ts}

@@ -1,16 +1,6 @@
-import { SVGAttributes } from 'react';
+import { checkIcons } from './helpers';
 
-export interface ISvgIcon {
-  viewBox?: string;
-  paths?: Array<SVGAttributes<never>>;
-  circles?: Array<SVGAttributes<never>>;
-  rects?: Array<SVGAttributes<never>>;
-}
-
-// эта функция позволяет корректно определить ключи в типе ниже
-const checkIcons = <P extends string>(ico: Record<P, ISvgIcon>) => ico;
-
-export const icons = checkIcons({
+export const iconsList = checkIcons({
   'vendor-service': {
     paths: [
       {
@@ -834,5 +824,3 @@ export const icons = checkIcons({
     ],
   },
 });
-
-export type ICommonIcon = keyof typeof icons;

package/src/components/Icon/index.ts

@@ -1,4 +1,4 @@
 export * from './Icon';
+export * from './types';
+export { iconsList } from './icons-list';
 export type { IconStyles } from './Icon.styles';
-export type { ISvgIcon, ICommonIcon } from './icons';
-export type { IComplexIcon } from './complexIcons';

package/src/components/Icon/types.ts

@@ -0,0 +1,16 @@
+import { SVGAttributes } from 'react';
+import { complexIcons } from './complexIcons';
+import { iconsList } from './icons-list';
+
+export interface ISvgIcon {
+  viewBox?: string;
+  paths?: Array<SVGAttributes<never>>;
+  circles?: Array<SVGAttributes<never>>;
+  rects?: Array<SVGAttributes<never>>;
+}
+
+export type ICommonIcon = keyof typeof iconsList;
+
+export type IComplexIcon = keyof typeof complexIcons;
+
+export type IIconType = ICommonIcon | IComplexIcon;

package/src/components/IncrementInput/IncrementInput.tsx

@@ -3,7 +3,7 @@ import { isNumberInteger } from '@true-engineering/true-react-platform-helpers';
 import { addDataAttributes, getNumberInRange, getNumberLength } from '../../helpers';
 import { useTheme, useTweakStyles } from '../../hooks';
 import { INumberInputProps, NumberInput } from '../NumberInput';
-import { ChangeButton } from './ChangeButton';
+import { ChangeButton } from './components';
 import { IncrementInputStyles, styles } from './IncrementInput.styles';
 
 export interface IIncrementInputProps extends Omit<INumberInputProps, 'canBeFloat' | 'precision'> {

package/src/components/IncrementInput/{ChangeButton.tsx → components/ChangeButton/ChangeButton.tsx}

@@ -1,13 +1,13 @@
 import { FC } from 'react';
 import clsx from 'clsx';
 import { Classes } from 'jss';
-import { Icon } from '../Icon';
+import { Icon } from '../../../Icon';
 
-interface IChangeButtonProps {
+export interface IChangeButtonProps {
   type: 'plus' | 'minus';
   isButtonDisabled: boolean;
   isInvalid?: boolean;
-  classes: Classes<'button' | 'disabledButton' | 'errorButton'>;
+  classes: Classes<'button' | 'disabledButton' | 'errorButton'>; // TODO: !!!!!
   onClick: () => void;
 }
 

package/src/components/IncrementInput/components/ChangeButton/index.ts

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

package/src/components/IncrementInput/components/index.ts

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

package/src/components/Input/Input.stories.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { ComponentStory } from '@storybook/react';
-import { icons } from '../Icon/icons';
+import { iconsList } from '../Icon';
 import { Input, IInputProps } from './Input';
 
 const types: Array<IInputProps['type']> = ['text', 'password', 'email', 'number'];
@@ -17,7 +17,7 @@ const inlineStyles = [
   'middle',
 ];
 const masks = [undefined, '99/99', 'aaa-aaa', '***+***'];
-const iconTypes = [undefined, ...Object.keys(icons)];
+const iconTypes = [undefined, ...Object.keys(iconsList)];
 const borders = [undefined, 'left', 'top', 'right', 'bottom'];
 const errorPositions = ['bottom', 'top'];
 

package/src/components/Input/Input.tsx

@@ -10,7 +10,7 @@ import {
   ClipboardEvent,
   InputHTMLAttributes,
 } from 'react';
-import InputMask, { Props as ReactInputMaskBaseProps } from 'react-input-mask';
+import InputMask from 'react-input-mask';
 import clsx from 'clsx';
 import {
   addDataTestId,
@@ -23,15 +23,10 @@ import { useTheme, useTweakStyles } from '../../hooks';
 import { ICommonProps, IIcon } from '../../types';
 import { Icon } from '../Icon';
 import { ThemedPreloader } from '../ThemedPreloader';
+import { DEFAULT_SIZE } from './constants';
+import { IReactInputMaskProps } from './types';
 import { InputStyles, styles } from './Input.styles';
 
-export const DEFAULT_SIZE = 6;
-
-type IReactInputMaskProps = Pick<
-  Partial<ReactInputMaskBaseProps>,
-  'mask' | 'maskPlaceholder' | 'alwaysShowMask' | 'beforeMaskedStateChange'
->;
-
 export interface IInputProps extends ICommonProps, IReactInputMaskProps {
   tweakStyles?: InputStyles;
   value?: string;

package/src/components/Input/constants.ts

@@ -0,0 +1 @@
+export const DEFAULT_SIZE = 6;

package/src/components/Input/index.ts

@@ -1,2 +1,3 @@
 export * from './Input';
+export * from './types';
 export type { InputStyles } from './Input.styles';

package/src/components/Input/types.ts

@@ -0,0 +1,6 @@
+import { Props as ReactInputMaskBaseProps } from 'react-input-mask';
+
+export type IReactInputMaskProps = Pick<
+  Partial<ReactInputMaskBaseProps>,
+  'mask' | 'maskPlaceholder' | 'alwaysShowMask' | 'beforeMaskedStateChange'
+>;

package/src/components/List/List.stories.tsx

@@ -1,6 +1,7 @@
 import { ComponentStory, ComponentMeta } from '@storybook/react';
 import { colors } from '../../theme';
-import { List, IListItem } from './List';
+import { List } from './List';
+import { IListItem } from './types';
 
 const listItems: IListItem[] = [
   {