packages/date-picker/src/defaultComponents.tsx - develop - kaws/ui-kit-ce

packages/date-picker/src/defaultComponents.tsx
162 строки5 KB
Строганов Федор
feat(date-picker): добавлено свойство components
11 сен 2025, 16:06
11 сен 2025, 16:06580c9dd
import React from 'react'
import {
  DatePickerCalendar,
  DatePickerCalendarProps,
  DatePickerDropdownContent,
  RangePickerCalendar,
  RangePickerCalendarProps,
  RangePickerDropdownContent,
  TimePickerTimeColumn,
  TimePickerTimeColumnProps,
  TimePickerDropdownContent,
  TimeRangePickerTimeColumnProps,
  TimeRangePickerTimeColumn,
  TimeRangePickerDropdownContent,
  QuarterPickerDropdownContent,
  QuarterPickerCalendarProps,
  QuarterPickerCalendar,
  QuarterRangePickerCalendar,
  QuarterRangePickerDropdownContent,
  QuarterRangePickerCalendarProps,
  DatePickerDropdownContentProps,
  RangePickerDropdownContentProps,
  TimePickerDropdownContentProps,
  TimeRangePickerDropdownContentProps,
  QuarterPickerDropdownContentProps,
  QuarterRangePickerDropdownContentProps,
} from './userComponents'

export type DatePickerComponents = {
  Calendar: React.ComponentType<DatePickerCalendarProps>
  Header: React.ComponentType
  Footer: React.ComponentType
  DropdownContent: React.ComponentType<DatePickerDropdownContentProps>
}

export type RangePickerComponents<TDate = unknown> = {
  Calendar: React.ComponentType<RangePickerCalendarProps<TDate>>
  Header: React.ComponentType
  Footer: React.ComponentType
  DropdownContent: React.ComponentType<RangePickerDropdownContentProps>
}

export type TimePickerComponents<TDate = unknown> = {
  TimeColumn: React.ComponentType<TimePickerTimeColumnProps<TDate>>
  Header: React.ComponentType
  Footer: React.ComponentType
  DropdownContent: React.ComponentType<TimePickerDropdownContentProps>
}

export type TimeRangePickerComponents<TDate = unknown> = {
  TimeColumn: React.ComponentType<TimeRangePickerTimeColumnProps<TDate>>
  Header: React.ComponentType
  Footer: React.ComponentType
  DropdownContent: React.ComponentType<TimeRangePickerDropdownContentProps>
}

export type QuarterPickerComponents<TDate = unknown> = {
  Calendar: React.ComponentType<QuarterPickerCalendarProps<TDate>>
  Header: React.ComponentType
  Footer: React.ComponentType
  DropdownContent: React.ComponentType<QuarterPickerDropdownContentProps>
}

export type QuarterRangePickerComponents<TDate = unknown> = {
  Calendar: React.ComponentType<QuarterRangePickerCalendarProps<TDate>>
  Header: React.ComponentType
  Footer: React.ComponentType
  DropdownContent: React.ComponentType<QuarterRangePickerDropdownContentProps>
}

export type DatePickerComponentsConfig = Partial<DatePickerComponents>
export type RangePickerComponentsConfig = Partial<RangePickerComponents>
export type TimePickerComponentsConfig = Partial<TimePickerComponents>
export type QuarterPickerComponentsConfig = Partial<QuarterPickerComponents>
export type QuarterRangePickerComponentsConfig =
  Partial<QuarterRangePickerComponents>
export type TimeRangePickerComponentsConfig = Partial<TimeRangePickerComponents>

export const defaultDatePickerComponents: DatePickerComponents = {
  Calendar: DatePickerCalendar,
  Header: () => null,
  Footer: () => null,
  DropdownContent: DatePickerDropdownContent,
}

export const defaultRangePickerComponents: RangePickerComponents = {
  Calendar: RangePickerCalendar,
  Header: () => null,
  Footer: () => null,
  DropdownContent: RangePickerDropdownContent,
}

export const defaultTimePickerComponents: TimePickerComponents = {
  TimeColumn: TimePickerTimeColumn,
  Header: () => null,
  Footer: () => null,
  DropdownContent: TimePickerDropdownContent,
}

export const defaultTimeRangePickerComponents: TimeRangePickerComponents = {
  TimeColumn: TimeRangePickerTimeColumn,
  Header: () => null,
  Footer: () => null,
  DropdownContent: TimeRangePickerDropdownContent,
}

export const defaultQuarterPickerComponents: QuarterPickerComponents = {
  Calendar: QuarterPickerCalendar,
  Header: () => null,
  Footer: () => null,
  DropdownContent: QuarterPickerDropdownContent,
}

export const defaultQuarterRangePickerComponents: QuarterRangePickerComponents =
  {
    Calendar: QuarterRangePickerCalendar,
    Header: () => null,
    Footer: () => null,
    DropdownContent: QuarterRangePickerDropdownContent,
  }

export const getDatePickerComponents = (
  components?: DatePickerComponentsConfig
): DatePickerComponents => ({
  ...defaultDatePickerComponents,
  ...components,
})

export const getRangePickerComponents = (
  components?: RangePickerComponentsConfig
): RangePickerComponents => ({
  ...defaultRangePickerComponents,
  ...components,
})

export const getTimePickerComponents = (
  components?: TimePickerComponentsConfig
): TimePickerComponents => ({
  ...defaultTimePickerComponents,
  ...components,
})

export const getTimeRangePickerComponents = (
  components?: TimeRangePickerComponentsConfig
): TimeRangePickerComponents => ({
  ...defaultTimeRangePickerComponents,
  ...components,
})

export const getQuarterPickerComponents = (
  components?: QuarterPickerComponentsConfig
): QuarterPickerComponents => ({
  ...defaultQuarterPickerComponents,
  ...components,
})

export const getQuarterRangePickerComponents = (
  components?: QuarterRangePickerComponentsConfig
): QuarterRangePickerComponents => ({
  ...defaultQuarterRangePickerComponents,
  ...components,
})