Latest updates from IceHrmPro

This commit is contained in:
Thilina Pituwala
2020-05-20 18:47:29 +02:00
parent 60c92d7935
commit 7453a58aad
18012 changed files with 2089245 additions and 10173 deletions

View File

@@ -0,0 +1,18 @@
import * as React from 'react';
import { GenerateConfig } from '../../generate';
import { Locale, OnSelect } from '../../interface';
import { SharedTimeProps } from '.';
export interface BodyOperationRef {
onUpDown: (diff: number) => void;
}
export interface TimeBodyProps<DateType> extends SharedTimeProps<DateType> {
prefixCls: string;
locale: Locale;
generateConfig: GenerateConfig<DateType>;
value?: DateType | null;
onSelect: OnSelect<DateType>;
activeColumnIndex: number;
operationRef: React.MutableRefObject<BodyOperationRef | undefined>;
}
declare function TimeBody<DateType>(props: TimeBodyProps<DateType>): JSX.Element;
export default TimeBody;

View File

@@ -0,0 +1,155 @@
import * as React from 'react';
import TimeUnitColumn from './TimeUnitColumn';
import { leftPad } from '../../utils/miscUtil';
function generateUnits(start, end, step, disabledUnits) {
var units = [];
for (var i = start; i <= end; i += step) {
units.push({
label: leftPad(i, 2),
value: i,
disabled: (disabledUnits || []).includes(i)
});
}
return units;
}
function TimeBody(props) {
var generateConfig = props.generateConfig,
prefixCls = props.prefixCls,
operationRef = props.operationRef,
activeColumnIndex = props.activeColumnIndex,
value = props.value,
showHour = props.showHour,
showMinute = props.showMinute,
showSecond = props.showSecond,
use12Hours = props.use12Hours,
_props$hourStep = props.hourStep,
hourStep = _props$hourStep === void 0 ? 1 : _props$hourStep,
_props$minuteStep = props.minuteStep,
minuteStep = _props$minuteStep === void 0 ? 1 : _props$minuteStep,
_props$secondStep = props.secondStep,
secondStep = _props$secondStep === void 0 ? 1 : _props$secondStep,
disabledHours = props.disabledHours,
disabledMinutes = props.disabledMinutes,
disabledSeconds = props.disabledSeconds,
hideDisabledOptions = props.hideDisabledOptions,
onSelect = props.onSelect;
var columns = [];
var contentPrefixCls = "".concat(prefixCls, "-content");
var columnPrefixCls = "".concat(prefixCls, "-time-panel");
var isPM;
var hour = value ? generateConfig.getHour(value) : -1;
var minute = value ? generateConfig.getMinute(value) : -1;
var second = value ? generateConfig.getSecond(value) : -1;
var setTime = function setTime(isNewPM, newHour, newMinute, newSecond) {
var newDate = value || generateConfig.getNow();
var mergedHour = Math.max(0, newHour);
var mergedMinute = Math.max(0, newMinute);
var mergedSecond = Math.max(0, newSecond);
newDate = generateConfig.setSecond(newDate, mergedSecond);
newDate = generateConfig.setMinute(newDate, mergedMinute);
newDate = generateConfig.setHour(newDate, !use12Hours || !isNewPM ? mergedHour : mergedHour + 12);
return newDate;
}; // ========================= Unit =========================
var hours = generateUnits(0, use12Hours ? 11 : 23, hourStep, disabledHours && disabledHours()); // Should additional logic to handle 12 hours
if (use12Hours && hour !== -1) {
isPM = hour >= 12;
hour %= 12;
hours[0].label = '12';
}
var minutes = generateUnits(0, 59, minuteStep, disabledMinutes && disabledMinutes(hour));
var seconds = generateUnits(0, 59, secondStep, disabledSeconds && disabledSeconds(hour, minute)); // ====================== Operations ======================
operationRef.current = {
onUpDown: function onUpDown(diff) {
var column = columns[activeColumnIndex];
if (column) {
var valueIndex = column.units.findIndex(function (unit) {
return unit.value === column.value;
});
var unitLen = column.units.length;
for (var i = 1; i < unitLen; i += 1) {
var nextUnit = column.units[(valueIndex + diff * i + unitLen) % unitLen];
if (nextUnit.disabled !== true) {
column.onSelect(nextUnit.value);
break;
}
}
}
}
}; // ======================== Render ========================
function addColumnNode(condition, node, columnValue, units, onColumnSelect) {
if (condition !== false) {
columns.push({
node: React.cloneElement(node, {
prefixCls: columnPrefixCls,
value: columnValue,
active: activeColumnIndex === columns.length,
onSelect: onColumnSelect,
units: units,
hideDisabledOptions: hideDisabledOptions
}),
onSelect: onColumnSelect,
value: columnValue,
units: units
});
}
} // Hour
addColumnNode(showHour, React.createElement(TimeUnitColumn, {
key: "hour"
}), hour, hours, function (num) {
onSelect(setTime(isPM, num, minute, second), 'mouse');
}); // Minute
addColumnNode(showMinute, React.createElement(TimeUnitColumn, {
key: "minute"
}), minute, minutes, function (num) {
onSelect(setTime(isPM, hour, num, second), 'mouse');
}); // Second
addColumnNode(showSecond, React.createElement(TimeUnitColumn, {
key: "second"
}), second, seconds, function (num) {
onSelect(setTime(isPM, hour, minute, num), 'mouse');
}); // 12 Hours
var PMIndex = -1;
if (typeof isPM === 'boolean') {
PMIndex = isPM ? 1 : 0;
}
addColumnNode(use12Hours === true, React.createElement(TimeUnitColumn, {
key: "12hours"
}), PMIndex, [{
label: 'AM',
value: 0
}, {
label: 'PM',
value: 1
}], function (num) {
onSelect(setTime(!!num, hour, minute, second), 'mouse');
});
return React.createElement("div", {
className: contentPrefixCls
}, columns.map(function (_ref) {
var node = _ref.node;
return node;
}));
}
export default TimeBody;

View File

@@ -0,0 +1,12 @@
/// <reference types="react" />
import { Locale } from '../../interface';
import { GenerateConfig } from '../../generate';
export interface TimeHeaderProps<DateType> {
prefixCls: string;
value?: DateType | null;
locale: Locale;
generateConfig: GenerateConfig<DateType>;
format: string;
}
declare function TimeHeader<DateType>(props: TimeHeaderProps<DateType>): JSX.Element;
export default TimeHeader;

View File

@@ -0,0 +1,24 @@
import * as React from 'react';
import Header from '../Header';
import PanelContext from '../../PanelContext';
function TimeHeader(props) {
var _React$useContext = React.useContext(PanelContext),
hideHeader = _React$useContext.hideHeader;
if (hideHeader) {
return null;
}
var prefixCls = props.prefixCls,
generateConfig = props.generateConfig,
locale = props.locale,
value = props.value,
format = props.format;
var headerPrefixCls = "".concat(prefixCls, "-header");
return React.createElement(Header, {
prefixCls: headerPrefixCls
}, value ? generateConfig.locale.format(locale.locale, value, format) : "\xA0");
}
export default TimeHeader;

View File

@@ -0,0 +1,16 @@
import * as React from 'react';
export interface Unit {
label: React.ReactText;
value: number;
disabled?: boolean;
}
export interface TimeUnitColumnProps {
prefixCls?: string;
units?: Unit[];
value?: number;
active?: boolean;
hideDisabledOptions?: boolean;
onSelect?: (value: number) => void;
}
declare function TimeUnitColumn(props: TimeUnitColumnProps): JSX.Element;
export default TimeUnitColumn;

View File

@@ -0,0 +1,71 @@
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
import * as React from 'react';
import classNames from 'classnames';
import { scrollTo } from '../../utils/uiUtil';
import PanelContext from '../../PanelContext';
function TimeUnitColumn(props) {
var prefixCls = props.prefixCls,
units = props.units,
onSelect = props.onSelect,
value = props.value,
active = props.active,
hideDisabledOptions = props.hideDisabledOptions;
var cellPrefixCls = "".concat(prefixCls, "-cell");
var _React$useContext = React.useContext(PanelContext),
open = _React$useContext.open;
var ulRef = React.useRef(null);
var liRefs = React.useRef(new Map()); // `useLayoutEffect` here to avoid blink by duration is 0
React.useLayoutEffect(function () {
var li = liRefs.current.get(value);
if (li && open !== false) {
scrollTo(ulRef.current, li.offsetTop, 120);
}
}, [value]);
React.useLayoutEffect(function () {
if (open) {
var li = liRefs.current.get(value);
if (li) {
scrollTo(ulRef.current, li.offsetTop, 0);
}
}
}, [open]);
return React.createElement("ul", {
className: classNames("".concat(prefixCls, "-column"), _defineProperty({}, "".concat(prefixCls, "-column-active"), active)),
ref: ulRef,
style: {
position: 'relative'
}
}, units.map(function (unit) {
var _classNames2;
if (hideDisabledOptions && unit.disabled) {
return null;
}
return React.createElement("li", {
key: unit.value,
ref: function ref(element) {
liRefs.current.set(unit.value, element);
},
className: classNames(cellPrefixCls, (_classNames2 = {}, _defineProperty(_classNames2, "".concat(cellPrefixCls, "-disabled"), unit.disabled), _defineProperty(_classNames2, "".concat(cellPrefixCls, "-selected"), value === unit.value), _classNames2)),
onClick: function onClick() {
if (unit.disabled) {
return;
}
onSelect(unit.value);
}
}, React.createElement("div", {
className: "".concat(cellPrefixCls, "-inner")
}, unit.label));
}));
}
export default TimeUnitColumn;

View File

@@ -0,0 +1,20 @@
/// <reference types="react" />
import { PanelSharedProps, DisabledTimes } from '../../interface';
export interface SharedTimeProps<DateType> extends DisabledTimes {
format?: string;
showHour?: boolean;
showMinute?: boolean;
showSecond?: boolean;
use12Hours?: boolean;
hourStep?: number;
minuteStep?: number;
secondStep?: number;
hideDisabledOptions?: boolean;
defaultValue?: DateType;
}
export interface TimePanelProps<DateType> extends PanelSharedProps<DateType>, SharedTimeProps<DateType> {
format?: string;
active?: boolean;
}
declare function TimePanel<DateType>(props: TimePanelProps<DateType>): JSX.Element;
export default TimePanel;

View File

@@ -0,0 +1,85 @@
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import * as React from 'react';
import classNames from 'classnames';
import TimeHeader from './TimeHeader';
import TimeBody from './TimeBody';
import { createKeyDownHandler } from '../../utils/uiUtil';
var countBoolean = function countBoolean(boolList) {
return boolList.filter(function (bool) {
return bool !== false;
}).length;
};
function TimePanel(props) {
var generateConfig = props.generateConfig,
_props$format = props.format,
format = _props$format === void 0 ? 'HH:mm:ss' : _props$format,
prefixCls = props.prefixCls,
active = props.active,
operationRef = props.operationRef,
showHour = props.showHour,
showMinute = props.showMinute,
showSecond = props.showSecond,
_props$use12Hours = props.use12Hours,
use12Hours = _props$use12Hours === void 0 ? false : _props$use12Hours,
onSelect = props.onSelect,
value = props.value;
var panelPrefixCls = "".concat(prefixCls, "-time-panel");
var bodyOperationRef = React.useRef(); // ======================= Keyboard =======================
var _React$useState = React.useState(-1),
_React$useState2 = _slicedToArray(_React$useState, 2),
activeColumnIndex = _React$useState2[0],
setActiveColumnIndex = _React$useState2[1];
var columnsCount = countBoolean([showHour, showMinute, showSecond, use12Hours]);
operationRef.current = {
onKeyDown: function onKeyDown(event) {
return createKeyDownHandler(event, {
onLeftRight: function onLeftRight(diff) {
setActiveColumnIndex((activeColumnIndex + diff + columnsCount) % columnsCount);
},
onUpDown: function onUpDown(diff) {
if (activeColumnIndex === -1) {
setActiveColumnIndex(0);
} else if (bodyOperationRef.current) {
bodyOperationRef.current.onUpDown(diff);
}
},
onEnter: function onEnter() {
onSelect(value || generateConfig.getNow(), 'key');
setActiveColumnIndex(-1);
}
});
},
onBlur: function onBlur() {
setActiveColumnIndex(-1);
}
};
return React.createElement("div", {
className: classNames(panelPrefixCls, _defineProperty({}, "".concat(panelPrefixCls, "-active"), active))
}, React.createElement(TimeHeader, Object.assign({}, props, {
format: format,
prefixCls: prefixCls
})), React.createElement(TimeBody, Object.assign({}, props, {
prefixCls: prefixCls,
activeColumnIndex: activeColumnIndex,
operationRef: bodyOperationRef
})));
}
export default TimePanel;