ModalCalendar

Reusable ModalCalendar

Example

import {ModalCalendar, Button, createStyles, usePopups, useStyles, View} from '@lad-tech/mobydick-calendar';

export const ModalCalendarWidget = () => {
  const [styles] = useStyles(stylesFn);
  const {openPopup} = usePopups();

  return (
    <View style={styles.container}>
      <Button
        text={'ModalCalendar'}
        onPress={() =>
          openPopup({
            Content: props => <ModalCalendar {...props} />,
          })
        }
      />
    </View>
  );
};

const stylesFn = createStyles(({spaces}) => ({
  container: {
    gap: spaces.Space16,
    alignItems: 'center',
  },
}));

Props

IContentProps

Inherits IContentProps.

ICalendar.

Inherits ICalendar.

IHorizontalButtonsView

Inherits Partial IHorizontalButtonsView.

onDateRangeChange

Type
(dateRange?: IDateRange) => void

Works by clicking Apply and Cancel, if you need to record that you, for example, canceled the selected dates;

titlePrefix

Type	DEFAULT
string	'Выбрано '

titleSuffix

Type	DEFAULT
string	' д'

titleFont

Type	DEFAULT
TypographyProp	'Medium-Primary-M'

Custom font from the design system for label

descriptionText

Type
string

descriptionFont

Type	DEFAULT
TypographyProp	'Regular-Muted-M'

Custom font from the design system for label

buttonView

Type	DEFAULT
IButtonView	'Medium-Tertiary-XS'

isCounter

TYPE	DEFAULT
boolean	true

isShowToday

TYPE	DEFAULT
boolean	true

onAcceptDateRangeChange

Type
(dateRange: IDateRange) => void

onAcceptDateRangeChange – works when you click Apply;