@up42/up-components 5.16.0-date-pickers.0 → 5.16.1

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.
@@ -2,8 +2,8 @@ import { DatePickerProps as MuiDatePickerProps } from '@mui/x-date-pickers-pro';
2
2
  import { Dayjs } from 'dayjs';
3
3
  import React from 'react';
4
4
  import { type DatePickerWrapperProps } from '../FormDatePickerWrapper';
5
- export type FormDatePickerDateType = Date | Dayjs | null | undefined;
6
- type NonGenericMuiDatePickerProps = MuiDatePickerProps<FormDatePickerDateType>;
5
+ export type DatePickerDateType = Dayjs | null | undefined;
6
+ type NonGenericMuiDatePickerProps = MuiDatePickerProps<DatePickerDateType>;
7
7
  export type FormDatePickerProps = NonGenericMuiDatePickerProps & DatePickerWrapperProps;
8
8
  export declare const FormDatePicker: React.ForwardRefExoticComponent<NonGenericMuiDatePickerProps & DatePickerWrapperProps & React.RefAttributes<HTMLDivElement>>;
9
9
  export {};
@@ -1,35 +1,23 @@
1
+ import { DatePickerProps as MuiDatePickerProps } from '@mui/x-date-pickers-pro';
1
2
  import React from 'react';
2
- import { DateRangePickerProps } from '@mui/x-date-pickers-pro/DateRangePicker';
3
- import { type DatePickerWrapperProps } from '../FormDatePickerWrapper';
4
- import { FormDatePickerDateType } from '../FormDatePicker/FormDatePicker';
5
- export type DateRange = {
6
- start: FormDatePickerDateType;
7
- end: FormDatePickerDateType;
3
+ import type { MUIGlobalOmit } from '@global/utils/types';
4
+ import { DatePickerDateType, FormDatePickerProps } from '../FormDatePicker/FormDatePicker';
5
+ type NonGenericMuiDatePickerProps = MuiDatePickerProps<DatePickerDateType>;
6
+ export type FormDateRangePickerProps = Omit<MUIGlobalOmit<NonGenericMuiDatePickerProps>, 'value' | 'onChange'> & {
7
+ start: DatePickerDateType;
8
+ onStartChange: (date: DatePickerDateType) => void;
9
+ end: DatePickerDateType;
10
+ onEndChange: (date: DatePickerDateType) => void;
11
+ label?: string;
12
+ startPickerProps?: {
13
+ slotProps: FormDatePickerProps['slotProps'];
14
+ };
15
+ endPickerProps?: {
16
+ slotProps: FormDatePickerProps['slotProps'];
17
+ };
8
18
  };
9
- export declare const DEFAULT_FORMAT = "YYYY\u2013MM\u2013DD";
10
- export type FormDateRangePickerProps = {
11
- startLabel?: string;
12
- startPlaceholder?: string;
13
- endLabel?: string;
14
- endPlaceholder?: string;
15
- value: DateRange | null;
16
- onChange?: (value: DateRange | null) => void;
17
- disabled?: boolean;
18
- /**
19
- * Defines whether or not the user can input values and navigate in the calendars using the keyboard.
20
- */
21
- allowKeyboard?: boolean;
22
- /**
23
- * Defines the minimum number of days after the "start date" that the "end date" can be selected.
24
- */
25
- minEndDateOffset?: number;
26
- /**
27
- * Defines the maximum number of days after the "start date" that the "end date" can be selected.
28
- */
29
- maxEndDateOffset?: number;
30
- } & DatePickerWrapperProps & Omit<DateRangePickerProps<FormDatePickerDateType | Date>, 'value' | 'onChange'>;
31
19
  /**
32
- * FormDateRangePicker allows users to choose two dates (start and end) using calendar view.
33
- * Documentation: https://up-components.up42.com/?path=/docs-patterns-form-formdaterangepicker--docs
20
+ * Documentation: https://up-components.up42.com/?path=/docs/patterns-form-formdaterangepicker--docs
34
21
  */
35
- export declare const FormDateRangePicker: ({ value, onChange, label, helperText, error, startLabel, endLabel, disabled, minEndDateOffset, maxEndDateOffset, allowKeyboard, startPlaceholder, endPlaceholder, format, ...props }: FormDateRangePickerProps) => React.JSX.Element;
22
+ export declare const FormDateRangePicker: ({ start, onStartChange, end, onEndChange, label, minDate, maxDate, startPickerProps, endPickerProps, ...props }: FormDateRangePickerProps) => React.JSX.Element;
23
+ export {};
@@ -1,17 +1,36 @@
1
1
  import React from 'react';
2
+ import { DateRangePickerProps } from '@mui/x-date-pickers-pro/DateRangePicker';
2
3
  import { type DatePickerWrapperProps } from '../FormDatePickerWrapper';
3
- import { FormDateRangePickerProps, DateRange } from '../FormDateRangePicker/FormDateRangePicker';
4
+ import { DatePickerDateType } from '../FormDatePicker/FormDatePicker';
5
+ export type DateRange = {
6
+ start: DatePickerDateType | Date;
7
+ end: DatePickerDateType | Date;
8
+ };
4
9
  export type FormDateRangePickerListProps = {
10
+ startLabel?: string;
11
+ endLabel?: string;
5
12
  value: DateRange[];
6
13
  onChange?: (value: DateRange[]) => void;
7
14
  disabled?: boolean;
15
+ /**
16
+ * Defines whether or not the user can input values and navigate in the calendars using the keyboard.
17
+ */
18
+ allowKeyboard?: boolean;
19
+ /**
20
+ * Defines the minimum number of days after the "start date" that the "end date" can be selected.
21
+ */
22
+ minEndDateOffset?: number;
23
+ /**
24
+ * Defines the maximum number of days after the "start date" that the "end date" can be selected.
25
+ */
26
+ maxEndDateOffset?: number;
8
27
  /**
9
28
  * Defines the text to display in the action button to add a new Date Range.
10
29
  * It defaults to "Add new date".
11
30
  */
12
31
  addButtonText?: string;
13
- } & DatePickerWrapperProps & Omit<FormDateRangePickerProps, 'value' | 'onChange'>;
32
+ } & DatePickerWrapperProps & Omit<DateRangePickerProps<DatePickerDateType | Date>, 'value' | 'onChange'>;
14
33
  /**
15
34
  * Documentation: https://up-components.up42.com/?path=/docs/patterns-form-formdaterangepickerlist--docs
16
35
  */
17
- export declare const FormDateRangePickerList: ({ value, onChange, label, helperText, error, disabled, addButtonText, ...props }: FormDateRangePickerListProps) => React.JSX.Element;
36
+ export declare const FormDateRangePickerList: ({ value, onChange, label, helperText, error, startLabel, endLabel, disabled, minEndDateOffset, maxEndDateOffset, allowKeyboard, addButtonText, ...props }: FormDateRangePickerListProps) => React.JSX.Element;
@@ -10,10 +10,10 @@ export { GridContainer, type GridContainerProps, GridItem, type GridItemProps }
10
10
  export { PageContainer, type PageContainerProps } from './components/PageContainer/PageContainer';
11
11
  export { Checkbox, type CheckboxProps } from './components/Checkbox/Checkbox';
12
12
  export { FormCheckbox, type FormCheckboxProps } from './components/FormCheckbox/FormCheckbox';
13
- export { FormDatePicker, type FormDatePickerProps, type FormDatePickerDateType, } from './components/FormDatePickers/FormDatePicker/FormDatePicker';
14
- export { FormDateRangePicker, type FormDateRangePickerProps, type DateRange, } from './components/FormDatePickers/FormDateRangePicker/FormDateRangePicker';
13
+ export { FormDatePicker, type FormDatePickerProps, type DatePickerDateType, } from './components/FormDatePickers/FormDatePicker/FormDatePicker';
14
+ export { FormDateRangePicker, type FormDateRangePickerProps, } from './components/FormDatePickers/FormDateRangePicker/FormDateRangePicker';
15
15
  export { FormDateTimePicker, type FormDateTimePickerProps, } from './components/FormDatePickers/FormDateTimePicker/FormDateTimePicker';
16
- export { FormDateRangePickerList, type FormDateRangePickerListProps, } from './components/FormDatePickers/FormDateRangePickerList/FormDateRangePickerList';
16
+ export { FormDateRangePickerList, type FormDateRangePickerListProps, type DateRange, } from './components/FormDatePickers/FormDateRangePickerList/FormDateRangePickerList';
17
17
  export { Radio, type RadioProps } from './components/Radio/Radio';
18
18
  export { FormRadio, type FormRadioProps } from './components/FormRadio/FormRadio';
19
19
  export { Switch, type SwitchProps } from './components/Switch/Switch';
@@ -3,6 +3,9 @@ export interface CursorPaginatedResponse<T> {
3
3
  nextCursor: number | null;
4
4
  prevCursor: number | null;
5
5
  }
6
+ export interface UseCursorPaginationOptions {
7
+ defaultPageSize?: number;
8
+ }
6
9
  type UseCursorPaginationResponse = {
7
10
  pageSize: number;
8
11
  page: number;
@@ -30,5 +33,5 @@ export declare const useCursorPagination: (fetchingHook: ({ params }: {
30
33
  isRefetching: boolean;
31
34
  }, searchParams?: {
32
35
  [paramName: string]: string;
33
- } | undefined) => UseCursorPaginationResponse;
36
+ } | undefined, options?: UseCursorPaginationOptions) => UseCursorPaginationResponse;
34
37
  export {};
package/dist/index.d.ts CHANGED
@@ -177,22 +177,43 @@ type DatePickerWrapperProps = {
177
177
  helperText?: string;
178
178
  };
179
179
 
180
- type FormDatePickerDateType = Date | Dayjs | null | undefined;
181
- type NonGenericMuiDatePickerProps = DatePickerProps<FormDatePickerDateType>;
182
- type FormDatePickerProps = NonGenericMuiDatePickerProps & DatePickerWrapperProps;
183
- declare const FormDatePicker: React__default.ForwardRefExoticComponent<NonGenericMuiDatePickerProps & DatePickerWrapperProps & React__default.RefAttributes<HTMLDivElement>>;
180
+ type DatePickerDateType = Dayjs | null | undefined;
181
+ type NonGenericMuiDatePickerProps$1 = DatePickerProps<DatePickerDateType>;
182
+ type FormDatePickerProps = NonGenericMuiDatePickerProps$1 & DatePickerWrapperProps;
183
+ declare const FormDatePicker: React__default.ForwardRefExoticComponent<NonGenericMuiDatePickerProps$1 & DatePickerWrapperProps & React__default.RefAttributes<HTMLDivElement>>;
184
+
185
+ type NonGenericMuiDatePickerProps = DatePickerProps<DatePickerDateType>;
186
+ type FormDateRangePickerProps = Omit<MUIGlobalOmit<NonGenericMuiDatePickerProps>, 'value' | 'onChange'> & {
187
+ start: DatePickerDateType;
188
+ onStartChange: (date: DatePickerDateType) => void;
189
+ end: DatePickerDateType;
190
+ onEndChange: (date: DatePickerDateType) => void;
191
+ label?: string;
192
+ startPickerProps?: {
193
+ slotProps: FormDatePickerProps['slotProps'];
194
+ };
195
+ endPickerProps?: {
196
+ slotProps: FormDatePickerProps['slotProps'];
197
+ };
198
+ };
199
+ /**
200
+ * Documentation: https://up-components.up42.com/?path=/docs/patterns-form-formdaterangepicker--docs
201
+ */
202
+ declare const FormDateRangePicker: ({ start, onStartChange, end, onEndChange, label, minDate, maxDate, startPickerProps, endPickerProps, ...props }: FormDateRangePickerProps) => React__default.JSX.Element;
203
+
204
+ type NonGenericMuiDateTimePickerProps = DateTimePickerProps<Dayjs | null | undefined>;
205
+ type FormDateTimePickerProps = NonGenericMuiDateTimePickerProps & DatePickerWrapperProps;
206
+ declare const FormDateTimePicker: React__default.ForwardRefExoticComponent<NonGenericMuiDateTimePickerProps & DatePickerWrapperProps & React__default.RefAttributes<HTMLDivElement>>;
184
207
 
185
208
  type DateRange = {
186
- start: FormDatePickerDateType;
187
- end: FormDatePickerDateType;
209
+ start: DatePickerDateType | Date;
210
+ end: DatePickerDateType | Date;
188
211
  };
189
- type FormDateRangePickerProps = {
212
+ type FormDateRangePickerListProps = {
190
213
  startLabel?: string;
191
- startPlaceholder?: string;
192
214
  endLabel?: string;
193
- endPlaceholder?: string;
194
- value: DateRange | null;
195
- onChange?: (value: DateRange | null) => void;
215
+ value: DateRange[];
216
+ onChange?: (value: DateRange[]) => void;
196
217
  disabled?: boolean;
197
218
  /**
198
219
  * Defines whether or not the user can input values and navigate in the calendars using the keyboard.
@@ -206,31 +227,16 @@ type FormDateRangePickerProps = {
206
227
  * Defines the maximum number of days after the "start date" that the "end date" can be selected.
207
228
  */
208
229
  maxEndDateOffset?: number;
209
- } & DatePickerWrapperProps & Omit<DateRangePickerProps<FormDatePickerDateType | Date>, 'value' | 'onChange'>;
210
- /**
211
- * FormDateRangePicker allows users to choose two dates (start and end) using calendar view.
212
- * Documentation: https://up-components.up42.com/?path=/docs-patterns-form-formdaterangepicker--docs
213
- */
214
- declare const FormDateRangePicker: ({ value, onChange, label, helperText, error, startLabel, endLabel, disabled, minEndDateOffset, maxEndDateOffset, allowKeyboard, startPlaceholder, endPlaceholder, format, ...props }: FormDateRangePickerProps) => React__default.JSX.Element;
215
-
216
- type NonGenericMuiDateTimePickerProps = DateTimePickerProps<Dayjs | null | undefined>;
217
- type FormDateTimePickerProps = NonGenericMuiDateTimePickerProps & DatePickerWrapperProps;
218
- declare const FormDateTimePicker: React__default.ForwardRefExoticComponent<NonGenericMuiDateTimePickerProps & DatePickerWrapperProps & React__default.RefAttributes<HTMLDivElement>>;
219
-
220
- type FormDateRangePickerListProps = {
221
- value: DateRange[];
222
- onChange?: (value: DateRange[]) => void;
223
- disabled?: boolean;
224
230
  /**
225
231
  * Defines the text to display in the action button to add a new Date Range.
226
232
  * It defaults to "Add new date".
227
233
  */
228
234
  addButtonText?: string;
229
- } & DatePickerWrapperProps & Omit<FormDateRangePickerProps, 'value' | 'onChange'>;
235
+ } & DatePickerWrapperProps & Omit<DateRangePickerProps<DatePickerDateType | Date>, 'value' | 'onChange'>;
230
236
  /**
231
237
  * Documentation: https://up-components.up42.com/?path=/docs/patterns-form-formdaterangepickerlist--docs
232
238
  */
233
- declare const FormDateRangePickerList: ({ value, onChange, label, helperText, error, disabled, addButtonText, ...props }: FormDateRangePickerListProps) => React__default.JSX.Element;
239
+ declare const FormDateRangePickerList: ({ value, onChange, label, helperText, error, startLabel, endLabel, disabled, minEndDateOffset, maxEndDateOffset, allowKeyboard, addButtonText, ...props }: FormDateRangePickerListProps) => React__default.JSX.Element;
234
240
 
235
241
  type RadioProps = MUIGlobalOmit<RadioProps$1>;
236
242
  /**
@@ -5824,6 +5830,9 @@ interface CursorPaginatedResponse<T> {
5824
5830
  nextCursor: number | null;
5825
5831
  prevCursor: number | null;
5826
5832
  }
5833
+ interface UseCursorPaginationOptions {
5834
+ defaultPageSize?: number;
5835
+ }
5827
5836
  type UseCursorPaginationResponse = {
5828
5837
  pageSize: number;
5829
5838
  page: number;
@@ -5851,7 +5860,7 @@ declare const useCursorPagination: (fetchingHook: ({ params }: {
5851
5860
  isRefetching: boolean;
5852
5861
  }, searchParams?: {
5853
5862
  [paramName: string]: string;
5854
- } | undefined) => UseCursorPaginationResponse;
5863
+ } | undefined, options?: UseCursorPaginationOptions) => UseCursorPaginationResponse;
5855
5864
 
5856
5865
  type UseToggleResult = [
5857
5866
  boolean,
@@ -5940,4 +5949,4 @@ type ContextState = {
5940
5949
  declare const useAlert: () => ContextState;
5941
5950
 
5942
5951
  export { Alert, Avatar, Badge, Banner, Button, Checkbox, CodeBlock, CodeInline, CodeSnippet, ContactBox, ControlButton, CopyButton, DataGrid, DateTime, Divider, DocumentationPopover, EditTagsButton, EmptyState, FeatureCard, FeatureCardHeader, FeatureCardHeaderActions, FeatureFlagCheckbox, FormCheckbox, FormDatePicker, FormDateRangePicker, FormDateRangePickerList, FormDateTimePicker, FormInput, FormRadio, FormSelect, FormSwitch, GridContainer, GridItem, Icon, Illustration, InfoCard, InfoModal, InfoPopover, Input, Link, Loading, Logo, NotFound, PageContainer, PageHeader, PageHeaderV2, Popover, Radio, Select, Slider, StatusLight, Switch, Tab, TabGroup, Table, TableBody, TableCell, TableContainer, TableFooter, TableHead, TablePagination, TableRow, TableSortLabel, Tabs, Tag, TagsList, ToggleButton, Typography, UpComponentsProvider, analytics, capitalize, copyToClipboard, formatDate, formatFileSize, formatNumber, generateQueryKey, theme, useAlert, useCursorPagination, useDebounce, useQueryParams, useRemotePagination, useToggle };
5943
- export type { AlertProps, AnalyticsConfig, AvatarProps, BadgeProps, BannerProps, ButtonProps, CheckboxProps, CodeBlockProps, CodeInlineProps, CodeSnippetItemProps, CodeSnippetProps, ContactBoxProps, ControlButtonProps, CopyButtonProps, CreateAlertProps, CreateSnackbarProps, CursorPaginatedResponse, DateRange, DateTimeProps, DividerProps, DocumentationPopoverProps, EditTagsButtonProps, EmptyStateProps, FeatureCardHeaderActionsProps, FeatureCardHeaderProps, FeatureCardProps, FeatureFlagCheckboxProps, FormCheckboxProps, FormDatePickerDateType, FormDatePickerProps, FormDateRangePickerListProps, FormDateRangePickerProps, FormDateTimePickerProps, FormInputProps, FormRadioProps, FormSelectProps, FormSwitchProps, GridContainerProps, GridItemProps, IconAction, IconProps$1 as IconProps, IllustrationProps, InfoCardProps, InfoModalProps, InfoPopoverProps, InputProps, LinkProps, LoadingProps, LogoProps, MenuAction, NotFoundProps, PageContainerProps, PageHeaderProps, PageHeaderV2Props, PaginatedResponse, PopoverProps, RadioProps, SelectProps, SliderProps, StatusLightProps, SwitchProps, TabGroupProps, TabProps, TableBodyProps, TableCellProps, TableContainerProps, TableFooterProps, TableHeadProps, TablePaginationProps, TableProps, TableRowProps, TableSortLabelProps, TabsProps, TagItem, TagProps, TagsListProps, ToggleButtonProps, TypographyProps, UseToggleResult };
5952
+ export type { AlertProps, AnalyticsConfig, AvatarProps, BadgeProps, BannerProps, ButtonProps, CheckboxProps, CodeBlockProps, CodeInlineProps, CodeSnippetItemProps, CodeSnippetProps, ContactBoxProps, ControlButtonProps, CopyButtonProps, CreateAlertProps, CreateSnackbarProps, CursorPaginatedResponse, DatePickerDateType, DateRange, DateTimeProps, DividerProps, DocumentationPopoverProps, EditTagsButtonProps, EmptyStateProps, FeatureCardHeaderActionsProps, FeatureCardHeaderProps, FeatureCardProps, FeatureFlagCheckboxProps, FormCheckboxProps, FormDatePickerProps, FormDateRangePickerListProps, FormDateRangePickerProps, FormDateTimePickerProps, FormInputProps, FormRadioProps, FormSelectProps, FormSwitchProps, GridContainerProps, GridItemProps, IconAction, IconProps$1 as IconProps, IllustrationProps, InfoCardProps, InfoModalProps, InfoPopoverProps, InputProps, LinkProps, LoadingProps, LogoProps, MenuAction, NotFoundProps, PageContainerProps, PageHeaderProps, PageHeaderV2Props, PaginatedResponse, PopoverProps, RadioProps, SelectProps, SliderProps, StatusLightProps, SwitchProps, TabGroupProps, TabProps, TableBodyProps, TableCellProps, TableContainerProps, TableFooterProps, TableHeadProps, TablePaginationProps, TableProps, TableRowProps, TableSortLabelProps, TabsProps, TagItem, TagProps, TagsListProps, ToggleButtonProps, TypographyProps, UseToggleResult };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@up42/up-components",
3
- "version": "5.16.0-date-pickers.0",
3
+ "version": "5.16.1",
4
4
  "description": "UP42 Component Library",
5
5
  "author": "Axel Fuhrmann axel.fuhrmann@up42.com",
6
6
  "license": "ISC",
@@ -30,7 +30,7 @@
30
30
  "optimize-icons": "svgo -f src/global/icons"
31
31
  },
32
32
  "dependencies": {
33
- "@up42/design-system-tokens": "^7.0.0",
33
+ "@up42/design-system-tokens": "^7.0.1",
34
34
  "dayjs": "^1.11.7",
35
35
  "prismjs": "^1.29.0"
36
36
  },
@@ -78,7 +78,7 @@
78
78
  "prettier": "^2.5.1",
79
79
  "react": "^17.0.2",
80
80
  "react-router-dom": "^6.14.0",
81
- "rimraf": "^6.0.1",
81
+ "rimraf": "^6.1.2",
82
82
  "rollup": "^4.13.2",
83
83
  "rollup-plugin-dts": "^6.1.0",
84
84
  "rollup-plugin-peer-deps-external": "^2.2.4",
@@ -116,8 +116,6 @@
116
116
  },
117
117
  "packageManager": "pnpm@10.10.0+sha512.d615db246fe70f25dcfea6d8d73dee782ce23e2245e3c4f6f888249fb568149318637dca73c2c5c8ef2a4ca0d5657fb9567188bfab47f566d1ee6ce987815c39",
118
118
  "pnpm": {
119
- "overrides": {
120
- "tmp": ">=0.2.4"
121
- }
119
+ "overrides": {}
122
120
  }
123
121
  }