@true-engineering/true-react-common-ui-kit 4.0.0-alpha64 → 4.0.0-alpha66

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.
Files changed (30) hide show
  1. package/dist/components/DatePicker/types.d.ts +1 -1
  2. package/dist/components/FiltersPane/components/Filter/helpers.d.ts +1 -0
  3. package/dist/components/FiltersPane/components/FilterDateSingle/FilterDateSingle.d.ts +15 -0
  4. package/dist/components/FiltersPane/components/FilterDateSingle/FilterDateSingle.styles.d.ts +11 -0
  5. package/dist/components/FiltersPane/components/FilterDateSingle/index.d.ts +2 -0
  6. package/dist/components/FiltersPane/components/FilterWithDates/FilterWithDates.styles.d.ts +1 -5
  7. package/dist/components/FiltersPane/components/index.d.ts +1 -0
  8. package/dist/components/FiltersPane/types.d.ts +8 -2
  9. package/dist/theme/types.d.ts +2 -1
  10. package/dist/true-react-common-ui-kit.js +237 -175
  11. package/dist/true-react-common-ui-kit.js.map +1 -1
  12. package/dist/true-react-common-ui-kit.umd.cjs +1 -1
  13. package/dist/true-react-common-ui-kit.umd.cjs.map +1 -1
  14. package/package.json +1 -1
  15. package/src/components/DatePicker/DatePicker.tsx +2 -0
  16. package/src/components/DatePicker/types.ts +1 -0
  17. package/src/components/FiltersPane/FiltersPane.stories.tsx +38 -23
  18. package/src/components/FiltersPane/FiltersPane.tsx +5 -1
  19. package/src/components/FiltersPane/components/Filter/Filter.tsx +19 -1
  20. package/src/components/FiltersPane/components/Filter/helpers.ts +1 -1
  21. package/src/components/FiltersPane/components/FilterDateSingle/FilterDateSingle.styles.ts +34 -0
  22. package/src/components/FiltersPane/components/FilterDateSingle/FilterDateSingle.tsx +103 -0
  23. package/src/components/FiltersPane/components/FilterDateSingle/index.ts +2 -0
  24. package/src/components/FiltersPane/components/FilterValueView/FilterValueView.tsx +2 -2
  25. package/src/components/FiltersPane/components/FilterWithDates/FilterWithDates.styles.ts +1 -24
  26. package/src/components/FiltersPane/components/FilterWithDates/FilterWithDates.tsx +6 -43
  27. package/src/components/FiltersPane/components/index.ts +1 -0
  28. package/src/components/FiltersPane/constants.ts +2 -0
  29. package/src/components/FiltersPane/types.ts +12 -1
  30. package/src/theme/types.ts +2 -0
@@ -1,4 +1,4 @@
1
1
  import { DatePickerProps } from 'react-datepicker';
2
2
  import { IDateInputProps } from '../DateInput';
3
3
  export type IRange = [Date | null, Date | null] | null;
4
- export type IDatePickerBaseProps = Pick<DatePickerProps, 'startDate' | 'endDate' | 'minDate' | 'maxDate' | 'allowSameDay' | 'disabledKeyboardNavigation' | 'monthsShown' | 'popperModifiers' | 'popperPlacement' | 'filterDate' | 'dayClassName' | 'calendarContainer' | 'onCalendarOpen' | 'onCalendarClose' | 'onYearChange' | 'onMonthChange' | 'focusSelectedMonth' | 'shouldCloseOnSelect' | 'showPreviousMonths' | 'todayButton' | 'renderCustomHeader' | 'customInputRef' | 'preventOpenOnFocus' | 'strictParsing' | 'highlightDates' | 'fixedHeight' | 'swapRange' | 'onKeyDown'> & Omit<IDateInputProps, 'date' | 'startDate' | 'endDate' | 'isRange' | 'isActive' | 'icon' | 'maxLength' | 'onChange' | 'onClick' | 'tweakStyles' | 'onKeyDown'>;
4
+ export type IDatePickerBaseProps = Pick<DatePickerProps, 'startDate' | 'endDate' | 'minDate' | 'maxDate' | 'allowSameDay' | 'disabledKeyboardNavigation' | 'monthsShown' | 'popperModifiers' | 'popperPlacement' | 'popperProps' | 'filterDate' | 'dayClassName' | 'calendarContainer' | 'onCalendarOpen' | 'onCalendarClose' | 'onYearChange' | 'onMonthChange' | 'focusSelectedMonth' | 'shouldCloseOnSelect' | 'showPreviousMonths' | 'todayButton' | 'renderCustomHeader' | 'customInputRef' | 'preventOpenOnFocus' | 'strictParsing' | 'highlightDates' | 'fixedHeight' | 'swapRange' | 'onKeyDown'> & Omit<IDateInputProps, 'date' | 'startDate' | 'endDate' | 'isRange' | 'isActive' | 'icon' | 'maxLength' | 'onChange' | 'onClick' | 'tweakStyles' | 'onKeyDown'>;
@@ -1,4 +1,5 @@
1
1
  import { IDatePeriod, IFilterMultiSelectValues, IPeriod } from '../../types';
2
+ export declare const isDateOrEmpty: (value: unknown) => value is Date | null | undefined;
2
3
  export declare const isDatePeriodValue: (value: any) => value is IDatePeriod;
3
4
  export declare const isPeriodValue: (value: any) => value is IPeriod;
4
5
  export declare const isMultiSelectValue: <T extends string>(value: any) => value is IFilterMultiSelectValues<T>;
@@ -0,0 +1,15 @@
1
+ import { FC } from 'react';
2
+ import { ICommonProps } from '../../../../types';
3
+ import { IDatePickerProps } from '../../../DatePicker';
4
+ import { IFilterLocaleKey, IPartialFilterLocale } from '../../types';
5
+ import { IFilterDateSingleStyles } from './FilterDateSingle.styles';
6
+ export interface IFilterDateSingleProps extends ICommonProps<IFilterDateSingleStyles>, Partial<Pick<IDatePickerProps, 'label' | 'minDate' | 'maxDate' | 'calendarStartDay' | 'popperModifiers' | 'popperPlacement'>> {
7
+ value?: Date | null;
8
+ locale?: IPartialFilterLocale;
9
+ localeKey?: IFilterLocaleKey;
10
+ isClearable?: boolean;
11
+ onChange: (value: Date | null) => void;
12
+ onClose?: () => void;
13
+ onEndBtnSubmit: () => void;
14
+ }
15
+ export declare const FilterDateSingle: FC<IFilterDateSingleProps>;
@@ -0,0 +1,11 @@
1
+ import { ITweakStyles } from '../../../../theme';
2
+ import { IButtonStyles } from '../../../Button';
3
+ import { IDatePickerStyles } from '../../../DatePicker';
4
+ export declare const useStyles: import('../../../../theme').IUseStyles<"container" | "root" | "buttons">;
5
+ export declare const clearButtonStyles: Partial<import('../../../../theme').IStyles<"content" | "outline" | "custom" | "s" | "text" | "root" | "inline" | "children" | "active" | "disabled" | "destructive" | "icon" | "fullWidth" | "m" | "l" | "xl" | "primary" | "secondary" | "warning" | "iconFromLeft" | "iconFromRight" | "onlyIcon" | "withIcon" | "loader" | "loading">> & Partial<{
6
+ tweakPreloader: import('../../..').IThemedPreloaderStyles;
7
+ }>;
8
+ export type IFilterDateSingleStyles = ITweakStyles<typeof useStyles, {
9
+ tweakDatePicker: IDatePickerStyles;
10
+ tweakClearButton: IButtonStyles;
11
+ }>;
@@ -0,0 +1,2 @@
1
+ export * from './FilterDateSingle';
2
+ export type { IFilterDateSingleStyles } from './FilterDateSingle.styles';
@@ -1,17 +1,13 @@
1
1
  import { ITweakStyles } from '../../../../theme';
2
2
  import { IButtonStyles } from '../../../Button';
3
3
  import { IDatePickerStyles } from '../../../DatePicker';
4
- export declare const useStyles: import('../../../../theme').IUseStyles<"container" | "root" | "datepicker" | "containerItem" | "btnRow">;
4
+ export declare const useStyles: import('../../../../theme').IUseStyles<"container" | "root" | "containerItem" | "btnRow">;
5
5
  export declare const clearButtonStyles: Partial<import('../../../../theme').IStyles<"content" | "outline" | "custom" | "s" | "text" | "root" | "inline" | "children" | "active" | "disabled" | "destructive" | "icon" | "fullWidth" | "m" | "l" | "xl" | "primary" | "secondary" | "warning" | "iconFromLeft" | "iconFromRight" | "onlyIcon" | "withIcon" | "loader" | "loading">> & Partial<{
6
6
  tweakPreloader: import('../../..').IThemedPreloaderStyles;
7
7
  }>;
8
8
  export declare const backButtonStyles: Partial<import('../../../../theme').IStyles<"content" | "outline" | "custom" | "s" | "text" | "root" | "inline" | "children" | "active" | "disabled" | "destructive" | "icon" | "fullWidth" | "m" | "l" | "xl" | "primary" | "secondary" | "warning" | "iconFromLeft" | "iconFromRight" | "onlyIcon" | "withIcon" | "loader" | "loading">> & Partial<{
9
9
  tweakPreloader: import('../../..').IThemedPreloaderStyles;
10
10
  }>;
11
- export declare const startDatePickerStyles: IDatePickerStyles;
12
- export declare const startDatePickerWithButtonStyles: IDatePickerStyles;
13
- export declare const endDatePickerStyles: IDatePickerStyles;
14
- export declare const endDatePickerWithButtonStyles: IDatePickerStyles;
15
11
  export type IFilterWithDatesStyles = ITweakStyles<typeof useStyles, {
16
12
  tweakClearButton: IButtonStyles;
17
13
  tweakBackButton: IButtonStyles;
@@ -1,4 +1,5 @@
1
1
  export * from './Filter';
2
+ export * from './FilterDateSingle';
2
3
  export * from './FilterInterval';
3
4
  export * from './FilterMultiSelect';
4
5
  export * from './FilterSelect';
@@ -3,7 +3,7 @@ import { ITestIdProps } from '../../types';
3
3
  import { IDatePickerProps } from '../DatePicker';
4
4
  import { IMultiSelectListValues } from '../MultiSelectList';
5
5
  import { INumberInputProps } from '../NumberInput';
6
- import { IFilterIntervalProps, IFilterMultiSelectProps, IFilterSelectProps, IFilterWithDatesProps, IFilterWithPeriodProps, IFilterWrapperStyles } from './components';
6
+ import { IFilterDateSingleProps, IFilterIntervalProps, IFilterMultiSelectProps, IFilterSelectProps, IFilterWithDatesProps, IFilterWithPeriodProps, IFilterWrapperStyles } from './components';
7
7
  import { FilterLocales, PERIODS, SelectLocales } from './constants';
8
8
  export type IPeriodType = (typeof PERIODS)[number];
9
9
  export type IFilterMultiSelectValues<Option = string> = IMultiSelectListValues<Option>;
@@ -25,11 +25,13 @@ export interface IPeriod extends IDatePeriod {
25
25
  label?: string;
26
26
  }
27
27
  export type IPeriodGetter = () => IDatePeriod;
28
+ export type IFilterDateSingleValue = Date;
28
29
  export type IFilterWithDatesValue = IDatePeriod;
29
30
  export type MultiSelectOptionType<Value> = Value | undefined extends IFilterMultiSelectValues<infer Option> | undefined ? Option : unknown;
30
31
  export interface IConfigItemBasicBase<Value> {
31
32
  name: ReactNode;
32
33
  isInline?: boolean;
34
+ isDisabled?: boolean;
33
35
  isClearable?: boolean;
34
36
  requiredFilledFilters?: string[];
35
37
  localeKey?: IFilterLocaleKey;
@@ -58,6 +60,9 @@ export type IDateRangeConfigItem<Value> = IConfigItemBasicBase<Value> & {
58
60
  type: 'dateRange';
59
61
  dateFormat?: string;
60
62
  } & Omit<IFilterWithPeriodProps, 'value' | 'onChange' | 'setIsOpen'>;
63
+ export type IDatePickerSingleConfigItem<Value> = IConfigItemBasicBase<Value> & {
64
+ type: 'datePickerSingle';
65
+ } & Omit<IFilterDateSingleProps, 'value' | 'onChange' | 'onEndBtnSubmit'>;
61
66
  export interface ICustomComponentProps<Value> extends ITestIdProps {
62
67
  value?: Value;
63
68
  onChange: (v?: Value) => void;
@@ -82,7 +87,7 @@ export interface ICustomMultipleConfigItem<Value> extends IConfigItemBasicBase<V
82
87
  getSelectedValue?: (v: ICustomValue<Value>) => ReactNode;
83
88
  }
84
89
  export type ICustomConfigItem<Value> = ICustomRangeConfigItem<Value> | ICustomMultipleConfigItem<Value>;
85
- export type ConfigItem<Value> = ISelectConfigItem<Value> | IMultiSelectConfigItem<Value> | ICustomConfigItem<Value> | IDateRangeWithoutPeriodConfigItem<Value> | IDateRangeConfigItem<Value> | IIntervalConfigItem<Value> | IBooleanConfigItem<Value>;
90
+ export type ConfigItem<Value> = ISelectConfigItem<Value> | IMultiSelectConfigItem<Value> | ICustomConfigItem<Value> | IDateRangeWithoutPeriodConfigItem<Value> | IDateRangeConfigItem<Value> | IDatePickerSingleConfigItem<Value> | IIntervalConfigItem<Value> | IBooleanConfigItem<Value>;
86
91
  export type ConfigType<Values> = {
87
92
  [K in keyof Values]: ConfigItem<Values[K]>;
88
93
  };
@@ -97,6 +102,7 @@ export interface IFilterLocale {
97
102
  from: string;
98
103
  to: string;
99
104
  back: string;
105
+ date: string;
100
106
  months: string[];
101
107
  periods: {
102
108
  [key: string]: string;
@@ -1,6 +1,6 @@
1
1
  import { Classes, JssStyle, JssValue, Styles } from 'jss';
2
2
  import { IMaybeArray } from '@true-engineering/true-react-platform-helpers';
3
- import { IAccountInfoStyles, IAddButtonStyles, IButtonStyles, ICheckboxStyles, ICloseButtonStyles, IControlWrapperStyles, ICssBaselineStyles, IDateInputStyles, IDatePickerHeaderStyles, IDatePickerStyles, IDescriptionStyles, IDocActionsStyles, IDotsPreloaderStyles, IFileInputStyles, IFileItemStyles, IFilterIntervalStyles, IFilterSelectStyles, IFiltersPaneSearchStyles, IFiltersPaneStyles, IFilterValueViewStyles, IFilterWithDatesStyles, IFilterWithPeriodStyles, IFilterWrapperStyles, IFlagStyles, IFlexibleTableCellStyles, IFlexibleTableRowStyles, IFlexibleTableStyles, IIconButtonStyles, IIconStyles, IIconType, 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, IWithMessagesStyles, IWithPopupStyles, IWithTooltipStyles } from '../components';
3
+ import { IAccountInfoStyles, IAddButtonStyles, IButtonStyles, ICheckboxStyles, ICloseButtonStyles, IControlWrapperStyles, ICssBaselineStyles, IDateInputStyles, IDatePickerHeaderStyles, IDatePickerStyles, IDescriptionStyles, IDocActionsStyles, IDotsPreloaderStyles, IFileInputStyles, IFileItemStyles, IFilterDateSingleStyles, IFilterIntervalStyles, IFilterSelectStyles, IFiltersPaneSearchStyles, IFiltersPaneStyles, IFilterValueViewStyles, IFilterWithDatesStyles, IFilterWithPeriodStyles, IFilterWrapperStyles, IFlagStyles, IFlexibleTableCellStyles, IFlexibleTableRowStyles, IFlexibleTableStyles, IIconButtonStyles, IIconStyles, IIconType, 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, IWithMessagesStyles, IWithPopupStyles, IWithTooltipStyles } from '../components';
4
4
  export type IStyles<C extends string> = Styles<C>;
5
5
  export type IStyle = JssStyle;
6
6
  export type IMixedStyles<T> = IMaybeArray<T | boolean | undefined>;
@@ -27,6 +27,7 @@ export interface IComponentStyles {
27
27
  FileItem: IFileItemStyles;
28
28
  FilterValueView: IFilterValueViewStyles;
29
29
  FiltersPane: IFiltersPaneStyles;
30
+ FilterDateSingle: IFilterDateSingleStyles;
30
31
  FilterInterval: IFilterIntervalStyles;
31
32
  FilterSelect: IFilterSelectStyles;
32
33
  FilterWithDates: IFilterWithDatesStyles;