@croquiscom/pds 10.4.0 → 10.6.0

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/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @croquiscom/pds
2
2
 
3
+ ## 10.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - d4199d8: feat: Drawer close animation 사용여부 prop 추가
8
+
9
+ ## 10.5.0
10
+
11
+ ### Minor Changes
12
+
13
+ - 0b9baf1: TimePicker 개별 disabled option 추가
14
+
3
15
  ## 10.4.0
4
16
 
5
17
  ### Minor Changes
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { DateRange } from 'react-day-picker';
3
3
  import { Duration } from 'date-fns';
4
4
  import { DatePickerBaseProps } from './DatePicker';
5
- import { TimePickerProps } from '../time-picker';
5
+ import { TimePickerProps, DisabledTimes } from '../time-picker';
6
6
  export type DatePresetItem = {
7
7
  id: number;
8
8
  label: string;
@@ -11,6 +11,9 @@ export type DatePresetItem = {
11
11
  };
12
12
  export type DatePreset = DatePresetItem[];
13
13
  export type Dates = DateRange;
14
+ export interface DateRangeTimePickerProps extends Omit<TimePickerProps, 'value' | 'fill' | 'onChange' | 'disabledTime'> {
15
+ disabledTime?: (value: Date | null, range?: 'from' | 'to') => DisabledTimes;
16
+ }
14
17
  export interface DateRangePickerProps extends Omit<DatePickerBaseProps, 'disabled'> {
15
18
  /**
16
19
  * 좌측 팝오버 DatePreset 사용 유무
@@ -69,7 +72,7 @@ export interface DateRangePickerProps extends Omit<DatePickerBaseProps, 'disable
69
72
  /**
70
73
  * [TimePickerProps](https://storybook.kakaostyle.in/master/pds/?path=/docs/component-timepicker--base)를 적용할 수 있습니다.
71
74
  */
72
- timePickerProps?: Omit<TimePickerProps, 'value' | 'fill' | 'onChange'>;
75
+ timePickerProps?: DateRangeTimePickerProps;
73
76
  /**
74
77
  * TimePicker 사용시 NowButton disabled 유무
75
78
  * @default false
@@ -1,9 +1,12 @@
1
+ import { TimeOption } from '../time-picker/TimePickerOptions';
1
2
  /**
2
3
  * @param value string
3
4
  * @param dateFormat string [default='yyyy.MM.dd']
4
5
  * @param strongCheck boolean [default=false] 값이 없는 경우, 날짜 입력중인 경우 (dateFormat.length 와 비교) error 추가 판단
5
6
  */
6
7
  export declare function checkInputValidation(value: any, dateFormat?: string, strongCheck?: boolean): boolean;
8
+ export declare function isDisabledTime(value: string, timeHourPickerOptions: TimeOption[], timeMinutePickerOptions: TimeOption[]): boolean;
9
+ export declare function isExactDateMatch(input: any, formatString: any): boolean;
7
10
  export declare function convertStringToDate(value: any): Date;
8
11
  export declare const convertDateToDateWithTime: (date: Date, time?: Date | null, value?: {
9
12
  hours?: number;
@@ -37,6 +37,11 @@ export interface DrawerProps {
37
37
  * @default true
38
38
  */
39
39
  lockScroll?: boolean;
40
+ /**
41
+ * Drawer 닫힐 때 애니메이션 사용 여부
42
+ * @default true
43
+ */
44
+ animationOnClose?: boolean;
40
45
  onClose?: () => void;
41
46
  }
42
47
  export declare const Drawer: React.ComponentType<DrawerProps & {
@@ -6,6 +6,7 @@ type Story = StoryObj<typeof Drawer>;
6
6
  export declare const Base: Story;
7
7
  export declare const Width: Story;
8
8
  export declare const NoUsePortal: Story;
9
+ export declare const NoUseAnimationOnClose: Story;
9
10
  export declare const Direction: Story;
10
11
  export declare const DrawerWithNavigation: Story;
11
12
  export declare const DrawerWithModal: Story;
@@ -1,6 +1,10 @@
1
1
  import React from 'react';
2
2
  import { CSSValueWithLength } from '../../styles';
3
3
  import { InputSize } from '../input/types';
4
+ export interface DisabledTimes {
5
+ disabledHours?: () => number[];
6
+ disabledMinutes?: (hour: number) => number[];
7
+ }
4
8
  export interface TimePickerProps {
5
9
  className?: string;
6
10
  /**
@@ -14,6 +18,7 @@ export interface TimePickerProps {
14
18
  zIndex?: number;
15
19
  error?: boolean;
16
20
  disabled?: boolean;
21
+ disabledTime?: (value: Date | null) => DisabledTimes;
17
22
  /**
18
23
  * TimePicker 팝오버 너비 100% 사용여부
19
24
  * - Input 요소 만큼의 100% 너비를 가집니다.
@@ -42,4 +47,4 @@ export interface TimePickerProps {
42
47
  /** @default true */
43
48
  usePortal?: boolean;
44
49
  }
45
- export declare const TimePicker: ({ disabled, size, value, error, width, fill, zIndex, className, onOpen, onClose, onChange, incrementMinute, showRemoveButton, usePortal, }: TimePickerProps) => React.JSX.Element;
50
+ export declare const TimePicker: ({ disabled, disabledTime, size, value, error, width, fill, zIndex, className, onOpen, onClose, onChange, incrementMinute, showRemoveButton, usePortal, }: TimePickerProps) => React.JSX.Element;
@@ -3,10 +3,10 @@ export interface TimeOption {
3
3
  label: string;
4
4
  value: number;
5
5
  index: number;
6
+ disabled: boolean;
6
7
  }
7
8
  export interface TimePickerOptionsProps {
8
9
  availableHeight: number;
9
- disabled?: boolean;
10
10
  fill?: boolean;
11
11
  timeHourPickerOptions: TimeOption[];
12
12
  timeMinutePickerOptions: TimeOption[];
@@ -15,9 +15,7 @@ export interface TimePickerOptionsProps {
15
15
  onChangeHour?: (option: number) => void;
16
16
  onChangeMinute?: (option: number) => void;
17
17
  }
18
- export declare const getTimePickerOptions: (length: number, increment?: number) => TimeOption[];
19
- export declare const getTimePickerOption: (options: TimeOption[], value: TimeOption['value']) => TimeOption;
20
18
  export declare const TIME_PICKER_COLUMN_HEIGHT = 340;
21
19
  export declare const TIME_PICKER_CELL_HEIGHT = 38;
22
20
  export declare const TIME_PICKER_SAFE_AREA = 100;
23
- export declare const TimePickerOptions: ({ availableHeight, timeHourPickerOptions, timeMinutePickerOptions, selectedTimeHour, selectedTimeMinute, disabled, fill, onChangeHour, onChangeMinute, }: TimePickerOptionsProps) => React.JSX.Element;
21
+ export declare const TimePickerOptions: ({ availableHeight, timeHourPickerOptions, timeMinutePickerOptions, selectedTimeHour, selectedTimeMinute, fill, onChangeHour, onChangeMinute, }: TimePickerOptionsProps) => React.JSX.Element;
@@ -1,15 +1,16 @@
1
1
  import React from 'react';
2
- import { TimePickerProps } from './TimePicker';
2
+ import { TimePickerProps, DisabledTimes } from './TimePicker';
3
3
  type TimeRange = {
4
4
  from: Date | null;
5
5
  to: Date | null;
6
6
  };
7
- export interface TimeRangePickerProps extends Omit<TimePickerProps, 'value' | 'onChange'> {
7
+ export interface TimeRangePickerProps extends Omit<TimePickerProps, 'value' | 'onChange' | 'disabledTime'> {
8
8
  /**
9
9
  * { from: Date | null; to: Date | null }
10
10
  */
11
11
  value?: TimeRange;
12
12
  onChange?: (start: TimeRange['from'], end: TimeRange['to']) => void;
13
+ disabledTime?: (value: Date | null, range?: 'from' | 'to') => DisabledTimes;
13
14
  }
14
- export declare const TimeRangePicker: ({ disabled, size, value, error, width, className, zIndex, onOpen, onClose, onChange, incrementMinute, fill, showRemoveButton, }: TimeRangePickerProps) => React.JSX.Element;
15
+ export declare const TimeRangePicker: ({ disabled, disabledTime, size, value, error, width, className, zIndex, onOpen, onClose, onChange, incrementMinute, fill, showRemoveButton, }: TimeRangePickerProps) => React.JSX.Element;
15
16
  export {};
@@ -0,0 +1,10 @@
1
+ import { DisabledTimes } from './TimePicker';
2
+ import { TimeOption } from './TimePickerOptions';
3
+ export declare const getTimePickerOptions: (length: number, increment?: number, disabledValues?: number[]) => TimeOption[];
4
+ export declare const getTimePickerOption: (options: TimeOption[], value: TimeOption['value']) => TimeOption;
5
+ export declare const getDisabledTimes: (disabledTimeFn: (date: Date, range?: 'from' | 'to') => DisabledTimes, date: Date, range?: 'from' | 'to') => {
6
+ disabledHours: number[];
7
+ disabledMinutes: number[];
8
+ };
9
+ export declare const getDisabledTime: (timePickerOptions: TimeOption[], time: number) => boolean;
10
+ export declare const getAvailableSelectedTime: (timePickerOptions: TimeOption[]) => number;