@true-engineering/true-react-common-ui-kit 3.56.0 → 3.56.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/FiltersPane/components/FilterInterval/FilterInterval.d.ts +3 -11
- package/dist/components/FiltersPane/types.d.ts +2 -0
- package/dist/components/FlexibleTable/FlexibleTable.styles.d.ts +1 -1
- package/dist/true-react-common-ui-kit.js +433 -387
- package/dist/true-react-common-ui-kit.js.map +1 -1
- package/dist/true-react-common-ui-kit.umd.cjs +433 -387
- package/dist/true-react-common-ui-kit.umd.cjs.map +1 -1
- package/package.json +1 -1
- package/src/components/FiltersPane/components/FilterInterval/FilterInterval.tsx +5 -17
- package/src/components/FiltersPane/types.ts +6 -0
- package/src/components/FlexibleTable/FlexibleTable.styles.ts +4 -2
- package/src/components/FlexibleTable/FlexibleTable.tsx +4 -1
package/package.json
CHANGED
|
@@ -6,7 +6,7 @@ import { ICommonProps } from '../../../../types';
|
|
|
6
6
|
import { Button } from '../../../Button';
|
|
7
7
|
import { NumberInput } from '../../../NumberInput';
|
|
8
8
|
import { getLocale, sortValues } from '../../helpers';
|
|
9
|
-
import { IFilterLocaleKey, IPartialFilterLocale } from '../../types';
|
|
9
|
+
import { IFilterLocaleKey, IFilterNumberInputProps, IPartialFilterLocale } from '../../types';
|
|
10
10
|
import {
|
|
11
11
|
useStyles,
|
|
12
12
|
IFilterIntervalStyles,
|
|
@@ -22,16 +22,8 @@ export interface IFilterIntervalProps extends ICommonProps<IFilterIntervalStyles
|
|
|
22
22
|
locale?: IPartialFilterLocale;
|
|
23
23
|
withFieldNameInLabel?: boolean;
|
|
24
24
|
canBeFloat?: boolean;
|
|
25
|
-
fromInput?:
|
|
26
|
-
|
|
27
|
-
max?: number;
|
|
28
|
-
maxLength?: number;
|
|
29
|
-
};
|
|
30
|
-
toInput?: {
|
|
31
|
-
min?: number;
|
|
32
|
-
max?: number;
|
|
33
|
-
maxLength?: number;
|
|
34
|
-
};
|
|
25
|
+
fromInput?: IFilterNumberInputProps;
|
|
26
|
+
toInput?: IFilterNumberInputProps;
|
|
35
27
|
}
|
|
36
28
|
|
|
37
29
|
export const FilterInterval: FC<IFilterIntervalProps> = ({
|
|
@@ -101,11 +93,9 @@ export const FilterInterval: FC<IFilterIntervalProps> = ({
|
|
|
101
93
|
border="bottom"
|
|
102
94
|
canBeFloat={canBeFloat}
|
|
103
95
|
isClearable
|
|
104
|
-
min={fromInput?.min}
|
|
105
|
-
max={fromInput?.max}
|
|
106
|
-
maxLength={fromInput?.maxLength}
|
|
107
96
|
tweakStyles={tweakInputStyles}
|
|
108
97
|
testId={getTestId(testId, 'start')}
|
|
98
|
+
{...fromInput}
|
|
109
99
|
/>
|
|
110
100
|
{withFieldNameInLabel && (
|
|
111
101
|
<div className={classes.autosize}>
|
|
@@ -125,11 +115,9 @@ export const FilterInterval: FC<IFilterIntervalProps> = ({
|
|
|
125
115
|
border="bottom"
|
|
126
116
|
canBeFloat={canBeFloat}
|
|
127
117
|
isClearable
|
|
128
|
-
min={toInput?.min}
|
|
129
|
-
max={toInput?.max}
|
|
130
|
-
maxLength={toInput?.maxLength}
|
|
131
118
|
tweakStyles={tweakInputStyles}
|
|
132
119
|
testId={getTestId(testId, 'end')}
|
|
120
|
+
{...toInput}
|
|
133
121
|
/>
|
|
134
122
|
{withFieldNameInLabel && (
|
|
135
123
|
<div className={classes.autosize}>
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { FC, ReactNode } from 'react';
|
|
2
2
|
import { IDatePickerProps } from '../DatePicker';
|
|
3
3
|
import { IMultiSelectListValues } from '../MultiSelectList';
|
|
4
|
+
import { INumberInputProps } from '../NumberInput';
|
|
4
5
|
import type {
|
|
5
6
|
IFilterIntervalProps,
|
|
6
7
|
IFilterMultiSelectProps,
|
|
@@ -173,3 +174,8 @@ export type IFilterWithDateDatePickerProps = Omit<
|
|
|
173
174
|
IDatePickerProps,
|
|
174
175
|
'onChange' | 'value' | 'locale' | 'months' | 'selectedDate' | 'tweakStyles'
|
|
175
176
|
>;
|
|
177
|
+
|
|
178
|
+
export type IFilterNumberInputProps = Omit<
|
|
179
|
+
INumberInputProps,
|
|
180
|
+
'onChange' | 'value' | 'label' | 'testId' | 'tweakStyles'
|
|
181
|
+
>;
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { rgba } from '../../helpers';
|
|
2
|
-
import { colors, ITweakStyles, createThemedStyles, animations } from '../../theme';
|
|
2
|
+
import { colors, ITweakStyles, createThemedStyles, animations, helpers } from '../../theme';
|
|
3
3
|
import type { IFlexibleTableRowStyles } from './components';
|
|
4
4
|
|
|
5
5
|
export const STICKY_SHADOW_PADDING = 12;
|
|
6
6
|
|
|
7
7
|
export const useStyles = createThemedStyles('FlexibleTable', {
|
|
8
|
+
flexibleTableWrapper: {},
|
|
9
|
+
|
|
8
10
|
root: {
|
|
9
11
|
width: '100%',
|
|
10
12
|
position: 'relative',
|
|
@@ -13,7 +15,7 @@ export const useStyles = createThemedStyles('FlexibleTable', {
|
|
|
13
15
|
},
|
|
14
16
|
|
|
15
17
|
scroll: {
|
|
16
|
-
|
|
18
|
+
...helpers.withScrollBar,
|
|
17
19
|
/*
|
|
18
20
|
Чтобы сделать таблицу на всю высоту проставьте
|
|
19
21
|
height у родителя таблицы у себя в проекте.
|
|
@@ -221,7 +221,10 @@ export function FlexibleTable<
|
|
|
221
221
|
const Table = TableRenders[renderMode];
|
|
222
222
|
|
|
223
223
|
return (
|
|
224
|
-
<div
|
|
224
|
+
<div
|
|
225
|
+
ref={ref}
|
|
226
|
+
className={clsx(classes.flexibleTableWrapper, { [classes.scroll]: isHorizontallyScrollable })}
|
|
227
|
+
>
|
|
225
228
|
<Table.Root
|
|
226
229
|
className={classes.root}
|
|
227
230
|
{...addDataTestId(testId)}
|