@jetbrains/ring-ui 4.1.12 → 5.0.0-beta.11

package/dist/data-list/data-list.mock.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { SelectionItem } from '../table/selection';
+export interface Item extends SelectionItem {
+    title: ReactNode;
+    collapsible?: boolean;
+    selectable?: boolean;
+    items?: Item[];
+}
+declare const items: Item[];
+export declare const moreItems: {
+    id: number;
+    selectable: boolean;
+    collapsible: boolean;
+    title: JSX.Element;
+}[];
+export default items;

package/dist/data-list/data-list.mock.js

@@ -11,7 +11,7 @@ import '../link/clickableLink.js';
 import '../_helpers/link.js';
 import '../_helpers/badge.js';
 
-var dataList_mock = [{
+const items = [{
   id: 1,
   title: /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("strong", null, "Assigner"), " in 60 projects"),
   collapsible: true,
@@ -187,4 +187,4 @@ const moreItems = [{
   }, "duplicate"))
 }];
 
-export { dataList_mock as default, moreItems };
+export { items as default, moreItems };

package/dist/data-list/item.d.ts

@@ -0,0 +1,50 @@
+import { PureComponent, ReactNode } from 'react';
+import Selection, { SelectionItem } from '../table/selection';
+export declare enum moreLessButtonStates {
+    UNUSED = 0,
+    MORE = 1,
+    MORE_LOADING = 2,
+    LESS = 3
+}
+export interface BaseFormattedItem<T> {
+    items?: readonly T[];
+    title?: ReactNode;
+    collapsible?: boolean | null | undefined;
+    collapsed?: boolean | null | undefined;
+    onCollapse?: () => void;
+    onExpand?: () => void;
+    selectable?: boolean | undefined;
+}
+export interface FormattedItem<T> extends BaseFormattedItem<T> {
+    key?: string | null | undefined;
+    id?: string | number | null | undefined;
+}
+export interface ItemProps<T extends SelectionItem> extends BaseFormattedItem<T> {
+    item: T;
+    onFocus: (item: T) => void;
+    onSelect: (item: T, selected: boolean) => void;
+    itemFormatter: (item: T) => FormattedItem<T>;
+    level: number;
+    parentShift: number;
+    showMoreLessButton: moreLessButtonStates;
+    onItemMoreLess: (item: T, more: boolean) => void;
+    className?: string | null | undefined;
+    showFocus?: boolean | undefined;
+    selection: Selection<T>;
+    selected?: boolean | undefined;
+}
+export default class Item<T extends SelectionItem> extends PureComponent<ItemProps<T>> {
+    static defaultProps: {
+        items: never[];
+        level: number;
+        parentShift: number;
+        showMoreLessButton: moreLessButtonStates;
+        onItemMoreLess: () => void;
+    };
+    onShowMore: () => void;
+    onShowLess: () => void;
+    onFocus: () => void;
+    onSelect: (selected: boolean) => void;
+    renderItem: (model: T, parentShift: number) => JSX.Element;
+    render(): JSX.Element;
+}

package/dist/data-list/item.js

@@ -6,7 +6,8 @@ import chevronDownIcon from '@jetbrains/icons/chevron-down';
 import Link from '../link/link.js';
 import Text from '../text/text.js';
 import LoaderInline from '../loader-inline/loader-inline.js';
-import Button from '../button/button.js';
+import { Button } from '../button/button.js';
+import Selection from '../table/selection.js';
 import { m as modules_09d014b4, T as Title } from '../_helpers/title.js';
 import 'focus-visible';
 import 'classnames';
@@ -14,34 +15,33 @@ import '../global/memoize.js';
 import '../global/data-tests.js';
 import '../link/clickableLink.js';
 import '../_helpers/link.js';
-import '../global/theme.js';
-import '../_helpers/inject-styles.js';
-import '../global/conic-gradient.js';
-import 'conic-gradient';
-import '../global/supports-css.js';
-import '../global/inject-styles.js';
-import '../global/radial-gradient-mask.js';
-import '../global/get-uid.js';
+import '../_helpers/loader-inline.js';
 import '@jetbrains/icons/chevron-10px';
 import '../icon/icon.js';
 import 'util-deprecate';
 import '../icon/icon__constants.js';
 import '../_helpers/icon.js';
 import '../icon/icon__svg.js';
+import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 import '../global/focus-sensor-hoc.js';
+import '../global/prop-types.js';
 import '../global/composeRefs.js';
 import '../checkbox/checkbox.js';
 import '@jetbrains/icons/checkmark';
 import '@jetbrains/icons/remove-10px';
 import '../_helpers/checkbox.js';
+import '../global/get-uid.js';
+
+var moreLessButtonStates;
+
+(function (moreLessButtonStates) {
+  moreLessButtonStates[moreLessButtonStates["UNUSED"] = 0] = "UNUSED";
+  moreLessButtonStates[moreLessButtonStates["MORE"] = 1] = "MORE";
+  moreLessButtonStates[moreLessButtonStates["MORE_LOADING"] = 2] = "MORE_LOADING";
+  moreLessButtonStates[moreLessButtonStates["LESS"] = 3] = "LESS";
+})(moreLessButtonStates || (moreLessButtonStates = {}));
 
-const moreLessButtonStates = {
-  UNUSED: 0,
-  MORE: 1,
-  MORE_LOADING: 2,
-  LESS: 3
-};
 const ITEM_LEFT_OFFSET = 32;
 const LIST_LEFT_OFFSET = 24;
 class Item extends PureComponent {
@@ -101,7 +101,6 @@ class Item extends PureComponent {
         collapsed: item.collapsed,
         onCollapse: item.onCollapse,
         onExpand: item.onExpand,
-        focused: selection.isFocused(model),
         showFocus: selection.isFocused(model),
         onFocus: onFocus,
         selection: selection,
@@ -173,7 +172,7 @@ class Item extends PureComponent {
       }
     }
 
-    const itemIsEmpty = !items.length || collapsible && collapsed;
+    const itemIsEmpty = !(items !== null && items !== void 0 && items.length) || collapsible && collapsed;
     const offset = level * LIST_LEFT_OFFSET + ITEM_LEFT_OFFSET + parentShift;
     return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Title, {
       title: title,
@@ -194,34 +193,36 @@ class Item extends PureComponent {
 
 }
 
-_defineProperty(Item, "propTypes", {
-  item: PropTypes.object,
+_defineProperty(Item, "defaultProps", {
+  items: [],
+  level: 0,
+  parentShift: 0,
+  showMoreLessButton: moreLessButtonStates.UNUSED,
+  onItemMoreLess: () => {}
+});
+
+Item.propTypes = {
+  item: PropTypes.shape({
+    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired
+  }).isRequired,
   title: PropTypes.node,
   items: PropTypes.array,
   className: PropTypes.string,
   level: PropTypes.number,
   parentShift: PropTypes.number,
-  itemFormatter: PropTypes.func,
+  itemFormatter: PropTypes.func.isRequired,
   collapsible: PropTypes.bool,
   collapsed: PropTypes.bool,
   onCollapse: PropTypes.func,
   onExpand: PropTypes.func,
   showFocus: PropTypes.bool,
-  onFocus: PropTypes.func,
-  selection: PropTypes.object,
+  onFocus: PropTypes.func.isRequired,
+  selection: PropTypes.instanceOf(Selection).isRequired,
   selectable: PropTypes.bool,
   selected: PropTypes.bool,
-  onSelect: PropTypes.func,
+  onSelect: PropTypes.func.isRequired,
   showMoreLessButton: PropTypes.number,
   onItemMoreLess: PropTypes.func
-});
-
-_defineProperty(Item, "defaultProps", {
-  items: [],
-  level: 0,
-  parentShift: 0,
-  showMoreLessButton: moreLessButtonStates.UNUSED,
-  onItemMoreLess: () => {}
-});
+};
 
 export { Item as default, moreLessButtonStates };

package/dist/data-list/selection.d.ts

@@ -0,0 +1,16 @@
+import TableSelection, { CloneWithConfig, SelectionItem } from '../table/selection';
+export default class Selection<T extends SelectionItem> extends TableSelection<T> {
+    protected _buildData(data: T[]): Set<T>;
+    protected _buildSelected(data: Set<T>, selected: Set<T>): Set<T>;
+    private _getDescendants;
+    private _getAncestors;
+    private _selectDescendants;
+    private _deselectDescendants;
+    private _selectAncestors;
+    private _deselectAncestors;
+    select(value?: T | null): Selection<T>;
+    focus(value: T | null | undefined): Selection<T>;
+    resetSelection(): Selection<T>;
+    cloneWith(config: CloneWithConfig<T>): Selection<T>;
+    deselect(value?: T | null): Selection<T>;
+}

package/dist/data-list/selection.js

@@ -1,4 +1,5 @@
 import Selection$1 from '../table/selection.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
 
 class Selection extends Selection$1 {
   _buildData(data) {
@@ -77,6 +78,18 @@ class Selection extends Selection$1 {
     });
   }
 
+  focus(value) {
+    return super.focus(value);
+  }
+
+  resetSelection() {
+    return super.resetSelection();
+  }
+
+  cloneWith(config) {
+    return super.cloneWith(config);
+  }
+
   deselect() {
     let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this._focused;
 

package/dist/data-list/title.d.ts

@@ -0,0 +1,26 @@
+import React, { PureComponent, ReactNode } from 'react';
+import { FocusSensorAddProps } from '../global/focus-sensor-hoc';
+export interface TitleProps extends FocusSensorAddProps<HTMLDivElement> {
+    onSelect: (selected: boolean) => void;
+    selectable?: boolean | undefined;
+    selected?: boolean | undefined;
+    showFocus?: boolean | undefined;
+    offset?: number | undefined;
+    className?: string | null | undefined;
+    title?: ReactNode;
+    collapserExpander?: ReactNode;
+}
+declare class Title extends PureComponent<TitleProps> {
+    static defaultProps: {
+        selectable: boolean;
+        selected: boolean;
+        showFocus: boolean;
+    };
+    id: string;
+    onCheckboxFocus: () => void;
+    onCheckboxChange: () => void;
+    toggleSelection(): void;
+    render(): JSX.Element;
+}
+declare const _default: React.ComponentType<import("../global/focus-sensor-hoc").FocusSensorProps<TitleProps, HTMLDivElement, typeof Title>>;
+export default _default;

package/dist/data-list/title.js

@@ -5,6 +5,7 @@ import 'classnames';
 import '../global/focus-sensor-hoc.js';
 import '../checkbox/checkbox.js';
 import '../global/get-uid.js';
+import '../global/prop-types.js';
 export { T as default } from '../_helpers/title.js';
 import '../global/composeRefs.js';
 import '@jetbrains/icons/checkmark';

package/dist/data-list-ng/data-list-ng.js

@@ -1,5 +1,5 @@
 import angularComponentFactory from '../global/angular-component-factory.js';
-import DataList from '../data-list/data-list.js';
+import DataListContainer from '../data-list/data-list.js';
 import '../_helpers/_rollupPluginBabelHelpers.js';
 import 'angular';
 import 'react';
@@ -9,6 +9,7 @@ import '../global/react-dom-renderer.js';
 import 'prop-types';
 import 'classnames';
 import '../global/focus-sensor-hoc.js';
+import '../global/prop-types.js';
 import '../global/composeRefs.js';
 import '../table/selection-shortcuts-hoc.js';
 import '../table/selection.js';
@@ -33,13 +34,7 @@ import '../link/clickableLink.js';
 import '../_helpers/link.js';
 import '../text/text.js';
 import '../loader-inline/loader-inline.js';
-import '../global/theme.js';
-import '../_helpers/inject-styles.js';
-import '../global/conic-gradient.js';
-import 'conic-gradient';
-import '../global/supports-css.js';
-import '../global/inject-styles.js';
-import '../global/radial-gradient-mask.js';
+import '../_helpers/loader-inline.js';
 import '../button/button.js';
 import '@jetbrains/icons/chevron-10px';
 import '../icon/icon.js';
@@ -47,13 +42,15 @@ import 'util-deprecate';
 import '../icon/icon__constants.js';
 import '../_helpers/icon.js';
 import '../icon/icon__svg.js';
+import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 import '../_helpers/title.js';
 import '../checkbox/checkbox.js';
 import '@jetbrains/icons/checkmark';
 import '@jetbrains/icons/remove-10px';
 import '../_helpers/checkbox.js';
+import '../data-list/selection.js';
 
-var dataListNg = angularComponentFactory(DataList, 'DataList').name;
+var dataListNg = angularComponentFactory(DataListContainer, 'DataList').name;
 
 export { dataListNg as default };

package/dist/date-picker/consts.d.ts

@@ -0,0 +1,99 @@
+import { ReactNode } from 'react';
+import PropTypes from 'prop-types';
+import type { Locale } from 'date-fns';
+declare const units: {
+    unit: number;
+    cellSize: number;
+    calHeight: number;
+    yearHeight: number;
+};
+export default units;
+export declare const YEAR = 12;
+export declare const WEEK = 7;
+export declare const weekdays: {
+    MO: number;
+    TU: number;
+    WE: number;
+    TH: number;
+    FR: number;
+    SA: number;
+    SU: number;
+};
+export declare const MIDDLE_DAY = 15;
+export declare const yearDuration: number;
+export declare const yearScrollSpeed: number;
+export declare const DOUBLE = 2;
+export declare const HALF = 0.5;
+export declare const dateType: PropTypes.Requireable<string | number | Date>;
+export declare function parseTime(time: string): string | null;
+export interface DateInputTranslations {
+    addFirstDate: string;
+    addSecondDate: string;
+    addTime: string;
+    selectName: string;
+}
+export interface DateSpecificPopupProps {
+    withTime?: false | undefined;
+    range?: false | undefined;
+    onChange: (date: Date | null | undefined) => void;
+}
+export interface DatePickerChange {
+    from?: Date | null | undefined;
+    to?: Date | null | undefined;
+    date?: Date | null | undefined;
+    time?: string | null | undefined;
+}
+export interface TimeSpecificPopupProps {
+    withTime: true;
+    range?: false | undefined;
+    onChange: (change: DatePickerChange) => void;
+}
+export interface RangeSpecificPopupProps {
+    withTime?: false | undefined;
+    range: true;
+    onChange: (change: DatePickerChange) => void;
+}
+export interface DatePopupState {
+    active: Field;
+    text: string | null;
+    hoverDate: Date | null;
+    scrollDate: number | null;
+}
+export interface DatePopupBaseProps {
+    date?: Date | number | string | null | undefined;
+    time?: string | null | undefined;
+    from?: Date | number | string | null | undefined;
+    to?: Date | number | string | null | undefined;
+    minDate?: string | null | undefined;
+    maxDate?: string | null | undefined;
+    translations: DateInputTranslations;
+    fromPlaceholder?: string | null | undefined;
+    toPlaceholder?: string | null | undefined;
+    timePlaceholder?: string | null | undefined;
+    hidden: boolean;
+    locale?: Locale | undefined;
+    parseDateInput: (text: Date | number | string | null | undefined) => Date | null;
+    displayFormat: (date: Date, locale: Locale | undefined) => string;
+    onComplete: () => void;
+    onClear?: ((e: React.MouseEvent<HTMLButtonElement>) => void) | null | undefined;
+    renderAfterCalendar?: ((state: DatePopupState) => ReactNode) | undefined;
+}
+export interface Dates {
+    from?: Date | null | undefined;
+    to?: Date | null | undefined;
+    date?: Date | null | undefined;
+    time?: never;
+}
+export interface CalendarProps extends Omit<DatePopupBaseProps, 'date' | 'from' | 'to' | 'time'>, Dates {
+    activeDate: Date | null;
+    scrollDate: number | Date;
+    currentRange: [Date, Date] | null;
+    activeRange: [Date, Date] | null;
+    onScroll: (to: number) => void;
+    onScrollChange: (date: number) => void;
+}
+export interface MonthsProps extends CalendarProps {
+    onSelect: (date: Date) => void;
+    onHover: (date: Date) => void;
+}
+export declare type Field = 'date' | 'time' | 'from' | 'to';

package/dist/date-picker/consts.js

@@ -6,7 +6,7 @@ const unit = 8; // px;
 const units = {
   unit,
 
-  /* eslint-disable no-magic-numbers */
+  /* eslint-disable @typescript-eslint/no-magic-numbers */
   cellSize: unit * 3,
   calHeight: unit * 36,
   yearHeight: unit * 4
@@ -34,25 +34,6 @@ const yearDuration = durationToMillis({
 const yearScrollSpeed = yearDuration / (YEAR * units.cellSize);
 const DOUBLE = 2;
 const HALF = 0.5;
-function linear(x0, y0, a) {
-  return {
-    y(x) {
-      return +y0 + (x - x0) * a;
-    },
-
-    x(y) {
-      return +x0 + (y - y0) / a;
-    }
-
-  };
-}
-const deprecatedPropType = replacement => (props, propName) => {
-  if (propName in props) {
-    return new Error(`"${propName}" prop is deprecated and will be removed in 5.0. ${replacement} instead. See https://github.com/JetBrains/ring-ui/blob/master/CHANGELOG.md#310 for details`);
-  }
-
-  return undefined;
-};
 const dateType = PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.string, PropTypes.number]);
 function parseTime(time) {
   let result = null;
@@ -66,4 +47,4 @@ function parseTime(time) {
   return result;
 }
 
-export { DOUBLE, HALF, MIDDLE_DAY, WEEK, YEAR, dateType, units as default, deprecatedPropType, linear, parseTime, weekdays, yearDuration, yearScrollSpeed };
+export { DOUBLE, HALF, MIDDLE_DAY, WEEK, YEAR, dateType, units as default, parseTime, weekdays, yearDuration, yearScrollSpeed };

package/dist/date-picker/date-input.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { DatePopupBaseProps, Field } from './consts';
+export interface UpdateInputConfig {
+    active: boolean;
+    text: string | null;
+}
+export interface DateInputProps extends DatePopupBaseProps, UpdateInputConfig {
+    divider: boolean;
+    name: Field;
+    hoverDate: Date | null;
+    date: Date | null | undefined;
+    time?: string | null | undefined;
+    onInput: (value: string, name: Field) => void;
+    onActivate: () => void;
+    onConfirm: () => void;
+}
+export default class DateInput extends React.PureComponent<DateInputProps> {
+    static propTypes: {
+        active: PropTypes.Requireable<boolean>;
+        divider: PropTypes.Requireable<boolean>;
+        name: PropTypes.Requireable<string>;
+        text: PropTypes.Requireable<string>;
+        hoverDate: PropTypes.Requireable<string | number | Date>;
+        date: PropTypes.Requireable<string | number | Date>;
+        time: PropTypes.Requireable<string>;
+        displayFormat: PropTypes.Requireable<(...args: any[]) => any>;
+        hidden: PropTypes.Requireable<boolean>;
+        translations: PropTypes.Requireable<object>;
+        fromPlaceholder: PropTypes.Requireable<string>;
+        toPlaceholder: PropTypes.Requireable<string>;
+        timePlaceholder: PropTypes.Requireable<string>;
+        onInput: PropTypes.Requireable<(...args: any[]) => any>;
+        onActivate: PropTypes.Requireable<(...args: any[]) => any>;
+        onConfirm: PropTypes.Requireable<(...args: any[]) => any>;
+        onClear: PropTypes.Requireable<(...args: any[]) => any>;
+        locale: PropTypes.Requireable<object>;
+    };
+    static defaultProps: {
+        fromPlaceholder: null;
+        toPlaceholder: null;
+        timePlaceholder: null;
+        translations: {
+            addFirstDate: string;
+            addSecondDate: string;
+            addTime: string;
+            selectName: string;
+        };
+    };
+    componentDidUpdate(prevProps: DateInputProps): void;
+    input?: HTMLInputElement | null;
+    inputRef: (el: HTMLInputElement | null) => void;
+    updateInput({ text, active }: UpdateInputConfig): void;
+    handleChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    handleKeyDown: (e: React.KeyboardEvent) => false | void;
+    render(): JSX.Element;
+}

package/dist/date-picker/date-input.js

@@ -2,11 +2,12 @@ import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
 import React from 'react';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
-import Input from '../input/input.js';
+import { Input } from '../input/input.js';
+import { ControlsHeight } from '../global/controls-height.js';
 import { dateType } from './consts.js';
 import { m as modules_0c7b7d96 } from '../_helpers/date-picker.js';
 import '@jetbrains/icons/close';
-import '../global/theme.js';
+import '../global/prop-types.js';
 import '../button/button.js';
 import 'focus-visible';
 import '@jetbrains/icons/chevron-10px';
@@ -19,6 +20,7 @@ import '../global/memoize.js';
 import '../link/clickableLink.js';
 import '../_helpers/button__classes.js';
 import '../global/get-uid.js';
+import '../global/composeRefs.js';
 import '../_helpers/input.js';
 import 'date-fns/add';
 
@@ -26,12 +28,14 @@ class DateInput extends React.PureComponent {
   constructor() {
     super(...arguments);
 
+    _defineProperty(this, "input", void 0);
+
     _defineProperty(this, "inputRef", el => {
       this.input = el;
       this.updateInput(this.props);
     });
 
-    _defineProperty(this, "handleChange", e => this.props.onInput(e.target.value, e.target.dataset.name));
+    _defineProperty(this, "handleChange", e => this.props.onInput(e.currentTarget.value, e.currentTarget.dataset.name));
 
     _defineProperty(this, "handleKeyDown", e => e.key === 'Enter' && this.props.onConfirm());
   }
@@ -123,6 +127,7 @@ class DateInput extends React.PureComponent {
     return /*#__PURE__*/React.createElement(Input, {
       autoComplete: "off",
       borderless: true,
+      height: ControlsHeight.L,
       "data-name": name,
       inputRef: this.inputRef,
       className: classes,

package/dist/date-picker/date-picker.d.ts

@@ -0,0 +1,70 @@
+import { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+import type { Locale } from 'date-fns';
+import Popup from '../popup/popup';
+import { DropdownAttrs } from '../dropdown/dropdown';
+import { DatePopupProps } from './date-popup';
+import { DateInputTranslations, DatePickerChange } from './consts';
+export interface DatePickerTranslations extends Partial<DateInputTranslations> {
+    setDate: string;
+    setDateTime: string;
+    setPeriod: string;
+}
+export declare type DatePickerProps = Omit<DatePopupProps, 'translations' | 'parseDateInput' | 'onComplete' | 'hidden'> & {
+    className: string;
+    clear: boolean;
+    popupClassName?: string | null | undefined;
+    dropdownProps?: DropdownAttrs;
+    translations: DatePickerTranslations;
+    displayMonthFormat: (date: Date, locale: Locale | undefined) => string;
+    displayDayFormat: (date: Date, locale: Locale | undefined) => string;
+    displayTimeFormat: (date: Date, locale: Locale | undefined) => string;
+    applyTimeInput: (date: Date, time: string | null | undefined) => Date;
+    datePlaceholder: string;
+    dateTimePlaceholder: string;
+    rangePlaceholder: string;
+    disabled?: boolean | null | undefined;
+    parseDateInput: (input: string | null | undefined) => Date | null;
+};
+/**
+ * @name Date Picker
+ */
+export default class DatePicker extends PureComponent<DatePickerProps> {
+    static propTypes: {
+        className: PropTypes.Requireable<string>;
+        popupClassName: PropTypes.Requireable<string>;
+        date: PropTypes.Requireable<string | number | Date>;
+        withTime: PropTypes.Requireable<boolean>;
+        range: PropTypes.Requireable<boolean>;
+        from: PropTypes.Requireable<string | number | Date>;
+        to: PropTypes.Requireable<string | number | Date>;
+        clear: PropTypes.Requireable<boolean>;
+        displayFormat: PropTypes.Requireable<(...args: any[]) => any>;
+        displayMonthFormat: PropTypes.Requireable<(...args: any[]) => any>;
+        displayDayFormat: PropTypes.Requireable<(...args: any[]) => any>;
+        displayTimeFormat: PropTypes.Requireable<(...args: any[]) => any>;
+        parseDateInput: PropTypes.Requireable<(...args: any[]) => any>;
+        applyTimeInput: PropTypes.Requireable<(...args: any[]) => any>;
+        datePlaceholder: PropTypes.Requireable<string>;
+        dateTimePlaceholder: PropTypes.Requireable<string>;
+        rangePlaceholder: PropTypes.Requireable<string>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        dropdownProps: PropTypes.Requireable<object>;
+        disabled: PropTypes.Requireable<boolean>;
+        minDate: PropTypes.Requireable<string | number | Date>;
+        maxDate: PropTypes.Requireable<string | number | Date>;
+        translations: PropTypes.Requireable<object>;
+        locale: PropTypes.Requireable<object>;
+    };
+    static defaultProps: DatePickerProps;
+    handleChange: (change: DatePickerChange | Date | null | undefined) => void;
+    clear: () => void;
+    popup?: Popup | null;
+    popupRef: (el: Popup | null) => void;
+    closePopup: () => void;
+    parse: (arg: string | number | Date | null | undefined) => Date | null;
+    formatTime(): string | null;
+    getAnchorText: () => string;
+    render(): JSX.Element;
+}
+export declare type DatePickerAttrs = JSX.LibraryManagedAttributes<typeof DatePicker, DatePickerProps>;