diff --git a/docs/examples/debug.tsx b/docs/examples/debug.tsx index f5d9fa6b8..c707d499b 100644 --- a/docs/examples/debug.tsx +++ b/docs/examples/debug.tsx @@ -150,9 +150,22 @@ export default () => { // Shared {...sharedLocale} disabledDate={(date) => date.isBefore(dayjs())} + // disabledTime={() => ({ + // disabledHours: () => [0, 1, 2, 3, 4, 5], + // disabledMinutes: () => [0, 1, 2, 3, 4, 5], + // disabledSeconds: () => [0, 1, 2, 3, 4, 5], + // })} open ref={singleRef} suffixIcon="🧶" + // showTime={{ + // disabledTime: () => ({ + // disabledHours: () => [0, 1, 2, 3, 4, 5], + // disabledMinutes: () => [0, 1, 2, 3, 4, 5], + // disabledSeconds: () => [0, 1, 2, 3, 4, 5], + // }), + // }} + showTime={{}} onChange={(...args) => { console.log('🔥 Change:', ...args); }} diff --git a/src/hooks/useTimeConfig.ts b/src/hooks/useTimeConfig.ts index 5f0d3f18b..cd2d027a3 100644 --- a/src/hooks/useTimeConfig.ts +++ b/src/hooks/useTimeConfig.ts @@ -7,7 +7,7 @@ function checkShow(format: string, keywords: string[], show?: boolean) { } const showTimeKeys = [ - 'format', + // 'format', 'showNow', 'showHour', 'showMinute', @@ -31,18 +31,27 @@ const showTimeKeys = [ /** * Get SharedTimeProps from props. */ -function pickTimeProps(props: any): SharedTimeProps { +function pickTimeProps( + props: any, +): [timeProps: SharedTimeProps, propFormat: string] { const timeProps: any = pickProps(props, showTimeKeys); + const { format, picker } = props; - if (timeProps.format) { - let format = timeProps.format; - if (Array.isArray(format)) { - format = format[0]; + let propFormat: typeof format = null; + if (format) { + propFormat = format; + + if (Array.isArray(propFormat)) { + propFormat = propFormat[0]; } - timeProps.format = typeof format === 'object' ? format.format : format; + propFormat = typeof propFormat === 'object' ? propFormat.format : propFormat; + } + + if (picker === 'time') { + timeProps.format = propFormat; } - return timeProps; + return [timeProps, propFormat]; } function isStringFormat(format: any): format is string { @@ -68,11 +77,15 @@ export function getTimeProps( showTimeFormat: string, propFormat: string, ] { - const { showTime, picker } = componentProps; + const { showTime } = componentProps; - const pickedProps = pickTimeProps(componentProps); - const isShowTimeConfig = showTime && typeof showTime === 'object'; - const timeConfig = isShowTimeConfig ? showTime : pickedProps; + const [pickedProps, propFormat] = pickTimeProps(componentProps); + + const showTimeConfig = showTime && typeof showTime === 'object' ? showTime : {}; + const timeConfig = { + ...pickedProps, + ...showTimeConfig, + }; const { showMillisecond } = timeConfig; let { showHour, showMinute, showSecond } = timeConfig; @@ -83,12 +96,6 @@ export function getTimeProps( showSecond = true; } - const mergedFormat = isShowTimeConfig - ? showTime.format - : picker === 'time' - ? pickedProps.format - : null; - return [ timeConfig, { @@ -98,8 +105,8 @@ export function getTimeProps( showSecond, showMillisecond, }, - mergedFormat, - pickedProps.format, + timeConfig.format, + propFormat, ]; } diff --git a/tests/picker.spec.tsx b/tests/picker.spec.tsx index c36b0949a..91f25477e 100644 --- a/tests/picker.spec.tsx +++ b/tests/picker.spec.tsx @@ -605,7 +605,7 @@ describe('Picker.Basic', () => { it('time should display now', () => { const onCalendarChange = jest.fn(); const { container } = render(); - + openPicker(container); expect(document.querySelector('.rc-picker-header')).toBeFalsy(); @@ -1356,4 +1356,24 @@ describe('Picker.Basic', () => { expect(inputEle.size).toBe(12); expect(inputEle).toHaveValue('06:03:04 PM'); }); + + it('compatible with disabledTime on prop directly', () => { + render( + ({ + disabledHours: () => [0], + })} + hideDisabledOptions + showTime + open + />, + ); + + expect(document.querySelectorAll('.rc-picker-time-panel-column:first-child li')).toHaveLength( + 23, + ); + expect( + document.querySelector('.rc-picker-time-panel-column:first-child li').textContent, + ).toEqual('01'); + }); });