@douyinfe/semi-ui 2.1.0-beta.2 → 2.1.0-next.2

package/lib/cjs/datePicker/dateInput.js

@@ -0,0 +1,408 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _indexOf = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/index-of"));
+
+var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
+
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
+var _isArray = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/is-array"));
+
+var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _inputFoundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/datePicker/inputFoundation"));
+
+var _constants = require("@douyinfe/semi-foundation/lib/cjs/datePicker/constants");
+
+var _function = require("@douyinfe/semi-foundation/lib/cjs/utils/function");
+
+var _isNullOrUndefined = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/isNullOrUndefined"));
+
+var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
+
+var _index = _interopRequireDefault(require("../input/index"));
+
+var _semiIcons = require("@douyinfe/semi-icons");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && (0, _indexOf.default)(e).call(e, p) < 0) t[p] = s[p];
+
+  if (s != null && typeof _getOwnPropertySymbols.default === "function") for (var i = 0, p = (0, _getOwnPropertySymbols.default)(s); i < p.length; i++) {
+    if ((0, _indexOf.default)(e).call(e, p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+/* eslint-disable max-lines-per-function */
+
+/* eslint-disable no-unused-vars */
+
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+class DateInput extends _baseComponent.default {
+  constructor(props) {
+    super(props);
+
+    this.handleChange = (value, e) => this.foundation.handleChange(value, e);
+
+    this.handleEnterPress = e => this.foundation.handleInputComplete(e);
+
+    this.handleInputClear = e => this.foundation.handleInputClear(e);
+
+    this.handleRangeInputChange = (rangeStart, rangeEnd, e) => {
+      const rangeInputValue = this.getRangeInputValue(rangeStart, rangeEnd);
+      this.foundation.handleChange(rangeInputValue, e);
+    };
+
+    this.handleRangeInputClear = e => {
+      this.foundation.handleRangeInputClear(e);
+    };
+
+    this.handleRangeInputEnterPress = (e, rangeStart, rangeEnd) => {
+      const rangeInputValue = this.getRangeInputValue(rangeStart, rangeEnd);
+      this.foundation.handleRangeInputEnterPress(e, rangeInputValue);
+    };
+
+    this.handleRangeInputEndKeyPress = e => {
+      this.foundation.handleRangeInputEndKeyPress(e);
+    };
+
+    this.handleRangeInputFocus = (e, rangeType) => {
+      this.foundation.handleRangeInputFocus(e, rangeType);
+    };
+
+    this.handleRangeStartFocus = e => {
+      this.handleRangeInputFocus(e, 'rangeStart');
+    };
+
+    this.getRangeInputValue = (rangeStart, rangeEnd) => {
+      var _context, _context2;
+
+      const {
+        rangeSeparator
+      } = this.props;
+      const rangeInputValue = (0, _concat.default)(_context = (0, _concat.default)(_context2 = "".concat(rangeStart)).call(_context2, rangeSeparator)).call(_context, rangeEnd);
+      return rangeInputValue;
+    };
+
+    this.foundation = new _inputFoundation.default(this.adapter);
+  }
+
+  get adapter() {
+    var _this = this;
+
+    return (0, _assign.default)((0, _assign.default)({}, super.adapter), {
+      updateIsFocusing: isFocusing => this.setState({
+        isFocusing
+      }),
+      notifyClick: function () {
+        return _this.props.onClick(...arguments);
+      },
+      notifyChange: function () {
+        return _this.props.onChange(...arguments);
+      },
+      notifyEnter: function () {
+        return _this.props.onEnterPress(...arguments);
+      },
+      notifyBlur: function () {
+        return _this.props.onBlur(...arguments);
+      },
+      notifyClear: function () {
+        return _this.props.onClear(...arguments);
+      },
+      notifyFocus: function () {
+        return _this.props.onFocus(...arguments);
+      },
+      notifyRangeInputClear: function () {
+        return _this.props.onRangeClear(...arguments);
+      },
+      notifyRangeInputFocus: function () {
+        return _this.props.onFocus(...arguments);
+      },
+      notifyTabPress: function () {
+        return _this.props.onRangeEndTabPress(...arguments);
+      }
+    });
+  }
+
+  componentDidMount() {
+    this.foundation.init();
+  }
+
+  componentWillUnmount() {
+    this.foundation.destroy();
+  }
+
+  formatText(value) {
+    // eslint-disable-next-line max-len
+    return value && value.length ? this.foundation.formatShowText(value) : '';
+  }
+
+  renderRangePrefix() {
+    const {
+      prefix,
+      insetLabel,
+      prefixCls,
+      disabled,
+      rangeInputFocus
+    } = this.props;
+    const labelNode = prefix || insetLabel;
+    return labelNode ? /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-range-input-prefix"),
+      onClick: e => !disabled && !rangeInputFocus && this.handleRangeStartFocus(e)
+    }, labelNode) : null;
+  }
+
+  renderRangeSeparator(rangeStart, rangeEnd) {
+    const {
+      disabled,
+      rangeSeparator
+    } = this.props;
+    const separatorCls = (0, _classnames.default)({
+      ["".concat(_constants.cssClasses.PREFIX, "-range-input-separator")]: true,
+      ["".concat(_constants.cssClasses.PREFIX, "-range-input-separator-active")]: (rangeStart || rangeEnd) && !disabled
+    });
+    return /*#__PURE__*/_react.default.createElement("span", {
+      onClick: e => !disabled && this.handleRangeStartFocus(e),
+      className: separatorCls
+    }, rangeSeparator);
+  }
+
+  renderRangeClearBtn(rangeStart, rangeEnd) {
+    const {
+      showClear,
+      prefixCls,
+      disabled
+    } = this.props;
+    const allowClear = (rangeStart || rangeEnd) && showClear;
+    return allowClear && !disabled ? /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-range-input-clearbtn"),
+      onMouseDown: e => !disabled && this.handleRangeInputClear(e)
+    }, /*#__PURE__*/_react.default.createElement(_semiIcons.IconClear, null)) : null;
+  }
+
+  renderRangeSuffix(suffix) {
+    const {
+      prefixCls,
+      disabled,
+      rangeInputFocus
+    } = this.props;
+    const rangeSuffix = suffix ? /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-range-input-suffix"),
+      onClick: e => !disabled && !rangeInputFocus && this.handleRangeStartFocus(e)
+    }, suffix) : null;
+    return rangeSuffix;
+  }
+
+  renderRangeInput(rangeProps) {
+    var _context3, _context4;
+
+    const {
+      // this.props
+      placeholder,
+      inputStyle,
+      disabled,
+      inputReadOnly,
+      autofocus,
+      size,
+      // compute props
+      text,
+      suffix,
+      inputCls,
+      // range only props
+      rangeInputStartRef,
+      rangeInputEndRef,
+      rangeInputFocus,
+      prefixCls,
+      rangeSeparator
+    } = rangeProps;
+    const [rangeStart, rangeEnd = ''] = text.split(rangeSeparator) || [];
+    const rangeSize = size === 'large' ? 'default' : 'small';
+    const rangePlaceholder = (0, _isArray.default)(placeholder) ? placeholder : [placeholder, placeholder];
+    const [rangeStartPlaceholder, rangeEndPlaceholder] = rangePlaceholder;
+    const inputLeftWrapperCls = (0, _classnames.default)("".concat(prefixCls, "-range-input-wrapper-start"), "".concat(prefixCls, "-range-input-wrapper"), {
+      ["".concat(prefixCls, "-range-input-wrapper-active")]: rangeInputFocus === 'rangeStart',
+      ["".concat(prefixCls, "-range-input-wrapper-start-with-prefix")]: this.props.prefix || this.props.insetLabel
+    });
+    const inputRightWrapperCls = (0, _classnames.default)("".concat(prefixCls, "-range-input-wrapper-end"), "".concat(prefixCls, "-range-input-wrapper"), {
+      ["".concat(prefixCls, "-range-input-wrapper-active")]: rangeInputFocus === 'rangeEnd'
+    });
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.renderRangePrefix(), /*#__PURE__*/_react.default.createElement("div", {
+      onClick: e => !disabled && this.handleRangeInputFocus(e, 'rangeStart'),
+      className: (0, _concat.default)(_context3 = "".concat(inputCls, " ")).call(_context3, inputLeftWrapperCls)
+    }, /*#__PURE__*/_react.default.createElement(_index.default, {
+      size: rangeSize,
+      style: inputStyle,
+      disabled: disabled,
+      readonly: inputReadOnly,
+      placeholder: rangeStartPlaceholder,
+      value: rangeStart,
+      // range input onBlur function is called when panel is closed
+      // onBlur={noop}
+      onChange: (rangeStartValue, e) => this.handleRangeInputChange(rangeStartValue, rangeEnd, e),
+      onEnterPress: e => this.handleRangeInputEnterPress(e, rangeStart, rangeEnd),
+      onFocus: e => this.handleRangeInputFocus(e, 'rangeStart'),
+      autofocus: autofocus,
+      ref: rangeInputStartRef
+    })), this.renderRangeSeparator(rangeStart, rangeEnd), /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _concat.default)(_context4 = "".concat(inputCls, " ")).call(_context4, inputRightWrapperCls),
+      onClick: e => !disabled && this.handleRangeInputFocus(e, 'rangeEnd')
+    }, /*#__PURE__*/_react.default.createElement(_index.default, {
+      size: rangeSize,
+      style: inputStyle,
+      disabled: disabled,
+      readonly: inputReadOnly,
+      placeholder: rangeEndPlaceholder,
+      value: rangeEnd,
+      // range input onBlur function is called when panel is closed
+      // onBlur={noop}
+      onChange: (rangeEndValue, e) => this.handleRangeInputChange(rangeStart, rangeEndValue, e),
+      onEnterPress: e => this.handleRangeInputEnterPress(e, rangeStart, rangeEnd),
+      onFocus: e => this.handleRangeInputFocus(e, 'rangeEnd'),
+      onKeyDown: this.handleRangeInputEndKeyPress,
+      ref: rangeInputEndRef
+    })), this.renderRangeClearBtn(rangeStart, rangeEnd), this.renderRangeSuffix(suffix));
+  }
+
+  render() {
+    const _a = this.props,
+          {
+      placeholder,
+      type,
+      value,
+      inputValue,
+      inputStyle,
+      disabled,
+      showClear,
+      inputReadOnly,
+      insetLabel,
+      validateStatus,
+      block,
+      prefixCls,
+      dateFnsLocale,
+      // No need to pass to input
+      onBlur,
+      onClear,
+      onFocus,
+      prefix,
+      autofocus,
+      size,
+      // range input support props, no need passing to not range type
+      rangeInputStartRef,
+      rangeInputEndRef,
+      onRangeClear,
+      onRangeBlur,
+      onRangeEndTabPress,
+      rangeInputFocus,
+      rangeSeparator
+    } = _a,
+          rest = __rest(_a, ["placeholder", "type", "value", "inputValue", "inputStyle", "disabled", "showClear", "inputReadOnly", "insetLabel", "validateStatus", "block", "prefixCls", "dateFnsLocale", "onBlur", "onClear", "onFocus", "prefix", "autofocus", "size", "rangeInputStartRef", "rangeInputEndRef", "onRangeClear", "onRangeBlur", "onRangeEndTabPress", "rangeInputFocus", "rangeSeparator"]);
+
+    const dateIcon = /*#__PURE__*/_react.default.createElement(_semiIcons.IconCalendar, null);
+
+    const dateTimeIcon = /*#__PURE__*/_react.default.createElement(_semiIcons.IconCalendarClock, null);
+
+    const suffix = (0, _includes.default)(type).call(type, 'Time') ? dateTimeIcon : dateIcon;
+    let text = '';
+
+    if (!(0, _isNullOrUndefined.default)(inputValue)) {
+      text = inputValue;
+    } else if (value) {
+      text = this.formatText(value);
+    }
+
+    const inputCls = (0, _classnames.default)({
+      ["".concat(prefixCls, "-input-readonly")]: inputReadOnly
+    });
+    const isRangeType = /range/i.test(type);
+    const rangeProps = (0, _assign.default)((0, _assign.default)({}, this.props), {
+      text,
+      suffix,
+      inputCls
+    });
+    return isRangeType ? this.renderRangeInput(rangeProps) : /*#__PURE__*/_react.default.createElement(_index.default, (0, _assign.default)({}, rest, {
+      insetLabel: insetLabel,
+      disabled: disabled,
+      readonly: inputReadOnly,
+      className: inputCls,
+      style: inputStyle,
+      hideSuffix: showClear,
+      placeholder: placeholder,
+      onEnterPress: this.handleEnterPress,
+      onChange: this.handleChange,
+      onClear: this.handleInputClear,
+      suffix: suffix,
+      showClear: showClear,
+      value: text,
+      validateStatus: validateStatus,
+      prefix: prefix,
+      autofocus: autofocus,
+      size: size,
+      onBlur: onBlur,
+      onFocus: onFocus
+    }));
+  }
+
+}
+
+exports.default = DateInput;
+DateInput.propTypes = {
+  onClick: _propTypes.default.func,
+  onChange: _propTypes.default.func,
+  onEnterPress: _propTypes.default.func,
+  onBlur: _propTypes.default.func,
+  onClear: _propTypes.default.func,
+  onFocus: _propTypes.default.func,
+  value: _propTypes.default.array,
+  disabled: _propTypes.default.bool,
+  type: _propTypes.default.oneOf(_constants.strings.TYPE_SET),
+  multiple: _propTypes.default.bool,
+  showClear: _propTypes.default.bool,
+  format: _propTypes.default.string,
+  inputStyle: _propTypes.default.object,
+  inputReadOnly: _propTypes.default.bool,
+  insetLabel: _propTypes.default.node,
+  validateStatus: _propTypes.default.string,
+  prefix: _propTypes.default.node,
+  prefixCls: _propTypes.default.string,
+  dateFnsLocale: _propTypes.default.object.isRequired,
+  placeholder: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.array]),
+  rangeInputFocus: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
+  rangeInputStartRef: _propTypes.default.object,
+  rangeInputEndRef: _propTypes.default.object,
+  rangeSeparator: _propTypes.default.string
+};
+DateInput.defaultProps = {
+  showClear: true,
+  onClick: _function.noop,
+  onChange: _function.noop,
+  onEnterPress: _function.noop,
+  onBlur: _function.noop,
+  onClear: _function.noop,
+  onFocus: _function.noop,
+  multiple: false,
+  type: 'date',
+  inputStyle: {},
+  inputReadOnly: false,
+  prefixCls: _constants.cssClasses.PREFIX,
+  rangeSeparator: _constants.strings.DEFAULT_SEPARATOR_RANGE
+};

package/lib/cjs/datePicker/datePicker.d.ts

@@ -0,0 +1,180 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import DatePickerFoundation, { DatePickerAdapter, DatePickerFoundationProps, DatePickerFoundationState, DayStatusType, PresetType, Type } from '@douyinfe/semi-foundation/lib/cjs/datePicker/foundation';
+import BaseComponent from '../_base/baseComponent';
+import { DateInputProps } from './dateInput';
+import MonthsGrid, { MonthsGridProps } from './monthsGrid';
+import { YearAndMonthProps } from './yearAndMonth';
+import '@douyinfe/semi-foundation/lib/cjs/datePicker/datePicker.css';
+import { Locale } from '../locale/interface';
+import { RangeType } from '@douyinfe/semi-foundation/lib/cjs/datePicker/inputFoundation';
+import { TimePickerProps } from '../timePicker/TimePicker';
+export interface DatePickerProps extends DatePickerFoundationProps {
+    timePickerOpts?: TimePickerProps;
+    bottomSlot?: React.ReactNode;
+    insetLabel?: React.ReactNode;
+    prefix?: React.ReactNode;
+    topSlot?: React.ReactNode;
+    renderDate?: (dayNumber?: number, fullDate?: string) => React.ReactNode;
+    renderFullDate?: (dayNumber?: number, fullDate?: string, dayStatus?: DayStatusType) => React.ReactNode;
+    triggerRender?: (props: DatePickerProps) => React.ReactNode;
+    onBlur?: React.MouseEventHandler<HTMLInputElement>;
+    onClear?: React.MouseEventHandler<HTMLDivElement>;
+    onFocus?: (e: React.MouseEvent, rangeType: RangeType) => void;
+    onPresetClick?: (item: PresetType, e: React.MouseEvent<HTMLDivElement>) => void;
+    locale?: Locale['DatePicker'];
+    dateFnsLocale?: Locale['dateFnsLocale'];
+}
+export declare type DatePickerState = DatePickerFoundationState;
+export default class DatePicker extends BaseComponent<DatePickerProps, DatePickerState> {
+    static contextType: React.Context<import("../configProvider/context").ContextValue>;
+    static propTypes: {
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
+        size: PropTypes.Requireable<"default" | "small" | "large">;
+        density: PropTypes.Requireable<"default" | "compact">;
+        defaultValue: PropTypes.Requireable<string | number | object>;
+        value: PropTypes.Requireable<string | number | object>;
+        defaultPickerValue: PropTypes.Requireable<string | number | object>;
+        disabledTime: PropTypes.Requireable<(...args: any[]) => any>;
+        disabledTimePicker: PropTypes.Requireable<boolean>;
+        hideDisabledOptions: PropTypes.Requireable<boolean>;
+        format: PropTypes.Requireable<string>;
+        disabled: PropTypes.Requireable<boolean>;
+        multiple: PropTypes.Requireable<boolean>;
+        max: PropTypes.Requireable<number>;
+        placeholder: PropTypes.Requireable<string | any[]>;
+        presets: PropTypes.Requireable<any[]>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onChangeWithDateFirst: PropTypes.Requireable<boolean>;
+        weekStartsOn: PropTypes.Requireable<number>;
+        disabledDate: PropTypes.Requireable<(...args: any[]) => any>;
+        timePickerOpts: PropTypes.Requireable<object>;
+        showClear: PropTypes.Requireable<boolean>;
+        onOpenChange: PropTypes.Requireable<(...args: any[]) => any>;
+        open: PropTypes.Requireable<boolean>;
+        defaultOpen: PropTypes.Requireable<boolean>;
+        motion: PropTypes.Requireable<boolean | object>;
+        className: PropTypes.Requireable<string>;
+        prefixCls: PropTypes.Requireable<string>;
+        prefix: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        insetLabel: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        zIndex: PropTypes.Requireable<number>;
+        position: PropTypes.Requireable<"top" | "topLeft" | "topRight" | "left" | "leftTop" | "leftBottom" | "right" | "rightTop" | "rightBottom" | "bottom" | "bottomLeft" | "bottomRight" | "leftTopOver" | "rightTopOver">;
+        getPopupContainer: PropTypes.Requireable<(...args: any[]) => any>;
+        onCancel: PropTypes.Requireable<(...args: any[]) => any>;
+        onConfirm: PropTypes.Requireable<(...args: any[]) => any>;
+        needConfirm: PropTypes.Requireable<boolean>;
+        inputStyle: PropTypes.Requireable<object>;
+        timeZone: PropTypes.Requireable<string | number>;
+        triggerRender: PropTypes.Requireable<(...args: any[]) => any>;
+        stopPropagation: PropTypes.Requireable<string | boolean>;
+        autoAdjustOverflow: PropTypes.Requireable<boolean>;
+        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
+        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
+        onClear: PropTypes.Requireable<(...args: any[]) => any>;
+        style: PropTypes.Requireable<object>;
+        autoFocus: PropTypes.Requireable<boolean>;
+        inputReadOnly: PropTypes.Requireable<boolean>;
+        validateStatus: PropTypes.Requireable<"default" | "error" | "warning" | "success">;
+        renderDate: PropTypes.Requireable<(...args: any[]) => any>;
+        renderFullDate: PropTypes.Requireable<(...args: any[]) => any>;
+        spacing: PropTypes.Requireable<number>;
+        startDateOffset: PropTypes.Requireable<(...args: any[]) => any>;
+        endDateOffset: PropTypes.Requireable<(...args: any[]) => any>;
+        autoSwitchDate: PropTypes.Requireable<boolean>;
+        dropdownClassName: PropTypes.Requireable<string>;
+        dropdownStyle: PropTypes.Requireable<object>;
+        topSlot: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        bottomSlot: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        dateFnsLocale: PropTypes.Requireable<object>;
+        syncSwitchMonth: PropTypes.Requireable<boolean>;
+        onPanelChange: PropTypes.Requireable<(...args: any[]) => any>;
+        rangeSeparator: PropTypes.Requireable<string>;
+    };
+    static defaultProps: {
+        onChangeWithDateFirst: boolean;
+        autoAdjustOverflow: boolean;
+        stopPropagation: boolean;
+        motion: boolean;
+        prefixCls: "semi-datepicker";
+        zIndex: number;
+        type: string;
+        size: string;
+        density: string;
+        disabled: boolean;
+        multiple: boolean;
+        defaultOpen: boolean;
+        disabledHours: (...args: any[]) => void;
+        disabledMinutes: (...args: any[]) => void;
+        disabledSeconds: (...args: any[]) => void;
+        hideDisabledOptions: boolean;
+        onBlur: (...args: any[]) => void;
+        onFocus: (...args: any[]) => void;
+        onClear: (...args: any[]) => void;
+        onCancel: (...args: any[]) => void;
+        onConfirm: (...args: any[]) => void;
+        onChange: (...args: any[]) => void;
+        onOpenChange: (...args: any[]) => void;
+        onPanelChange: (...args: any[]) => void;
+        onPresetClick: (...args: any[]) => void;
+        weekStartsOn: 0;
+        disabledDate: {
+            (): false;
+            (): false;
+        };
+        disabledTime: {
+            (): false;
+            (): false;
+        };
+        inputReadOnly: boolean;
+        spacing: number;
+        autoSwitchDate: boolean;
+        syncSwitchMonth: boolean;
+        rangeSeparator: " ~ ";
+    };
+    triggerElRef: React.MutableRefObject<HTMLElement>;
+    panelRef: React.RefObject<HTMLDivElement>;
+    monthGrid: React.RefObject<MonthsGrid>;
+    rangeInputStartRef: React.RefObject<HTMLElement>;
+    rangeInputEndRef: React.RefObject<HTMLElement>;
+    focusRecordsRef: React.RefObject<{
+        rangeStart: boolean;
+        rangeEnd: boolean;
+    }>;
+    clickOutSideHandler: (e: MouseEvent) => void;
+    _mounted: boolean;
+    foundation: DatePickerFoundation;
+    constructor(props: DatePickerProps);
+    get adapter(): DatePickerAdapter;
+    isRangeType(type: Type, triggerRender: DatePickerProps['triggerRender']): boolean;
+    componentDidUpdate(prevProps: DatePickerProps): void;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    setTriggerRef: (node: HTMLDivElement) => HTMLDivElement;
+    handleSelectedChange: MonthsGridProps['onChange'];
+    handleYMSelectedChange: YearAndMonthProps['onSelect'];
+    disabledDisposeDate: MonthsGridProps['disabledDate'];
+    disabledDisposeTime: MonthsGridProps['disabledTime'];
+    renderMonthGrid(locale: Locale['DatePicker'], localeCode: string, dateFnsLocale: Locale['dateFnsLocale']): JSX.Element;
+    renderQuickControls(): JSX.Element;
+    handleOpenPanel: () => void;
+    handleInputChange: DatePickerFoundation['handleInputChange'];
+    handleInputComplete: DatePickerFoundation['handleInputComplete'];
+    handleInputBlur: DateInputProps['onBlur'];
+    handleInputFocus: DatePickerFoundation['handleInputFocus'];
+    handleInputClear: DatePickerFoundation['handleInputClear'];
+    handleTriggerWrapperClick: DatePickerFoundation['handleTriggerWrapperClick'];
+    handleSetRangeFocus: DatePickerFoundation['handleSetRangeFocus'];
+    handleRangeInputBlur: (value: any, e: any) => void;
+    handleRangeInputClear: DatePickerFoundation['handleRangeInputClear'];
+    handleRangeEndTabPress: DatePickerFoundation['handleRangeEndTabPress'];
+    isAnotherPanelHasOpened: (currentRangeInput: RangeType) => boolean;
+    renderInner(extraProps?: Partial<DatePickerProps>): JSX.Element;
+    handleConfirm: (e: React.MouseEvent) => void;
+    handleCancel: (e: React.MouseEvent) => void;
+    renderFooter: (locale: Locale['DatePicker'], localeCode: string) => JSX.Element;
+    renderPanel: (locale: Locale['DatePicker'], localeCode: string, dateFnsLocale: Locale['dateFnsLocale']) => JSX.Element;
+    renderYearMonthPanel: (locale: Locale['DatePicker'], localeCode: string) => JSX.Element;
+    wrapPopover: (children: React.ReactNode) => JSX.Element;
+    render(): JSX.Element;
+}