Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

rc-picker

Package Overview
Dependencies
Maintainers
1
Versions
320
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rc-picker - npm Package Compare versions

Comparing version 0.0.1-alpha.48 to 0.0.1-alpha.49

es/utils/getRanges.d.ts

1

es/generate/index.d.ts

@@ -16,3 +16,2 @@ export interface GenerateConfig<DateType> {

setDate: (value: DateType, date: number) => DateType;
setWeekDay: (value: DateType, day: number) => DateType;
setHour: (value: DateType, hour: number) => DateType;

@@ -19,0 +18,0 @@ setMinute: (value: DateType, minute: number) => DateType;

@@ -69,8 +69,2 @@ "use strict";

},
setWeekDay: function setWeekDay(date, day) {
var clone = date.clone();
clone.locale('en_US');
clone.weekday(day);
return clone;
},
setDate: function setDate(date, num) {

@@ -77,0 +71,0 @@ var clone = date.clone();

@@ -26,5 +26,2 @@ "use strict";

}, [disabledDate]);
var firstDay = React.useMemo(function () {
return generateConfig.locale.getWeekFirstDay(locale.locale);
}, [locale.locale]);

@@ -35,23 +32,22 @@ function disabledWeekDate(date) {

if (!disabledCache.has(weekStr)) {
var weekDay = generateConfig.getWeekDay(date);
var weekStartDate; // Set start week date
var disabled = false;
if (weekDay < firstDay) {
weekStartDate = generateConfig.setWeekDay(generateConfig.addDate(date, -7), firstDay);
} else {
weekStartDate = generateConfig.setWeekDay(date, firstDay);
} // Loop to find disabled status
var checkDisabled = function checkDisabled(offset) {
for (var i = 0; i < 7; i += 1) {
var currentDate = generateConfig.addDate(date, i * offset);
var currentWeekStr = generateConfig.locale.format(locale.locale, currentDate, 'YYYY-WW');
if (currentWeekStr !== weekStr) {
break;
}
var disabled = false;
for (var i = 0; i < 7; i += 1) {
var currentDate = generateConfig.setWeekDay(weekStartDate, i);
if (disabledDate(currentDate)) {
disabled = true;
break;
if (disabledDate(currentDate)) {
disabled = true;
break;
}
}
}
};
checkDisabled(1);
checkDisabled(-1);
disabledCache.set(weekStr, disabled);

@@ -58,0 +54,0 @@ }

@@ -44,3 +44,3 @@ /// <reference types="react" />

export declare type NullableDateType<DateType> = DateType | null | undefined;
export declare type OnSelect<DateType> = (value: DateType, type: 'key' | 'mouse') => void;
export declare type OnSelect<DateType> = (value: DateType, type: 'key' | 'mouse' | 'submit') => void;
export interface PanelSharedProps<DateType> {

@@ -78,1 +78,11 @@ prefixCls: string;

export declare type RangeValue<DateType> = [EventValue<DateType>, EventValue<DateType>] | null;
export interface Components {
button?: React.ComponentType | string;
rangeItem?: React.ComponentType | string;
}
export declare type RangeList = {
label: string;
onClick: () => void;
onMouseEnter: () => void;
onMouseLeave: () => void;
}[];
import * as React from 'react';
import { OnSelect } from './interface';
export declare type ContextOperationRefProps = {

@@ -15,4 +16,5 @@ onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => boolean;

onDateMouseLeave?: (date: any) => void;
onSelect?: OnSelect<any>;
}
declare const PanelContext: React.Context<PanelContextProps>;
export default PanelContext;

@@ -93,2 +93,6 @@ "use strict";

var getExtraFooter_1 = __importDefault(require("./utils/getExtraFooter"));
var getRanges_1 = __importDefault(require("./utils/getRanges"));
function InnerPicker(props) {

@@ -111,3 +115,4 @@ var _classnames_1$default2;

showTime = props.showTime,
picker = props.picker,
_props$picker = props.picker,
picker = _props$picker === void 0 ? 'date' : _props$picker,
format = props.format,

@@ -118,2 +123,3 @@ use12Hours = props.use12Hours,

open = props.open,
mode = props.mode,
defaultOpen = props.defaultOpen,

@@ -127,2 +133,3 @@ suffixIcon = props.suffixIcon,

pickerRef = props.pickerRef,
renderExtraFooter = props.renderExtraFooter,
onChange = props.onChange,

@@ -132,2 +139,3 @@ onOpenChange = props.onOpenChange,

onBlur = props.onBlur,
onPanelChange = props.onPanelChange,
onMouseDown = props.onMouseDown,

@@ -138,4 +146,7 @@ onMouseUp = props.onMouseUp,

onContextMenu = props.onContextMenu,
onClick = props.onClick;
var inputRef = React.useRef(null); // ============================= State =============================
onClick = props.onClick,
onSelect = props.onSelect,
_onOk = props.onOk;
var inputRef = React.useRef(null);
var needConfirmButton = picker === 'date' && !!showTime || picker === 'time'; // ============================= State =============================

@@ -206,5 +217,22 @@ var formatList = miscUtil_1.toArray(uiUtil_1.getDefaultFormat(format, picker, showTime, use12Hours)); // Panel ref

triggerTextChange = _useTextValueMapping_2[1],
resetText = _useTextValueMapping_2[2]; // ============================ Trigger ============================
resetText = _useTextValueMapping_2[2]; // ============================= Modes =============================
var _useMergeState_1$defa5 = useMergeState_1.default({
value: mode,
defaultStateValue: picker
}),
_useMergeState_1$defa6 = _slicedToArray(_useMergeState_1$defa5, 2),
mergedMode = _useMergeState_1$defa6[0],
setInnerMode = _useMergeState_1$defa6[1];
var triggerModeChange = function triggerModeChange(newValue, newMode) {
setInnerMode(newMode);
if (onPanelChange) {
onPanelChange(newValue, newMode);
}
}; // ============================ Trigger ============================
var triggerChange = function triggerChange(newValue) {

@@ -246,2 +274,3 @@ setSelectedValue(newValue);

var _usePickerInput_1$def = usePickerInput_1.default({
blurToCancel: needConfirmButton,
open: mergedOpen,

@@ -312,4 +341,34 @@ triggerOpen: triggerOpen,

var extraNode = getExtraFooter_1.default(prefixCls, mergedMode, renderExtraFooter);
var rangesNode = getRanges_1.default({
prefixCls: prefixCls,
needConfirmButton: needConfirmButton,
okDisabled: !selectedValue,
locale: locale,
onNow: function onNow() {
var now = generateConfig.getNow();
if (onSelect) {
onSelect(now);
}
triggerChange(now);
triggerOpen(false, true);
},
onOk: function onOk() {
if (selectedValue) {
triggerChange(selectedValue);
triggerOpen(false, true);
if (_onOk) {
_onOk(selectedValue);
}
}
}
});
var panel = React.createElement("div", {
className: "".concat(prefixCls, "-panel-container")
className: "".concat(prefixCls, "-panel-container"),
onMouseDown: function onMouseDown(e) {
e.preventDefault();
}
}, React.createElement(PickerPanel_1.default, Object.assign({}, panelProps, {

@@ -321,7 +380,8 @@ generateConfig: generateConfig,

tabIndex: -1,
onMouseDown: function onMouseDown(e) {
e.preventDefault();
},
onChange: setSelectedValue
})));
mode: mergedMode,
onChange: setSelectedValue,
onPanelChange: triggerModeChange
})), React.createElement("div", {
className: "".concat(prefixCls, "-footer")
}, extraNode, rangesNode));
var suffixNode;

@@ -347,4 +407,13 @@

}));
}
} // ============================ Return =============================
var onContextSelect = function onContextSelect(date, type) {
if (type === 'submit' || type !== 'key' && !needConfirmButton) {
// triggerChange will also update selected values
triggerChange(date);
triggerOpen(false, true);
}
};
return React.createElement(PanelContext_1.default.Provider, {

@@ -354,3 +423,4 @@ value: {

hideHeader: picker === 'time',
panelRef: panelDivRef
panelRef: panelDivRef,
onSelect: onContextSelect
}

@@ -357,0 +427,0 @@ }, React.createElement(PickerTrigger_1.default, {

@@ -10,3 +10,3 @@ /**

import { GenerateConfig } from './generate';
import { Locale, PanelMode, PickerMode, DisabledTime, OnPanelChange } from './interface';
import { Locale, PanelMode, PickerMode, DisabledTime, OnPanelChange, Components } from './interface';
import { DateRender } from './panels/DatePanel/DateBody';

@@ -37,2 +37,3 @@ import { MonthCellRender } from './panels/MonthPanel/MonthBody';

onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
onOk?: (date: DateType) => void;
/** @private This is internal usage. Do not use in your production env */

@@ -42,2 +43,4 @@ hideHeader?: boolean;

onPickerValueChange?: (date: DateType) => void;
/** @private Internal usage. Do not use in your production env */
components?: Components;
}

@@ -44,0 +47,0 @@ export interface PickerPanelBaseProps<DateType> extends PickerPanelSharedProps<DateType> {

@@ -80,2 +80,4 @@ "use strict";

var getRanges_1 = __importDefault(require("./utils/getRanges"));
function PickerPanel(props) {

@@ -107,3 +109,5 @@ var _classnames_1$default;

onMouseDown = props.onMouseDown,
onPickerValueChange = props.onPickerValueChange;
onPickerValueChange = props.onPickerValueChange,
_onOk = props.onOk;
var needConfirmButton = picker === 'date' && !!showTime || picker === 'time';

@@ -118,3 +122,4 @@ if (process.env.NODE_ENV !== 'production') {

var operationRef = panelContext.operationRef,
panelDivRef = panelContext.panelRef;
panelDivRef = panelContext.panelRef,
onContextSelect = panelContext.onSelect;

@@ -125,27 +130,19 @@ var _React$useContext = React.useContext(RangeContext_1.default),

rangedValue = _React$useContext.rangedValue,
hoverRangedValue = _React$useContext.hoverRangedValue,
onContextSelect = _React$useContext.onSelect;
hoverRangedValue = _React$useContext.hoverRangedValue;
var panelRef = React.useRef({}); // Handle init logic
var initRef = React.useRef(true); // Inner value
var initRef = React.useRef(true); // Value
var _React$useState = React.useState(function () {
if (value !== undefined) {
return value;
}
if (defaultValue !== undefined) {
return defaultValue;
}
return null;
var _useMergeState_1$defa = useMergeState_1.default({
value: value,
defaultValue: defaultValue,
defaultStateValue: null
}),
_React$useState2 = _slicedToArray(_React$useState, 2),
innerValue = _React$useState2[0],
setInnerValue = _React$useState2[1];
_useMergeState_1$defa2 = _slicedToArray(_useMergeState_1$defa, 2),
mergedValue = _useMergeState_1$defa2[0],
setInnerValue = _useMergeState_1$defa2[1]; // View date control
var mergedValue = value !== undefined ? value : innerValue; // View date control
var _useMergeState_1$defa = useMergeState_1.default({
var _useMergeState_1$defa3 = useMergeState_1.default({
value: pickerValue,

@@ -158,5 +155,5 @@ defaultValue: defaultPickerValue || mergedValue,

}),
_useMergeState_1$defa2 = _slicedToArray(_useMergeState_1$defa, 2),
viewDate = _useMergeState_1$defa2[0],
setInnerViewDate = _useMergeState_1$defa2[1];
_useMergeState_1$defa4 = _slicedToArray(_useMergeState_1$defa3, 2),
viewDate = _useMergeState_1$defa4[0],
setInnerViewDate = _useMergeState_1$defa4[1];

@@ -182,3 +179,3 @@ var setViewDate = function setViewDate(date) {

var _React$useState3 = React.useState(function () {
var _React$useState = React.useState(function () {
if (picker === 'time') {

@@ -190,5 +187,5 @@ return 'time';

}),
_React$useState4 = _slicedToArray(_React$useState3, 2),
innerMode = _React$useState4[0],
setInnerMode = _React$useState4[1];
_React$useState2 = _slicedToArray(_React$useState, 2),
innerMode = _React$useState2[0],
setInnerMode = _React$useState2[1];

@@ -212,2 +209,6 @@ var mergedMode = mode || innerMode;

if (onSelect) {
onSelect(date);
}
if (onContextSelect) {

@@ -217,6 +218,2 @@ onContextSelect(date, type);

if (onSelect) {
onSelect(date);
}
if (onChange && !dateUtil_1.isEqual(generateConfig, date, mergedValue)) {

@@ -357,16 +354,27 @@ onChange(date);

var extraFooter = inRange ? null : getExtraFooter_1.default(prefixCls, mergedMode, renderExtraFooter);
var nowNode;
var extraFooter;
var rangesNode;
if (!onContextSelect) {
extraFooter = getExtraFooter_1.default(prefixCls, mergedMode, renderExtraFooter);
rangesNode = getRanges_1.default({
prefixCls: prefixCls,
needConfirmButton: needConfirmButton,
okDisabled: !mergedValue,
locale: locale,
onOk: function onOk() {
if (mergedValue) {
triggerSelect(mergedValue, 'submit', true);
if (_onOk) {
_onOk(mergedValue);
}
}
}
});
}
var todayNode;
if (showTime && !inRange) {
nowNode = React.createElement("div", {
className: "".concat(prefixCls, "-now")
}, React.createElement("a", {
className: "".concat(prefixCls, "-now-btn"),
onClick: function onClick() {
triggerSelect(generateConfig.getNow(), 'mouse', true);
}
}, locale.now));
} else if (showToday && mergedMode === 'date' && picker === 'date') {
if (showToday && mergedMode === 'date' && picker === 'date' && !showTime) {
todayNode = React.createElement("a", {

@@ -394,5 +402,5 @@ className: "".concat(prefixCls, "-today-btn"),

ref: panelDivRef
}, panelNode, extraFooter || nowNode || todayNode ? React.createElement("div", {
}, panelNode, extraFooter || rangesNode || todayNode ? React.createElement("div", {
className: "".concat(prefixCls, "-footer")
}, extraFooter, nowNode, todayNode) : null));
}, extraFooter, rangesNode, todayNode) : null));
}

@@ -399,0 +407,0 @@

import * as React from 'react';
import { NullableDateType, RangeValue, OnSelect } from './interface';
interface RangeContextProps {
import { NullableDateType, RangeValue } from './interface';
export interface RangeContextProps {
/**

@@ -12,5 +12,4 @@ * Set displayed range value style.

panelPosition?: 'left' | 'right' | false;
onSelect?: OnSelect<any>;
}
declare const RangeContext: React.Context<RangeContextProps>;
export default RangeContext;

@@ -21,10 +21,5 @@ import * as React from 'react';

onBlur?: React.FocusEventHandler<HTMLInputElement>;
onOk?: () => void;
/** @private Internal usage. Do not use in your production env */
components?: {
button: React.ComponentType;
rangeItem: React.ComponentType;
};
onOk?: (dates: RangeValue<DateType>) => void;
}
declare type OmitPickerProps<Props> = Omit<Props, 'value' | 'defaultValue' | 'defaultPickerValue' | 'placeholder' | 'disabled' | 'disabledTime' | 'showToday' | 'showTime' | 'mode' | 'onChange' | 'onSelect' | 'onPanelChange' | 'pickerValue' | 'onPickerValueChange'>;
declare type OmitPickerProps<Props> = Omit<Props, 'value' | 'defaultValue' | 'defaultPickerValue' | 'placeholder' | 'disabled' | 'disabledTime' | 'showToday' | 'showTime' | 'mode' | 'onChange' | 'onSelect' | 'onPanelChange' | 'pickerValue' | 'onPickerValueChange' | 'onOk'>;
declare type RangeShowTimeObject<DateType> = Omit<SharedTimeProps<DateType>, 'defaultValue'> & {

@@ -31,0 +26,0 @@ defaultValue?: DateType[];

@@ -87,2 +87,4 @@ "use strict";

var getRanges_1 = __importDefault(require("./utils/getRanges"));
var useRangeViewDates_1 = __importDefault(require("./hooks/useRangeViewDates"));

@@ -156,4 +158,4 @@

onBlur = props.onBlur,
onOk = props.onOk,
components = props.components;
_onOk = props.onOk;
var needConfirmButton = picker === 'date' && !!showTime || picker === 'time';
var containerRef = React.useRef(null);

@@ -326,3 +328,3 @@ var panelDivRef = React.useRef(null);

values = [startValue, null];
endValue = null; // TODO: setViewDates1(updateValues(viewDates1, startValue, 1));
endValue = null;
}

@@ -455,3 +457,3 @@

return {
blurToCancel: !!(picker === 'date' && showTime),
blurToCancel: needConfirmButton,
forwardKeyDown: forwardKeyDown,

@@ -549,5 +551,23 @@ onBlur: onBlur,

};
} // ============================= Panel =============================
} // ============================ Ranges =============================
var rangeLabels = Object.keys(ranges || {});
var rangeList = rangeLabels.map(function (label) {
var range = ranges[label];
var newValues = typeof range === 'function' ? range() : range;
return {
label: label,
onClick: function onClick() {
triggerChange(newValues);
},
onMouseEnter: function onMouseEnter() {
setRangeHoverValue(newValues);
},
onMouseLeave: function onMouseLeave() {
setRangeHoverValue(null);
}
};
}); // ============================= Panel =============================
function renderPanel() {

@@ -571,13 +591,2 @@ var panelPosition = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;

var onContextSelect = function onContextSelect(date, type) {
var values = miscUtil_1.updateValues(selectedValue, date, activePickerIndex);
if (type === 'key' || picker === 'date' && showTime) {
setSelectedValue(values);
} else {
// triggerChange will also update selected values
triggerChange(values);
}
};
return React.createElement(RangeContext_1.default.Provider, {

@@ -588,4 +597,3 @@ value: {

rangedValue: rangeHoverValue || selectedValue,
hoverRangedValue: panelHoverRangedValue,
onSelect: onContextSelect
hoverRangedValue: panelHoverRangedValue
}

@@ -613,2 +621,3 @@ }, React.createElement(PickerPanel_1.default, Object.assign({}, props, panelProps, {

},
onOk: null,
onSelect: undefined,

@@ -636,3 +645,19 @@ onChange: undefined,

var extraNode = getExtraFooter_1.default(prefixCls, mergedModes[activePickerIndex], renderExtraFooter);
var rangesNode = getRanges_1.default({
prefixCls: prefixCls,
needConfirmButton: needConfirmButton,
okDisabled: !miscUtil_1.getValue(selectedValue, activePickerIndex),
locale: locale,
rangeList: rangeList,
onOk: function onOk() {
if (miscUtil_1.getValue(selectedValue, activePickerIndex)) {
triggerChange(selectedValue);
if (_onOk) {
_onOk(selectedValue);
}
}
}
});
if (picker !== 'time' && !showTime) {

@@ -658,42 +683,2 @@ var viewDate = getViewDate(activePickerIndex);

var rangesNode;
if (ranges || showTime) {
var mergedRanges = ranges || {};
var rangeList = Object.keys(mergedRanges);
var Button = components && components.button || 'button';
var RangeItem = components && components.rangeItem || 'span';
rangesNode = React.createElement("ul", {
className: "".concat(prefixCls, "-ranges")
}, rangeList.map(function (label) {
var range = mergedRanges[label];
var rangeValues = Array.isArray(range) ? range : range();
return React.createElement("li", {
key: label
}, React.createElement(RangeItem, {
onClick: function onClick() {
var newValues = rangeValues;
triggerChange(newValues);
},
onMouseEnter: function onMouseEnter() {
setRangeHoverValue(rangeValues);
},
onMouseLeave: function onMouseLeave() {
setRangeHoverValue(null);
}
}, label));
}), showTime && React.createElement("li", {
className: "".concat(prefixCls, "-ok")
}, React.createElement(Button, {
disabled: !miscUtil_1.getValue(selectedValue, activePickerIndex),
onClick: function onClick() {
triggerChange(selectedValue);
if (onOk) {
onOk();
}
}
}, locale.ok)));
}
return React.createElement("div", {

@@ -710,3 +695,5 @@ className: "".concat(prefixCls, "-panel-container"),

className: "".concat(prefixCls, "-panels")
}, panels), extraNode, rangesNode);
}, panels), React.createElement("div", {
className: "".concat(prefixCls, "-picker-footer")
}, extraNode, rangesNode));
}

@@ -776,2 +763,13 @@

var onContextSelect = function onContextSelect(date, type) {
var values = miscUtil_1.updateValues(selectedValue, date, activePickerIndex);
if (type === 'submit' || type !== 'key' && !needConfirmButton) {
// triggerChange will also update selected values
triggerChange(values);
} else {
setSelectedValue(values);
}
};
return React.createElement(PanelContext_1.default.Provider, {

@@ -782,3 +780,4 @@ value: {

onDateMouseEnter: onDateMouseEnter,
onDateMouseLeave: onDateMouseLeave
onDateMouseLeave: onDateMouseLeave,
onSelect: onContextSelect
}

@@ -785,0 +784,0 @@ }, React.createElement(PickerTrigger_1.default, {

import { GenerateConfig } from '../generate';
import { NullableDateType, PickerMode, Locale } from '../interface';
import { NullableDateType, PickerMode } from '../interface';
export declare const WEEK_DAY_COUNT = 7;

@@ -11,3 +11,2 @@ export declare function isNullEqual<T>(value1: T, value2: T): boolean | undefined;

export declare function isSameWeek<DateType>(generateConfig: GenerateConfig<DateType>, locale: string, date1: NullableDateType<DateType>, date2: NullableDateType<DateType>): boolean;
export declare function isSameWeekDay<DateType>(generateConfig: GenerateConfig<DateType>, week1: NullableDateType<DateType>, week2: NullableDateType<DateType>, locale: Locale): boolean;
export declare function isEqual<DateType>(generateConfig: GenerateConfig<DateType>, value1: NullableDateType<DateType>, value2: NullableDateType<DateType>): boolean;

@@ -14,0 +13,0 @@ /** Between in date but not equal of date */

@@ -99,14 +99,2 @@ "use strict";

function isSameWeekDay(generateConfig, week1, week2, locale) {
var equal = isNullEqual(week1, week2);
if (typeof equal === 'boolean') {
return equal;
}
return generateConfig.locale.format(locale.locale, week1, 'YYYY-WW') === generateConfig.locale.format(locale.locale, week2, 'YYYY-WW');
}
exports.isSameWeekDay = isSameWeekDay;
function isEqual(generateConfig, value1, value2) {

@@ -113,0 +101,0 @@ return isSameDate(generateConfig, value1, value2) && isSameTime(generateConfig, value1, value2);

@@ -16,3 +16,2 @@ export interface GenerateConfig<DateType> {

setDate: (value: DateType, date: number) => DateType;
setWeekDay: (value: DateType, day: number) => DateType;
setHour: (value: DateType, hour: number) => DateType;

@@ -19,0 +18,0 @@ setMinute: (value: DateType, minute: number) => DateType;

@@ -69,8 +69,2 @@ "use strict";

},
setWeekDay: function setWeekDay(date, day) {
var clone = date.clone();
clone.locale('en_US');
clone.weekday(day);
return clone;
},
setDate: function setDate(date, num) {

@@ -77,0 +71,0 @@ var clone = date.clone();

@@ -26,5 +26,2 @@ "use strict";

}, [disabledDate]);
var firstDay = React.useMemo(function () {
return generateConfig.locale.getWeekFirstDay(locale.locale);
}, [locale.locale]);

@@ -35,23 +32,22 @@ function disabledWeekDate(date) {

if (!disabledCache.has(weekStr)) {
var weekDay = generateConfig.getWeekDay(date);
var weekStartDate; // Set start week date
var disabled = false;
if (weekDay < firstDay) {
weekStartDate = generateConfig.setWeekDay(generateConfig.addDate(date, -7), firstDay);
} else {
weekStartDate = generateConfig.setWeekDay(date, firstDay);
} // Loop to find disabled status
var checkDisabled = function checkDisabled(offset) {
for (var i = 0; i < 7; i += 1) {
var currentDate = generateConfig.addDate(date, i * offset);
var currentWeekStr = generateConfig.locale.format(locale.locale, currentDate, 'YYYY-WW');
if (currentWeekStr !== weekStr) {
break;
}
var disabled = false;
for (var i = 0; i < 7; i += 1) {
var currentDate = generateConfig.setWeekDay(weekStartDate, i);
if (disabledDate(currentDate)) {
disabled = true;
break;
if (disabledDate(currentDate)) {
disabled = true;
break;
}
}
}
};
checkDisabled(1);
checkDisabled(-1);
disabledCache.set(weekStr, disabled);

@@ -58,0 +54,0 @@ }

@@ -44,3 +44,3 @@ /// <reference types="react" />

export declare type NullableDateType<DateType> = DateType | null | undefined;
export declare type OnSelect<DateType> = (value: DateType, type: 'key' | 'mouse') => void;
export declare type OnSelect<DateType> = (value: DateType, type: 'key' | 'mouse' | 'submit') => void;
export interface PanelSharedProps<DateType> {

@@ -78,1 +78,11 @@ prefixCls: string;

export declare type RangeValue<DateType> = [EventValue<DateType>, EventValue<DateType>] | null;
export interface Components {
button?: React.ComponentType | string;
rangeItem?: React.ComponentType | string;
}
export declare type RangeList = {
label: string;
onClick: () => void;
onMouseEnter: () => void;
onMouseLeave: () => void;
}[];
import * as React from 'react';
import { OnSelect } from './interface';
export declare type ContextOperationRefProps = {

@@ -15,4 +16,5 @@ onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => boolean;

onDateMouseLeave?: (date: any) => void;
onSelect?: OnSelect<any>;
}
declare const PanelContext: React.Context<PanelContextProps>;
export default PanelContext;

@@ -93,2 +93,6 @@ "use strict";

var getExtraFooter_1 = __importDefault(require("./utils/getExtraFooter"));
var getRanges_1 = __importDefault(require("./utils/getRanges"));
function InnerPicker(props) {

@@ -111,3 +115,4 @@ var _classnames_1$default2;

showTime = props.showTime,
picker = props.picker,
_props$picker = props.picker,
picker = _props$picker === void 0 ? 'date' : _props$picker,
format = props.format,

@@ -118,2 +123,3 @@ use12Hours = props.use12Hours,

open = props.open,
mode = props.mode,
defaultOpen = props.defaultOpen,

@@ -127,2 +133,3 @@ suffixIcon = props.suffixIcon,

pickerRef = props.pickerRef,
renderExtraFooter = props.renderExtraFooter,
onChange = props.onChange,

@@ -132,2 +139,3 @@ onOpenChange = props.onOpenChange,

onBlur = props.onBlur,
onPanelChange = props.onPanelChange,
onMouseDown = props.onMouseDown,

@@ -138,4 +146,7 @@ onMouseUp = props.onMouseUp,

onContextMenu = props.onContextMenu,
onClick = props.onClick;
var inputRef = React.useRef(null); // ============================= State =============================
onClick = props.onClick,
onSelect = props.onSelect,
_onOk = props.onOk;
var inputRef = React.useRef(null);
var needConfirmButton = picker === 'date' && !!showTime || picker === 'time'; // ============================= State =============================

@@ -206,5 +217,22 @@ var formatList = miscUtil_1.toArray(uiUtil_1.getDefaultFormat(format, picker, showTime, use12Hours)); // Panel ref

triggerTextChange = _useTextValueMapping_2[1],
resetText = _useTextValueMapping_2[2]; // ============================ Trigger ============================
resetText = _useTextValueMapping_2[2]; // ============================= Modes =============================
var _useMergeState_1$defa5 = useMergeState_1.default({
value: mode,
defaultStateValue: picker
}),
_useMergeState_1$defa6 = _slicedToArray(_useMergeState_1$defa5, 2),
mergedMode = _useMergeState_1$defa6[0],
setInnerMode = _useMergeState_1$defa6[1];
var triggerModeChange = function triggerModeChange(newValue, newMode) {
setInnerMode(newMode);
if (onPanelChange) {
onPanelChange(newValue, newMode);
}
}; // ============================ Trigger ============================
var triggerChange = function triggerChange(newValue) {

@@ -246,2 +274,3 @@ setSelectedValue(newValue);

var _usePickerInput_1$def = usePickerInput_1.default({
blurToCancel: needConfirmButton,
open: mergedOpen,

@@ -312,4 +341,34 @@ triggerOpen: triggerOpen,

var extraNode = getExtraFooter_1.default(prefixCls, mergedMode, renderExtraFooter);
var rangesNode = getRanges_1.default({
prefixCls: prefixCls,
needConfirmButton: needConfirmButton,
okDisabled: !selectedValue,
locale: locale,
onNow: function onNow() {
var now = generateConfig.getNow();
if (onSelect) {
onSelect(now);
}
triggerChange(now);
triggerOpen(false, true);
},
onOk: function onOk() {
if (selectedValue) {
triggerChange(selectedValue);
triggerOpen(false, true);
if (_onOk) {
_onOk(selectedValue);
}
}
}
});
var panel = React.createElement("div", {
className: "".concat(prefixCls, "-panel-container")
className: "".concat(prefixCls, "-panel-container"),
onMouseDown: function onMouseDown(e) {
e.preventDefault();
}
}, React.createElement(PickerPanel_1.default, Object.assign({}, panelProps, {

@@ -321,7 +380,8 @@ generateConfig: generateConfig,

tabIndex: -1,
onMouseDown: function onMouseDown(e) {
e.preventDefault();
},
onChange: setSelectedValue
})));
mode: mergedMode,
onChange: setSelectedValue,
onPanelChange: triggerModeChange
})), React.createElement("div", {
className: "".concat(prefixCls, "-footer")
}, extraNode, rangesNode));
var suffixNode;

@@ -347,4 +407,13 @@

}));
}
} // ============================ Return =============================
var onContextSelect = function onContextSelect(date, type) {
if (type === 'submit' || type !== 'key' && !needConfirmButton) {
// triggerChange will also update selected values
triggerChange(date);
triggerOpen(false, true);
}
};
return React.createElement(PanelContext_1.default.Provider, {

@@ -354,3 +423,4 @@ value: {

hideHeader: picker === 'time',
panelRef: panelDivRef
panelRef: panelDivRef,
onSelect: onContextSelect
}

@@ -357,0 +427,0 @@ }, React.createElement(PickerTrigger_1.default, {

@@ -10,3 +10,3 @@ /**

import { GenerateConfig } from './generate';
import { Locale, PanelMode, PickerMode, DisabledTime, OnPanelChange } from './interface';
import { Locale, PanelMode, PickerMode, DisabledTime, OnPanelChange, Components } from './interface';
import { DateRender } from './panels/DatePanel/DateBody';

@@ -37,2 +37,3 @@ import { MonthCellRender } from './panels/MonthPanel/MonthBody';

onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
onOk?: (date: DateType) => void;
/** @private This is internal usage. Do not use in your production env */

@@ -42,2 +43,4 @@ hideHeader?: boolean;

onPickerValueChange?: (date: DateType) => void;
/** @private Internal usage. Do not use in your production env */
components?: Components;
}

@@ -44,0 +47,0 @@ export interface PickerPanelBaseProps<DateType> extends PickerPanelSharedProps<DateType> {

@@ -80,2 +80,4 @@ "use strict";

var getRanges_1 = __importDefault(require("./utils/getRanges"));
function PickerPanel(props) {

@@ -107,3 +109,5 @@ var _classnames_1$default;

onMouseDown = props.onMouseDown,
onPickerValueChange = props.onPickerValueChange;
onPickerValueChange = props.onPickerValueChange,
_onOk = props.onOk;
var needConfirmButton = picker === 'date' && !!showTime || picker === 'time';

@@ -118,3 +122,4 @@ if (process.env.NODE_ENV !== 'production') {

var operationRef = panelContext.operationRef,
panelDivRef = panelContext.panelRef;
panelDivRef = panelContext.panelRef,
onContextSelect = panelContext.onSelect;

@@ -125,27 +130,19 @@ var _React$useContext = React.useContext(RangeContext_1.default),

rangedValue = _React$useContext.rangedValue,
hoverRangedValue = _React$useContext.hoverRangedValue,
onContextSelect = _React$useContext.onSelect;
hoverRangedValue = _React$useContext.hoverRangedValue;
var panelRef = React.useRef({}); // Handle init logic
var initRef = React.useRef(true); // Inner value
var initRef = React.useRef(true); // Value
var _React$useState = React.useState(function () {
if (value !== undefined) {
return value;
}
if (defaultValue !== undefined) {
return defaultValue;
}
return null;
var _useMergeState_1$defa = useMergeState_1.default({
value: value,
defaultValue: defaultValue,
defaultStateValue: null
}),
_React$useState2 = _slicedToArray(_React$useState, 2),
innerValue = _React$useState2[0],
setInnerValue = _React$useState2[1];
_useMergeState_1$defa2 = _slicedToArray(_useMergeState_1$defa, 2),
mergedValue = _useMergeState_1$defa2[0],
setInnerValue = _useMergeState_1$defa2[1]; // View date control
var mergedValue = value !== undefined ? value : innerValue; // View date control
var _useMergeState_1$defa = useMergeState_1.default({
var _useMergeState_1$defa3 = useMergeState_1.default({
value: pickerValue,

@@ -158,5 +155,5 @@ defaultValue: defaultPickerValue || mergedValue,

}),
_useMergeState_1$defa2 = _slicedToArray(_useMergeState_1$defa, 2),
viewDate = _useMergeState_1$defa2[0],
setInnerViewDate = _useMergeState_1$defa2[1];
_useMergeState_1$defa4 = _slicedToArray(_useMergeState_1$defa3, 2),
viewDate = _useMergeState_1$defa4[0],
setInnerViewDate = _useMergeState_1$defa4[1];

@@ -182,3 +179,3 @@ var setViewDate = function setViewDate(date) {

var _React$useState3 = React.useState(function () {
var _React$useState = React.useState(function () {
if (picker === 'time') {

@@ -190,5 +187,5 @@ return 'time';

}),
_React$useState4 = _slicedToArray(_React$useState3, 2),
innerMode = _React$useState4[0],
setInnerMode = _React$useState4[1];
_React$useState2 = _slicedToArray(_React$useState, 2),
innerMode = _React$useState2[0],
setInnerMode = _React$useState2[1];

@@ -212,2 +209,6 @@ var mergedMode = mode || innerMode;

if (onSelect) {
onSelect(date);
}
if (onContextSelect) {

@@ -217,6 +218,2 @@ onContextSelect(date, type);

if (onSelect) {
onSelect(date);
}
if (onChange && !dateUtil_1.isEqual(generateConfig, date, mergedValue)) {

@@ -357,16 +354,27 @@ onChange(date);

var extraFooter = inRange ? null : getExtraFooter_1.default(prefixCls, mergedMode, renderExtraFooter);
var nowNode;
var extraFooter;
var rangesNode;
if (!onContextSelect) {
extraFooter = getExtraFooter_1.default(prefixCls, mergedMode, renderExtraFooter);
rangesNode = getRanges_1.default({
prefixCls: prefixCls,
needConfirmButton: needConfirmButton,
okDisabled: !mergedValue,
locale: locale,
onOk: function onOk() {
if (mergedValue) {
triggerSelect(mergedValue, 'submit', true);
if (_onOk) {
_onOk(mergedValue);
}
}
}
});
}
var todayNode;
if (showTime && !inRange) {
nowNode = React.createElement("div", {
className: "".concat(prefixCls, "-now")
}, React.createElement("a", {
className: "".concat(prefixCls, "-now-btn"),
onClick: function onClick() {
triggerSelect(generateConfig.getNow(), 'mouse', true);
}
}, locale.now));
} else if (showToday && mergedMode === 'date' && picker === 'date') {
if (showToday && mergedMode === 'date' && picker === 'date' && !showTime) {
todayNode = React.createElement("a", {

@@ -394,5 +402,5 @@ className: "".concat(prefixCls, "-today-btn"),

ref: panelDivRef
}, panelNode, extraFooter || nowNode || todayNode ? React.createElement("div", {
}, panelNode, extraFooter || rangesNode || todayNode ? React.createElement("div", {
className: "".concat(prefixCls, "-footer")
}, extraFooter, nowNode, todayNode) : null));
}, extraFooter, rangesNode, todayNode) : null));
}

@@ -399,0 +407,0 @@

import * as React from 'react';
import { NullableDateType, RangeValue, OnSelect } from './interface';
interface RangeContextProps {
import { NullableDateType, RangeValue } from './interface';
export interface RangeContextProps {
/**

@@ -12,5 +12,4 @@ * Set displayed range value style.

panelPosition?: 'left' | 'right' | false;
onSelect?: OnSelect<any>;
}
declare const RangeContext: React.Context<RangeContextProps>;
export default RangeContext;

@@ -21,10 +21,5 @@ import * as React from 'react';

onBlur?: React.FocusEventHandler<HTMLInputElement>;
onOk?: () => void;
/** @private Internal usage. Do not use in your production env */
components?: {
button: React.ComponentType;
rangeItem: React.ComponentType;
};
onOk?: (dates: RangeValue<DateType>) => void;
}
declare type OmitPickerProps<Props> = Omit<Props, 'value' | 'defaultValue' | 'defaultPickerValue' | 'placeholder' | 'disabled' | 'disabledTime' | 'showToday' | 'showTime' | 'mode' | 'onChange' | 'onSelect' | 'onPanelChange' | 'pickerValue' | 'onPickerValueChange'>;
declare type OmitPickerProps<Props> = Omit<Props, 'value' | 'defaultValue' | 'defaultPickerValue' | 'placeholder' | 'disabled' | 'disabledTime' | 'showToday' | 'showTime' | 'mode' | 'onChange' | 'onSelect' | 'onPanelChange' | 'pickerValue' | 'onPickerValueChange' | 'onOk'>;
declare type RangeShowTimeObject<DateType> = Omit<SharedTimeProps<DateType>, 'defaultValue'> & {

@@ -31,0 +26,0 @@ defaultValue?: DateType[];

@@ -87,2 +87,4 @@ "use strict";

var getRanges_1 = __importDefault(require("./utils/getRanges"));
var useRangeViewDates_1 = __importDefault(require("./hooks/useRangeViewDates"));

@@ -156,4 +158,4 @@

onBlur = props.onBlur,
onOk = props.onOk,
components = props.components;
_onOk = props.onOk;
var needConfirmButton = picker === 'date' && !!showTime || picker === 'time';
var containerRef = React.useRef(null);

@@ -326,3 +328,3 @@ var panelDivRef = React.useRef(null);

values = [startValue, null];
endValue = null; // TODO: setViewDates1(updateValues(viewDates1, startValue, 1));
endValue = null;
}

@@ -455,3 +457,3 @@

return {
blurToCancel: !!(picker === 'date' && showTime),
blurToCancel: needConfirmButton,
forwardKeyDown: forwardKeyDown,

@@ -549,5 +551,23 @@ onBlur: onBlur,

};
} // ============================= Panel =============================
} // ============================ Ranges =============================
var rangeLabels = Object.keys(ranges || {});
var rangeList = rangeLabels.map(function (label) {
var range = ranges[label];
var newValues = typeof range === 'function' ? range() : range;
return {
label: label,
onClick: function onClick() {
triggerChange(newValues);
},
onMouseEnter: function onMouseEnter() {
setRangeHoverValue(newValues);
},
onMouseLeave: function onMouseLeave() {
setRangeHoverValue(null);
}
};
}); // ============================= Panel =============================
function renderPanel() {

@@ -571,13 +591,2 @@ var panelPosition = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;

var onContextSelect = function onContextSelect(date, type) {
var values = miscUtil_1.updateValues(selectedValue, date, activePickerIndex);
if (type === 'key' || picker === 'date' && showTime) {
setSelectedValue(values);
} else {
// triggerChange will also update selected values
triggerChange(values);
}
};
return React.createElement(RangeContext_1.default.Provider, {

@@ -588,4 +597,3 @@ value: {

rangedValue: rangeHoverValue || selectedValue,
hoverRangedValue: panelHoverRangedValue,
onSelect: onContextSelect
hoverRangedValue: panelHoverRangedValue
}

@@ -613,2 +621,3 @@ }, React.createElement(PickerPanel_1.default, Object.assign({}, props, panelProps, {

},
onOk: null,
onSelect: undefined,

@@ -636,3 +645,19 @@ onChange: undefined,

var extraNode = getExtraFooter_1.default(prefixCls, mergedModes[activePickerIndex], renderExtraFooter);
var rangesNode = getRanges_1.default({
prefixCls: prefixCls,
needConfirmButton: needConfirmButton,
okDisabled: !miscUtil_1.getValue(selectedValue, activePickerIndex),
locale: locale,
rangeList: rangeList,
onOk: function onOk() {
if (miscUtil_1.getValue(selectedValue, activePickerIndex)) {
triggerChange(selectedValue);
if (_onOk) {
_onOk(selectedValue);
}
}
}
});
if (picker !== 'time' && !showTime) {

@@ -658,42 +683,2 @@ var viewDate = getViewDate(activePickerIndex);

var rangesNode;
if (ranges || showTime) {
var mergedRanges = ranges || {};
var rangeList = Object.keys(mergedRanges);
var Button = components && components.button || 'button';
var RangeItem = components && components.rangeItem || 'span';
rangesNode = React.createElement("ul", {
className: "".concat(prefixCls, "-ranges")
}, rangeList.map(function (label) {
var range = mergedRanges[label];
var rangeValues = Array.isArray(range) ? range : range();
return React.createElement("li", {
key: label
}, React.createElement(RangeItem, {
onClick: function onClick() {
var newValues = rangeValues;
triggerChange(newValues);
},
onMouseEnter: function onMouseEnter() {
setRangeHoverValue(rangeValues);
},
onMouseLeave: function onMouseLeave() {
setRangeHoverValue(null);
}
}, label));
}), showTime && React.createElement("li", {
className: "".concat(prefixCls, "-ok")
}, React.createElement(Button, {
disabled: !miscUtil_1.getValue(selectedValue, activePickerIndex),
onClick: function onClick() {
triggerChange(selectedValue);
if (onOk) {
onOk();
}
}
}, locale.ok)));
}
return React.createElement("div", {

@@ -710,3 +695,5 @@ className: "".concat(prefixCls, "-panel-container"),

className: "".concat(prefixCls, "-panels")
}, panels), extraNode, rangesNode);
}, panels), React.createElement("div", {
className: "".concat(prefixCls, "-picker-footer")
}, extraNode, rangesNode));
}

@@ -776,2 +763,13 @@

var onContextSelect = function onContextSelect(date, type) {
var values = miscUtil_1.updateValues(selectedValue, date, activePickerIndex);
if (type === 'submit' || type !== 'key' && !needConfirmButton) {
// triggerChange will also update selected values
triggerChange(values);
} else {
setSelectedValue(values);
}
};
return React.createElement(PanelContext_1.default.Provider, {

@@ -782,3 +780,4 @@ value: {

onDateMouseEnter: onDateMouseEnter,
onDateMouseLeave: onDateMouseLeave
onDateMouseLeave: onDateMouseLeave,
onSelect: onContextSelect
}

@@ -785,0 +784,0 @@ }, React.createElement(PickerTrigger_1.default, {

import { GenerateConfig } from '../generate';
import { NullableDateType, PickerMode, Locale } from '../interface';
import { NullableDateType, PickerMode } from '../interface';
export declare const WEEK_DAY_COUNT = 7;

@@ -11,3 +11,2 @@ export declare function isNullEqual<T>(value1: T, value2: T): boolean | undefined;

export declare function isSameWeek<DateType>(generateConfig: GenerateConfig<DateType>, locale: string, date1: NullableDateType<DateType>, date2: NullableDateType<DateType>): boolean;
export declare function isSameWeekDay<DateType>(generateConfig: GenerateConfig<DateType>, week1: NullableDateType<DateType>, week2: NullableDateType<DateType>, locale: Locale): boolean;
export declare function isEqual<DateType>(generateConfig: GenerateConfig<DateType>, value1: NullableDateType<DateType>, value2: NullableDateType<DateType>): boolean;

@@ -14,0 +13,0 @@ /** Between in date but not equal of date */

@@ -99,14 +99,2 @@ "use strict";

function isSameWeekDay(generateConfig, week1, week2, locale) {
var equal = isNullEqual(week1, week2);
if (typeof equal === 'boolean') {
return equal;
}
return generateConfig.locale.format(locale.locale, week1, 'YYYY-WW') === generateConfig.locale.format(locale.locale, week2, 'YYYY-WW');
}
exports.isSameWeekDay = isSameWeekDay;
function isEqual(generateConfig, value1, value2) {

@@ -113,0 +101,0 @@ return isSameDate(generateConfig, value1, value2) && isSameTime(generateConfig, value1, value2);

{
"name": "rc-picker",
"version": "0.0.1-alpha.48",
"version": "0.0.1-alpha.49",
"description": "React date & time picker",

@@ -5,0 +5,0 @@ "keywords": [

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc