react-native-paper-dates 0.11.4 → 0.11.6

package/lib/commonjs/Time/TimePicker.js

@@ -69,7 +69,9 @@ function TimePicker(_ref) {
       setMode: setDisplayMode
     }
   }, /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: isLandscape ? styles.rootLandscape : styles.rootPortrait
+    style: isLandscape ? [styles.rootLandscape, {
+      width: 24 * 3 + 96 * 2 + 52 + (inputType === _timeUtils.inputTypes.picker ? _timeUtils.circleSize : -_timeUtils.circleSize)
+    }] : styles.rootPortrait
   }, /*#__PURE__*/React.createElement(_TimeInputs.default, {
     inputType: inputType,
     hours: hours,
@@ -93,8 +95,7 @@ const styles = _reactNative.StyleSheet.create({
   rootLandscape: {
     flexDirection: 'row',
     alignItems: 'center',
-    justifyContent: 'center',
-    width: 24 * 3 + 96 * 2 + 52 + _timeUtils.circleSize
+    justifyContent: 'center'
   },
   rootPortrait: {
     alignItems: 'center',

package/lib/commonjs/Time/TimePicker.js.map

@@ -1 +1 @@
-{"version":3,"names":["DisplayModeContext","React","createContext","mode","setMode","TimePicker","hours","minutes","onFocusInput","focused","inputType","onChange","locale","displayMode","setDisplayMode","useState","undefined","dimensions","useWindowDimensions","isLandscape","width","height","is24Hour","useMemo","formatter","Intl","DateTimeFormat","hour","minute","timeZone","formatted","format","Date","UTC","includes","useEffect","onInnerChange","useCallback","params","toHourOutputFormat","styles","rootLandscape","rootPortrait","inputTypes","picker","clockContainer","toHourInputFormat","StyleSheet","create","flexDirection","alignItems","justifyContent","circleSize","paddingTop","paddingLeft","paddingRight","memo"],"sources":["TimePicker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { View, StyleSheet, useWindowDimensions } from 'react-native'\n\nimport {\n  inputTypes,\n  PossibleClockTypes,\n  PossibleInputTypes,\n  toHourInputFormat,\n  toHourOutputFormat,\n} from './timeUtils'\n\nimport AnalogClock from './AnalogClock'\nimport { circleSize } from './timeUtils'\nimport TimeInputs from './TimeInputs'\n\nexport const DisplayModeContext = React.createContext<{\n  mode: 'AM' | 'PM' | undefined\n  setMode: React.Dispatch<React.SetStateAction<'AM' | 'PM' | undefined>>\n}>({ mode: 'AM', setMode: () => {} })\n\ntype onChangeFunc = ({\n  hours,\n  minutes,\n  focused,\n}: {\n  hours: number\n  minutes: number\n  focused?: undefined | PossibleClockTypes\n}) => any\n\nfunction TimePicker({\n  hours,\n  minutes,\n  onFocusInput,\n  focused,\n  inputType,\n  onChange,\n  locale,\n}: {\n  locale?: undefined | string\n  inputType: PossibleInputTypes\n  focused: PossibleClockTypes\n  hours: number\n  minutes: number\n  onFocusInput: (type: PossibleClockTypes) => any\n  onChange: onChangeFunc\n}) {\n  const [displayMode, setDisplayMode] = React.useState<'AM' | 'PM' | undefined>(\n    undefined\n  )\n  const dimensions = useWindowDimensions()\n  const isLandscape = dimensions.width > dimensions.height\n\n  // method to check whether we have 24 hours in clock or 12\n  const is24Hour = React.useMemo(() => {\n    const formatter = new Intl.DateTimeFormat(locale, {\n      hour: '2-digit',\n      minute: '2-digit',\n      timeZone: 'UTC',\n    })\n    const formatted = formatter.format(new Date(Date.UTC(2020, 1, 1, 23)))\n    return formatted.includes('23')\n  }, [locale])\n\n  // Initialize display Mode according the hours value\n  React.useEffect(() => {\n    if (hours >= 12) {\n      setDisplayMode('PM')\n    } else {\n      setDisplayMode('AM')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  const onInnerChange = React.useCallback<onChangeFunc>(\n    (params) => {\n      params.hours = toHourOutputFormat(params.hours, hours, is24Hour)\n      onChange(params)\n    },\n    [onChange, hours, is24Hour]\n  )\n\n  return (\n    <DisplayModeContext.Provider\n      value={{ mode: displayMode, setMode: setDisplayMode }}\n    >\n      <View style={isLandscape ? styles.rootLandscape : styles.rootPortrait}>\n        <TimeInputs\n          inputType={inputType}\n          hours={hours}\n          minutes={minutes}\n          is24Hour={is24Hour}\n          onChange={onChange}\n          onFocusInput={onFocusInput}\n          focused={focused}\n        />\n        {inputType === inputTypes.picker ? (\n          <View style={styles.clockContainer}>\n            <AnalogClock\n              hours={toHourInputFormat(hours, is24Hour)}\n              minutes={minutes}\n              focused={focused}\n              is24Hour={is24Hour}\n              onChange={onInnerChange}\n            />\n          </View>\n        ) : null}\n      </View>\n    </DisplayModeContext.Provider>\n  )\n}\n\nconst styles = StyleSheet.create({\n  rootLandscape: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: 24 * 3 + 96 * 2 + 52 + circleSize,\n  },\n  rootPortrait: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  clockContainer: { paddingTop: 36, paddingLeft: 12, paddingRight: 12 },\n})\n\nexport default React.memo(TimePicker)\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAQA;;AAEA;;;;;;;;AAEO,MAAMA,kBAAkB,gBAAGC,KAAK,CAACC,aAAN,CAG/B;EAAEC,IAAI,EAAE,IAAR;EAAcC,OAAO,EAAE,MAAM,CAAE;AAA/B,CAH+B,CAA3B;;;AAeP,SAASC,UAAT,OAgBG;EAAA,IAhBiB;IAClBC,KADkB;IAElBC,OAFkB;IAGlBC,YAHkB;IAIlBC,OAJkB;IAKlBC,SALkB;IAMlBC,QANkB;IAOlBC;EAPkB,CAgBjB;EACD,MAAM,CAACC,WAAD,EAAcC,cAAd,IAAgCb,KAAK,CAACc,QAAN,CACpCC,SADoC,CAAtC;EAGA,MAAMC,UAAU,GAAG,IAAAC,gCAAA,GAAnB;EACA,MAAMC,WAAW,GAAGF,UAAU,CAACG,KAAX,GAAmBH,UAAU,CAACI,MAAlD,CALC,CAOD;;EACA,MAAMC,QAAQ,GAAGrB,KAAK,CAACsB,OAAN,CAAc,MAAM;IACnC,MAAMC,SAAS,GAAG,IAAIC,IAAI,CAACC,cAAT,CAAwBd,MAAxB,EAAgC;MAChDe,IAAI,EAAE,SAD0C;MAEhDC,MAAM,EAAE,SAFwC;MAGhDC,QAAQ,EAAE;IAHsC,CAAhC,CAAlB;IAKA,MAAMC,SAAS,GAAGN,SAAS,CAACO,MAAV,CAAiB,IAAIC,IAAJ,CAASA,IAAI,CAACC,GAAL,CAAS,IAAT,EAAe,CAAf,EAAkB,CAAlB,EAAqB,EAArB,CAAT,CAAjB,CAAlB;IACA,OAAOH,SAAS,CAACI,QAAV,CAAmB,IAAnB,CAAP;EACD,CARgB,EAQd,CAACtB,MAAD,CARc,CAAjB,CARC,CAkBD;;EACAX,KAAK,CAACkC,SAAN,CAAgB,MAAM;IACpB,IAAI7B,KAAK,IAAI,EAAb,EAAiB;MACfQ,cAAc,CAAC,IAAD,CAAd;IACD,CAFD,MAEO;MACLA,cAAc,CAAC,IAAD,CAAd;IACD,CALmB,CAMpB;;EACD,CAPD,EAOG,EAPH;EASA,MAAMsB,aAAa,GAAGnC,KAAK,CAACoC,WAAN,CACnBC,MAAD,IAAY;IACVA,MAAM,CAAChC,KAAP,GAAe,IAAAiC,6BAAA,EAAmBD,MAAM,CAAChC,KAA1B,EAAiCA,KAAjC,EAAwCgB,QAAxC,CAAf;IACAX,QAAQ,CAAC2B,MAAD,CAAR;EACD,CAJmB,EAKpB,CAAC3B,QAAD,EAAWL,KAAX,EAAkBgB,QAAlB,CALoB,CAAtB;EAQA,oBACE,oBAAC,kBAAD,CAAoB,QAApB;IACE,KAAK,EAAE;MAAEnB,IAAI,EAAEU,WAAR;MAAqBT,OAAO,EAAEU;IAA9B;EADT,gBAGE,oBAAC,iBAAD;IAAM,KAAK,EAAEK,WAAW,GAAGqB,MAAM,CAACC,aAAV,GAA0BD,MAAM,CAACE;EAAzD,gBACE,oBAAC,mBAAD;IACE,SAAS,EAAEhC,SADb;IAEE,KAAK,EAAEJ,KAFT;IAGE,OAAO,EAAEC,OAHX;IAIE,QAAQ,EAAEe,QAJZ;IAKE,QAAQ,EAAEX,QALZ;IAME,YAAY,EAAEH,YANhB;IAOE,OAAO,EAAEC;EAPX,EADF,EAUGC,SAAS,KAAKiC,qBAAA,CAAWC,MAAzB,gBACC,oBAAC,iBAAD;IAAM,KAAK,EAAEJ,MAAM,CAACK;EAApB,gBACE,oBAAC,oBAAD;IACE,KAAK,EAAE,IAAAC,4BAAA,EAAkBxC,KAAlB,EAAyBgB,QAAzB,CADT;IAEE,OAAO,EAAEf,OAFX;IAGE,OAAO,EAAEE,OAHX;IAIE,QAAQ,EAAEa,QAJZ;IAKE,QAAQ,EAAEc;EALZ,EADF,CADD,GAUG,IApBN,CAHF,CADF;AA4BD;;AAED,MAAMI,MAAM,GAAGO,uBAAA,CAAWC,MAAX,CAAkB;EAC/BP,aAAa,EAAE;IACbQ,aAAa,EAAE,KADF;IAEbC,UAAU,EAAE,QAFC;IAGbC,cAAc,EAAE,QAHH;IAIb/B,KAAK,EAAE,KAAK,CAAL,GAAS,KAAK,CAAd,GAAkB,EAAlB,GAAuBgC;EAJjB,CADgB;EAO/BV,YAAY,EAAE;IACZQ,UAAU,EAAE,QADA;IAEZC,cAAc,EAAE;EAFJ,CAPiB;EAW/BN,cAAc,EAAE;IAAEQ,UAAU,EAAE,EAAd;IAAkBC,WAAW,EAAE,EAA/B;IAAmCC,YAAY,EAAE;EAAjD;AAXe,CAAlB,CAAf;;4BAcetD,KAAK,CAACuD,IAAN,CAAWnD,UAAX,C"}
+{"version":3,"names":["DisplayModeContext","React","createContext","mode","setMode","TimePicker","hours","minutes","onFocusInput","focused","inputType","onChange","locale","displayMode","setDisplayMode","useState","undefined","dimensions","useWindowDimensions","isLandscape","width","height","is24Hour","useMemo","formatter","Intl","DateTimeFormat","hour","minute","timeZone","formatted","format","Date","UTC","includes","useEffect","onInnerChange","useCallback","params","toHourOutputFormat","styles","rootLandscape","inputTypes","picker","circleSize","rootPortrait","clockContainer","toHourInputFormat","StyleSheet","create","flexDirection","alignItems","justifyContent","paddingTop","paddingLeft","paddingRight","memo"],"sources":["TimePicker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { View, StyleSheet, useWindowDimensions } from 'react-native'\n\nimport {\n  inputTypes,\n  PossibleClockTypes,\n  PossibleInputTypes,\n  toHourInputFormat,\n  toHourOutputFormat,\n} from './timeUtils'\n\nimport AnalogClock from './AnalogClock'\nimport { circleSize } from './timeUtils'\nimport TimeInputs from './TimeInputs'\n\nexport const DisplayModeContext = React.createContext<{\n  mode: 'AM' | 'PM' | undefined\n  setMode: React.Dispatch<React.SetStateAction<'AM' | 'PM' | undefined>>\n}>({ mode: 'AM', setMode: () => {} })\n\ntype onChangeFunc = ({\n  hours,\n  minutes,\n  focused,\n}: {\n  hours: number\n  minutes: number\n  focused?: undefined | PossibleClockTypes\n}) => any\n\nfunction TimePicker({\n  hours,\n  minutes,\n  onFocusInput,\n  focused,\n  inputType,\n  onChange,\n  locale,\n}: {\n  locale?: undefined | string\n  inputType: PossibleInputTypes\n  focused: PossibleClockTypes\n  hours: number\n  minutes: number\n  onFocusInput: (type: PossibleClockTypes) => any\n  onChange: onChangeFunc\n}) {\n  const [displayMode, setDisplayMode] = React.useState<'AM' | 'PM' | undefined>(\n    undefined\n  )\n  const dimensions = useWindowDimensions()\n  const isLandscape = dimensions.width > dimensions.height\n\n  // method to check whether we have 24 hours in clock or 12\n  const is24Hour = React.useMemo(() => {\n    const formatter = new Intl.DateTimeFormat(locale, {\n      hour: '2-digit',\n      minute: '2-digit',\n      timeZone: 'UTC',\n    })\n    const formatted = formatter.format(new Date(Date.UTC(2020, 1, 1, 23)))\n    return formatted.includes('23')\n  }, [locale])\n\n  // Initialize display Mode according the hours value\n  React.useEffect(() => {\n    if (hours >= 12) {\n      setDisplayMode('PM')\n    } else {\n      setDisplayMode('AM')\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  const onInnerChange = React.useCallback<onChangeFunc>(\n    (params) => {\n      params.hours = toHourOutputFormat(params.hours, hours, is24Hour)\n      onChange(params)\n    },\n    [onChange, hours, is24Hour]\n  )\n\n  return (\n    <DisplayModeContext.Provider\n      value={{ mode: displayMode, setMode: setDisplayMode }}\n    >\n      <View\n        style={\n          isLandscape\n            ? [\n                styles.rootLandscape,\n                {\n                  width:\n                    24 * 3 +\n                    96 * 2 +\n                    52 +\n                    (inputType === inputTypes.picker\n                      ? circleSize\n                      : -circleSize),\n                },\n              ]\n            : styles.rootPortrait\n        }\n      >\n        <TimeInputs\n          inputType={inputType}\n          hours={hours}\n          minutes={minutes}\n          is24Hour={is24Hour}\n          onChange={onChange}\n          onFocusInput={onFocusInput}\n          focused={focused}\n        />\n        {inputType === inputTypes.picker ? (\n          <View style={styles.clockContainer}>\n            <AnalogClock\n              hours={toHourInputFormat(hours, is24Hour)}\n              minutes={minutes}\n              focused={focused}\n              is24Hour={is24Hour}\n              onChange={onInnerChange}\n            />\n          </View>\n        ) : null}\n      </View>\n    </DisplayModeContext.Provider>\n  )\n}\n\nconst styles = StyleSheet.create({\n  rootLandscape: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  rootPortrait: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  clockContainer: { paddingTop: 36, paddingLeft: 12, paddingRight: 12 },\n})\n\nexport default React.memo(TimePicker)\n"],"mappings":"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"}

package/lib/commonjs/Time/TimePickerModal.js

@@ -44,9 +44,10 @@ function TimePickerModal(_ref) {
   } = _ref;
   const theme = (0, _reactNativePaper.useTheme)();
   let textFont;
+  let labelText = label;
 
   if (theme.isV3) {
-    textFont = theme.fonts.bodyMedium;
+    textFont = theme.fonts.labelMedium;
   } else {
     textFont = theme === null || theme === void 0 ? void 0 : theme.fonts.medium;
   }
@@ -55,6 +56,11 @@ function TimePickerModal(_ref) {
   const [focused, setFocused] = React.useState(_timeUtils.clockTypes.hours);
   const [localHours, setLocalHours] = React.useState(getHours(hours));
   const [localMinutes, setLocalMinutes] = React.useState(getMinutes(minutes));
+
+  if (inputType === _timeUtils.inputTypes.keyboard && !label) {
+    labelText = 'Enter time';
+  }
+
   React.useEffect(() => {
     setLocalHours(getHours(hours));
   }, [setLocalHours, hours]);
@@ -76,8 +82,7 @@ function TimePickerModal(_ref) {
     visible: visible,
     onRequestClose: onDismiss,
     presentationStyle: "overFullScreen",
-    supportedOrientations: supportedOrientations //@ts-ignore
-    ,
+    supportedOrientations: supportedOrientations,
     statusBarTranslucent: true
   }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_reactNative.TouchableWithoutFeedback, {
     onPress: onDismiss
@@ -93,16 +98,16 @@ function TimePickerModal(_ref) {
     behavior: 'padding'
   }, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
     style: [styles.modalContent, {
-      backgroundColor: theme.dark ? (0, _reactNativePaper.overlay)(10, theme.colors.surface) : theme.colors.surface,
-      borderRadius: theme.roundness
+      backgroundColor: theme.dark && theme.isV3 ? theme.colors.elevation.level3 : theme.isV3 ? theme.colors.surface : theme.dark ? (0, _reactNativePaper.overlay)(10, theme.colors.surface) : theme.colors.surface,
+      borderRadius: theme.isV3 ? theme.roundness * 6 : theme.roundness
     }]
   }, /*#__PURE__*/React.createElement(_reactNative.View, {
     style: styles.labelContainer
   }, /*#__PURE__*/React.createElement(_reactNative.Text, {
     style: [styles.label, { ...textFont,
-      color: theme !== null && theme !== void 0 && theme.isV3 ? theme.colors.onBackground : theme.colors.text
+      color: theme !== null && theme !== void 0 && theme.isV3 ? theme.colors.onSurfaceVariant : theme.colors.text
     }]
-  }, uppercase ? label.toUpperCase() : label)), /*#__PURE__*/React.createElement(_reactNative.View, {
+  }, uppercase ? labelText.toUpperCase() : labelText)), /*#__PURE__*/React.createElement(_reactNative.View, {
     style: styles.timePickerContainer
   }, /*#__PURE__*/React.createElement(_TimePicker.default, {
     locale: locale,
@@ -167,22 +172,25 @@ const styles = _reactNative.StyleSheet.create({
     },
     shadowOpacity: 0.34,
     shadowRadius: 6.27,
-    elevation: 10,
-    minWidth: 287
+    elevation: 3,
+    minWidth: 287,
+    paddingVertical: 8
   },
   labelContainer: {
-    height: 28,
     justifyContent: 'flex-end',
     paddingLeft: 24,
     paddingRight: 24,
-    marginTop: 8
+    paddingTop: 16
   },
   label: {
     letterSpacing: 1,
     fontSize: 13
   },
   timePickerContainer: {
-    padding: 24
+    paddingLeft: 24,
+    paddingTop: 20,
+    paddingBottom: 16,
+    paddingRight: 24
   },
   bottom: {
     flexDirection: 'row',

package/lib/commonjs/Time/TimePickerModal.js.map

@@ -1 +1 @@
-{"version":3,"names":["supportedOrientations","TimePickerModal","visible","onDismiss","onConfirm","hours","minutes","label","uppercase","cancelLabel","confirmLabel","animationType","locale","keyboardIcon","clockIcon","theme","useTheme","textFont","isV3","fonts","bodyMedium","medium","inputType","setInputType","React","useState","inputTypes","picker","focused","setFocused","clockTypes","localHours","setLocalHours","getHours","localMinutes","setLocalMinutes","getMinutes","useEffect","onFocusInput","useCallback","type","onChange","params","StyleSheet","absoluteFill","styles","modalBackground","backgroundColor","colors","backdrop","modalRoot","keyboardView","modalContent","dark","overlay","surface","borderRadius","roundness","labelContainer","color","onBackground","text","toUpperCase","timePickerContainer","bottom","getTimeInputTypeIcon","keyboard","reverseInputTypes","inputTypeToggle","fill","undefined","Date","create","justifyContent","alignItems","flex","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","minWidth","paddingLeft","paddingRight","marginTop","letterSpacing","fontSize","padding","flexDirection","margin","memo"],"sources":["TimePickerModal.tsx"],"sourcesContent":["import * as React from 'react'\nimport {\n  Modal,\n  StyleSheet,\n  View,\n  Text,\n  Animated,\n  TouchableWithoutFeedback,\n  KeyboardAvoidingView,\n} from 'react-native'\n\nimport {\n  Button,\n  IconButton,\n  MD2Theme,\n  overlay,\n  useTheme,\n} from 'react-native-paper'\n\nimport TimePicker from './TimePicker'\nimport {\n  clockTypes,\n  getTimeInputTypeIcon,\n  inputTypes,\n  PossibleClockTypes,\n  PossibleInputTypes,\n  reverseInputTypes,\n} from './timeUtils'\n\nconst supportedOrientations: any[] = [\n  'portrait',\n  'portrait-upside-down',\n  'landscape',\n  'landscape-left',\n  'landscape-right',\n]\n\nexport function TimePickerModal({\n  visible,\n  onDismiss,\n  onConfirm,\n  hours,\n  minutes,\n  label = 'Select time',\n  uppercase = true,\n  cancelLabel = 'Cancel',\n  confirmLabel = 'Ok',\n  animationType = 'none',\n  locale,\n  keyboardIcon = 'keyboard-outline',\n  clockIcon = 'clock-outline',\n}: {\n  locale?: undefined | string\n  label?: string\n  uppercase?: boolean\n  cancelLabel?: string\n  confirmLabel?: string\n  hours?: number | undefined\n  minutes?: number | undefined\n  visible: boolean | undefined\n  onDismiss: () => any\n  onConfirm: (hoursAndMinutes: { hours: number; minutes: number }) => any\n  animationType?: 'slide' | 'fade' | 'none'\n  keyboardIcon?: string\n  clockIcon?: string\n}) {\n  const theme = useTheme()\n\n  let textFont\n\n  if (theme.isV3) {\n    textFont = theme.fonts.bodyMedium\n  } else {\n    textFont = (theme as any as MD2Theme)?.fonts.medium\n  }\n\n  const [inputType, setInputType] = React.useState<PossibleInputTypes>(\n    inputTypes.picker\n  )\n  const [focused, setFocused] = React.useState<PossibleClockTypes>(\n    clockTypes.hours\n  )\n  const [localHours, setLocalHours] = React.useState<number>(getHours(hours))\n  const [localMinutes, setLocalMinutes] = React.useState<number>(\n    getMinutes(minutes)\n  )\n\n  React.useEffect(() => {\n    setLocalHours(getHours(hours))\n  }, [setLocalHours, hours])\n\n  React.useEffect(() => {\n    setLocalMinutes(getMinutes(minutes))\n  }, [setLocalMinutes, minutes])\n\n  const onFocusInput = React.useCallback(\n    (type: PossibleClockTypes) => setFocused(type),\n    []\n  )\n  const onChange = React.useCallback(\n    (params: {\n      focused?: PossibleClockTypes | undefined\n      hours: number\n      minutes: number\n    }) => {\n      if (params.focused) {\n        setFocused(params.focused)\n      }\n\n      setLocalHours(params.hours)\n      setLocalMinutes(params.minutes)\n    },\n    [setFocused, setLocalHours, setLocalMinutes]\n  )\n  return (\n    <Modal\n      animationType={animationType}\n      transparent={true}\n      visible={visible}\n      onRequestClose={onDismiss}\n      presentationStyle=\"overFullScreen\"\n      supportedOrientations={supportedOrientations}\n      //@ts-ignore\n      statusBarTranslucent={true}\n    >\n      <>\n        <TouchableWithoutFeedback onPress={onDismiss}>\n          <View\n            style={[\n              StyleSheet.absoluteFill,\n              styles.modalBackground,\n              { backgroundColor: theme.colors?.backdrop },\n            ]}\n          />\n        </TouchableWithoutFeedback>\n\n        <View\n          style={[StyleSheet.absoluteFill, styles.modalRoot]}\n          pointerEvents=\"box-none\"\n        >\n          <KeyboardAvoidingView\n            style={styles.keyboardView}\n            behavior={'padding'}\n          >\n            <Animated.View\n              style={[\n                styles.modalContent,\n                {\n                  backgroundColor: theme.dark\n                    ? overlay(10, theme.colors.surface)\n                    : theme.colors.surface,\n                  borderRadius: theme.roundness,\n                },\n              ]}\n            >\n              <View style={styles.labelContainer}>\n                <Text\n                  style={[\n                    styles.label,\n                    {\n                      ...textFont,\n                      color: theme?.isV3\n                        ? theme.colors.onBackground\n                        : (theme as any as MD2Theme).colors.text,\n                    },\n                  ]}\n                >\n                  {uppercase ? label.toUpperCase() : label}\n                </Text>\n              </View>\n              <View style={styles.timePickerContainer}>\n                <TimePicker\n                  locale={locale}\n                  inputType={inputType}\n                  focused={focused}\n                  hours={localHours}\n                  minutes={localMinutes}\n                  onChange={onChange}\n                  onFocusInput={onFocusInput}\n                />\n              </View>\n              <View style={styles.bottom}>\n                <IconButton\n                  icon={getTimeInputTypeIcon(inputType, {\n                    keyboard: keyboardIcon,\n                    picker: clockIcon,\n                  })}\n                  onPress={() => setInputType(reverseInputTypes[inputType])}\n                  size={24}\n                  style={styles.inputTypeToggle}\n                  accessibilityLabel=\"toggle keyboard\"\n                />\n                <View style={styles.fill} />\n                <Button onPress={onDismiss} uppercase={uppercase}>\n                  {cancelLabel}\n                </Button>\n                <Button\n                  onPress={() =>\n                    onConfirm({ hours: localHours, minutes: localMinutes })\n                  }\n                  uppercase={uppercase}\n                >\n                  {confirmLabel}\n                </Button>\n              </View>\n            </Animated.View>\n          </KeyboardAvoidingView>\n        </View>\n      </>\n    </Modal>\n  )\n}\n\nfunction getMinutes(minutes: number | undefined | null): number {\n  return minutes === undefined || minutes === null\n    ? new Date().getMinutes()\n    : minutes\n}\nfunction getHours(hours: number | undefined | null): number {\n  return hours === undefined || hours === null ? new Date().getHours() : hours\n}\n\nconst styles = StyleSheet.create({\n  modalRoot: {\n    justifyContent: 'center',\n    alignItems: 'center',\n    flex: 1,\n  },\n  keyboardView: {\n    justifyContent: 'center',\n    alignItems: 'center',\n    flex: 1,\n  },\n  modalBackground: {\n    flex: 1,\n  },\n  modalContent: {\n    shadowColor: '#000',\n    shadowOffset: {\n      width: 0,\n      height: 5,\n    },\n    shadowOpacity: 0.34,\n    shadowRadius: 6.27,\n    elevation: 10,\n    minWidth: 287,\n  },\n  labelContainer: {\n    height: 28,\n    justifyContent: 'flex-end',\n    paddingLeft: 24,\n    paddingRight: 24,\n    marginTop: 8,\n  },\n  label: {\n    letterSpacing: 1,\n    fontSize: 13,\n  },\n  timePickerContainer: { padding: 24 },\n  bottom: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    padding: 8,\n  },\n  inputTypeToggle: { margin: 4 },\n  fill: { flex: 1 },\n})\n\nexport default React.memo(TimePickerModal)\n"],"mappings":"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"}
+{"version":3,"names":["supportedOrientations","TimePickerModal","visible","onDismiss","onConfirm","hours","minutes","label","uppercase","cancelLabel","confirmLabel","animationType","locale","keyboardIcon","clockIcon","theme","useTheme","textFont","labelText","isV3","fonts","labelMedium","medium","inputType","setInputType","React","useState","inputTypes","picker","focused","setFocused","clockTypes","localHours","setLocalHours","getHours","localMinutes","setLocalMinutes","getMinutes","keyboard","useEffect","onFocusInput","useCallback","type","onChange","params","StyleSheet","absoluteFill","styles","modalBackground","backgroundColor","colors","backdrop","modalRoot","keyboardView","modalContent","dark","elevation","level3","surface","overlay","borderRadius","roundness","labelContainer","color","onSurfaceVariant","text","toUpperCase","timePickerContainer","bottom","getTimeInputTypeIcon","reverseInputTypes","inputTypeToggle","fill","undefined","Date","create","justifyContent","alignItems","flex","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","minWidth","paddingVertical","paddingLeft","paddingRight","paddingTop","letterSpacing","fontSize","paddingBottom","flexDirection","padding","margin","memo"],"sources":["TimePickerModal.tsx"],"sourcesContent":["import * as React from 'react'\nimport {\n  Modal,\n  StyleSheet,\n  View,\n  Text,\n  Animated,\n  TouchableWithoutFeedback,\n  KeyboardAvoidingView,\n} from 'react-native'\n\nimport {\n  Button,\n  IconButton,\n  MD2Theme,\n  overlay,\n  useTheme,\n} from 'react-native-paper'\n\nimport TimePicker from './TimePicker'\nimport {\n  clockTypes,\n  getTimeInputTypeIcon,\n  inputTypes,\n  PossibleClockTypes,\n  PossibleInputTypes,\n  reverseInputTypes,\n} from './timeUtils'\n\nconst supportedOrientations: (\n  | 'portrait'\n  | 'portrait-upside-down'\n  | 'landscape'\n  | 'landscape-left'\n  | 'landscape-right'\n)[] = [\n  'portrait',\n  'portrait-upside-down',\n  'landscape',\n  'landscape-left',\n  'landscape-right',\n]\n\nexport function TimePickerModal({\n  visible,\n  onDismiss,\n  onConfirm,\n  hours,\n  minutes,\n  label = 'Select time',\n  uppercase = true,\n  cancelLabel = 'Cancel',\n  confirmLabel = 'Ok',\n  animationType = 'none',\n  locale,\n  keyboardIcon = 'keyboard-outline',\n  clockIcon = 'clock-outline',\n}: {\n  locale?: undefined | string\n  label?: string\n  uppercase?: boolean\n  cancelLabel?: string\n  confirmLabel?: string\n  hours?: number | undefined\n  minutes?: number | undefined\n  visible: boolean | undefined\n  onDismiss: () => any\n  onConfirm: (hoursAndMinutes: { hours: number; minutes: number }) => any\n  animationType?: 'slide' | 'fade' | 'none'\n  keyboardIcon?: string\n  clockIcon?: string\n}) {\n  const theme = useTheme()\n\n  let textFont\n  let labelText = label\n\n  if (theme.isV3) {\n    textFont = theme.fonts.labelMedium\n  } else {\n    textFont = (theme as any as MD2Theme)?.fonts.medium\n  }\n\n  const [inputType, setInputType] = React.useState<PossibleInputTypes>(\n    inputTypes.picker\n  )\n  const [focused, setFocused] = React.useState<PossibleClockTypes>(\n    clockTypes.hours\n  )\n  const [localHours, setLocalHours] = React.useState<number>(getHours(hours))\n  const [localMinutes, setLocalMinutes] = React.useState<number>(\n    getMinutes(minutes)\n  )\n\n  if (inputType === inputTypes.keyboard && !label) {\n    labelText = 'Enter time'\n  }\n\n  React.useEffect(() => {\n    setLocalHours(getHours(hours))\n  }, [setLocalHours, hours])\n\n  React.useEffect(() => {\n    setLocalMinutes(getMinutes(minutes))\n  }, [setLocalMinutes, minutes])\n\n  const onFocusInput = React.useCallback(\n    (type: PossibleClockTypes) => setFocused(type),\n    []\n  )\n  const onChange = React.useCallback(\n    (params: {\n      focused?: PossibleClockTypes | undefined\n      hours: number\n      minutes: number\n    }) => {\n      if (params.focused) {\n        setFocused(params.focused)\n      }\n\n      setLocalHours(params.hours)\n      setLocalMinutes(params.minutes)\n    },\n    [setFocused, setLocalHours, setLocalMinutes]\n  )\n  return (\n    <Modal\n      animationType={animationType}\n      transparent={true}\n      visible={visible}\n      onRequestClose={onDismiss}\n      presentationStyle=\"overFullScreen\"\n      supportedOrientations={supportedOrientations}\n      statusBarTranslucent={true}\n    >\n      <>\n        <TouchableWithoutFeedback onPress={onDismiss}>\n          <View\n            style={[\n              StyleSheet.absoluteFill,\n              styles.modalBackground,\n              { backgroundColor: theme.colors?.backdrop },\n            ]}\n          />\n        </TouchableWithoutFeedback>\n        <View\n          style={[StyleSheet.absoluteFill, styles.modalRoot]}\n          pointerEvents=\"box-none\"\n        >\n          <KeyboardAvoidingView\n            style={styles.keyboardView}\n            behavior={'padding'}\n          >\n            <Animated.View\n              style={[\n                styles.modalContent,\n                {\n                  backgroundColor:\n                    theme.dark && theme.isV3\n                      ? theme.colors.elevation.level3\n                      : theme.isV3\n                      ? theme.colors.surface\n                      : theme.dark\n                      ? overlay(10, theme.colors.surface)\n                      : theme.colors.surface,\n                  borderRadius: theme.isV3\n                    ? theme.roundness * 6\n                    : theme.roundness,\n                },\n              ]}\n            >\n              <View style={styles.labelContainer}>\n                <Text\n                  style={[\n                    styles.label,\n                    {\n                      ...textFont,\n                      color: theme?.isV3\n                        ? theme.colors.onSurfaceVariant\n                        : (theme as any as MD2Theme).colors.text,\n                    },\n                  ]}\n                >\n                  {uppercase ? labelText.toUpperCase() : labelText}\n                </Text>\n              </View>\n              <View style={styles.timePickerContainer}>\n                <TimePicker\n                  locale={locale}\n                  inputType={inputType}\n                  focused={focused}\n                  hours={localHours}\n                  minutes={localMinutes}\n                  onChange={onChange}\n                  onFocusInput={onFocusInput}\n                />\n              </View>\n              <View style={styles.bottom}>\n                <IconButton\n                  icon={getTimeInputTypeIcon(inputType, {\n                    keyboard: keyboardIcon,\n                    picker: clockIcon,\n                  })}\n                  onPress={() => setInputType(reverseInputTypes[inputType])}\n                  size={24}\n                  style={styles.inputTypeToggle}\n                  accessibilityLabel=\"toggle keyboard\"\n                />\n                <View style={styles.fill} />\n                <Button onPress={onDismiss} uppercase={uppercase}>\n                  {cancelLabel}\n                </Button>\n                <Button\n                  onPress={() =>\n                    onConfirm({ hours: localHours, minutes: localMinutes })\n                  }\n                  uppercase={uppercase}\n                >\n                  {confirmLabel}\n                </Button>\n              </View>\n            </Animated.View>\n          </KeyboardAvoidingView>\n        </View>\n      </>\n    </Modal>\n  )\n}\n\nfunction getMinutes(minutes: number | undefined | null): number {\n  return minutes === undefined || minutes === null\n    ? new Date().getMinutes()\n    : minutes\n}\nfunction getHours(hours: number | undefined | null): number {\n  return hours === undefined || hours === null ? new Date().getHours() : hours\n}\n\nconst styles = StyleSheet.create({\n  modalRoot: {\n    justifyContent: 'center',\n    alignItems: 'center',\n    flex: 1,\n  },\n  keyboardView: {\n    justifyContent: 'center',\n    alignItems: 'center',\n    flex: 1,\n  },\n  modalBackground: {\n    flex: 1,\n  },\n  modalContent: {\n    shadowColor: '#000',\n    shadowOffset: {\n      width: 0,\n      height: 5,\n    },\n    shadowOpacity: 0.34,\n    shadowRadius: 6.27,\n    elevation: 3,\n    minWidth: 287,\n    paddingVertical: 8,\n  },\n  labelContainer: {\n    justifyContent: 'flex-end',\n    paddingLeft: 24,\n    paddingRight: 24,\n    paddingTop: 16,\n  },\n  label: {\n    letterSpacing: 1,\n    fontSize: 13,\n  },\n  timePickerContainer: {\n    paddingLeft: 24,\n    paddingTop: 20,\n    paddingBottom: 16,\n    paddingRight: 24,\n  },\n  bottom: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    padding: 8,\n  },\n  inputTypeToggle: { margin: 4 },\n  fill: { flex: 1 },\n})\n\nexport default React.memo(TimePickerModal)\n"],"mappings":"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"}

package/lib/commonjs/Time/timeUtils.js

@@ -28,8 +28,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-// 250? when bigger?
-const circleSize = 215;
+const circleSize = 256;
 exports.circleSize = circleSize;
 const hourTypes = {
   am: 'am',
@@ -171,11 +170,7 @@ function useSwitchColors(highlighted) {
   const backgroundColor = React.useMemo(() => {
     if (theme.dark) {
       if (highlighted) {
-        return (0, _color.default)(theme.colors.primary).hex();
-      }
-
-      if (theme.isV3) {
-        return (0, _color.default)(theme.colors.surface).lighten(1.4).hex();
+        return theme.isV3 ? theme.colors.tertiaryContainer : (0, _color.default)(theme.colors.primary).hex();
       }
 
       return theme.colors.backdrop;
@@ -193,11 +188,11 @@ function useSwitchColors(highlighted) {
   }, [highlighted, theme]);
   const color = React.useMemo(() => {
     if (highlighted && !theme.dark) {
-      return theme.colors.primary;
+      return theme.isV3 ? theme.colors.onSurfaceVariant : theme.colors.primary;
     }
 
     if (highlighted && theme.dark) {
-      return theme.colors.background;
+      return theme.isV3 ? theme.colors.onTertiaryContainer : theme.colors.background;
     }
 
     if (theme.isV3) {
@@ -217,38 +212,38 @@ function useInputColors(highlighted) {
   const backgroundColor = React.useMemo(() => {
     if (theme.dark) {
       if (highlighted) {
-        return (0, _color.default)(theme.colors.primary).hex();
+        return theme.isV3 ? theme.colors.primaryContainer : (0, _color.default)(theme.colors.primary).hex();
       }
 
-      return (0, _color.default)(theme.colors.surface).lighten(1.4).hex();
+      return theme.isV3 ? theme.colors.surfaceVariant : (0, _color.default)(theme.colors.surface).lighten(1.4).hex();
     }
 
     if (highlighted) {
       if (theme.isV3) {
-        return (0, _color.default)(theme.colors.primaryContainer).hex();
+        return theme.colors.secondaryContainer;
       }
 
       return (0, _color.default)(theme.colors.primary).lighten(1).hex();
     }
 
     if (theme.isV3) {
-      return (0, _color.default)(theme.colors.outline).lighten(0.9).hex();
+      return theme.colors.surfaceVariant;
     }
 
     return (0, _color.default)(theme.colors.surface).darken(0.1).hex();
   }, [highlighted, theme]);
   const color = React.useMemo(() => {
-    if (highlighted && !theme.dark) {
-      return theme.colors.primary;
-    }
-
     if (theme.isV3) {
       if (!highlighted) {
-        return theme.colors.onBackground;
+        return theme.isV3 ? theme.colors.onSurface : theme.colors.onBackground;
       }
 
-      return theme.colors.background;
+      return theme.isV3 ? theme.colors.onPrimaryContainer : theme.colors.onBackground;
     } else {
+      if (highlighted && !theme.dark) {
+        return theme.colors.primary;
+      }
+
       return theme.colors.text;
     }
   }, [highlighted, theme]);

package/lib/commonjs/Time/timeUtils.js.map

@@ -1 +1 @@
-{"version":3,"names":["circleSize","hourTypes","am","pm","getHourType","hours","undefined","inputTypes","keyboard","picker","reverseInputTypes","inputTypeIcons","getTimeInputTypeIcon","inputType","inputIconMap","clockTypes","minutes","outerHeight","_30","Math","PI","_12","_360","_90","snap","angle","step","a","diff","getHourTypeFromOffset","left","top","size","w","x","y","distance","sqrt","maxPm","getMinutes","handAngle","minute","parseInt","toFixed","getHours","hourType","hour","getAngle","atan","useSwitchColors","highlighted","theme","useTheme","backgroundColor","React","useMemo","dark","Color","colors","primary","hex","isV3","surface","lighten","backdrop","primaryContainer","color","background","onSurfaceVariant","placeholder","useInputColors","outline","darken","onBackground","text","toHourInputFormat","is24Hour","toHourOutputFormat","newHours","previousHours"],"sources":["timeUtils.ts"],"sourcesContent":["import * as React from 'react'\nimport Color from 'color'\nimport { MD2Theme, useTheme } from 'react-native-paper'\n\n// 250? when bigger?\nexport const circleSize = 215\n\nexport type PossibleHourTypes = 'am' | 'pm'\nexport type HourTypeMap = {\n  [hourType in PossibleHourTypes]: PossibleHourTypes\n}\nexport const hourTypes: HourTypeMap = {\n  am: 'am',\n  pm: 'pm',\n}\n\nexport function getHourType(hours: number): PossibleHourTypes | undefined {\n  if (hours >= 0 && hours <= 12) {\n    return hourTypes.am\n  }\n  if (hours > 12 && hours <= 24) {\n    return hourTypes.pm\n  }\n  return undefined\n}\n\nexport type PossibleInputTypes = 'keyboard' | 'picker'\nexport type InputTypeMap = {\n  [inputType in PossibleInputTypes]: PossibleInputTypes\n}\nexport const inputTypes: InputTypeMap = {\n  keyboard: 'keyboard',\n  picker: 'picker',\n}\n\nexport const reverseInputTypes: InputTypeMap = {\n  keyboard: 'picker',\n  picker: 'keyboard',\n}\ntype InputIconMap = {\n  [inputType in PossibleInputTypes]: string\n}\nexport const inputTypeIcons: InputIconMap = {\n  keyboard: 'keyboard-outline',\n  picker: 'clock-outline',\n}\n\nexport const getTimeInputTypeIcon = (\n  inputType: PossibleInputTypes,\n  inputIconMap?: InputIconMap\n) => {\n  return (\n    inputIconMap?.[reverseInputTypes[inputType]] ||\n    inputTypeIcons?.[reverseInputTypes[inputType]]\n  )\n}\n\nexport type PossibleClockTypes = 'hours' | 'minutes'\nexport type ClockTypeMap = {\n  [clockType in PossibleClockTypes]: PossibleClockTypes\n}\nexport const clockTypes: ClockTypeMap = {\n  minutes: 'minutes',\n  hours: 'hours',\n}\n\n// Code inspiration and copied from: https://github.com/ShaneGH/analogue-time-picker/blob/master/src/utils/angle.ts\n\nconst outerHeight = 34\nconst _30 = Math.PI / 6\nconst _12 = Math.PI / 30\nconst _360 = Math.PI * 2\nconst _90 = Math.PI / 2\n\n/** Snap an angle to a given step. E.g. if angle = 22° and step = 10°, round down to 20° */\nexport function snap(angle: number, step: number) {\n  let a = angle\n  while (a < 0) a += _360\n  let diff = a % step\n\n  if (diff <= step / 2) {\n    return angle - diff\n  }\n\n  return angle - diff + step\n}\n\n// detect am / pm based on offset\nexport function getHourTypeFromOffset(\n  left: number,\n  top: number,\n  size: number\n): PossibleHourTypes {\n  const w = size / 2\n  const x = w - left\n  const y = size / 2 - top\n\n  const distance = Math.sqrt(x * x + y * y)\n  const maxPm = w - outerHeight\n\n  return distance > maxPm ? hourTypes.am : hourTypes.pm\n}\n\n// Calculate the minute from the hand angle\nexport function getMinutes(handAngle: number) {\n  handAngle = snap(handAngle, _12)\n\n  let minute = parseInt((((handAngle - _90) % _360) / _12).toFixed(), 10)\n  while (minute < 0) minute += 60\n  while (minute >= 60) minute -= 60\n\n  return minute\n}\n\n// Calculate the hour from the hand angle\nexport function getHours(\n  handAngle: number,\n  hourType: PossibleHourTypes | undefined\n) {\n  handAngle = snap(handAngle, _30)\n\n  let hour = parseInt((((handAngle - _90) % _360) / _30).toFixed(), 10)\n  if (hour < 0) hour += 12\n  if (hour >= 12) hour -= 12\n\n  if (hourType === hourTypes.am) {\n    if (hour <= 0) {\n      hour += 12\n    } else if (hour >= 12) {\n      hour -= 12\n    }\n  }\n  if (hourType === hourTypes.pm) {\n    if (hour <= 0) {\n      hour += 12\n    } else if (hour > 12) {\n      hour -= 12\n    }\n  }\n\n  return hour\n}\n\n/** Get the angle of the left/top co-ordinate from the center of the width.height box */\nexport function getAngle(left: number, top: number, size: number) {\n  const x = size / 2 - left\n  const y = size / 2 - top\n\n  // tan O = y / x\n  let angle = x ? Math.atan(y / x) : y < 0 ? -_90 : _90\n  if (x < 0) {\n    // reflect along vertical axis\n    angle = -angle + 2 * (_90 + angle)\n  }\n\n  return angle\n}\n\nexport function useSwitchColors(highlighted: boolean) {\n  const theme = useTheme()\n  const backgroundColor = React.useMemo<string>(() => {\n    if (theme.dark) {\n      if (highlighted) {\n        return Color(theme.colors.primary).hex()\n      }\n      if (theme.isV3) {\n        return Color(theme.colors.surface).lighten(1.4).hex()\n      }\n      return theme.colors.backdrop\n    }\n\n    if (highlighted) {\n      if (theme.isV3) {\n        return theme.colors.primaryContainer\n      }\n\n      return Color(theme.colors.primary).lighten(1).hex()\n    }\n    return theme.colors.surface\n  }, [highlighted, theme])\n\n  const color = React.useMemo<string>(() => {\n    if (highlighted && !theme.dark) {\n      return theme.colors.primary\n    }\n    if (highlighted && theme.dark) {\n      return theme.colors.background\n    }\n    if (theme.isV3) {\n      return theme.colors.onSurfaceVariant\n    } else {\n      return (theme as any as MD2Theme).colors.placeholder\n    }\n  }, [highlighted, theme])\n\n  return { backgroundColor, color }\n}\n\nexport function useInputColors(highlighted: boolean) {\n  const theme = useTheme()\n  const backgroundColor = React.useMemo<string>(() => {\n    if (theme.dark) {\n      if (highlighted) {\n        return Color(theme.colors.primary).hex()\n      }\n      return Color(theme.colors.surface).lighten(1.4).hex()\n    }\n\n    if (highlighted) {\n      if (theme.isV3) {\n        return Color(theme.colors.primaryContainer).hex()\n      }\n      return Color(theme.colors.primary).lighten(1).hex()\n    }\n    if (theme.isV3) {\n      return Color(theme.colors.outline).lighten(0.9).hex()\n    }\n    return Color(theme.colors.surface).darken(0.1).hex()\n  }, [highlighted, theme])\n\n  const color = React.useMemo<string>(() => {\n    if (highlighted && !theme.dark) {\n      return theme.colors.primary\n    }\n    if (theme.isV3) {\n      if (!highlighted) {\n        return theme.colors.onBackground\n      }\n      return theme.colors.background\n    } else {\n      return (theme as any as MD2Theme).colors.text\n    }\n  }, [highlighted, theme])\n\n  return { backgroundColor, color }\n}\n\nexport function toHourInputFormat(hours: number, is24Hour: boolean): number {\n  if (hours === 24) {\n    return 0\n  }\n  if (is24Hour) {\n    return hours\n  }\n  if (hours > 12) {\n    return hours - 12\n  }\n  return hours\n}\n\nexport function toHourOutputFormat(\n  newHours: number,\n  previousHours: number,\n  is24Hour: boolean\n): number {\n  if (is24Hour) {\n    return newHours\n  }\n  if (previousHours > 12 && newHours < 12) {\n    return newHours + 12\n  }\n  return newHours\n}\n"],"mappings":"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"}
+{"version":3,"names":["circleSize","hourTypes","am","pm","getHourType","hours","undefined","inputTypes","keyboard","picker","reverseInputTypes","inputTypeIcons","getTimeInputTypeIcon","inputType","inputIconMap","clockTypes","minutes","outerHeight","_30","Math","PI","_12","_360","_90","snap","angle","step","a","diff","getHourTypeFromOffset","left","top","size","w","x","y","distance","sqrt","maxPm","getMinutes","handAngle","minute","parseInt","toFixed","getHours","hourType","hour","getAngle","atan","useSwitchColors","highlighted","theme","useTheme","backgroundColor","React","useMemo","dark","isV3","colors","tertiaryContainer","Color","primary","hex","backdrop","primaryContainer","lighten","surface","color","onSurfaceVariant","onTertiaryContainer","background","placeholder","useInputColors","surfaceVariant","secondaryContainer","darken","onSurface","onBackground","onPrimaryContainer","text","toHourInputFormat","is24Hour","toHourOutputFormat","newHours","previousHours"],"sources":["timeUtils.ts"],"sourcesContent":["import * as React from 'react'\nimport Color from 'color'\nimport { MD2Theme, useTheme } from 'react-native-paper'\n\nexport const circleSize = 256\n\nexport type PossibleHourTypes = 'am' | 'pm'\nexport type HourTypeMap = {\n  [hourType in PossibleHourTypes]: PossibleHourTypes\n}\nexport const hourTypes: HourTypeMap = {\n  am: 'am',\n  pm: 'pm',\n}\n\nexport function getHourType(hours: number): PossibleHourTypes | undefined {\n  if (hours >= 0 && hours <= 12) {\n    return hourTypes.am\n  }\n  if (hours > 12 && hours <= 24) {\n    return hourTypes.pm\n  }\n  return undefined\n}\n\nexport type PossibleInputTypes = 'keyboard' | 'picker'\nexport type InputTypeMap = {\n  [inputType in PossibleInputTypes]: PossibleInputTypes\n}\nexport const inputTypes: InputTypeMap = {\n  keyboard: 'keyboard',\n  picker: 'picker',\n}\n\nexport const reverseInputTypes: InputTypeMap = {\n  keyboard: 'picker',\n  picker: 'keyboard',\n}\ntype InputIconMap = {\n  [inputType in PossibleInputTypes]: string\n}\nexport const inputTypeIcons: InputIconMap = {\n  keyboard: 'keyboard-outline',\n  picker: 'clock-outline',\n}\n\nexport const getTimeInputTypeIcon = (\n  inputType: PossibleInputTypes,\n  inputIconMap?: InputIconMap\n) => {\n  return (\n    inputIconMap?.[reverseInputTypes[inputType]] ||\n    inputTypeIcons?.[reverseInputTypes[inputType]]\n  )\n}\n\nexport type PossibleClockTypes = 'hours' | 'minutes'\nexport type ClockTypeMap = {\n  [clockType in PossibleClockTypes]: PossibleClockTypes\n}\nexport const clockTypes: ClockTypeMap = {\n  minutes: 'minutes',\n  hours: 'hours',\n}\n\n// Code inspiration and copied from: https://github.com/ShaneGH/analogue-time-picker/blob/master/src/utils/angle.ts\n\nconst outerHeight = 34\nconst _30 = Math.PI / 6\nconst _12 = Math.PI / 30\nconst _360 = Math.PI * 2\nconst _90 = Math.PI / 2\n\n/** Snap an angle to a given step. E.g. if angle = 22° and step = 10°, round down to 20° */\nexport function snap(angle: number, step: number) {\n  let a = angle\n  while (a < 0) a += _360\n  let diff = a % step\n\n  if (diff <= step / 2) {\n    return angle - diff\n  }\n\n  return angle - diff + step\n}\n\n// detect am / pm based on offset\nexport function getHourTypeFromOffset(\n  left: number,\n  top: number,\n  size: number\n): PossibleHourTypes {\n  const w = size / 2\n  const x = w - left\n  const y = size / 2 - top\n\n  const distance = Math.sqrt(x * x + y * y)\n  const maxPm = w - outerHeight\n\n  return distance > maxPm ? hourTypes.am : hourTypes.pm\n}\n\n// Calculate the minute from the hand angle\nexport function getMinutes(handAngle: number) {\n  handAngle = snap(handAngle, _12)\n\n  let minute = parseInt((((handAngle - _90) % _360) / _12).toFixed(), 10)\n  while (minute < 0) minute += 60\n  while (minute >= 60) minute -= 60\n\n  return minute\n}\n\n// Calculate the hour from the hand angle\nexport function getHours(\n  handAngle: number,\n  hourType: PossibleHourTypes | undefined\n) {\n  handAngle = snap(handAngle, _30)\n\n  let hour = parseInt((((handAngle - _90) % _360) / _30).toFixed(), 10)\n  if (hour < 0) hour += 12\n  if (hour >= 12) hour -= 12\n\n  if (hourType === hourTypes.am) {\n    if (hour <= 0) {\n      hour += 12\n    } else if (hour >= 12) {\n      hour -= 12\n    }\n  }\n  if (hourType === hourTypes.pm) {\n    if (hour <= 0) {\n      hour += 12\n    } else if (hour > 12) {\n      hour -= 12\n    }\n  }\n\n  return hour\n}\n\n/** Get the angle of the left/top co-ordinate from the center of the width.height box */\nexport function getAngle(left: number, top: number, size: number) {\n  const x = size / 2 - left\n  const y = size / 2 - top\n\n  // tan O = y / x\n  let angle = x ? Math.atan(y / x) : y < 0 ? -_90 : _90\n  if (x < 0) {\n    // reflect along vertical axis\n    angle = -angle + 2 * (_90 + angle)\n  }\n\n  return angle\n}\n\nexport function useSwitchColors(highlighted: boolean) {\n  const theme = useTheme()\n  const backgroundColor = React.useMemo<string>(() => {\n    if (theme.dark) {\n      if (highlighted) {\n        return theme.isV3\n          ? theme.colors.tertiaryContainer\n          : Color(theme.colors.primary).hex()\n      }\n      return theme.colors.backdrop\n    }\n\n    if (highlighted) {\n      if (theme.isV3) {\n        return theme.colors.primaryContainer\n      }\n\n      return Color(theme.colors.primary).lighten(1).hex()\n    }\n    return theme.colors.surface\n  }, [highlighted, theme])\n\n  const color = React.useMemo<string>(() => {\n    if (highlighted && !theme.dark) {\n      return theme.isV3 ? theme.colors.onSurfaceVariant : theme.colors.primary\n    }\n    if (highlighted && theme.dark) {\n      return theme.isV3\n        ? theme.colors.onTertiaryContainer\n        : theme.colors.background\n    }\n    if (theme.isV3) {\n      return theme.colors.onSurfaceVariant\n    } else {\n      return (theme as any as MD2Theme).colors.placeholder\n    }\n  }, [highlighted, theme])\n\n  return { backgroundColor, color }\n}\n\nexport function useInputColors(highlighted: boolean) {\n  const theme = useTheme()\n  const backgroundColor = React.useMemo<string>(() => {\n    if (theme.dark) {\n      if (highlighted) {\n        return theme.isV3\n          ? theme.colors.primaryContainer\n          : Color(theme.colors.primary).hex()\n      }\n      return theme.isV3\n        ? theme.colors.surfaceVariant\n        : Color(theme.colors.surface).lighten(1.4).hex()\n    }\n\n    if (highlighted) {\n      if (theme.isV3) {\n        return theme.colors.secondaryContainer\n      }\n      return Color(theme.colors.primary).lighten(1).hex()\n    }\n    if (theme.isV3) {\n      return theme.colors.surfaceVariant\n    }\n    return Color(theme.colors.surface).darken(0.1).hex()\n  }, [highlighted, theme])\n\n  const color = React.useMemo<string>(() => {\n    if (theme.isV3) {\n      if (!highlighted) {\n        return theme.isV3 ? theme.colors.onSurface : theme.colors.onBackground\n      }\n      return theme.isV3\n        ? theme.colors.onPrimaryContainer\n        : theme.colors.onBackground\n    } else {\n      if (highlighted && !theme.dark) {\n        return theme.colors.primary\n      }\n      return (theme as any as MD2Theme).colors.text\n    }\n  }, [highlighted, theme])\n\n  return { backgroundColor, color }\n}\n\nexport function toHourInputFormat(hours: number, is24Hour: boolean): number {\n  if (hours === 24) {\n    return 0\n  }\n  if (is24Hour) {\n    return hours\n  }\n  if (hours > 12) {\n    return hours - 12\n  }\n  return hours\n}\n\nexport function toHourOutputFormat(\n  newHours: number,\n  previousHours: number,\n  is24Hour: boolean\n): number {\n  if (is24Hour) {\n    return newHours\n  }\n  if (previousHours > 12 && newHours < 12) {\n    return newHours + 12\n  }\n  return newHours\n}\n"],"mappings":"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"}

package/lib/commonjs/utils.js

@@ -49,6 +49,15 @@ function useHeaderTextColor() {
 function useTextColorOnPrimary() {
   const theme = (0, _reactNativePaper.useTheme)();
   const isDark = !(0, _color.default)(theme.colors.primary).isLight();
+
+  if (theme.isV3) {
+    if (isDark && theme.dark) {
+      return theme.colors.onSurface;
+    } else {
+      return theme.colors.onPrimary;
+    }
+  }
+
   return isDark ? '#fff' : '#000';
 }
 

package/lib/commonjs/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["useLatest","value","ref","React","useRef","current","useHeaderBackgroundColor","theme","useTheme","dark","mode","overlay","colors","surface","primary","useHeaderColorIsLight","background","Color","isLight","useHeaderTextColor","useTextColorOnPrimary","isDark","range","start","end","Array","fill","map","_","i","lightenBy","color","ratio","lightness","darkenBy"],"sources":["utils.ts"],"sourcesContent":["import * as React from 'react'\nimport {\n  DefaultTheme,\n  MD3DarkTheme,\n  overlay,\n  useTheme,\n} from 'react-native-paper'\nimport Color from 'color'\n\nexport type PaperTheme = typeof MD3DarkTheme | typeof DefaultTheme\n\nexport function useLatest<T>(value: T) {\n  const ref = React.useRef(value)\n  ref.current = value\n  return ref\n}\n\nexport function useHeaderBackgroundColor() {\n  const theme = useTheme()\n  return theme.dark && theme.mode === 'adaptive'\n    ? overlay(4, theme.colors.surface)\n    : theme.colors.primary\n}\n\nexport function useHeaderColorIsLight() {\n  const theme = useTheme()\n  const background =\n    theme.dark && theme.mode === 'adaptive'\n      ? theme.colors.surface\n      : theme.colors.primary\n  return Color(background).isLight()\n}\n\nexport function useHeaderTextColor() {\n  const isLight = useHeaderColorIsLight()\n  return !isLight ? '#fff' : '#000'\n}\n\nexport function useTextColorOnPrimary() {\n  const theme = useTheme()\n  const isDark = !Color(theme.colors.primary).isLight()\n  return isDark ? '#fff' : '#000'\n}\n\nexport function range(start: number, end: number) {\n  return Array(end - start + 1)\n    .fill(null)\n    .map((_, i) => start + i)\n}\n\nexport function lightenBy(color: Color, ratio: number) {\n  const lightness = color.lightness()\n  return color.lightness(lightness + (100 - lightness) * ratio)\n}\n\nexport function darkenBy(color: Color, ratio: number) {\n  const lightness = color.lightness()\n  return color.lightness(lightness - lightness * ratio)\n}\n"],"mappings":";;;;;;;;;;;;;;AAAA;;AACA;;AAMA;;;;;;;;AAIO,SAASA,SAAT,CAAsBC,KAAtB,EAAgC;EACrC,MAAMC,GAAG,GAAGC,KAAK,CAACC,MAAN,CAAaH,KAAb,CAAZ;EACAC,GAAG,CAACG,OAAJ,GAAcJ,KAAd;EACA,OAAOC,GAAP;AACD;;AAEM,SAASI,wBAAT,GAAoC;EACzC,MAAMC,KAAK,GAAG,IAAAC,0BAAA,GAAd;EACA,OAAOD,KAAK,CAACE,IAAN,IAAcF,KAAK,CAACG,IAAN,KAAe,UAA7B,GACH,IAAAC,yBAAA,EAAQ,CAAR,EAAWJ,KAAK,CAACK,MAAN,CAAaC,OAAxB,CADG,GAEHN,KAAK,CAACK,MAAN,CAAaE,OAFjB;AAGD;;AAEM,SAASC,qBAAT,GAAiC;EACtC,MAAMR,KAAK,GAAG,IAAAC,0BAAA,GAAd;EACA,MAAMQ,UAAU,GACdT,KAAK,CAACE,IAAN,IAAcF,KAAK,CAACG,IAAN,KAAe,UAA7B,GACIH,KAAK,CAACK,MAAN,CAAaC,OADjB,GAEIN,KAAK,CAACK,MAAN,CAAaE,OAHnB;EAIA,OAAO,IAAAG,cAAA,EAAMD,UAAN,EAAkBE,OAAlB,EAAP;AACD;;AAEM,SAASC,kBAAT,GAA8B;EACnC,MAAMD,OAAO,GAAGH,qBAAqB,EAArC;EACA,OAAO,CAACG,OAAD,GAAW,MAAX,GAAoB,MAA3B;AACD;;AAEM,SAASE,qBAAT,GAAiC;EACtC,MAAMb,KAAK,GAAG,IAAAC,0BAAA,GAAd;EACA,MAAMa,MAAM,GAAG,CAAC,IAAAJ,cAAA,EAAMV,KAAK,CAACK,MAAN,CAAaE,OAAnB,EAA4BI,OAA5B,EAAhB;EACA,OAAOG,MAAM,GAAG,MAAH,GAAY,MAAzB;AACD;;AAEM,SAASC,KAAT,CAAeC,KAAf,EAA8BC,GAA9B,EAA2C;EAChD,OAAOC,KAAK,CAACD,GAAG,GAAGD,KAAN,GAAc,CAAf,CAAL,CACJG,IADI,CACC,IADD,EAEJC,GAFI,CAEA,CAACC,CAAD,EAAIC,CAAJ,KAAUN,KAAK,GAAGM,CAFlB,CAAP;AAGD;;AAEM,SAASC,SAAT,CAAmBC,KAAnB,EAAiCC,KAAjC,EAAgD;EACrD,MAAMC,SAAS,GAAGF,KAAK,CAACE,SAAN,EAAlB;EACA,OAAOF,KAAK,CAACE,SAAN,CAAgBA,SAAS,GAAG,CAAC,MAAMA,SAAP,IAAoBD,KAAhD,CAAP;AACD;;AAEM,SAASE,QAAT,CAAkBH,KAAlB,EAAgCC,KAAhC,EAA+C;EACpD,MAAMC,SAAS,GAAGF,KAAK,CAACE,SAAN,EAAlB;EACA,OAAOF,KAAK,CAACE,SAAN,CAAgBA,SAAS,GAAGA,SAAS,GAAGD,KAAxC,CAAP;AACD"}
+{"version":3,"names":["useLatest","value","ref","React","useRef","current","useHeaderBackgroundColor","theme","useTheme","dark","mode","overlay","colors","surface","primary","useHeaderColorIsLight","background","Color","isLight","useHeaderTextColor","useTextColorOnPrimary","isDark","isV3","onSurface","onPrimary","range","start","end","Array","fill","map","_","i","lightenBy","color","ratio","lightness","darkenBy"],"sources":["utils.ts"],"sourcesContent":["import * as React from 'react'\nimport {\n  DefaultTheme,\n  MD3DarkTheme,\n  overlay,\n  useTheme,\n} from 'react-native-paper'\nimport Color from 'color'\n\nexport type PaperTheme = typeof MD3DarkTheme | typeof DefaultTheme\n\nexport function useLatest<T>(value: T) {\n  const ref = React.useRef(value)\n  ref.current = value\n  return ref\n}\n\nexport function useHeaderBackgroundColor() {\n  const theme = useTheme()\n  return theme.dark && theme.mode === 'adaptive'\n    ? overlay(4, theme.colors.surface)\n    : theme.colors.primary\n}\n\nexport function useHeaderColorIsLight() {\n  const theme = useTheme()\n  const background =\n    theme.dark && theme.mode === 'adaptive'\n      ? theme.colors.surface\n      : theme.colors.primary\n  return Color(background).isLight()\n}\n\nexport function useHeaderTextColor() {\n  const isLight = useHeaderColorIsLight()\n  return !isLight ? '#fff' : '#000'\n}\n\nexport function useTextColorOnPrimary() {\n  const theme = useTheme()\n  const isDark = !Color(theme.colors.primary).isLight()\n\n  if (theme.isV3) {\n    if (isDark && theme.dark) {\n      return theme.colors.onSurface\n    } else {\n      return theme.colors.onPrimary\n    }\n  }\n\n  return isDark ? '#fff' : '#000'\n}\n\nexport function range(start: number, end: number) {\n  return Array(end - start + 1)\n    .fill(null)\n    .map((_, i) => start + i)\n}\n\nexport function lightenBy(color: Color, ratio: number) {\n  const lightness = color.lightness()\n  return color.lightness(lightness + (100 - lightness) * ratio)\n}\n\nexport function darkenBy(color: Color, ratio: number) {\n  const lightness = color.lightness()\n  return color.lightness(lightness - lightness * ratio)\n}\n"],"mappings":";;;;;;;;;;;;;;AAAA;;AACA;;AAMA;;;;;;;;AAIO,SAASA,SAAT,CAAsBC,KAAtB,EAAgC;EACrC,MAAMC,GAAG,GAAGC,KAAK,CAACC,MAAN,CAAaH,KAAb,CAAZ;EACAC,GAAG,CAACG,OAAJ,GAAcJ,KAAd;EACA,OAAOC,GAAP;AACD;;AAEM,SAASI,wBAAT,GAAoC;EACzC,MAAMC,KAAK,GAAG,IAAAC,0BAAA,GAAd;EACA,OAAOD,KAAK,CAACE,IAAN,IAAcF,KAAK,CAACG,IAAN,KAAe,UAA7B,GACH,IAAAC,yBAAA,EAAQ,CAAR,EAAWJ,KAAK,CAACK,MAAN,CAAaC,OAAxB,CADG,GAEHN,KAAK,CAACK,MAAN,CAAaE,OAFjB;AAGD;;AAEM,SAASC,qBAAT,GAAiC;EACtC,MAAMR,KAAK,GAAG,IAAAC,0BAAA,GAAd;EACA,MAAMQ,UAAU,GACdT,KAAK,CAACE,IAAN,IAAcF,KAAK,CAACG,IAAN,KAAe,UAA7B,GACIH,KAAK,CAACK,MAAN,CAAaC,OADjB,GAEIN,KAAK,CAACK,MAAN,CAAaE,OAHnB;EAIA,OAAO,IAAAG,cAAA,EAAMD,UAAN,EAAkBE,OAAlB,EAAP;AACD;;AAEM,SAASC,kBAAT,GAA8B;EACnC,MAAMD,OAAO,GAAGH,qBAAqB,EAArC;EACA,OAAO,CAACG,OAAD,GAAW,MAAX,GAAoB,MAA3B;AACD;;AAEM,SAASE,qBAAT,GAAiC;EACtC,MAAMb,KAAK,GAAG,IAAAC,0BAAA,GAAd;EACA,MAAMa,MAAM,GAAG,CAAC,IAAAJ,cAAA,EAAMV,KAAK,CAACK,MAAN,CAAaE,OAAnB,EAA4BI,OAA5B,EAAhB;;EAEA,IAAIX,KAAK,CAACe,IAAV,EAAgB;IACd,IAAID,MAAM,IAAId,KAAK,CAACE,IAApB,EAA0B;MACxB,OAAOF,KAAK,CAACK,MAAN,CAAaW,SAApB;IACD,CAFD,MAEO;MACL,OAAOhB,KAAK,CAACK,MAAN,CAAaY,SAApB;IACD;EACF;;EAED,OAAOH,MAAM,GAAG,MAAH,GAAY,MAAzB;AACD;;AAEM,SAASI,KAAT,CAAeC,KAAf,EAA8BC,GAA9B,EAA2C;EAChD,OAAOC,KAAK,CAACD,GAAG,GAAGD,KAAN,GAAc,CAAf,CAAL,CACJG,IADI,CACC,IADD,EAEJC,GAFI,CAEA,CAACC,CAAD,EAAIC,CAAJ,KAAUN,KAAK,GAAGM,CAFlB,CAAP;AAGD;;AAEM,SAASC,SAAT,CAAmBC,KAAnB,EAAiCC,KAAjC,EAAgD;EACrD,MAAMC,SAAS,GAAGF,KAAK,CAACE,SAAN,EAAlB;EACA,OAAOF,KAAK,CAACE,SAAN,CAAgBA,SAAS,GAAG,CAAC,MAAMA,SAAP,IAAoBD,KAAhD,CAAP;AACD;;AAEM,SAASE,QAAT,CAAkBH,KAAlB,EAAgCC,KAAhC,EAA+C;EACpD,MAAMC,SAAS,GAAGF,KAAK,CAACE,SAAN,EAAlB;EACA,OAAOF,KAAK,CAACE,SAAN,CAAgBA,SAAS,GAAGA,SAAS,GAAGD,KAAxC,CAAP;AACD"}

package/lib/module/Time/AmPmSwitcher.js

@@ -3,12 +3,13 @@ import { View, StyleSheet } from 'react-native';
 import { Text, TouchableRipple, useTheme } from 'react-native-paper';
 import { useMemo } from 'react';
 import Color from 'color';
-import { useSwitchColors } from './timeUtils';
+import { inputTypes, useSwitchColors } from './timeUtils';
 import { DisplayModeContext } from './TimePicker';
 export default function AmPmSwitcher(_ref) {
   let {
     onChange,
-    hours
+    hours,
+    inputType
   } = _ref;
   const {
     setMode,
@@ -16,17 +17,20 @@ export default function AmPmSwitcher(_ref) {
   } = React.useContext(DisplayModeContext);
   const theme = useTheme();
   const backgroundColor = useMemo(() => {
-    if (theme.dark) {
-      return Color(theme.colors.surface).lighten(1.2).hex();
+    if (theme.isV3) {
+      return theme.colors.outline;
     }
 
-    return Color(theme.isV3 ? theme.colors.inverseOnSurface : theme.colors.surface).darken(0.1).hex();
+    return Color(theme.dark ? Color(theme.colors.surface).lighten(1.2).hex() : theme.colors.surface).darken(0.1).hex();
   }, [theme]);
   const isAM = mode === 'AM';
   return /*#__PURE__*/React.createElement(View, {
-    style: [styles.root, {
+    style: [styles.root, // eslint-disable-next-line react-native/no-inline-styles
+    {
       borderColor: backgroundColor,
-      borderRadius: theme.roundness
+      borderRadius: theme.roundness * 2,
+      height: inputType === inputTypes.keyboard ? 72 : 80,
+      marginBottom: inputType === 'keyboard' ? 24 : 0
     }]
   }, /*#__PURE__*/React.createElement(SwitchButton, {
     label: "AM",
@@ -69,7 +73,7 @@ function SwitchButton(_ref2) {
     backgroundColor,
     color
   } = useSwitchColors(selected);
-  let textFont = theme !== null && theme !== void 0 && theme.isV3 ? theme.fonts.bodyMedium : theme.fonts.medium;
+  let textFont = theme !== null && theme !== void 0 && theme.isV3 ? theme.fonts.titleMedium : theme.fonts.medium;
   return /*#__PURE__*/React.createElement(TouchableRipple, {
     onPress: onPress,
     style: styles.switchButton,
@@ -97,14 +101,13 @@ function SwitchButton(_ref2) {
 
 const styles = StyleSheet.create({
   root: {
-    width: 50,
-    height: 80,
+    width: 52,
     borderWidth: 1,
     overflow: 'hidden'
   },
   switchSeparator: {
     height: 1,
-    width: 48
+    width: 52
   },
   switchButton: {
     flex: 1

package/lib/module/Time/AmPmSwitcher.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","StyleSheet","Text","TouchableRipple","useTheme","useMemo","Color","useSwitchColors","DisplayModeContext","AmPmSwitcher","onChange","hours","setMode","mode","useContext","theme","backgroundColor","dark","colors","surface","lighten","hex","isV3","inverseOnSurface","darken","isAM","styles","root","borderColor","borderRadius","roundness","switchSeparator","SwitchButton","label","onPress","selected","disabled","color","textFont","fonts","bodyMedium","medium","switchButton","switchButtonInner","create","width","height","borderWidth","overflow","flex","alignItems","justifyContent"],"sources":["AmPmSwitcher.tsx"],"sourcesContent":["import * as React from 'react'\nimport { View, StyleSheet } from 'react-native'\nimport { MD2Theme, Text, TouchableRipple, useTheme } from 'react-native-paper'\nimport { useMemo } from 'react'\nimport Color from 'color'\nimport { useSwitchColors } from './timeUtils'\nimport { DisplayModeContext } from './TimePicker'\n\nexport default function AmPmSwitcher({\n  onChange,\n  hours,\n}: {\n  hours: number\n  onChange: (newHours: number) => any\n}) {\n  const { setMode, mode } = React.useContext(DisplayModeContext)\n  const theme = useTheme()\n  const backgroundColor = useMemo<string>(() => {\n    if (theme.dark) {\n      return Color(theme.colors.surface).lighten(1.2).hex()\n    }\n    return Color(\n      theme.isV3 ? theme.colors.inverseOnSurface : theme.colors.surface\n    )\n      .darken(0.1)\n      .hex()\n  }, [theme])\n\n  const isAM = mode === 'AM'\n  return (\n    <View\n      style={[\n        styles.root,\n        {\n          borderColor: backgroundColor,\n          borderRadius: theme.roundness,\n        },\n      ]}\n    >\n      <SwitchButton\n        label=\"AM\"\n        onPress={() => {\n          setMode('AM')\n          if (hours - 12 >= 0) {\n            onChange(hours - 12)\n          }\n        }}\n        selected={isAM}\n        disabled={isAM}\n      />\n      <View style={[styles.switchSeparator, { backgroundColor }]} />\n      <SwitchButton\n        label=\"PM\"\n        onPress={() => {\n          setMode('PM')\n          if (hours + 12 <= 24) {\n            onChange(hours + 12)\n          }\n        }}\n        selected={!isAM}\n        disabled={!isAM}\n      />\n    </View>\n  )\n}\n\nfunction SwitchButton({\n  label,\n  onPress,\n  selected,\n  disabled,\n}: {\n  label: string\n  onPress: (() => any) | undefined\n  selected: boolean\n  disabled: boolean\n}) {\n  const theme = useTheme()\n  const { backgroundColor, color } = useSwitchColors(selected)\n\n  let textFont = theme?.isV3\n    ? theme.fonts.bodyMedium\n    : (theme as any as MD2Theme).fonts.medium\n\n  return (\n    <TouchableRipple\n      onPress={onPress}\n      style={styles.switchButton}\n      accessibilityLabel={label}\n      // @ts-ignore old React Native versions\n      accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}\n      // @ts-ignore old React Native versions\n      accessibilityComponentType=\"button\"\n      accessibilityRole=\"button\"\n      accessibilityState={{ disabled }}\n      disabled={disabled}\n    >\n      <View style={[styles.switchButtonInner, { backgroundColor }]}>\n        <Text\n          selectable={false}\n          style={[\n            {\n              ...textFont,\n              color: color,\n            },\n          ]}\n        >\n          {label}\n        </Text>\n      </View>\n    </TouchableRipple>\n  )\n}\n\nconst styles = StyleSheet.create({\n  root: {\n    width: 50,\n    height: 80,\n    borderWidth: 1,\n    overflow: 'hidden',\n  },\n  switchSeparator: {\n    height: 1,\n    width: 48,\n  },\n  switchButton: {\n    flex: 1,\n  },\n  switchButtonInner: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n})\n"],"mappings":"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"}
+{"version":3,"names":["React","View","StyleSheet","Text","TouchableRipple","useTheme","useMemo","Color","inputTypes","useSwitchColors","DisplayModeContext","AmPmSwitcher","onChange","hours","inputType","setMode","mode","useContext","theme","backgroundColor","isV3","colors","outline","dark","surface","lighten","hex","darken","isAM","styles","root","borderColor","borderRadius","roundness","height","keyboard","marginBottom","switchSeparator","SwitchButton","label","onPress","selected","disabled","color","textFont","fonts","titleMedium","medium","switchButton","switchButtonInner","create","width","borderWidth","overflow","flex","alignItems","justifyContent"],"sources":["AmPmSwitcher.tsx"],"sourcesContent":["import * as React from 'react'\nimport { View, StyleSheet } from 'react-native'\nimport { MD2Theme, Text, TouchableRipple, useTheme } from 'react-native-paper'\nimport { useMemo } from 'react'\nimport Color from 'color'\nimport { inputTypes, PossibleInputTypes, useSwitchColors } from './timeUtils'\nimport { DisplayModeContext } from './TimePicker'\n\nexport default function AmPmSwitcher({\n  onChange,\n  hours,\n  inputType,\n}: {\n  hours: number\n  onChange: (newHours: number) => any\n  inputType: PossibleInputTypes\n}) {\n  const { setMode, mode } = React.useContext(DisplayModeContext)\n  const theme = useTheme()\n  const backgroundColor = useMemo<string>(() => {\n    if (theme.isV3) {\n      return theme.colors.outline\n    }\n    return Color(\n      theme.dark\n        ? Color(theme.colors.surface).lighten(1.2).hex()\n        : theme.colors.surface\n    )\n      .darken(0.1)\n      .hex()\n  }, [theme])\n\n  const isAM = mode === 'AM'\n  return (\n    <View\n      style={[\n        styles.root,\n        // eslint-disable-next-line react-native/no-inline-styles\n        {\n          borderColor: backgroundColor,\n          borderRadius: theme.roundness * 2,\n          height: inputType === inputTypes.keyboard ? 72 : 80,\n          marginBottom: inputType === 'keyboard' ? 24 : 0,\n        },\n      ]}\n    >\n      <SwitchButton\n        label=\"AM\"\n        onPress={() => {\n          setMode('AM')\n          if (hours - 12 >= 0) {\n            onChange(hours - 12)\n          }\n        }}\n        selected={isAM}\n        disabled={isAM}\n      />\n      <View style={[styles.switchSeparator, { backgroundColor }]} />\n      <SwitchButton\n        label=\"PM\"\n        onPress={() => {\n          setMode('PM')\n          if (hours + 12 <= 24) {\n            onChange(hours + 12)\n          }\n        }}\n        selected={!isAM}\n        disabled={!isAM}\n      />\n    </View>\n  )\n}\n\nfunction SwitchButton({\n  label,\n  onPress,\n  selected,\n  disabled,\n}: {\n  label: string\n  onPress: (() => any) | undefined\n  selected: boolean\n  disabled: boolean\n}) {\n  const theme = useTheme()\n  const { backgroundColor, color } = useSwitchColors(selected)\n\n  let textFont = theme?.isV3\n    ? theme.fonts.titleMedium\n    : (theme as any as MD2Theme).fonts.medium\n\n  return (\n    <TouchableRipple\n      onPress={onPress}\n      style={styles.switchButton}\n      accessibilityLabel={label}\n      // @ts-ignore old React Native versions\n      accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}\n      // @ts-ignore old React Native versions\n      accessibilityComponentType=\"button\"\n      accessibilityRole=\"button\"\n      accessibilityState={{ disabled }}\n      disabled={disabled}\n    >\n      <View style={[styles.switchButtonInner, { backgroundColor }]}>\n        <Text\n          selectable={false}\n          style={[\n            {\n              ...textFont,\n              color: color,\n            },\n          ]}\n        >\n          {label}\n        </Text>\n      </View>\n    </TouchableRipple>\n  )\n}\n\nconst styles = StyleSheet.create({\n  root: {\n    width: 52,\n    borderWidth: 1,\n    overflow: 'hidden',\n  },\n  switchSeparator: {\n    height: 1,\n    width: 52,\n  },\n  switchButton: {\n    flex: 1,\n  },\n  switchButtonInner: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n})\n"],"mappings":"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"}

package/lib/module/Time/AnalogClock.js

@@ -96,7 +96,7 @@ function AnalogClock(_ref) {
     ref: clockRef
   }, panResponder.panHandlers, {
     style: [styles.clock, {
-      backgroundColor: theme.dark ? Color(theme.colors.surface).lighten(1.4).hex() : theme.isV3 ? Color(theme.colors.outline).lighten(0.9).hex() : Color(theme.colors.surface).darken(0.1).hex()
+      backgroundColor: theme.isV3 ? theme.colors.surfaceVariant : theme.dark ? Color(theme.colors.surface).lighten(1.4).hex() : Color(theme.colors.surface).darken(0.1).hex()
     }] // @ts-ignore -> https://github.com/necolas/react-native-web/issues/506
     ,
     cursor: 'pointer'
@@ -106,7 +106,7 @@ function AnalogClock(_ref) {
       transform: [{
         rotate: -90 + pointerNumber * degreesPerNumber + 'deg'
       }, {
-        translateX: circleSize / 4 - 4 - dynamicSize / 2
+        translateX: circleSize / 4 - (focused === clockTypes.hours && pointerNumber >= 0 && pointerNumber < 13 ? 0 : 4) + (focused === clockTypes.minutes ? 4 : 0) - dynamicSize / 2
       }],
       width: circleSize / 2 - 4 - dynamicSize
     }],
@@ -153,16 +153,15 @@ const styles = StyleSheet.create({
     alignItems: 'center'
   },
   endPoint: {
-    borderRadius: 15,
-    height: 30,
-    width: 30,
+    borderRadius: 24,
+    height: 48,
+    width: 48,
     position: 'absolute',
     right: 0,
-    bottom: -14
+    bottom: -23
   },
   line: {
     position: 'absolute',
-    marginBottom: -1,
     height: 2,
     borderRadius: 4
   }