react-native-paper-dates 0.4.6 → 0.7.0

package/lib/typescript/{src/Date → Date}/dateUtils.d.ts

@@ -1,3 +1,4 @@
+import type { ValidRangeType } from './Calendar';
 export declare type DisableWeekDaysType = number[];
 export declare function showWeekDay(dayIndex: number, disableWeekDays?: DisableWeekDaysType): boolean;
 export declare function dateToUnix(d: Date): number;
@@ -10,6 +11,12 @@ export declare function getFirstDayOfMonth({ year, month, }: {
     year: number;
     month: number;
 }): number;
+export declare function useRangeChecker(validRange: ValidRangeType | undefined): {
+    isDisabled: (day: Date) => boolean;
+    isWithinValidRange: (day: Date) => boolean;
+    validStart: Date | undefined;
+    validEnd: Date | undefined;
+};
 export declare function areDatesOnSameDay(a: Date, b?: Date | null | undefined): boolean;
 export declare function isDateBetween(date: Date, { startDate, endDate, }: {
     startDate?: Date | null | undefined;
@@ -37,4 +44,12 @@ export declare function getGridCount(index: number): number;
 export declare function getGridCountForDate(date: Date): number;
 export declare function getRealIndex(index: number): number;
 export declare function getInitialIndex(date: Date | undefined): number;
+export declare function useInputFormatter({ locale }: {
+    locale: string | undefined;
+}): Intl.DateTimeFormat;
+export declare function getStartOfDay(d: Date): Date;
+export declare function getEndOfDay(d: Date): Date;
+export declare function useInputFormat({ formatter, }: {
+    formatter: Intl.DateTimeFormat;
+}): string;
 export declare function differenceInMonths(firstDate: Date, secondDate: Date): number;

package/lib/typescript/Date/inputUtils.d.ts

@@ -0,0 +1,14 @@
+import type { ValidRangeType } from './Calendar';
+export default function useDateInput({ locale, value, validRange, inputMode, onChange, }: {
+    onChange: (d: Date) => void;
+    locale: undefined | string;
+    value: Date | undefined;
+    validRange: ValidRangeType | undefined;
+    inputMode: 'start' | 'end';
+}): {
+    onChange: (d: Date) => void;
+    error: string | null;
+    formattedValue: string;
+    onChangeText: (date: string) => void;
+    inputFormat: string;
+};

package/lib/typescript/TextInputMask.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+declare const _default: React.ForwardRefExoticComponent<Pick<((Pick<import("react-native-paper/lib/typescript/components/TextInput/TextInput").TextInputProps, "allowFontScaling" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "defaultValue" | "editable" | "keyboardType" | "maxLength" | "multiline" | "onBlur" | "onChange" | "onChangeText" | "onContentSizeChange" | "onEndEditing" | "onPressIn" | "onPressOut" | "onFocus" | "onSelectionChange" | "onSubmitEditing" | "onTextInput" | "onScroll" | "onKeyPress" | "placeholder" | "placeholderTextColor" | "returnKeyType" | "secureTextEntry" | "selectTextOnFocus" | "selection" | "selectionColor" | "style" | "textAlign" | "testID" | "inputAccessoryViewID" | "value" | "maxFontSizeMultiplier" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "scrollEnabled" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "numberOfLines" | "returnKeyLabel" | "textBreakStrategy" | "underlineColorAndroid" | "textAlignVertical" | "showSoftInputOnFocus" | "ref" | "label" | "key" | "render" | "left" | "right" | "disabled" | "mode" | "error" | "autoCompleteType" | "underlineColor" | "activeUnderlineColor" | "outlineColor" | "activeOutlineColor" | "dense"> & {
+    theme?: import("@callstack/react-theme-provider").$DeepPartial<ReactNativePaper.Theme> | undefined;
+}) | (Pick<import("react-native-paper/lib/typescript/components/TextInput/TextInput").TextInputProps, "allowFontScaling" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "defaultValue" | "editable" | "keyboardType" | "maxLength" | "multiline" | "onBlur" | "onChange" | "onChangeText" | "onContentSizeChange" | "onEndEditing" | "onPressIn" | "onPressOut" | "onFocus" | "onSelectionChange" | "onSubmitEditing" | "onTextInput" | "onScroll" | "onKeyPress" | "placeholder" | "placeholderTextColor" | "returnKeyType" | "secureTextEntry" | "selectTextOnFocus" | "selection" | "selectionColor" | "style" | "textAlign" | "testID" | "inputAccessoryViewID" | "value" | "maxFontSizeMultiplier" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "scrollEnabled" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "numberOfLines" | "returnKeyLabel" | "textBreakStrategy" | "underlineColorAndroid" | "textAlignVertical" | "showSoftInputOnFocus" | "ref" | "label" | "key" | "render" | "left" | "right" | "disabled" | "mode" | "error" | "autoCompleteType" | "underlineColor" | "activeUnderlineColor" | "outlineColor" | "activeOutlineColor" | "dense"> & {
+    theme?: import("@callstack/react-theme-provider").$DeepPartial<ReactNativePaper.Theme> | undefined;
+} & {
+    children?: React.ReactNode;
+})) & {
+    mask: string;
+}, "allowFontScaling" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "defaultValue" | "editable" | "keyboardType" | "maxLength" | "multiline" | "onBlur" | "onChange" | "onChangeText" | "onContentSizeChange" | "onEndEditing" | "onPressIn" | "onPressOut" | "onFocus" | "onSelectionChange" | "onSubmitEditing" | "onTextInput" | "onScroll" | "onKeyPress" | "placeholder" | "placeholderTextColor" | "returnKeyType" | "secureTextEntry" | "selectTextOnFocus" | "selection" | "selectionColor" | "style" | "textAlign" | "testID" | "inputAccessoryViewID" | "value" | "maxFontSizeMultiplier" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "scrollEnabled" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "numberOfLines" | "returnKeyLabel" | "textBreakStrategy" | "underlineColorAndroid" | "textAlignVertical" | "showSoftInputOnFocus" | "label" | "key" | "render" | "left" | "right" | "disabled" | "mode" | "error" | "autoCompleteType" | "underlineColor" | "activeUnderlineColor" | "outlineColor" | "activeOutlineColor" | "dense" | "mask" | "theme"> & React.RefAttributes<unknown>>;
+export default _default;

package/lib/typescript/Time/AmPmSwitcher.d.ts

@@ -0,0 +1,4 @@
+export default function AmPmSwitcher({ onChange, hours, }: {
+    hours: number;
+    onChange: (newHours: number) => any;
+}): JSX.Element;

package/lib/typescript/{src/Time → Time}/AnalogClock.d.ts

@@ -5,7 +5,7 @@ declare function AnalogClock({ hours, minutes, focused, is24Hour, onChange, }: {
     minutes: number;
     focused: PossibleClockTypes;
     is24Hour: boolean;
-    onChange: ({ hours, minutes, focused, }: {
+    onChange: (hoursMinutesAndFocused: {
         hours: number;
         minutes: number;
         focused?: undefined | PossibleClockTypes;

package/lib/typescript/{src/Time → Time}/TimeInputs.d.ts

@@ -6,7 +6,7 @@ declare function TimeInputs({ hours, minutes, onFocusInput, focused, inputType,
     hours: number;
     minutes: number;
     onFocusInput: (type: PossibleClockTypes) => any;
-    onChange: ({ hours, minutes, focused, }: {
+    onChange: (hoursMinutesAndFocused: {
         hours: number;
         minutes: number;
         focused?: undefined | PossibleClockTypes;

package/lib/typescript/{src/Time → Time}/TimePicker.d.ts

@@ -1,5 +1,9 @@
 import * as React from 'react';
 import { PossibleClockTypes, PossibleInputTypes } from './timeUtils';
+export declare const DisplayModeContext: React.Context<{
+    mode: 'AM' | 'PM' | undefined;
+    setMode: React.Dispatch<React.SetStateAction<'AM' | 'PM' | undefined>>;
+}>;
 declare type onChangeFunc = ({ hours, minutes, focused, }: {
     hours: number;
     minutes: number;

package/lib/typescript/{src/Time → Time}/TimePickerModal.d.ts

@@ -8,7 +8,7 @@ export declare function TimePickerModal({ visible, onDismiss, onConfirm, hours,
     minutes?: number | undefined;
     visible: boolean | undefined;
     onDismiss: () => any;
-    onConfirm: ({ hours, minutes }: {
+    onConfirm: (hoursAndMinutes: {
         hours: number;
         minutes: number;
     }) => any;

package/lib/typescript/index.d.ts

@@ -0,0 +1,13 @@
+export { default as Calendar } from './Date/Calendar';
+export { default as DatePickerModal } from './Date/DatePickerModal';
+export * from './Date/DatePickerModal';
+export { default as DatePickerModalContent } from './Date/DatePickerModalContent';
+export { default as TimePickerModal } from './Time/TimePickerModal';
+export { default as TimePicker } from './Time/TimePicker';
+export { default as DatePickerInput } from './Date/DatePickerInput';
+export type { TranslationsType } from './translations/utils';
+export { registerTranslation, getTranslation } from './translations/utils';
+export { default as nl } from './translations/nl';
+export { default as en } from './translations/en';
+export { default as pl } from './translations/pl';
+export { default as enGB } from './translations/enGB';

package/lib/typescript/translations/en.d.ts

@@ -0,0 +1,3 @@
+import type { TranslationsType } from './utils';
+declare const en: TranslationsType;
+export default en;

package/lib/typescript/translations/enGB.d.ts

@@ -0,0 +1,3 @@
+import type { TranslationsType } from './utils';
+declare const enGB: TranslationsType;
+export default enGB;

package/lib/typescript/translations/nl.d.ts

@@ -0,0 +1,3 @@
+import type { TranslationsType } from './utils';
+declare const nl: TranslationsType;
+export default nl;

package/lib/typescript/translations/pl.d.ts

@@ -0,0 +1,3 @@
+import type { TranslationsType } from './utils';
+declare const pl: TranslationsType;
+export default pl;

package/lib/typescript/translations/utils.d.ts

@@ -0,0 +1,18 @@
+export declare type TranslationsType = {
+    selectSingle: string;
+    selectMultiple: string;
+    selectRange: string;
+    save: string;
+    notAccordingToDateFormat: (inputFormat: string) => string;
+    mustBeHigherThan: string;
+    mustBeLowerThan: string;
+    mustBeBetween: string;
+    dateIsDisabled: string;
+    previous: string;
+    next: string;
+    typeInDate: string;
+    pickDateFromCalendar: string;
+    close: string;
+};
+export declare function getTranslation(locale: string | undefined, key: keyof TranslationsType, fallback?: any): any;
+export declare function registerTranslation(locale: string, translations: TranslationsType): void;

package/lib/typescript/utils.d.ts

@@ -0,0 +1,58 @@
+import * as React from 'react';
+import Color from 'color';
+export declare function useLatest<T>(value: T): React.MutableRefObject<T>;
+export declare function useHeaderBackgroundColor(): string;
+export declare function useHeaderColorIsLight(): boolean;
+export declare function useHeaderTextColor(): "#fff" | "#000";
+export declare function useTextColorOnPrimary(): "#fff" | "#000";
+export declare function range(start: number, end: number): number[];
+export declare function lightenBy(color: Color, ratio: number): Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | any | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}>;
+export declare function darkenBy(color: Color, ratio: number): Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | Color<string | number | any | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}> | ArrayLike<number> | {
+    [key: string]: any;
+}>;

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "react-native-paper-dates",
-  "version": "0.4.6",
+  "version": "0.7.0",
   "description": "Performant Date Picker for React Native Paper",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
-  "types": "lib/typescript/src/index.d.ts",
+  "types": "lib/typescript/index.d.ts",
   "react-native": "src/index",
   "source": "src/index",
   "files": [
@@ -15,6 +15,8 @@
     "cpp",
     "react-native-paper-dates.podspec",
     "!lib/typescript/example",
+    "!android/build",
+    "!ios/build",
     "!**/__tests__",
     "!**/__fixtures__",
     "!**/__mocks__"
@@ -23,9 +25,8 @@
     "test": "jest",
     "typescript": "tsc --noEmit",
     "lint": "eslint \"**/*.{js,ts,tsx}\"",
-    "build": "bob build",
     "prepare": "bob build",
-    "release": "bob build && dotenv release-it --",
+    "release": "release-it",
     "example": "yarn --cwd example",
     "pods": "cd example && pod-install --quiet",
     "bootstrap": "yarn example && yarn && yarn pods"
@@ -42,34 +43,31 @@
     "url": "https://github.com/web-ridge/react-native-paper-dates/issues"
   },
   "homepage": "https://github.com/web-ridge/react-native-paper-dates#readme",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
   "devDependencies": {
-    "@commitlint/config-conventional": "^8.3.4",
-    "@react-native-community/bob": "^0.16.2",
-    "@react-native-community/eslint-config": "^2.0.0",
+    "@commitlint/config-conventional": "^11.0.0",
+    "@react-native-community/eslint-config": "^3.0.1",
     "@release-it/conventional-changelog": "^2.0.0",
-    "@types/color": "^3.0.1",
-    "@types/jest": "^26.0.0",
-    "@types/react": "^16.9.19",
-    "@types/react-dom": "^16.9.8",
-    "@types/react-native": "0.63.40",
-    "@types/react-native-vector-icons": "^6.4.6",
-    "color": "^3.1.2",
-    "commitlint": "^8.3.5",
-    "dotenv-cli": "^4.0.0",
-    "eslint": "^7.2.0",
-    "eslint-config-prettier": "^6.11.0",
-    "eslint-plugin-prettier": "^3.1.3",
+    "@types/color": "^3.0.2",
+    "@types/jest": "^26.0.24",
+    "@types/react": "^16.14.20",
+    "@types/react-native": "^0.66.1",
+    "commitlint": "^11.0.0",
+    "eslint": "^7.32.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-prettier": "^4.0.0",
     "husky": "^4.2.5",
     "jest": "^26.0.1",
-    "pod-install": "^0.1.0",
-    "prettier": "^2.0.5",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1",
-    "react-native": "0.63.2",
-    "react-native-paper": "^4.7.2",
-    "react-native-web": "^0.15.5",
-    "release-it": "^14.2.2",
-    "typescript": "^4.1.0"
+    "pod-install": "^0.1.28",
+    "prettier": "^2.4.1",
+    "react": "16.13.1",
+    "react-native": "^0.64.2",
+    "react-native-builder-bob": "latest",
+    "react-native-paper": "^4.10.0",
+    "release-it": "^14.11.6",
+    "typescript": "^4.4.4"
   },
   "peerDependencies": {
     "react": "*",
@@ -77,13 +75,6 @@
     "react-native-paper": "*",
     "react-native-vector-icons": "*"
   },
-  "jest": {
-    "preset": "react-native",
-    "modulePathIgnorePatterns": [
-      "<rootDir>/example/node_modules",
-      "<rootDir>/lib/"
-    ]
-  },
   "husky": {
     "hooks": {
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
@@ -113,6 +104,7 @@
     }
   },
   "eslintConfig": {
+    "root": true,
     "extends": [
       "@react-native-community",
       "prettier"
@@ -134,7 +126,8 @@
   "eslintIgnore": [
     "node_modules/",
     "lib/",
-    "example/"
+    "example/node_modules",
+    "example/web-build"
   ],
   "prettier": {
     "quoteProps": "consistent",
@@ -144,13 +137,21 @@
     "useTabs": false,
     "semi": false
   },
-  "@react-native-community/bob": {
+  "react-native-builder-bob": {
     "source": "src",
     "output": "lib",
     "targets": [
       "commonjs",
       "module",
-      "typescript"
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
     ]
+  },
+  "dependencies": {
+    "color": "^3.2.1"
   }
 }

package/src/Date/Calendar.tsx

@@ -1,13 +1,12 @@
 import * as React from 'react'
 import { StyleSheet, View } from 'react-native'
-
 import Swiper from './Swiper'
-
 import Month from './Month'
 import {
   areDatesOnSameDay,
   dateToUnix,
   DisableWeekDaysType,
+  getEndOfDay,
   getInitialIndex,
 } from './dateUtils'
 
@@ -16,7 +15,7 @@ import { useCallback, useMemo } from 'react'
 import YearPicker from './YearPicker'
 import Color from 'color'
 import { useTheme } from 'react-native-paper'
-import { useLatest } from '../utils'
+import { useLatest, lightenBy, darkenBy } from '../utils'
 
 export type ModeType = 'single' | 'range' | 'multiple'
 
@@ -25,10 +24,11 @@ export type ScrollModeType = 'horizontal' | 'vertical'
 export type ValidRangeType = {
   startDate?: Date
   endDate?: Date
+  disabledDates?: Date[]
 }
 
 export type BaseCalendarProps = {
-  locale?: undefined | string
+  locale: string
   disableWeekDays?: DisableWeekDaysType
   validRange?: ValidRangeType
 
@@ -37,6 +37,7 @@ export type BaseCalendarProps = {
   dates?: CalendarDates
   startDate?: CalendarDate
   endDate?: CalendarDate
+  dateMode?: 'start' | 'end'
 }
 
 export type CalendarDate = Date | undefined
@@ -47,7 +48,7 @@ export type RangeChange = (params: {
   endDate: CalendarDate
 }) => any
 
-export type SingleChange = (params: { date: CalendarDate }) => any
+export type SingleChange = (params: { date: CalendarDate }) => void
 
 export type MultiChange = (params: {
   dates: CalendarDates
@@ -55,7 +56,7 @@ export type MultiChange = (params: {
   change: 'added' | 'removed'
 }) => any
 
-export type MultiConfirm = (params: { dates: Date[] }) => any
+export type MultiConfirm = (params: { dates: Date[] }) => void
 
 export interface CalendarSingleProps extends BaseCalendarProps {
   mode: 'single'
@@ -89,15 +90,16 @@ function Calendar(
     disableWeekDays,
     dates,
     validRange,
+    dateMode,
   } = props
 
   const theme = useTheme()
 
   const selectColor = useMemo<string>(() => {
     if (theme.dark) {
-      return Color(theme.colors.primary).hex()
+      return darkenBy(Color(theme.colors.primary), 0.9).hex()
     }
-    return Color(theme.colors.primary).lighten(0.9).hex()
+    return lightenBy(Color(theme.colors.primary), 0.9).hex()
   }, [theme])
 
   const scrollMode =
@@ -128,7 +130,7 @@ function Calendar(
     (d: Date) => {
       if (mode === 'single') {
         ;(onChangeRef.current as SingleChange)({
-          date: d,
+          date: dateMode === 'start' ? d : getEndOfDay(d),
         })
       } else if (mode === 'range') {
         const sd = startDateRef.current
@@ -139,9 +141,7 @@ function Calendar(
         }
         ;(onChangeRef.current as RangeChange)({
           startDate: isStart ? d : sd,
-          endDate: !isStart
-            ? new Date(d.getFullYear(), d.getMonth(), d.getDate(), 23, 59, 59)
-            : undefined,
+          endDate: !isStart ? getEndOfDay(d) : undefined,
         })
       } else if (mode === 'multiple') {
         datesRef.current = datesRef.current || []
@@ -159,10 +159,11 @@ function Calendar(
         })
       }
     },
-    [mode, onChangeRef, startDateRef, endDateRef, datesRef]
+    [mode, dateMode, onChangeRef, startDateRef, endDateRef, datesRef]
   )
 
   const firstDate = startDate || date || dates?.[0]
+
   return (
     <View style={styles.root}>
       <Swiper