@tecsinapse/react-core 1.22.8 → 2.0.0

package/dist/cjs/components/molecules/DatePicker/DatePicker.js

@@ -12,8 +12,7 @@ require('../../atoms/Input/PressableInputContainer/styled.js');
 var HintInputContainer = require('../HintInputContainer/HintInputContainer.js');
 var styled = require('./styled.js');
 
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
+function _interopNamespaceDefault(e) {
   var n = Object.create(null);
   if (e) {
     Object.keys(e).forEach(function (k) {
@@ -26,13 +25,14 @@ function _interopNamespace(e) {
       }
     });
   }
-  n["default"] = e;
+  n.default = e;
   return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 function DatePicker({
+  /** DatePicker props */
   month,
   year,
   onChange,
@@ -92,34 +92,34 @@ function DatePicker({
       lowest && highest && setTimeout(requestCloseCalendar, 200);
     }
   }, [value, closeOnPick, type, requestCloseCalendar]);
-  const calendar = /* @__PURE__ */ React__namespace.createElement(CalendarComponent, {
-    pointerEvents: "box-none",
-    type,
-    value,
-    month,
-    year,
-    onChange,
-    locale
-  });
-  return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, controlComponent ? controlComponent(handleShowCalendar, getDisplayValue()) : /* @__PURE__ */ React__namespace.createElement(HintInputContainer, {
-    focused,
-    viewStyle: style,
-    onPress: handleShowCalendar,
-    disabled,
-    hintComponent,
-    LabelComponent: TextComponent,
-    variant,
-    hint,
-    rightComponent: /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(styled.CalendarIcon, {
-      name: "calendar-sharp",
-      type: "ionicon",
-      size: "centi"
-    }), rightComponent),
-    ...rest
-  }, /* @__PURE__ */ React__namespace.createElement(StyledText, {
-    fontWeight: "bold",
-    disabled
-  }, getDisplayValue() || " ")), renderCalendar(calendar, handleBlur));
+  const calendar = /* @__PURE__ */ React__namespace.createElement(
+    CalendarComponent,
+    {
+      pointerEvents: "box-none",
+      type,
+      value,
+      month,
+      year,
+      onChange,
+      locale
+    }
+  );
+  return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, controlComponent ? controlComponent(handleShowCalendar, getDisplayValue()) : /* @__PURE__ */ React__namespace.createElement(
+    HintInputContainer,
+    {
+      focused,
+      viewStyle: style,
+      onPress: handleShowCalendar,
+      disabled,
+      hintComponent,
+      LabelComponent: TextComponent,
+      variant,
+      hint,
+      rightComponent: /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(styled.CalendarIcon, { name: "calendar-sharp", type: "ionicon", size: "centi" }), rightComponent),
+      ...rest
+    },
+    /* @__PURE__ */ React__namespace.createElement(StyledText, { fontWeight: "bold", disabled }, getDisplayValue() || " ")
+  ), renderCalendar(calendar, handleBlur));
 }
 
 module.exports = DatePicker;

package/dist/cjs/components/molecules/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sources":["../../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarProps, DateRange, SelectionType } from '../Calendar';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { CalendarIcon, getStyledTextComponent } from './styled';\n\nexport interface DatePickerProps<T extends SelectionType>\n  extends InputContainerProps,\n    Omit<CalendarProps<T>, 'style'> {\n  controlComponent?: (\n    onPress: () => void,\n    displayValue?: string\n  ) => JSX.Element;\n  TextComponent?: React.FC<TextProps>;\n  CalendarComponent: React.FC<CalendarProps<T>>;\n  placeholder?: string;\n  onFocus?: () => void | never;\n  onBlur?: () => void | never;\n  format?: string;\n  closeOnPick?: boolean;\n  renderCalendar: (\n    calendar: React.ReactElement,\n    blur?: () => void\n  ) => JSX.Element | null;\n  requestShowCalendar: () => void;\n  requestCloseCalendar: () => void;\n}\n\nfunction DatePicker<T extends SelectionType>({\n  /** DatePicker props */\n  month,\n  year,\n  onChange,\n  value,\n  type,\n  format = 'yyyy-MM-dd',\n  placeholder,\n  onFocus,\n  onBlur,\n  disabled,\n  controlComponent,\n  hintComponent,\n  hint,\n  variant,\n  TextComponent = Text,\n  CalendarComponent,\n  rightComponent,\n  style,\n  locale,\n  closeOnPick = false,\n  renderCalendar,\n  requestShowCalendar,\n  requestCloseCalendar,\n  ...rest\n}: DatePickerProps<T>): JSX.Element {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  const handleShowCalendar = React.useCallback(() => {\n    requestShowCalendar();\n    handleFocus();\n  }, [handleFocus, requestShowCalendar]);\n\n  const getDisplayValue = () => {\n    if (!value) return placeholder;\n    if (type === 'day') {\n      return formatDate(value as Date, format, { locale: locale });\n    } else {\n      const { lowest, highest } = value as DateRange;\n      if (highest)\n        return `${formatDate(lowest, format, {\n          locale: locale,\n        })} - ${formatDate(highest, format, { locale: locale })}`;\n      else return formatDate(lowest, format, { locale: locale });\n    }\n  };\n\n  const StyledText = getStyledTextComponent(TextComponent);\n\n  useEffect(() => {\n    if (closeOnPick && value && type === 'day') {\n      setTimeout(requestCloseCalendar, 200);\n    }\n    if (closeOnPick && value && type === 'range') {\n      const { lowest, highest } = value as DateRange;\n      lowest && highest && setTimeout(requestCloseCalendar, 200);\n    }\n  }, [value, closeOnPick, type, requestCloseCalendar]);\n\n  const calendar = (\n    <CalendarComponent\n      pointerEvents={'box-none'}\n      type={type}\n      value={value}\n      month={month}\n      year={year}\n      onChange={onChange}\n      locale={locale}\n    />\n  );\n\n  return (\n    <>\n      {controlComponent ? (\n        controlComponent(handleShowCalendar, getDisplayValue())\n      ) : (\n        <HintInputContainer\n          focused={focused}\n          viewStyle={style}\n          onPress={handleShowCalendar}\n          disabled={disabled}\n          hintComponent={hintComponent}\n          LabelComponent={TextComponent}\n          variant={variant}\n          hint={hint}\n          rightComponent={\n            <>\n              <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n              {rightComponent}\n            </>\n          }\n          {...rest}\n        >\n          <StyledText fontWeight=\"bold\" disabled={disabled}>\n            {getDisplayValue() || ' '}\n          </StyledText>\n        </HintInputContainer>\n      )}\n      {renderCalendar(calendar, handleBlur)}\n    </>\n  );\n}\n\nexport default DatePicker;\n"],"names":["useInputFocus","React","formatDate","getStyledTextComponent","useEffect","CalendarIcon"],"mappings":"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"}
+{"version":3,"file":"DatePicker.js","sources":["../../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarProps, DateRange, SelectionType } from '../Calendar';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { CalendarIcon, getStyledTextComponent } from './styled';\n\nexport interface DatePickerProps<T extends SelectionType>\n  extends InputContainerProps,\n    Omit<CalendarProps<T>, 'style'> {\n  controlComponent?: (\n    onPress: () => void,\n    displayValue?: string\n  ) => JSX.Element;\n  TextComponent?: React.FC<TextProps>;\n  CalendarComponent: React.FC<CalendarProps<T>>;\n  placeholder?: string;\n  onFocus?: () => void | never;\n  onBlur?: () => void | never;\n  format?: string;\n  closeOnPick?: boolean;\n  renderCalendar: (\n    calendar: React.ReactElement,\n    blur?: () => void\n  ) => JSX.Element | null;\n  requestShowCalendar: () => void;\n  requestCloseCalendar: () => void;\n}\n\nfunction DatePicker<T extends SelectionType>({\n  /** DatePicker props */\n  month,\n  year,\n  onChange,\n  value,\n  type,\n  format = 'yyyy-MM-dd',\n  placeholder,\n  onFocus,\n  onBlur,\n  disabled,\n  controlComponent,\n  hintComponent,\n  hint,\n  variant,\n  TextComponent = Text,\n  CalendarComponent,\n  rightComponent,\n  style,\n  locale,\n  closeOnPick = false,\n  renderCalendar,\n  requestShowCalendar,\n  requestCloseCalendar,\n  ...rest\n}: DatePickerProps<T>): JSX.Element {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  const handleShowCalendar = React.useCallback(() => {\n    requestShowCalendar();\n    handleFocus();\n  }, [handleFocus, requestShowCalendar]);\n\n  const getDisplayValue = () => {\n    if (!value) return placeholder;\n    if (type === 'day') {\n      return formatDate(value as Date, format, { locale: locale });\n    } else {\n      const { lowest, highest } = value as DateRange;\n      if (highest)\n        return `${formatDate(lowest, format, {\n          locale: locale,\n        })} - ${formatDate(highest, format, { locale: locale })}`;\n      else return formatDate(lowest, format, { locale: locale });\n    }\n  };\n\n  const StyledText = getStyledTextComponent(TextComponent);\n\n  useEffect(() => {\n    if (closeOnPick && value && type === 'day') {\n      setTimeout(requestCloseCalendar, 200);\n    }\n    if (closeOnPick && value && type === 'range') {\n      const { lowest, highest } = value as DateRange;\n      lowest && highest && setTimeout(requestCloseCalendar, 200);\n    }\n  }, [value, closeOnPick, type, requestCloseCalendar]);\n\n  const calendar = (\n    <CalendarComponent\n      pointerEvents={'box-none'}\n      type={type}\n      value={value}\n      month={month}\n      year={year}\n      onChange={onChange}\n      locale={locale}\n    />\n  );\n\n  return (\n    <>\n      {controlComponent ? (\n        controlComponent(handleShowCalendar, getDisplayValue())\n      ) : (\n        <HintInputContainer\n          focused={focused}\n          viewStyle={style}\n          onPress={handleShowCalendar}\n          disabled={disabled}\n          hintComponent={hintComponent}\n          LabelComponent={TextComponent}\n          variant={variant}\n          hint={hint}\n          rightComponent={\n            <>\n              <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n              {rightComponent}\n            </>\n          }\n          {...rest}\n        >\n          <StyledText fontWeight=\"bold\" disabled={disabled}>\n            {getDisplayValue() || ' '}\n          </StyledText>\n        </HintInputContainer>\n      )}\n      {renderCalendar(calendar, handleBlur)}\n    </>\n  );\n}\n\nexport default DatePicker;\n"],"names":["useInputFocus","React","formatDate","getStyledTextComponent","useEffect","CalendarIcon"],"mappings":"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"}

package/dist/cjs/components/molecules/DatePicker/styled.d.ts

@@ -2,14 +2,10 @@ import { FC } from 'react';
 import { InputContainerProps } from '../../atoms/Input';
 import { TextProps } from '../../atoms/Text';
 export declare const getStyledTextComponent: (component: FC<TextProps>) => import("@emotion/native").StyledComponent<TextProps & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & Partial<InputContainerProps> & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {}>;
 export declare const CalendarIcon: import("@emotion/native").StyledComponent<import("../../atoms/Icon").IconProps & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {}>;

package/dist/cjs/components/molecules/DatePicker/styled.js

@@ -1,7 +1,5 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var styled = require('@emotion/native');
 var Icon = require('../../atoms/Icon/Icon.js');
 require('react');
@@ -12,19 +10,15 @@ require('../../atoms/Input/InputElement/InputElement.js');
 require('../../atoms/Input/InputMaskElement/InputMaskElement.js');
 require('../../atoms/Input/PressableInputContainer/styled.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
 const getStyledTextComponent = (component) => {
-  return styled__default["default"](component)(
+  return styled(component)(
     (props) => styled.css`
       line-height: ${props.theme?.typography.h5.lineHeight};
       ${styled$1.disabledInputStyles(props)}
     `
   );
 };
-const CalendarIcon = styled__default["default"](Icon)`
+const CalendarIcon = styled(Icon)`
   padding: ${({ theme }) => theme.spacing.centi};
   color: ${({ theme }) => theme.color.secondary.medium};
 `;

package/dist/cjs/components/molecules/DatePicker/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/DatePicker/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { Icon } from '../../atoms/Icon';\nimport { disabledInputStyles, InputContainerProps } from '../../atoms/Input';\nimport { TextProps } from '../../atoms/Text';\n\nexport const getStyledTextComponent = (component: FC<TextProps>) => {\n  return styled(component)(\n    (props: Partial<InputContainerProps> & Partial<StyleProps>) => css`\n      line-height: ${props.theme?.typography.h5.lineHeight};\n      ${disabledInputStyles(props)}\n    `\n  );\n};\n\nexport const CalendarIcon = styled(Icon)<Partial<StyleProps>>`\n  padding: ${({ theme }) => theme.spacing.centi};\n  color: ${({ theme }) => theme.color.secondary.medium};\n`;\n"],"names":["styled","css","disabledInputStyles"],"mappings":";;;;;;;;;;;;;;;;;;AAOa,MAAA,sBAAA,GAAyB,CAAC,SAA6B,KAAA;AAClE,EAAA,OAAOA,2BAAO,SAAS,CAAA;AAAA,IACrB,CAAC,KAA8D,KAAAC,UAAA,CAAA;AAAA,mBAC9C,EAAA,KAAA,CAAM,KAAO,EAAA,UAAA,CAAW,EAAG,CAAA,UAAA,CAAA;AAAA,MAAA,EACxCC,6BAAoB,KAAK,CAAA,CAAA;AAAA,IAAA,CAAA;AAAA,GAE/B,CAAA;AACF,EAAA;AAEa,MAAA,YAAA,GAAeF,2BAAO,IAAI,CAAA,CAAA;AAAA,WAAA,EAC1B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,KAAA,CAAA;AAAA,SAAA,EAC/B,CAAC,EAAE,KAAA,EAAY,KAAA,KAAA,CAAM,MAAM,SAAU,CAAA,MAAA,CAAA;AAAA;;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/DatePicker/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { Icon } from '../../atoms/Icon';\nimport { disabledInputStyles, InputContainerProps } from '../../atoms/Input';\nimport { TextProps } from '../../atoms/Text';\n\nexport const getStyledTextComponent = (component: FC<TextProps>) => {\n  return styled(component)(\n    (props: Partial<InputContainerProps> & Partial<StyleProps>) => css`\n      line-height: ${props.theme?.typography.h5.lineHeight};\n      ${disabledInputStyles(props)}\n    `\n  );\n};\n\nexport const CalendarIcon = styled(Icon)<Partial<StyleProps>>`\n  padding: ${({ theme }) => theme.spacing.centi};\n  color: ${({ theme }) => theme.color.secondary.medium};\n`;\n"],"names":["css","disabledInputStyles"],"mappings":";;;;;;;;;;;;AAOa,MAAA,sBAAA,GAAyB,CAAC,SAA6B,KAAA;AAClE,EAAA,OAAO,OAAO,SAAS,CAAA;AAAA,IACrB,CAAC,KAA8D,KAAAA,UAAA,CAAA;AAAA,mBAC9C,EAAA,KAAA,CAAM,KAAO,EAAA,UAAA,CAAW,EAAG,CAAA,UAAA,CAAA;AAAA,MAAA,EACxCC,6BAAoB,KAAK,CAAA,CAAA;AAAA,IAAA,CAAA;AAAA,GAE/B,CAAA;AACF,EAAA;AAEa,MAAA,YAAA,GAAe,OAAO,IAAI,CAAA,CAAA;AAAA,WAAA,EAC1B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,KAAA,CAAA;AAAA,SAAA,EAC/B,CAAC,EAAE,KAAA,EAAY,KAAA,KAAA,CAAM,MAAM,SAAU,CAAA,MAAA,CAAA;AAAA;;;;;"}

package/dist/cjs/components/molecules/DateTimePicker/DateTimePicker.js

@@ -14,8 +14,7 @@ var DateTimeSelector = require('../DateTimeSelector/DateTimeSelector.js');
 var HintInputContainer = require('../HintInputContainer/HintInputContainer.js');
 var styled$1 = require('./styled.js');
 
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
+function _interopNamespaceDefault(e) {
   var n = Object.create(null);
   if (e) {
     Object.keys(e).forEach(function (k) {
@@ -28,11 +27,11 @@ function _interopNamespace(e) {
       }
     });
   }
-  n["default"] = e;
+  n.default = e;
   return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 const DateTimePicker = ({
   onChange,
@@ -89,46 +88,46 @@ const DateTimePicker = ({
   const StyledDateTimeSelector = styled$1.getStyledDateTimeSelector(
     DateTimeSelectorComponent
   );
-  const dateTimeSelector = /* @__PURE__ */ React__namespace.createElement(StyledDateTimeSelector, {
-    value,
-    mode,
-    format,
-    locale,
-    upperDateThreshold,
-    lowerDateThreshold,
-    offsetThreshold,
-    upperOffsetThreshold,
-    lowerOffsetThreshold,
-    dateModalTitle,
-    timeModalTitle,
-    dateConfirmButtonText,
-    timeConfirmButtonText,
-    dayLabel,
-    monthLabel,
-    yearLabel,
-    hourLabel,
-    minuteLabel,
-    onChange: handleChoosing
-  });
-  return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, controlComponent ? controlComponent(handleShowSelector, displayValue) : /* @__PURE__ */ React__namespace.createElement(HintInputContainer, {
-    focused,
-    viewStyle: style,
-    onPress: handleShowSelector,
-    disabled,
-    LabelComponent: TextComponent,
-    variant,
-    hint,
-    hintComponent,
-    rightComponent: /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(styled.CalendarIcon, {
-      name: "calendar-sharp",
-      type: "ionicon",
-      size: "centi"
-    }), rightComponent),
-    ...rest
-  }, /* @__PURE__ */ React__namespace.createElement(StyledText, {
-    fontWeight: "bold",
-    disabled
-  }, displayValue)), renderSelector(dateTimeSelector, handleBlur));
+  const dateTimeSelector = /* @__PURE__ */ React__namespace.createElement(
+    StyledDateTimeSelector,
+    {
+      value,
+      mode,
+      format,
+      locale,
+      upperDateThreshold,
+      lowerDateThreshold,
+      offsetThreshold,
+      upperOffsetThreshold,
+      lowerOffsetThreshold,
+      dateModalTitle,
+      timeModalTitle,
+      dateConfirmButtonText,
+      timeConfirmButtonText,
+      dayLabel,
+      monthLabel,
+      yearLabel,
+      hourLabel,
+      minuteLabel,
+      onChange: handleChoosing
+    }
+  );
+  return /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, controlComponent ? controlComponent(handleShowSelector, displayValue) : /* @__PURE__ */ React__namespace.createElement(
+    HintInputContainer,
+    {
+      focused,
+      viewStyle: style,
+      onPress: handleShowSelector,
+      disabled,
+      LabelComponent: TextComponent,
+      variant,
+      hint,
+      hintComponent,
+      rightComponent: /* @__PURE__ */ React__namespace.createElement(React__namespace.Fragment, null, /* @__PURE__ */ React__namespace.createElement(styled.CalendarIcon, { name: "calendar-sharp", type: "ionicon", size: "centi" }), rightComponent),
+      ...rest
+    },
+    /* @__PURE__ */ React__namespace.createElement(StyledText, { fontWeight: "bold", disabled }, displayValue)
+  ), renderSelector(dateTimeSelector, handleBlur));
 };
 
 module.exports = DateTimePicker;

package/dist/cjs/components/molecules/DateTimePicker/DateTimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.js","sources":["../../../../../src/components/molecules/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarIcon, getStyledTextComponent } from '../DatePicker/styled';\nimport { DateTimeSelector, DateTimeSelectorProps } from '../DateTimeSelector';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { getStyledDateTimeSelector } from './styled';\n\nexport interface DateTimePickerProps\n  extends InputContainerProps,\n    Omit<DateTimeSelectorProps, 'style'> {\n  controlComponent?: (\n    onPress: () => void,\n    displayValue?: string\n  ) => JSX.Element;\n  TextComponent?: React.FC<TextProps>;\n  DateTimeSelectorComponent: React.FC<DateTimeSelectorProps>;\n  placeholder?: string;\n  onFocus?: () => void | never;\n  onBlur?: () => void | never;\n  renderSelector: (\n    selector: React.ReactElement,\n    blur?: () => void\n  ) => JSX.Element | null;\n  requestShowSelector: () => void;\n  requestCloseSelector: () => void;\n}\n\nconst DateTimePicker: React.FC<DateTimePickerProps> = ({\n  onChange,\n  value,\n  mode = 'date',\n  format = 'yyyy-MM-dd hh:mm:ss',\n  locale,\n  upperDateThreshold,\n  lowerDateThreshold,\n  offsetThreshold,\n  upperOffsetThreshold,\n  lowerOffsetThreshold,\n  dateModalTitle,\n  timeModalTitle,\n  dateConfirmButtonText,\n  timeConfirmButtonText,\n  dayLabel,\n  monthLabel,\n  yearLabel,\n  hourLabel,\n  minuteLabel,\n  placeholder,\n  onFocus,\n  onBlur,\n  disabled,\n  controlComponent,\n  hintComponent,\n  hint,\n  variant = 'default',\n  TextComponent = Text,\n  DateTimeSelectorComponent = DateTimeSelector,\n  rightComponent,\n  style,\n  renderSelector,\n  requestShowSelector,\n  requestCloseSelector,\n  ...rest\n}) => {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  const handleShowSelector = () => {\n    requestShowSelector();\n    handleFocus();\n  };\n\n  const handleChoosing = (value: Date) => {\n    onChange?.(value);\n    requestCloseSelector();\n  };\n\n  const StyledText = getStyledTextComponent(TextComponent);\n  const displayValue =\n    (value ? formatDate(value, format, { locale: locale }) : placeholder) ||\n    ' ';\n  const StyledDateTimeSelector = getStyledDateTimeSelector(\n    DateTimeSelectorComponent\n  );\n\n  const dateTimeSelector = (\n    <StyledDateTimeSelector\n      value={value}\n      mode={mode}\n      format={format}\n      locale={locale}\n      upperDateThreshold={upperDateThreshold}\n      lowerDateThreshold={lowerDateThreshold}\n      offsetThreshold={offsetThreshold}\n      upperOffsetThreshold={upperOffsetThreshold}\n      lowerOffsetThreshold={lowerOffsetThreshold}\n      dateModalTitle={dateModalTitle}\n      timeModalTitle={timeModalTitle}\n      dateConfirmButtonText={dateConfirmButtonText}\n      timeConfirmButtonText={timeConfirmButtonText}\n      dayLabel={dayLabel}\n      monthLabel={monthLabel}\n      yearLabel={yearLabel}\n      hourLabel={hourLabel}\n      minuteLabel={minuteLabel}\n      onChange={handleChoosing}\n    />\n  );\n\n  return (\n    <>\n      {controlComponent ? (\n        controlComponent(handleShowSelector, displayValue)\n      ) : (\n        <HintInputContainer\n          focused={focused}\n          viewStyle={style}\n          onPress={handleShowSelector}\n          disabled={disabled}\n          LabelComponent={TextComponent}\n          variant={variant}\n          hint={hint}\n          hintComponent={hintComponent}\n          rightComponent={\n            <>\n              <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n              {rightComponent}\n            </>\n          }\n          {...rest}\n        >\n          <StyledText fontWeight=\"bold\" disabled={disabled}>\n            {displayValue}\n          </StyledText>\n        </HintInputContainer>\n      )}\n      {renderSelector(dateTimeSelector, handleBlur)}\n    </>\n  );\n};\n\nexport default DateTimePicker;\n"],"names":["useInputFocus","value","getStyledTextComponent","formatDate","getStyledDateTimeSelector","React","CalendarIcon"],"mappings":"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"}
+{"version":3,"file":"DateTimePicker.js","sources":["../../../../../src/components/molecules/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport * as React from 'react';\nimport { InputContainerProps, useInputFocus } from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { CalendarIcon, getStyledTextComponent } from '../DatePicker/styled';\nimport { DateTimeSelector, DateTimeSelectorProps } from '../DateTimeSelector';\nimport { HintInputContainer } from '../HintInputContainer';\nimport { getStyledDateTimeSelector } from './styled';\n\nexport interface DateTimePickerProps\n  extends InputContainerProps,\n    Omit<DateTimeSelectorProps, 'style'> {\n  controlComponent?: (\n    onPress: () => void,\n    displayValue?: string\n  ) => JSX.Element;\n  TextComponent?: React.FC<TextProps>;\n  DateTimeSelectorComponent: React.FC<DateTimeSelectorProps>;\n  placeholder?: string;\n  onFocus?: () => void | never;\n  onBlur?: () => void | never;\n  renderSelector: (\n    selector: React.ReactElement,\n    blur?: () => void\n  ) => JSX.Element | null;\n  requestShowSelector: () => void;\n  requestCloseSelector: () => void;\n}\n\nconst DateTimePicker: React.FC<DateTimePickerProps> = ({\n  onChange,\n  value,\n  mode = 'date',\n  format = 'yyyy-MM-dd hh:mm:ss',\n  locale,\n  upperDateThreshold,\n  lowerDateThreshold,\n  offsetThreshold,\n  upperOffsetThreshold,\n  lowerOffsetThreshold,\n  dateModalTitle,\n  timeModalTitle,\n  dateConfirmButtonText,\n  timeConfirmButtonText,\n  dayLabel,\n  monthLabel,\n  yearLabel,\n  hourLabel,\n  minuteLabel,\n  placeholder,\n  onFocus,\n  onBlur,\n  disabled,\n  controlComponent,\n  hintComponent,\n  hint,\n  variant = 'default',\n  TextComponent = Text,\n  DateTimeSelectorComponent = DateTimeSelector,\n  rightComponent,\n  style,\n  renderSelector,\n  requestShowSelector,\n  requestCloseSelector,\n  ...rest\n}) => {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  const handleShowSelector = () => {\n    requestShowSelector();\n    handleFocus();\n  };\n\n  const handleChoosing = (value: Date) => {\n    onChange?.(value);\n    requestCloseSelector();\n  };\n\n  const StyledText = getStyledTextComponent(TextComponent);\n  const displayValue =\n    (value ? formatDate(value, format, { locale: locale }) : placeholder) ||\n    ' ';\n  const StyledDateTimeSelector = getStyledDateTimeSelector(\n    DateTimeSelectorComponent\n  );\n\n  const dateTimeSelector = (\n    <StyledDateTimeSelector\n      value={value}\n      mode={mode}\n      format={format}\n      locale={locale}\n      upperDateThreshold={upperDateThreshold}\n      lowerDateThreshold={lowerDateThreshold}\n      offsetThreshold={offsetThreshold}\n      upperOffsetThreshold={upperOffsetThreshold}\n      lowerOffsetThreshold={lowerOffsetThreshold}\n      dateModalTitle={dateModalTitle}\n      timeModalTitle={timeModalTitle}\n      dateConfirmButtonText={dateConfirmButtonText}\n      timeConfirmButtonText={timeConfirmButtonText}\n      dayLabel={dayLabel}\n      monthLabel={monthLabel}\n      yearLabel={yearLabel}\n      hourLabel={hourLabel}\n      minuteLabel={minuteLabel}\n      onChange={handleChoosing}\n    />\n  );\n\n  return (\n    <>\n      {controlComponent ? (\n        controlComponent(handleShowSelector, displayValue)\n      ) : (\n        <HintInputContainer\n          focused={focused}\n          viewStyle={style}\n          onPress={handleShowSelector}\n          disabled={disabled}\n          LabelComponent={TextComponent}\n          variant={variant}\n          hint={hint}\n          hintComponent={hintComponent}\n          rightComponent={\n            <>\n              <CalendarIcon name=\"calendar-sharp\" type=\"ionicon\" size=\"centi\" />\n              {rightComponent}\n            </>\n          }\n          {...rest}\n        >\n          <StyledText fontWeight=\"bold\" disabled={disabled}>\n            {displayValue}\n          </StyledText>\n        </HintInputContainer>\n      )}\n      {renderSelector(dateTimeSelector, handleBlur)}\n    </>\n  );\n};\n\nexport default DateTimePicker;\n"],"names":["useInputFocus","value","getStyledTextComponent","formatDate","getStyledDateTimeSelector","React","CalendarIcon"],"mappings":"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"}

package/dist/cjs/components/molecules/DateTimePicker/styled.d.ts

@@ -1,8 +1,6 @@
 import { FC } from 'react';
 import { DateTimeSelectorProps } from '../DateTimeSelector';
 export declare const getStyledDateTimeSelector: (component: FC<DateTimeSelectorProps>) => import("@emotion/native").StyledComponent<DateTimeSelectorProps & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {}>;

package/dist/cjs/components/molecules/DateTimePicker/styled.js

@@ -1,15 +1,9 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var styled = require('@emotion/native');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
 const getStyledDateTimeSelector = (component) => {
-  return styled__default["default"](component)`
+  return styled(component)`
     padding: ${({ theme }) => theme.spacing.deca};
   `;
 };

package/dist/cjs/components/molecules/DateTimePicker/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/DateTimePicker/styled.ts"],"sourcesContent":["import styled from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { DateTimeSelectorProps } from '../DateTimeSelector';\n\nexport const getStyledDateTimeSelector = (\n  component: FC<DateTimeSelectorProps>\n) => {\n  return styled(component)<Partial<StyleProps>>`\n    padding: ${({ theme }) => theme.spacing.deca};\n  `;\n};\n"],"names":["styled"],"mappings":";;;;;;;;;;AAKa,MAAA,yBAAA,GAA4B,CACvC,SACG,KAAA;AACH,EAAA,OAAOA,2BAAO,SAAS,CAAA,CAAA;AAAA,aAAA,EACV,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,EAAA,CAAA,CAAA;AAE5C;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/DateTimePicker/styled.ts"],"sourcesContent":["import styled from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { DateTimeSelectorProps } from '../DateTimeSelector';\n\nexport const getStyledDateTimeSelector = (\n  component: FC<DateTimeSelectorProps>\n) => {\n  return styled(component)<Partial<StyleProps>>`\n    padding: ${({ theme }) => theme.spacing.deca};\n  `;\n};\n"],"names":[],"mappings":";;;;AAKa,MAAA,yBAAA,GAA4B,CACvC,SACG,KAAA;AACH,EAAA,OAAO,OAAO,SAAS,CAAA,CAAA;AAAA,aAAA,EACV,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,EAAA,CAAA,CAAA;AAE5C;;;;"}

package/dist/cjs/components/molecules/DateTimeSelector/DateTimeSelector.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ViewProps } from 'react-native';
 import { TextProps } from '../../atoms/Text';
-export declare type DateTimeSelectorMode = 'date' | 'time' | 'datetime' | 'month';
+export type DateTimeSelectorMode = 'date' | 'time' | 'datetime' | 'month';
 export interface DateTimeSelectorProps extends ViewProps {
     TextComponent?: React.FC<TextProps>;
     value?: Date;

package/dist/cjs/components/molecules/DateTimeSelector/DateTimeSelector.js

@@ -10,8 +10,7 @@ require('@emotion/react');
 var Selector = require('./Selector.js');
 var styled = require('./styled.js');
 
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
+function _interopNamespaceDefault(e) {
   var n = Object.create(null);
   if (e) {
     Object.keys(e).forEach(function (k) {
@@ -24,11 +23,11 @@ function _interopNamespace(e) {
       }
     });
   }
-  n["default"] = e;
+  n.default = e;
   return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 function getThresholdUnit(mode, threshold) {
   if (!threshold)
@@ -112,79 +111,76 @@ const DateTimeSelector = ({
   const handlePressBack = () => {
     setCurrentMode(0);
   };
-  return /* @__PURE__ */ React__namespace.createElement(styled.Root, {
-    ...rest
-  }, /* @__PURE__ */ React__namespace.createElement(styled.Header, null, currentMode === 1 && /* @__PURE__ */ React__namespace.createElement(styled.BackButton, {
-    onPress: handlePressBack
-  }, /* @__PURE__ */ React__namespace.createElement(Icon, {
-    type: "material-community",
-    name: "chevron-left",
-    size: "mega",
-    colorVariant: "secondary"
-  })), /* @__PURE__ */ React__namespace.createElement(TextComponent, {
-    typography: "base",
-    colorVariant: "secondary"
-  }, modalTitle)), isDate ? /* @__PURE__ */ React__namespace.createElement(styled.Content, null, mode !== "month" && /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, {
-    isFirst: true
-  }, /* @__PURE__ */ React__namespace.createElement(Selector.Selector, {
-    TextComponent,
-    onChange: handleChange("date"),
-    referenceDate: date,
-    value: date.getDate(),
-    label: dayLabel || "Day",
-    granularity: "date",
-    getDisplayValue: getDisplayedValue("date"),
-    preventUpper: upperDateThreshold ? dateFns.isSameDay(upperDateThreshold, date) : false,
-    preventLower: lowerDateThreshold ? dateFns.isSameDay(lowerDateThreshold, date) : false
-  })), /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, null, /* @__PURE__ */ React__namespace.createElement(Selector.Selector, {
-    TextComponent,
-    onChange: handleChange("month"),
-    referenceDate: date,
-    value: date.getMonth(),
-    label: monthLabel || "Month",
-    granularity: "month",
-    getDisplayValue: getDisplayedValue("month"),
-    preventUpper: upperDateThreshold ? dateFns.isSameMonth(upperDateThreshold, date) : false,
-    preventLower: lowerDateThreshold ? dateFns.isSameMonth(lowerDateThreshold, date) : false
-  })), /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, {
-    isLast: true
-  }, /* @__PURE__ */ React__namespace.createElement(Selector.Selector, {
-    TextComponent,
-    onChange: handleChange("year"),
-    referenceDate: date,
-    value: date.getFullYear(),
-    label: yearLabel || "Year",
-    granularity: "year",
-    getDisplayValue: getDisplayedValue("year"),
-    preventUpper: upperDateThreshold ? dateFns.isSameYear(upperDateThreshold, date) : false,
-    preventLower: lowerDateThreshold ? dateFns.isSameYear(lowerDateThreshold, date) : false
-  }))) : /* @__PURE__ */ React__namespace.createElement(styled.Content, null, /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, {
-    isFirst: true
-  }, /* @__PURE__ */ React__namespace.createElement(Selector.Selector, {
-    TextComponent,
-    onChange: handleChange("hours"),
-    referenceDate: date,
-    value: date.getHours(),
-    label: hourLabel || "Hour",
-    granularity: "hours",
-    getDisplayValue: getDisplayedValue("hours")
-  })), /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, {
-    isLast: true
-  }, /* @__PURE__ */ React__namespace.createElement(Selector.Selector, {
-    TextComponent,
-    onChange: handleChange("minutes"),
-    referenceDate: date,
-    value: date.getMinutes(),
-    label: minuteLabel || "Minute",
-    granularity: "minutes",
-    getDisplayValue: getDisplayedValue("minutes")
-  }))), /* @__PURE__ */ React__namespace.createElement(Button, {
-    color: "primary",
-    onPress: handlePressConfirm
-  }, /* @__PURE__ */ React__namespace.createElement(TextComponent, {
-    fontWeight: "bold",
-    fontColor: "light"
-  }, confirmButtonText || "OK")));
+  return /* @__PURE__ */ React__namespace.createElement(styled.Root, { ...rest }, /* @__PURE__ */ React__namespace.createElement(styled.Header, null, currentMode === 1 && /* @__PURE__ */ React__namespace.createElement(styled.BackButton, { onPress: handlePressBack }, /* @__PURE__ */ React__namespace.createElement(
+    Icon,
+    {
+      type: "material-community",
+      name: "chevron-left",
+      size: "mega",
+      colorVariant: "secondary"
+    }
+  )), /* @__PURE__ */ React__namespace.createElement(TextComponent, { typography: "base", colorVariant: "secondary" }, modalTitle)), isDate ? /* @__PURE__ */ React__namespace.createElement(styled.Content, null, mode !== "month" && /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, { isFirst: true }, /* @__PURE__ */ React__namespace.createElement(
+    Selector.Selector,
+    {
+      TextComponent,
+      onChange: handleChange("date"),
+      referenceDate: date,
+      value: date.getDate(),
+      label: dayLabel || "Day",
+      granularity: "date",
+      getDisplayValue: getDisplayedValue("date"),
+      preventUpper: upperDateThreshold ? dateFns.isSameDay(upperDateThreshold, date) : false,
+      preventLower: lowerDateThreshold ? dateFns.isSameDay(lowerDateThreshold, date) : false
+    }
+  )), /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, null, /* @__PURE__ */ React__namespace.createElement(
+    Selector.Selector,
+    {
+      TextComponent,
+      onChange: handleChange("month"),
+      referenceDate: date,
+      value: date.getMonth(),
+      label: monthLabel || "Month",
+      granularity: "month",
+      getDisplayValue: getDisplayedValue("month"),
+      preventUpper: upperDateThreshold ? dateFns.isSameMonth(upperDateThreshold, date) : false,
+      preventLower: lowerDateThreshold ? dateFns.isSameMonth(lowerDateThreshold, date) : false
+    }
+  )), /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, { isLast: true }, /* @__PURE__ */ React__namespace.createElement(
+    Selector.Selector,
+    {
+      TextComponent,
+      onChange: handleChange("year"),
+      referenceDate: date,
+      value: date.getFullYear(),
+      label: yearLabel || "Year",
+      granularity: "year",
+      getDisplayValue: getDisplayedValue("year"),
+      preventUpper: upperDateThreshold ? dateFns.isSameYear(upperDateThreshold, date) : false,
+      preventLower: lowerDateThreshold ? dateFns.isSameYear(lowerDateThreshold, date) : false
+    }
+  ))) : /* @__PURE__ */ React__namespace.createElement(styled.Content, null, /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, { isFirst: true }, /* @__PURE__ */ React__namespace.createElement(
+    Selector.Selector,
+    {
+      TextComponent,
+      onChange: handleChange("hours"),
+      referenceDate: date,
+      value: date.getHours(),
+      label: hourLabel || "Hour",
+      granularity: "hours",
+      getDisplayValue: getDisplayedValue("hours")
+    }
+  )), /* @__PURE__ */ React__namespace.createElement(styled.SelectorContainer, { isLast: true }, /* @__PURE__ */ React__namespace.createElement(
+    Selector.Selector,
+    {
+      TextComponent,
+      onChange: handleChange("minutes"),
+      referenceDate: date,
+      value: date.getMinutes(),
+      label: minuteLabel || "Minute",
+      granularity: "minutes",
+      getDisplayValue: getDisplayedValue("minutes")
+    }
+  ))), /* @__PURE__ */ React__namespace.createElement(Button, { color: "primary", onPress: handlePressConfirm }, /* @__PURE__ */ React__namespace.createElement(TextComponent, { fontWeight: "bold", fontColor: "light" }, confirmButtonText || "OK")));
 };
 
 module.exports = DateTimeSelector;