@true-engineering/true-react-common-ui-kit 2.7.0 → 3.0.0-alpha.1

package/dist/components/FiltersPane/components/FilterWrapper/FilterWrapper.styles.d.ts

@@ -1,96 +1,6 @@
-import { ComponentStyles } from '../../../../types';
-export declare const styles: {
-    root: {
-        position: string;
-        transition: string;
-        transitionProperty: string;
-        border: (string | number)[];
-        borderRadius: number;
-        boxSizing: string;
-        height: number;
-        minWidth: number;
-    };
-    item: {
-        display: string;
-        padding: number[];
-        cursor: string;
-    };
-    booleanItem: {
-        padding: number;
-    };
-    name: {
-        fontSize: number;
-        lineHeight: string;
-        whiteSpace: string;
-    };
-    boolean: {
-        padding: number[];
-    };
-    noValue: {};
-    openNoValue: {};
-    openWithValue: {};
-    disabled: {
-        '& > $item': {
-            cursor: string;
-        };
-    };
-    withValue: {};
-    iconContainer: {
-        width: number;
-        height: number;
-        transition: string;
-        alignSelf: string;
-        marginLeft: number;
-        marginRight: number;
-        flexShrink: number;
-    };
-    open: {
-        transform: string;
-    };
-    dropdown: {
-        position: string;
-        zIndex: number;
-        marginTop: number;
-        border: (string | number)[];
-    };
-    left: {
-        left: number;
-    };
-    right: {
-        right: number;
-    };
-    value: {
-        alignSelf: string;
-        fontSize: number;
-        lineHeight: string;
-        margin: number[];
-        fontWeight: string;
-        display: string;
-        minWidth: number;
-    };
-    animationEnd: {
-        opacity: number;
-        transform: string;
-        transition: string;
-        transitionProperty: string;
-    };
-    animationStart: {
-        opacity: number;
-        transform: string;
-        transition: string;
-        transitionProperty: string;
-    };
-    'dropdown-enter': {
-        extend: string;
-    };
-    'dropdown-enter-active': {
-        extend: string;
-    };
-    'dropdown-exit-active': {
-        extend: string;
-    };
-    'dropdown-exit': {
-        extend: string;
-    };
-};
-export declare type FilterWrapperStyles = ComponentStyles<typeof styles>;
+import { ITweakStyles } from '../../../../theme';
+import { IFilterValueViewStyles } from '../FilterValueView';
+export declare const useStyles: import("../../../../theme").IUseStyles<"boolean" | "right" | "left" | "item" | "value" | "name" | "root" | "open" | "disabled" | "booleanItem" | "noValue" | "openNoValue" | "openWithValue" | "withValue" | "iconContainer" | "dropdown" | "animationEnd" | "animationStart" | "dropdown-enter" | "dropdown-enter-active" | "dropdown-exit-active" | "dropdown-exit", unknown>;
+export declare type IFilterWrapperStyles = ITweakStyles<typeof useStyles, {
+    tweakValueView: IFilterValueViewStyles;
+}>;

package/dist/components/FiltersPane/components/FilterWrapper/index.d.ts

@@ -1,2 +1,2 @@
 export * from './FilterWrapper';
-export type { FilterWrapperStyles } from './FilterWrapper.styles';
+export type { IFilterWrapperStyles } from './FilterWrapper.styles';

package/dist/components/FiltersPane/components/FiltersPaneSearch/FiltersPaneSearch.d.ts

@@ -2,16 +2,14 @@ import { ReactNode } from 'react';
 import { ICommonProps } from '../../../../types';
 import { IFilterLocaleKey, IFiltersPaneSearchPayload, IPartialFilterLocale } from '../../types';
 import { IFilterSelectProps } from '../FilterSelect';
-import { FiltersPaneSearchStyles } from './FiltersPaneSearch.styles';
-export interface IFiltersPaneSearchProps<Value> extends ICommonProps {
-    tweakStyles?: FiltersPaneSearchStyles;
+import { IFiltersPaneSearchStyles } from './FiltersPaneSearch.styles';
+export interface IFiltersPaneSearchProps<Value> extends ICommonProps<IFiltersPaneSearchStyles> {
     field?: Value;
     fields?: Value[];
     value?: string;
     onChange: (v: IFiltersPaneSearchPayload<Value>) => void;
     localeKey?: IFilterLocaleKey;
     locale?: IPartialFilterLocale;
-    testId?: string;
     maxLength?: number;
     getValueView?: (value: Value) => ReactNode;
     getValueId?: (value: Value) => string;

package/dist/components/FiltersPane/components/FiltersPaneSearch/FiltersPaneSearch.styles.d.ts

@@ -1,91 +1,10 @@
-import { ComponentStyles } from '../../../../types';
-export declare const styles: {
-    root: {
-        display: string;
-        position: string;
-        backgroundColor: string;
-        border: (string | number)[];
-        borderRadius: number;
-        paddingRight: number;
-        transition: string;
-        transitionProperty: string;
-    };
-    focused: {
-        backgroundColor: "#ffffff";
-        borderColor: "#d0d6e1";
-    };
-    disabled: {
-        '& $selectBlock': {
-            cursor: string;
-        };
-    };
-    selectWrapper: {
-        position: string;
-        display: string;
-        flexShrink: number;
-    };
-    selectBlock: {
-        display: string;
-        alignItems: string;
-        gap: number;
-        cursor: string;
-        height: string;
-    };
-    selectLabel: {
-        flexShrink: number;
-        fontSize: number;
-        userSelect: string;
-    };
-    chevronIcon: {
-        flexShrink: number;
-        width: number;
-        height: number;
-        marginRight: number;
-        transition: string;
-        opacity: number;
-    };
-    open: {
-        transform: string;
-    };
-    dropdown: {
-        position: string;
-        top: number;
-        right: number;
-        zIndex: number;
-        minWidth: number;
-        marginTop: number;
-        borderRadius: 6;
-        backgroundColor: "#ffffff";
-        overflow: string;
-    };
-    dropdownInput: {
-        borderBottom: (string | number)[];
-    };
-    active: {
-        fontWeight: string;
-    };
-    tweakSearchInput: {
-        tweakInput: {
-            inputWrapper: {
-                backgroundColor: string;
-                border: string;
-                height: number;
-                fontSize: number;
-                minWidth: number;
-            };
-            focused: {
-                backgroundColor: string;
-                border: string;
-            };
-        };
-    };
-    tweakSelect: {
-        root: {
-            borderRadius: number;
-            borderBottomLeftRadius: number;
-            borderBottomRightRadius: number;
-            boxShadow: string;
-        };
-    };
-};
-export declare type FiltersPaneSearchStyles = ComponentStyles<typeof styles>;
+import { ITweakStyles } from '../../../../theme';
+import { ISearchInputStyles } from '../../../SearchInput';
+import { ISelectStyles } from '../../../Select';
+export declare const useStyles: import("../../../../theme").IUseStyles<"root" | "open" | "active" | "disabled" | "dropdownInput" | "dropdown" | "focused" | "selectWrapper" | "selectBlock" | "selectLabel" | "chevronIcon", unknown>;
+export declare const searchInputStyles: ISearchInputStyles;
+export declare const selectStyles: ISelectStyles;
+export declare type IFiltersPaneSearchStyles = ITweakStyles<typeof useStyles, {
+    tweakSearchInput: ISearchInputStyles;
+    tweakSelect: ISelectStyles;
+}>;

package/dist/components/FiltersPane/components/FiltersPaneSearch/index.d.ts

@@ -1,2 +1,2 @@
 export * from './FiltersPaneSearch';
-export type { FiltersPaneSearchStyles } from './FiltersPaneSearch.styles';
+export type { IFiltersPaneSearchStyles } from './FiltersPaneSearch.styles';

package/dist/components/FiltersPane/helpers.d.ts

@@ -1,5 +1,5 @@
 import { type IFilterLocale, type IFilterLocaleKey, type IPartialFilterLocale, ISelectLocale, ISelectLocaleKey } from './types';
 export declare const getLocale: (key?: IFilterLocaleKey, custom?: IPartialFilterLocale, custom2?: IPartialFilterLocale) => IFilterLocale;
 export declare const getSelectLocale: (key?: ISelectLocaleKey, custom?: Partial<ISelectLocale>, custom2?: Partial<ISelectLocale>) => ISelectLocale;
-export declare const sortValues: (arr: Array<number | undefined>) => (number | undefined)[];
+export declare const sortValues: (arr: Array<number | undefined>) => Array<number | undefined>;
 export declare const defaultConvertFunction: (val: unknown) => string;

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

@@ -1,4 +1,4 @@
 export * from './FiltersPane';
+export type { IFiltersPaneStyles } from './FiltersPane.styles';
 export * from './types';
 export * from './components';
-export type { FiltersPaneStyles } from './FiltersPane.styles';

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

@@ -104,4 +104,4 @@ export interface ISelectLocale {
     nothingFound: string;
 }
 export declare type ISelectLocaleKey = keyof typeof SelectLocales;
-export declare type IFilterWithDateDatePickerProps = Omit<IDatePickerProps, 'onChange' | 'value' | 'locale' | 'months' | 'selectedDate'>;
+export declare type IFilterWithDateDatePickerProps = Omit<IDatePickerProps, 'onChange' | 'value' | 'locale' | 'months' | 'selectedDate' | 'tweakStyles'>;

package/dist/components/Flag/Flag.d.ts

@@ -1,8 +1,7 @@
 import { FC } from 'react';
 import { ICommonProps } from '../../types';
-import { FlagStyles } from './Flag.styles';
-export interface IFlagProps extends ICommonProps {
-    tweakStyles?: FlagStyles;
+import { IFlagStyles } from './Flag.styles';
+export interface IFlagProps extends Pick<ICommonProps<IFlagStyles>, 'tweakStyles'> {
     countryCode?: string;
 }
 export declare const Flag: FC<IFlagProps>;

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

@@ -1,12 +1,3 @@
-import { ComponentStyles } from '../../types';
-export declare const styles: {
-    root: {
-        border: (string | number)[];
-        borderRadius: number;
-    };
-    noFlag: {
-        width: number;
-        color: "#505f79";
-    };
-};
-export declare type FlagStyles = ComponentStyles<typeof styles>;
+import { ITweakStyles } from '../../theme';
+export declare const useStyles: import("../../theme").IUseStyles<"root" | "noFlag", unknown>;
+export declare type IFlagStyles = ITweakStyles<typeof useStyles>;

package/dist/components/Flag/augment.d.ts

@@ -1 +1 @@
-declare module 'country-flag-icons/react/3x2';
+declare module 'country-flag-icons/react/3x2';

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

@@ -1,2 +1,2 @@
 export * from './Flag';
-export type { FlagStyles } from './Flag.styles';
+export type { IFlagStyles } from './Flag.styles';

package/dist/components/FlexibleTable/FlexibleTable.d.ts

@@ -1,14 +1,13 @@
 import { ReactNode, RefObject } from 'react';
 import { ICommonProps } from '../../types';
-import { FlexibleTableConfigType, IInfinityScrollConfig } from './types';
-import { FlexibleTableStyles } from './FlexibleTable.styles';
-export interface IFlexibleTableProps<Values extends Record<string, any>> extends ICommonProps {
-    tweakStyles?: FlexibleTableStyles;
+import { IFlexibleTableConfigType, IInfinityScrollConfig } from './types';
+import { IFlexibleTableStyles } from './FlexibleTable.styles';
+export interface IFlexibleTableProps<Values extends Record<string, any>> extends ICommonProps<IFlexibleTableStyles> {
     content: Values[];
     headerContent?: Partial<Record<keyof Values, any>>;
     enabledColumns?: Array<keyof Values>;
     activeRows?: number[];
-    config?: FlexibleTableConfigType<Values>;
+    config?: IFlexibleTableConfigType<Values>;
     isHorizontallyScrollable?: boolean;
     isFirstColumnSticky?: boolean;
     infinityScrollConfig?: IInfinityScrollConfig;
@@ -20,6 +19,5 @@ export interface IFlexibleTableProps<Values extends Record<string, any>> extends
     refForScroll?: RefObject<HTMLDivElement>;
     nothingFoundContent?: ReactNode;
     expandableRowComponent?: (item: Values, isOpen: boolean, close: () => void) => ReactNode;
-    testId?: string;
 }
 export declare function FlexibleTable<Values extends Record<string, any>>({ data, tweakStyles, content, headerContent, config, activeRows, enabledColumns, isHorizontallyScrollable, isFirstColumnSticky, infinityScrollConfig, uniqueField, onHeadClick, onRowHover, onRowClick, refForScroll, rowAttributes, nothingFoundContent, testId, expandableRowComponent, }: IFlexibleTableProps<Values>): JSX.Element;

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

@@ -1,101 +1,7 @@
-import { ComponentStyles } from '../../types';
-export declare const styles: {
-    root: {
-        position: string;
-        width: string;
-        borderCollapse: string;
-        borderSpacing: number;
-    };
-    row: {
-        position: string;
-    };
-    scroll: {
-        overflow: string;
-        maxHeight: string;
-    };
-    horizontallyScrolled: {
-        '& $cellSticky': {
-            boxShadow: string;
-        };
-        '& $headerSticky::before': {
-            boxShadow: string;
-        };
-    };
-    loader: {
-        position: string;
-        left: number;
-        maxWidth: string;
-        height: number;
-        display: string;
-        justifyContent: string;
-        alignItems: string;
-    };
-    headerRow: {
-        verticalAlign: string;
-    };
-    activeRow: {};
-    cell: {
-        position: string;
-        boxSizing: string;
-        padding: number[];
-        fontSize: number;
-        lineHeight: number;
-        zIndex: number;
-        verticalAlign: string;
-    };
-    cellSticky: {
-        zIndex: number;
-        paddingLeft: number;
-        paddingRight: number;
-        transition: string[];
-    };
-    cellSecond: {
-        paddingLeft: number;
-    };
-    header: {
-        position: string;
-        boxSizing: string;
-        top: number;
-        zIndex: number;
-        fontSize: number;
-        fontWeight: string;
-        padding: number[];
-    };
-    headerSticky: {
-        zIndex: number;
-        left: number;
-        paddingLeft: number;
-        paddingRight: number;
-        '&::before': {
-            content: string;
-            display: string;
-            width: string;
-            height: string;
-            position: string;
-            left: number;
-            top: number;
-            background: string;
-            pointerEvents: string;
-            zIndex: number;
-            transition: string[];
-        };
-        '&::after': {
-            content: string;
-            display: string;
-            width: number;
-            height: string;
-            position: string;
-            left: string;
-            top: number;
-            background: string;
-            zIndex: number;
-        };
-    };
-    headerSecond: {
-        paddingLeft: number;
-    };
-    editableRow: {
-        cursor: string;
-    };
-};
-export declare type FlexibleTableStyles = ComponentStyles<typeof styles>;
+import { ITweakStyles } from '../../theme';
+import { IFlexibleTableRowStyles } from './components';
+export declare const STICKY_SHADOW_PADDING = 12;
+export declare const useStyles: import("../../theme").IUseStyles<"root" | "scroll" | "header" | "loader" | "horizontallyScrolled" | "headerRow" | "headerSticky" | "headerSecond", unknown>;
+export declare type IFlexibleTableStyles = ITweakStyles<typeof useStyles, {
+    tweakTableRow: IFlexibleTableRowStyles;
+}>;

package/dist/components/FlexibleTable/components/FlexibleTableCell/FlexibleTableCell.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import type { ICommonProps } from '../../../../types';
+import type { IFlexibleTableConfigType } from '../../types';
+import { IFlexibleTableCellStyles } from './FlexibleTableCell.styles';
+export interface IFlexibleTableCellProps<Values extends Record<string, any>> extends Pick<ICommonProps<IFlexibleTableCellStyles>, 'tweakStyles'> {
+    item: Values;
+    columnName: keyof Values;
+    config?: IFlexibleTableConfigType<Values>;
+    isFocusedRow?: boolean;
+    isSecond?: boolean;
+    isSticky?: boolean;
+    isNestedComponentExpanded: boolean;
+    isRowNestedComponentExpanded: boolean;
+    onSetNestedComponent(component?: ReactNode): void;
+}
+declare function FlexibleTableCell<Values extends Record<string, any>>({ item, columnName, config, isFocusedRow, isSecond, isSticky, isNestedComponentExpanded, isRowNestedComponentExpanded, tweakStyles, onSetNestedComponent, }: IFlexibleTableCellProps<Values>): JSX.Element;
+export default FlexibleTableCell;

package/dist/components/FlexibleTable/components/FlexibleTableCell/FlexibleTableCell.styles.d.ts

@@ -0,0 +1,3 @@
+import { ITweakStyles } from '../../../../theme';
+export declare const useStyles: import("../../../../theme").IUseStyles<"root" | "sticky" | "second", unknown>;
+export declare type IFlexibleTableCellStyles = ITweakStyles<typeof useStyles>;

package/dist/components/FlexibleTable/components/FlexibleTableCell/index.d.ts

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

package/dist/components/FlexibleTable/components/FlexibleTableRow/FlexibleTableRow.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { ICommonProps } from '../../../../types';
+import { IFlexibleTableConfigType } from '../../types';
+import { IFlexibleTableRowStyles } from './FlexibleTableRow.styles';
+export interface IFlexibleTableRowProps<Values extends Record<string, any>> extends Pick<ICommonProps<IFlexibleTableRowStyles>, 'tweakStyles'> {
+    item: Values;
+    uniqueField?: keyof Values;
+    isFirstColumnSticky?: boolean;
+    isActive: boolean;
+    config?: IFlexibleTableConfigType<Values>;
+    enabledColumns?: Array<keyof Values>;
+    rowAttributes?: Array<keyof Values>;
+    expandableRowComponent?(item: Values, isOpen: boolean, close: () => void): ReactNode;
+    onRowHover?(id?: string): void;
+    onRowClick?(id: string): void;
+}
+declare function FlexibleTableRowInner<Values extends Record<string, any>>({ item, uniqueField, isFirstColumnSticky, isActive, config, enabledColumns, rowAttributes, tweakStyles, expandableRowComponent, onRowHover, onRowClick, }: IFlexibleTableRowProps<Values>): JSX.Element;
+export declare const FlexibleTableRow: typeof FlexibleTableRowInner;
+export {};

package/dist/components/FlexibleTable/components/FlexibleTableRow/FlexibleTableRow.styles.d.ts

@@ -0,0 +1,6 @@
+import { ITweakStyles } from '../../../../theme';
+import { IFlexibleTableCellStyles } from '../FlexibleTableCell';
+export declare const useStyles: import("../../../../theme").IUseStyles<"root" | "active" | "editable", unknown>;
+export declare type IFlexibleTableRowStyles = ITweakStyles<typeof useStyles, {
+    tweakTableCell: IFlexibleTableCellStyles;
+}>;

package/dist/components/FlexibleTable/components/FlexibleTableRow/index.d.ts

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

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

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

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

@@ -1,3 +1,4 @@
 export * from './FlexibleTable';
 export * from './types';
-export type { FlexibleTableStyles } from './FlexibleTable.styles';
+export type { IFlexibleTableStyles } from './FlexibleTable.styles';
+export type { IFlexibleTableCellStyles, IFlexibleTableRowStyles } from './components';

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

@@ -13,7 +13,7 @@ export declare type IValueComponent<Values, Value> = (props: {
     isRowNestedComponentExpanded: boolean;
     onSetNestedComponent: (component?: ReactNode) => void;
 }) => JSX.Element | ReactNode;
-export declare type FlexibleTableConfigType<Values> = {
+export declare type IFlexibleTableConfigType<Values> = {
     [Key in keyof Values]?: {
         title?: ReactNode;
         titleComponent?: ITitleComponent<unknown>;

package/dist/components/Icon/Icon.d.ts

@@ -1,9 +1,8 @@
 import { FC } from 'react';
 import { ICommonProps } from '../../types';
 import { IIconType } from './types';
-import { IconStyles } from './Icon.styles';
-export interface IIconProps extends ICommonProps {
-    tweakStyles?: IconStyles;
+import { IIconStyles } from './Icon.styles';
+export interface IIconProps extends ICommonProps<IIconStyles> {
     type: IIconType;
 }
 export declare const Icon: FC<IIconProps>;

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

@@ -1,8 +1,3 @@
-import { ComponentStyles } from '../../types';
-export declare const styles: {
-    root: {
-        display: string;
-        alignItems: string;
-    };
-};
-export declare type IconStyles = ComponentStyles<typeof styles>;
+import { ITweakStyles } from '../../theme';
+export declare const useStyles: import("../../theme").IUseStyles<"root", unknown>;
+export declare type IIconStyles = ITweakStyles<typeof useStyles>;

package/dist/components/Icon/complexIcons/augment.d.ts

@@ -1 +1 @@
-declare module '*.svg?raw';
+declare module '*.svg?raw';

package/dist/components/Icon/icons-list.d.ts

@@ -1 +1 @@
-export declare const iconsList: Record<"direction" | "filter" | "search" | "repeat" | "link" | "sort" | "document" | "vendor-service" | "aircraft-takeoff" | "archive" | "arrow" | "arrow-right" | "baggage" | "balloon" | "bluetooth" | "bonus" | "book" | "box" | "business" | "calendar" | "cancel" | "check" | "check-big" | "check-all" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chevron-down-small" | "chevron-left-small" | "chevron-right-small" | "chevron-up-small" | "circle-check" | "close" | "close-large" | "close-window" | "copy" | "copy-outline" | "crane" | "danger" | "download" | "email" | "eye" | "eye-closed" | "female" | "folder" | "folder-add" | "food" | "information" | "insurance" | "list" | "lock" | "lock-open" | "male" | "menu" | "minus" | "burger-menu" | "pencil" | "pin" | "plane" | "plane-circle" | "plus" | "presentation" | "print" | "question" | "refresh" | "rocket" | "round-trip" | "vendor-logo" | "scan" | "send-email" | "settings" | "sign-out" | "size" | "sort-asc" | "sort-desc" | "sort-list-asc" | "sort-list-desc" | "star" | "status-error" | "status-info" | "status-not-ok" | "status-ok" | "status-warning" | "three-circles" | "ticket-revert" | "ticket" | "time" | "trash-can" | "upgrade" | "user" | "user-group" | "voucher", import("./types").ISvgIcon>;
+export declare const iconsList: Record<"document" | "vendor-service" | "aircraft-takeoff" | "archive" | "arrow" | "arrow-right" | "baggage" | "balloon" | "bluetooth" | "bonus" | "book" | "box" | "business" | "calendar" | "cancel" | "check" | "check-big" | "check-all" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chevron-down-small" | "chevron-left-small" | "chevron-right-small" | "chevron-up-small" | "circle-check" | "close" | "close-large" | "close-window" | "copy" | "copy-outline" | "crane" | "danger" | "direction" | "download" | "email" | "eye" | "eye-closed" | "female" | "filter" | "food" | "information" | "insurance" | "link" | "list" | "lock" | "lock-open" | "male" | "menu" | "minus" | "burger-menu" | "pencil" | "pin" | "plane" | "plane-circle" | "plus" | "print" | "question" | "refresh" | "repeat" | "rocket" | "round-trip" | "vendor-logo" | "scan" | "search" | "send-email" | "settings" | "sign-out" | "size" | "sort" | "sort-asc" | "sort-desc" | "sort-list-asc" | "sort-list-desc" | "star" | "status-error" | "status-info" | "status-not-ok" | "status-ok" | "status-warning" | "three-circles" | "ticket-revert" | "ticket" | "time" | "trash-can" | "upgrade" | "user" | "user-group" | "voucher", import("./types").ISvgIcon>;

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

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

package/dist/components/IncrementInput/IncrementInput.d.ts

@@ -1,8 +1,8 @@
 import { FC } from 'react';
+import { ICommonProps } from '../../types';
 import { INumberInputProps } from '../NumberInput';
-import { IncrementInputStyles } from './IncrementInput.styles';
-export interface IIncrementInputProps extends Omit<INumberInputProps, 'canBeFloat' | 'precision'> {
-    tweakStyles?: IncrementInputStyles;
+import { IIncrementInputStyles } from './IncrementInput.styles';
+export interface IIncrementInputProps extends Omit<INumberInputProps, 'canBeFloat' | 'precision' | 'tweakStyles'>, ICommonProps<IIncrementInputStyles> {
     step?: number;
 }
 export declare const IncrementInput: FC<IIncrementInputProps>;

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

@@ -1,63 +1,9 @@
-import { ComponentStyles } from '../../types';
+import { ITweakStyles } from '../../theme';
+import { IInputStyles } from '../Input';
 export declare const BUTTONS_WIDTH = 36;
 export declare const BUTTONS_GAP = 2;
-export declare const styles: {
-    root: {
-        display: string;
-        alignItems: string;
-        position: string;
-    };
-    buttons: {
-        display: string;
-        flexDirection: string;
-        width: number;
-        position: string;
-        right: number;
-        top: number;
-        bottom: number;
-        zIndex: number;
-    };
-    button: {
-        width: string;
-        height: number;
-        border: string;
-        outline: string;
-        backgroundColor: "#f6f8fc";
-        transition: string;
-        color: "#505f79";
-        cursor: string;
-        display: string;
-        alignItems: string;
-        justifyContent: string;
-        padding: number[];
-        '&:hover, &:focus': {
-            backgroundColor: "#dde3ed";
-        };
-        '&:active': {
-            backgroundColor: "#95a0b3";
-        };
-        '&:first-child': {
-            marginBottom: number;
-        };
-    };
-    disabledButton: {
-        backgroundColor: "#ffffff";
-        color: "#95a0b3";
-        cursor: string;
-        '&:hover': {
-            backgroundColor: "#ffffff";
-        };
-    };
-    errorButton: {};
-    tweakInput: {
-        input: {
-            '&:not($withControls)': {
-                paddingRight: number;
-            };
-        };
-        controls: {
-            paddingRight: number;
-        };
-    };
-};
-export declare type IncrementInputStyles = ComponentStyles<typeof styles>;
+export declare const useStyles: import("../../theme").IUseStyles<"root" | "button" | "buttons" | "disabledButton" | "errorButton", unknown>;
+export declare const inputStyles: IInputStyles;
+export declare type IIncrementInputStyles = ITweakStyles<typeof useStyles, {
+    tweakInput: IInputStyles;
+}>;