react-native-week-selector

Usage

import {
  IRangeDateSelectorItem,
  RangeDateSelector,
} from "@phankiet/react-native-week-selector";

<RangeDateSelector
  type={"week"}
  onConfirm={handleChangeWeek}
  weekLabel={t("weekLabel")}
  closeText={t("close")}
  confirmText={t("confirm")}
>
  <View style={[styles.pickerWrapper, { flex: 3 }]}>
    <View style={styles.labelDate}>
      <Text style={styles.pickerText}>{"Select week"}</Text>
      <IonIcon name={"chevron-down"} size={18} color={colors.orangePrimary} />
    </View>
  </View>
</RangeDateSelector>;

Properties

| Name | Type | Default | Required | Description | | --------------- | ------------------------------------------------------------------------------- | -------------------- | -------- | ------------------------------------------------------------------ | | children | node | none | true | The interface when the user presses to select will display a popup | | type | "week" or "month" | "week" | false | Type of selector | | weekLabel | string | "Tuần" | false | Label of week item | | formatDate | string | "DD/MM" | false | Date format of item | | renderItem | { item: IRangeDateSelectorItem, index: number, selected: boolean }) => function | node | false | Item UI | | selectedColor | string | "#ccc" | false | | buttonStyle | ViewStyle | | false | | buttonTextStyle | TextStyle | | false | | yearTextStyle | TextStyle | | false | | labelStyle | ViewStyle | | false | | labelTextStyle | TextStyle | | false | | closeText | string | "Đóng" | false | | confirmText | string | "Xác nhận" | false | | currentYear | number | moment().get("year") | false | | onConfirm | (selected: IRangeDateSelectorItem) => function | none | false |