diginet-core-ui 1.4.54-beta.3 → 1.4.55-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/accordion/details.js +1 -1
- package/components/accordion/group.js +1 -1
- package/components/accordion/index.js +1 -1
- package/components/accordion/summary.js +1 -1
- package/components/alert/index.js +1 -1
- package/components/alert/notify.js +1 -1
- package/components/avatar/index.js +2 -2
- package/components/badge/index.js +1 -1
- package/components/breadcrumb/index.js +1 -1
- package/components/button/icon.js +1 -1
- package/components/button/index.js +1 -1
- package/components/button/more.js +16 -7
- package/components/button/ripple-effect.js +1 -1
- package/components/card/body.js +1 -1
- package/components/card/extra.js +1 -1
- package/components/card/footer.js +1 -1
- package/components/card/header.js +1 -1
- package/components/card/index.js +1 -1
- package/components/chart/Pie/Circle.js +1 -1
- package/components/chart/Pie/Sector.js +1 -1
- package/components/chart/Pie/index.js +1 -1
- package/components/chart/Pie-v2/Circle.js +1 -1
- package/components/chart/Pie-v2/Sector.js +1 -1
- package/components/chart/Pie-v2/index.js +1 -1
- package/components/chart/bar/Bar.js +1 -1
- package/components/chart/bar/index.js +1 -1
- package/components/chart/bar-v2/Bar.js +1 -1
- package/components/chart/bar-v2/index.js +1 -1
- package/components/chart/line/index.js +1 -1
- package/components/chart/line-v2/index.js +1 -1
- package/components/check-text/index.js +1 -1
- package/components/check-text/interview-confirmation.js +1 -1
- package/components/check-text/interview-status.js +1 -1
- package/components/chip/index.js +1 -1
- package/components/collapse/index.js +1 -1
- package/components/divider/index.js +1 -1
- package/components/form-control/attachment/index.js +22 -22
- package/components/form-control/calendar/index.js +1 -1
- package/components/form-control/calendar/range.js +1 -1
- package/components/form-control/checkbox/index.js +1 -1
- package/components/form-control/control/index.js +1 -1
- package/components/form-control/date-input/index.js +1 -1
- package/components/form-control/date-picker/index.js +1 -1
- package/components/form-control/date-range-picker/index.js +273 -38
- package/components/form-control/dropdown/index.js +77 -54
- package/components/form-control/dropdown-box/index.js +1 -1
- package/components/form-control/form-group/index.js +1 -1
- package/components/form-control/helper-text/index.js +1 -1
- package/components/form-control/input-base/UncontrolledInputBase.js +1 -1
- package/components/form-control/input-base/index.js +1 -1
- package/components/form-control/label/index.js +1 -1
- package/components/form-control/money-input/index.js +1 -1
- package/components/form-control/number-input/index2.js +19 -19
- package/components/form-control/password-input/index.js +1 -1
- package/components/form-control/phone-input/index.js +1 -1
- package/components/form-control/radio/index.js +1 -1
- package/components/form-control/text-input/index.js +1 -1
- package/components/form-control/time-picker/index.js +1 -1
- package/components/form-control/time-picker/v2/index.js +1 -1
- package/components/form-control/toggle/index.js +1 -1
- package/components/form-view/input.js +1 -1
- package/components/grid/index.js +1 -1
- package/components/image/index.js +1 -1
- package/components/list/list-item-action.js +1 -1
- package/components/list/list-item-icon.js +1 -1
- package/components/list/list-item-text.js +1 -1
- package/components/list/list-item.js +1 -1
- package/components/list/list.js +1 -1
- package/components/list/sub-header.js +1 -1
- package/components/modal/body.js +1 -1
- package/components/modal/footer.js +1 -1
- package/components/modal/header.js +1 -1
- package/components/modal/index.js +1 -1
- package/components/modal/modal.js +1 -1
- package/components/others/option-wrapper/index.js +1 -1
- package/components/paging/page-info.js +35 -35
- package/components/paging/page-selector.js +1 -1
- package/components/paper/index.js +1 -1
- package/components/popover/body.js +1 -1
- package/components/popover/footer.js +1 -1
- package/components/popover/header.js +1 -1
- package/components/popover/index.js +14 -14
- package/components/popup/index.js +1 -1
- package/components/popup/v2/index.js +1 -1
- package/components/progress/circular.js +1 -1
- package/components/progress/linear.js +1 -1
- package/components/rating/index.js +1 -1
- package/components/skeleton/index.js +1 -1
- package/components/slider/slider-container.js +1 -1
- package/components/slider/slider-item.js +1 -1
- package/components/status/index.js +1 -1
- package/components/tab/tab-container.js +1 -1
- package/components/tab/tab-header.js +1 -1
- package/components/tab/tab-panel.js +1 -1
- package/components/tab/tab.js +1 -1
- package/components/tooltip/index.js +1 -1
- package/components/transfer/index.js +1 -1
- package/components/tree-view/index.js +1 -1
- package/components/typography/index.js +1 -1
- package/global/index.js +3 -0
- package/icons/effect.js +1 -1
- package/icons/menu/v2/index.js +1 -1
- package/package.json +1 -1
- package/readme.md +10 -0
|
@@ -13,7 +13,7 @@ import { classNames, getProp, hexToRGBA, useDelayUnmount } from "../../utils";
|
|
|
13
13
|
import ModalContext from "./context";
|
|
14
14
|
const fadeInDown = animations.fadeInDown;
|
|
15
15
|
const fadeOutUp = animations.fadeOutUp;
|
|
16
|
-
const Modal = /*#__PURE__*/memo(
|
|
16
|
+
const Modal = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
17
17
|
if (!reference) reference = useRef(null);
|
|
18
18
|
const theme = useTheme();
|
|
19
19
|
const {
|
|
@@ -4,7 +4,7 @@ import { jsx } from '@emotion/core';
|
|
|
4
4
|
import { forwardRef, memo, useEffect, useState } from 'react';
|
|
5
5
|
import sx from "../../../styles/sx";
|
|
6
6
|
const OptionWrapper = Component => {
|
|
7
|
-
const WrappedComponent = /*#__PURE__*/memo(
|
|
7
|
+
const WrappedComponent = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((props, ref) => {
|
|
8
8
|
const [options, setOptions] = useState({});
|
|
9
9
|
const option = (option, optionValue) => {
|
|
10
10
|
if (typeof option === 'undefined') {
|
|
@@ -17,7 +17,7 @@ const getLastPage = (totalItems, itemsPerPage) => {
|
|
|
17
17
|
}
|
|
18
18
|
return _lastPage + 1;
|
|
19
19
|
};
|
|
20
|
-
const PagingInfo = /*#__PURE__*/memo(
|
|
20
|
+
const PagingInfo = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
21
21
|
action = {},
|
|
22
22
|
bgColor: bgColorProp,
|
|
23
23
|
className,
|
|
@@ -533,22 +533,22 @@ PagingInfo.propTypes = {
|
|
|
533
533
|
onChangePage: PropTypes.func,
|
|
534
534
|
/** Callback fired when quantity on per page changed. */
|
|
535
535
|
onChangePerPage: PropTypes.func,
|
|
536
|
-
/**
|
|
537
|
-
* Callback fired when page number is changing.
|
|
538
|
-
*
|
|
539
|
-
* * prevPage: Page before changed
|
|
540
|
-
* * newPage: Page after changed
|
|
541
|
-
* * cancel(value): Function cancel change page
|
|
542
|
-
* * @param {value} - bool
|
|
536
|
+
/**
|
|
537
|
+
* Callback fired when page number is changing.
|
|
538
|
+
*
|
|
539
|
+
* * prevPage: Page before changed
|
|
540
|
+
* * newPage: Page after changed
|
|
541
|
+
* * cancel(value): Function cancel change page
|
|
542
|
+
* * @param {value} - bool
|
|
543
543
|
*/
|
|
544
544
|
onChangingPage: PropTypes.func,
|
|
545
|
-
/**
|
|
546
|
-
* Callback fired when quantity on item per page is changing.
|
|
547
|
-
*
|
|
548
|
-
* * prevPerPage: Items per page before changed
|
|
549
|
-
* * newPerPage: Items per page after changed
|
|
550
|
-
* * cancel(value): Function cancel change items per page
|
|
551
|
-
* * @param {value} - bool
|
|
545
|
+
/**
|
|
546
|
+
* Callback fired when quantity on item per page is changing.
|
|
547
|
+
*
|
|
548
|
+
* * prevPerPage: Items per page before changed
|
|
549
|
+
* * newPerPage: Items per page after changed
|
|
550
|
+
* * cancel(value): Function cancel change items per page
|
|
551
|
+
* * @param {value} - bool
|
|
552
552
|
*/
|
|
553
553
|
onChangingPerPage: PropTypes.func,
|
|
554
554
|
/** Style inline of component. */
|
|
@@ -557,26 +557,26 @@ PagingInfo.propTypes = {
|
|
|
557
557
|
totalItems: PropTypes.number,
|
|
558
558
|
/** Compact type for mobile. */
|
|
559
559
|
typeShort: PropTypes.bool
|
|
560
|
-
/**
|
|
561
|
-
* ref methods (ref.current.instance.*method*)
|
|
562
|
-
*
|
|
563
|
-
* * onChangePage(page): Change page number
|
|
564
|
-
* * @param {page} - number
|
|
565
|
-
* * onChangePerPage(per): Change quantity on per page
|
|
566
|
-
* * @param {per} - number
|
|
567
|
-
* * setTotalItems(items): Set total items
|
|
568
|
-
* * @param {items} - number
|
|
569
|
-
*
|
|
570
|
-
* * option(): Gets all UI component properties
|
|
571
|
-
* * Returns value - object
|
|
572
|
-
* * option(optionName): Gets the value of a single property
|
|
573
|
-
* * @param {optionName} - string
|
|
574
|
-
* * Returns value - any
|
|
575
|
-
* * option(optionName, optionValue): Updates the value of a single property
|
|
576
|
-
* * @param {optionName} - string
|
|
577
|
-
* * @param {optionValue} - any
|
|
578
|
-
* * option(options): Updates the values of several properties
|
|
579
|
-
* * @param {options} - object
|
|
560
|
+
/**
|
|
561
|
+
* ref methods (ref.current.instance.*method*)
|
|
562
|
+
*
|
|
563
|
+
* * onChangePage(page): Change page number
|
|
564
|
+
* * @param {page} - number
|
|
565
|
+
* * onChangePerPage(per): Change quantity on per page
|
|
566
|
+
* * @param {per} - number
|
|
567
|
+
* * setTotalItems(items): Set total items
|
|
568
|
+
* * @param {items} - number
|
|
569
|
+
*
|
|
570
|
+
* * option(): Gets all UI component properties
|
|
571
|
+
* * Returns value - object
|
|
572
|
+
* * option(optionName): Gets the value of a single property
|
|
573
|
+
* * @param {optionName} - string
|
|
574
|
+
* * Returns value - any
|
|
575
|
+
* * option(optionName, optionValue): Updates the value of a single property
|
|
576
|
+
* * @param {optionName} - string
|
|
577
|
+
* * @param {optionValue} - any
|
|
578
|
+
* * option(options): Updates the values of several properties
|
|
579
|
+
* * @param {options} - object
|
|
580
580
|
*/
|
|
581
581
|
};
|
|
582
582
|
export { PagingInfo };
|
|
@@ -17,7 +17,7 @@ const getLastPage = (totalItems, itemsPerPage) => {
|
|
|
17
17
|
}
|
|
18
18
|
return _lastPage + 1;
|
|
19
19
|
};
|
|
20
|
-
const PagingSelector = /*#__PURE__*/memo(
|
|
20
|
+
const PagingSelector = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
21
21
|
action = {},
|
|
22
22
|
className,
|
|
23
23
|
currentPage,
|
|
@@ -5,7 +5,7 @@ import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useRef } fro
|
|
|
5
5
|
import { bgColor, border, borderRadius, parseMaxHeight, parseWidth, parseWidthHeight, shadowSmall } from "../../styles/general";
|
|
6
6
|
import { useTheme } from "../../theme";
|
|
7
7
|
import { classNames, getProp, renderHTML } from "../../utils";
|
|
8
|
-
const Paper = /*#__PURE__*/memo(
|
|
8
|
+
const Paper = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
9
9
|
width,
|
|
10
10
|
height,
|
|
11
11
|
mapping,
|
|
@@ -8,7 +8,7 @@ import { bgColor, border, borderRadius, displayFlex, flexCol, order, overflowAut
|
|
|
8
8
|
import { useTheme } from "../../theme";
|
|
9
9
|
import useThemeProps from "../../theme/utils/useThemeProps";
|
|
10
10
|
import { classNames, getProp } from "../../utils";
|
|
11
|
-
const PopoverBody = /*#__PURE__*/memo(
|
|
11
|
+
const PopoverBody = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
12
12
|
if (!reference) reference = useRef(null);
|
|
13
13
|
const theme = useTheme();
|
|
14
14
|
|
|
@@ -8,7 +8,7 @@ import { bgColor, borderRadius, boxBorder, displayFlex, flexRow, itemsCenter, ju
|
|
|
8
8
|
import { useTheme } from "../../theme";
|
|
9
9
|
import useThemeProps from "../../theme/utils/useThemeProps";
|
|
10
10
|
import { classNames, getProp } from "../../utils";
|
|
11
|
-
const PopoverFooter = /*#__PURE__*/memo(
|
|
11
|
+
const PopoverFooter = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
12
12
|
if (!reference) reference = useRef(null);
|
|
13
13
|
const theme = useTheme();
|
|
14
14
|
|
|
@@ -9,7 +9,7 @@ import { bgColor, borderRadius, boxBorder, displayFlex, flexRow, itemsCenter, or
|
|
|
9
9
|
import { useTheme } from "../../theme";
|
|
10
10
|
import useThemeProps from "../../theme/utils/useThemeProps";
|
|
11
11
|
import { classNames, getProp } from "../../utils";
|
|
12
|
-
const PopoverHeader = /*#__PURE__*/memo(
|
|
12
|
+
const PopoverHeader = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
13
13
|
if (!reference) reference = useRef(null);
|
|
14
14
|
const theme = useTheme();
|
|
15
15
|
|
|
@@ -106,7 +106,7 @@ const getDirectionPopover = direction => {
|
|
|
106
106
|
};
|
|
107
107
|
}
|
|
108
108
|
};
|
|
109
|
-
const Popover = /*#__PURE__*/memo(
|
|
109
|
+
const Popover = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
110
110
|
if (!reference) reference = useRef(null);
|
|
111
111
|
const theme = useTheme();
|
|
112
112
|
const {
|
|
@@ -202,7 +202,7 @@ const Popover = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, reference)
|
|
|
202
202
|
}
|
|
203
203
|
};
|
|
204
204
|
const updatePositionPopover = (el = null, cb) => {
|
|
205
|
-
var _window, _window2, _anchor6, _anchorRect, _anchorRect2, _anchor7, _anchorRect3, _anchorRect4, _anchorRect5, _anchorRect6, _anchorRect7, _anchorRect8, _anchorRect9,
|
|
205
|
+
var _window, _window2, _anchor6, _anchorRect, _anchorRect2, _anchor7, _anchorRect3, _anchorRect4, _anchorRect5, _anchorRect6, _anchorRect7, _anchorRect8, _anchorRect9, _anchorRect0, _anchorRect1, _anchorRect10, _newDirectionObject, _newDirectionObject$t, _transformOrigin, _newDirectionObject2, _newDirectionObject2$, _transformOrigin2;
|
|
206
206
|
if (el instanceof Element) setElement(el);
|
|
207
207
|
if (!ref.current) {
|
|
208
208
|
window.removeEventListener('resize', updatePositionPopover);
|
|
@@ -336,36 +336,36 @@ const Popover = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, reference)
|
|
|
336
336
|
|
|
337
337
|
// Valid mean popover not at top-left, top-right, bottom-left, bottom-right
|
|
338
338
|
const validVerticalArrow = left >= ((_anchorRect5 = anchorRect) === null || _anchorRect5 === void 0 ? void 0 : _anchorRect5.left) + ((_anchorRect6 = anchorRect) === null || _anchorRect6 === void 0 ? void 0 : _anchorRect6.width) / 2 - popoverWidth && left <= ((_anchorRect7 = anchorRect) === null || _anchorRect7 === void 0 ? void 0 : _anchorRect7.right) - ((_anchorRect8 = anchorRect) === null || _anchorRect8 === void 0 ? void 0 : _anchorRect8.width) / 2 + popoverWidth;
|
|
339
|
-
const validHorizontalArrow = top >= ((_anchorRect9 = anchorRect) === null || _anchorRect9 === void 0 ? void 0 : _anchorRect9.top) + ((
|
|
339
|
+
const validHorizontalArrow = top >= ((_anchorRect9 = anchorRect) === null || _anchorRect9 === void 0 ? void 0 : _anchorRect9.top) + ((_anchorRect0 = anchorRect) === null || _anchorRect0 === void 0 ? void 0 : _anchorRect0.height) / 2 - popoverHeight && top <= ((_anchorRect1 = anchorRect) === null || _anchorRect1 === void 0 ? void 0 : _anchorRect1.bottom) - ((_anchorRect10 = anchorRect) === null || _anchorRect10 === void 0 ? void 0 : _anchorRect10.height) / 2;
|
|
340
340
|
|
|
341
341
|
// Get arrow's position
|
|
342
342
|
if (arrow && translate) {
|
|
343
343
|
switch (aPosition) {
|
|
344
344
|
case 'top':
|
|
345
345
|
if (validVerticalArrow) {
|
|
346
|
-
var
|
|
347
|
-
arrowPosition.left = ((
|
|
346
|
+
var _anchorRect11, _anchorRect12;
|
|
347
|
+
arrowPosition.left = ((_anchorRect11 = anchorRect) === null || _anchorRect11 === void 0 ? void 0 : _anchorRect11.width) / 2 + ((_anchorRect12 = anchorRect) === null || _anchorRect12 === void 0 ? void 0 : _anchorRect12.left) - arrowSize + 'px';
|
|
348
348
|
arrowPosition.top = Math.round(top) - arrowSize + 'px';
|
|
349
349
|
}
|
|
350
350
|
break;
|
|
351
351
|
case 'bottom':
|
|
352
352
|
if (validVerticalArrow) {
|
|
353
|
-
var
|
|
354
|
-
arrowPosition.left = ((
|
|
353
|
+
var _anchorRect13, _anchorRect14;
|
|
354
|
+
arrowPosition.left = ((_anchorRect13 = anchorRect) === null || _anchorRect13 === void 0 ? void 0 : _anchorRect13.width) / 2 + ((_anchorRect14 = anchorRect) === null || _anchorRect14 === void 0 ? void 0 : _anchorRect14.left) - arrowSize + 'px';
|
|
355
355
|
arrowPosition.top = Math.round(top) + popoverHeight + 'px';
|
|
356
356
|
}
|
|
357
357
|
break;
|
|
358
358
|
case 'left':
|
|
359
359
|
if (validHorizontalArrow) {
|
|
360
|
-
var
|
|
361
|
-
arrowPosition.top = ((
|
|
360
|
+
var _anchorRect15, _anchorRect16;
|
|
361
|
+
arrowPosition.top = ((_anchorRect15 = anchorRect) === null || _anchorRect15 === void 0 ? void 0 : _anchorRect15.height) / 2 + ((_anchorRect16 = anchorRect) === null || _anchorRect16 === void 0 ? void 0 : _anchorRect16.top) - arrowSize / 2 + 'px';
|
|
362
362
|
arrowPosition.left = Math.round(left) - 1.5 * arrowSize + 'px';
|
|
363
363
|
}
|
|
364
364
|
break;
|
|
365
365
|
case 'right':
|
|
366
366
|
if (validHorizontalArrow) {
|
|
367
|
-
var
|
|
368
|
-
arrowPosition.top = ((
|
|
367
|
+
var _anchorRect17, _anchorRect18;
|
|
368
|
+
arrowPosition.top = ((_anchorRect17 = anchorRect) === null || _anchorRect17 === void 0 ? void 0 : _anchorRect17.height) / 2 + ((_anchorRect18 = anchorRect) === null || _anchorRect18 === void 0 ? void 0 : _anchorRect18.top) - arrowSize / 2 + 'px';
|
|
369
369
|
arrowPosition.left = Math.round(left) + popoverWidth - arrowSize / 2 + 'px';
|
|
370
370
|
}
|
|
371
371
|
break;
|
|
@@ -495,15 +495,15 @@ const Popover = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, reference)
|
|
|
495
495
|
return currentRef;
|
|
496
496
|
});
|
|
497
497
|
const renderAnchor = () => {
|
|
498
|
-
var
|
|
499
|
-
if (!((
|
|
498
|
+
var _anchor0, _anchor1, _anchor1$props;
|
|
499
|
+
if (!((_anchor0 = anchor) !== null && _anchor0 !== void 0 && _anchor0.type)) return null;
|
|
500
500
|
const AnchorTag = /*#__PURE__*/React.cloneElement(anchor, {
|
|
501
501
|
ref: ref => {
|
|
502
502
|
anchor = ref;
|
|
503
503
|
},
|
|
504
504
|
style: {
|
|
505
505
|
cursor: 'pointer',
|
|
506
|
-
...(((
|
|
506
|
+
...(((_anchor1 = anchor) === null || _anchor1 === void 0 ? void 0 : (_anchor1$props = _anchor1.props) === null || _anchor1$props === void 0 ? void 0 : _anchor1$props.style) || {})
|
|
507
507
|
}
|
|
508
508
|
});
|
|
509
509
|
return AnchorTag;
|
|
@@ -16,7 +16,7 @@ const titleMap = new Map([['yesno', 'notify'], ['success', 'confirm'], ['warning
|
|
|
16
16
|
const iconMap = new Map([['yesno', 'Info'], ['success', 'ApprovalFilled'], ['warning', 'Warning'], ['danger', 'Failed'], ['info', 'Info']]);
|
|
17
17
|
const fadeInDown = animations.fadeInDown;
|
|
18
18
|
const fadeOutUp = animations.fadeOutUp;
|
|
19
|
-
const Popup = /*#__PURE__*/memo(
|
|
19
|
+
const Popup = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
20
20
|
action = {},
|
|
21
21
|
cancelProps,
|
|
22
22
|
className,
|
|
@@ -121,7 +121,7 @@ const getDimension = (size, theme) => {
|
|
|
121
121
|
}
|
|
122
122
|
};
|
|
123
123
|
const directionAngleMap = new Map([['top', -90], ['bottom', 90], ['right', 0], ['left', -180]]);
|
|
124
|
-
const CircularProgress = /*#__PURE__*/memo(
|
|
124
|
+
const CircularProgress = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
125
125
|
action = {},
|
|
126
126
|
background: backgroundProp,
|
|
127
127
|
circleRef,
|
|
@@ -249,7 +249,7 @@ Determinate.propTypes = {
|
|
|
249
249
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
|
|
250
250
|
};
|
|
251
251
|
export const DeterminateLinearProgress = /*#__PURE__*/memo(Determinate);
|
|
252
|
-
const LinearProgress = /*#__PURE__*/memo(
|
|
252
|
+
const LinearProgress = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
253
253
|
background,
|
|
254
254
|
className,
|
|
255
255
|
color,
|
|
@@ -7,7 +7,7 @@ import { Fragment, forwardRef, memo, useEffect, useImperativeHandle, useMemo, us
|
|
|
7
7
|
import { bgColor, border, borderColor, cursorPointer, displayInlineFlex, flexRow, flexRowReverse, itemsCenter, outlineNone, overflowHidden, parseWidth, pointerEventsNone, positionAbsolute, positionRelative, textColor } from "../../styles/general";
|
|
8
8
|
import { useTheme } from "../../theme";
|
|
9
9
|
import { classNames, getProp, hexToRGBA, randomString } from "../../utils";
|
|
10
|
-
const Rating = /*#__PURE__*/memo(
|
|
10
|
+
const Rating = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
11
11
|
id,
|
|
12
12
|
disabled,
|
|
13
13
|
readOnly,
|
|
@@ -8,7 +8,7 @@ import { parseWidthHeight } from "../../styles/general";
|
|
|
8
8
|
import { useTheme } from "../../theme";
|
|
9
9
|
import useThemeProps from "../../theme/utils/useThemeProps";
|
|
10
10
|
import { classNames, getProp } from "../../utils";
|
|
11
|
-
const Skeleton = /*#__PURE__*/memo(
|
|
11
|
+
const Skeleton = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
12
12
|
if (!reference) reference = useRef(null);
|
|
13
13
|
const theme = useTheme();
|
|
14
14
|
// const { spacing } = theme;
|
|
@@ -12,7 +12,7 @@ const colorMap = new Map([['default', 'system/rest']]);
|
|
|
12
12
|
const iconSizeMap = new Map([['small', '16px'], ['medium', '20px'], ['large', '24px']]);
|
|
13
13
|
const typographySizeMap = new Map([['small', 'p3'], ['medium', 'p2'], ['large', 'p1']]);
|
|
14
14
|
const filledPaddingSizeMap = new Map([['small', [0.5, 2]], ['medium', [0.5, 2]], ['large', [0.5, 3]]]);
|
|
15
|
-
const Status = /*#__PURE__*/memo(
|
|
15
|
+
const Status = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
16
16
|
action = {},
|
|
17
17
|
className,
|
|
18
18
|
color: colorProp,
|
|
@@ -8,7 +8,7 @@ import useThemeProps from "../../theme/utils/useThemeProps";
|
|
|
8
8
|
import { classNames } from "../../utils";
|
|
9
9
|
import TabContext from "./context";
|
|
10
10
|
const typographyByLevelMap = new Map([['level1', 'h3'], ['level2', 'p1']]);
|
|
11
|
-
const TabContainer = /*#__PURE__*/memo(
|
|
11
|
+
const TabContainer = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
12
12
|
if (!reference) reference = useRef(null);
|
|
13
13
|
|
|
14
14
|
// props priority: `inProps` > `themeDefaultProps`
|
|
@@ -9,7 +9,7 @@ import { useTheme } from "../../theme";
|
|
|
9
9
|
import useThemeProps from "../../theme/utils/useThemeProps";
|
|
10
10
|
import { classNames } from "../../utils";
|
|
11
11
|
import TabContext from "./context";
|
|
12
|
-
const TabHeader = /*#__PURE__*/memo(
|
|
12
|
+
const TabHeader = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
13
13
|
var _ref$current, _ref$current2;
|
|
14
14
|
if (!reference) reference = useRef(null);
|
|
15
15
|
|
|
@@ -8,7 +8,7 @@ import { useTheme } from "../../theme";
|
|
|
8
8
|
import useThemeProps from "../../theme/utils/useThemeProps";
|
|
9
9
|
import { classNames, getProp } from "../../utils";
|
|
10
10
|
import TabContext from "./context";
|
|
11
|
-
const TabPanel = /*#__PURE__*/memo(
|
|
11
|
+
const TabPanel = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
12
12
|
if (!reference) reference = useRef(null);
|
|
13
13
|
|
|
14
14
|
// props priority: `inProps` > `themeDefaultProps`
|
package/components/tab/tab.js
CHANGED
|
@@ -10,7 +10,7 @@ import { useTheme } from "../../theme";
|
|
|
10
10
|
import useThemeProps from "../../theme/utils/useThemeProps";
|
|
11
11
|
import { classNames, getProp } from "../../utils";
|
|
12
12
|
import TabContext from "./context";
|
|
13
|
-
const TabItem = /*#__PURE__*/memo(
|
|
13
|
+
const TabItem = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
14
14
|
if (!reference) reference = useRef(null);
|
|
15
15
|
|
|
16
16
|
// props priority: `inProps` > `themeDefaultProps`
|
|
@@ -8,7 +8,7 @@ import { Fragment, forwardRef, memo, useMemo, useRef, useState } from 'react';
|
|
|
8
8
|
import { bgColor, borderRadius, boxBorder, displayBlock, displayFlex, displayInlineFlex, flexCol, itemsCenter, justifyCenter, objectCover, parseMinHeight, parseWidth, parseWidthHeight, positionRelative, positionSticky, shadowSmall, top, z } from "../../styles/general";
|
|
9
9
|
import { useTheme } from "../../theme";
|
|
10
10
|
import { capitalize, classNames, getProp } from "../../utils";
|
|
11
|
-
const Transfer = /*#__PURE__*/memo(
|
|
11
|
+
const Transfer = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
12
12
|
choicesList,
|
|
13
13
|
chosenList,
|
|
14
14
|
selectAll,
|
|
@@ -13,7 +13,7 @@ import { classNames, getProp, mapParent, randomString, removeUnicode } from "../
|
|
|
13
13
|
const separatorPattern = /\{\w+\}/g;
|
|
14
14
|
const currentValue = {},
|
|
15
15
|
itemsRenderAsync = {};
|
|
16
|
-
const TreeView = /*#__PURE__*/memo(
|
|
16
|
+
const TreeView = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
17
17
|
var _value3;
|
|
18
18
|
if (!reference) reference = useRef(null);
|
|
19
19
|
const theme = useTheme();
|
|
@@ -11,7 +11,7 @@ import { classNames, getProp, renderHTML } from "../../utils";
|
|
|
11
11
|
const colorMap = new Map([['default', 'text/main']]);
|
|
12
12
|
const formatMap = new Map([['capitalize', textCapitalize], ['uppercase', textUppercase], ['lowercase', textLowercase], ['italic', italic], ['line-through', textLineThrough], ['underline', textUnderline], ['sentence', textSentence]]);
|
|
13
13
|
const isTextClamped = elm => (elm === null || elm === void 0 ? void 0 : elm.scrollHeight) > (elm === null || elm === void 0 ? void 0 : elm.clientHeight);
|
|
14
|
-
const Typography = /*#__PURE__*/memo(
|
|
14
|
+
const Typography = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
15
15
|
var _ref$current;
|
|
16
16
|
// props priority: `inProps` > `themeDefaultProps`
|
|
17
17
|
const props = useThemeProps({
|
package/global/index.js
CHANGED
|
@@ -50,6 +50,7 @@ const globalObject = {
|
|
|
50
50
|
yesterday: 'Hôm qua',
|
|
51
51
|
thisWeek: 'Tuần này',
|
|
52
52
|
thisMonth: 'Tháng này',
|
|
53
|
+
selectPeriod: 'Chọn theo kỳ',
|
|
53
54
|
// Time Picker
|
|
54
55
|
months: {
|
|
55
56
|
full: ['tháng 01', 'tháng 02', 'tháng 03', 'tháng 04', 'tháng 05', 'tháng 06', 'tháng 07', 'tháng 08', 'tháng 09', 'tháng 10', 'tháng 11', 'tháng 12'],
|
|
@@ -130,6 +131,7 @@ const globalObject = {
|
|
|
130
131
|
yesterday: 'Yesterday',
|
|
131
132
|
thisWeek: 'This week',
|
|
132
133
|
thisMonth: 'This month',
|
|
134
|
+
selectPeriod: 'Select period',
|
|
133
135
|
// Time Picker
|
|
134
136
|
months: {
|
|
135
137
|
full: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
|
|
@@ -210,6 +212,7 @@ const globalObject = {
|
|
|
210
212
|
yesterday: '昨天',
|
|
211
213
|
thisWeek: '本周',
|
|
212
214
|
thisMonth: '本月',
|
|
215
|
+
selectPeriod: '按期选择',
|
|
213
216
|
// Time Picker
|
|
214
217
|
months: {
|
|
215
218
|
full: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
|
package/icons/effect.js
CHANGED
|
@@ -10,7 +10,7 @@ import useThemeProps from "../theme/utils/useThemeProps";
|
|
|
10
10
|
import { capitalize, classNames, getProp } from "../utils";
|
|
11
11
|
import * as Icons from "./basic";
|
|
12
12
|
const iconColorMap = new Map([['Image', 'dynamic/pumpkin'], ['Compressed', 'dynamic/violet'], ['Presentation', 'dynamic/pumpkin'], ['Sheet', 'semantic/success'], ['Word', 'semantic/info'], ['Pdf', 'semantic/danger']]);
|
|
13
|
-
const Icon = /*#__PURE__*/memo(
|
|
13
|
+
const Icon = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((inProps, reference) => {
|
|
14
14
|
if (!reference) reference = useRef(null);
|
|
15
15
|
const theme = useTheme();
|
|
16
16
|
|
package/icons/menu/v2/index.js
CHANGED
|
@@ -6,7 +6,7 @@ import { jsx } from '@emotion/core';
|
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
7
7
|
import { forwardRef, memo, useImperativeHandle, useMemo, useRef } from 'react';
|
|
8
8
|
import { classNames } from "../../../utils";
|
|
9
|
-
const IconMenu = /*#__PURE__*/memo(
|
|
9
|
+
const IconMenu = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(({
|
|
10
10
|
action,
|
|
11
11
|
className,
|
|
12
12
|
height,
|
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -42,6 +42,16 @@ npm test
|
|
|
42
42
|
|
|
43
43
|
## Changelog
|
|
44
44
|
|
|
45
|
+
## 1.4.55
|
|
46
|
+
- \[Added\]: Icon – Add IconMenu MHRM09N1401, MHRM09N1402
|
|
47
|
+
- \[Added\]: Icon – Add Icon Book
|
|
48
|
+
- \[Added\]: Icon – Add Icon PaperCancel, LoadingV2
|
|
49
|
+
- \[Added\]: Icon – Add IconMenu MHRM21N0001
|
|
50
|
+
- \[Added\]: Dropdown - Add 'selectAll' prop to allow multiple selection
|
|
51
|
+
- \[Added\]: ButtonMore – Add new property to ButtonMore
|
|
52
|
+
- \[Added\]: Dropdown – Add support for allowing Dropdown to reselect the same value multiple times
|
|
53
|
+
- \[Added\]: DateRangePicker – Add a new mode to change the UI of DateRangePicker
|
|
54
|
+
|
|
45
55
|
## 1.4.54
|
|
46
56
|
- \[Added\]: Icon – Add Icon Camera
|
|
47
57
|
- \[Fixed\]: Treeview - Fix bug Treeview keeps the search bar visible while scrolling
|