diff --git a/src/components/DatePicker/index.jsx b/src/components/DatePicker/index.jsx index 36e209997..5326aa104 100644 --- a/src/components/DatePicker/index.jsx +++ b/src/components/DatePicker/index.jsx @@ -11,6 +11,11 @@ const momentToDate = (date) => (!date || date instanceof Date ? date : date.toDa const withMoment = (DatePickerComponent) => React.forwardRef( ({ selected, onChange, startDate, endDate, minDate, maxDate, dateFormat, disableMomentFormat, ...props }, ref) => { + const _dateFormat = React.useMemo( + () => (disableMomentFormat ? dateFormat : transform(dateFormat)), + [dateFormat, disableMomentFormat] + ); + const isDate = selected instanceof Date; const handleChange = React.useCallback( (newDate) => { @@ -27,7 +32,7 @@ const withMoment = (DatePickerComponent) => endDate={momentToDate(endDate)} minDate={momentToDate(minDate)} maxDate={momentToDate(maxDate)} - dateFormat={disableMomentFormat ? dateFormat : transform(dateFormat)} + dateFormat={_dateFormat} onChange={handleChange} /> ); diff --git a/src/components/DatePicker/transformFormat.js b/src/components/DatePicker/transformFormat.js index bf1fdda67..f7b28de2c 100644 --- a/src/components/DatePicker/transformFormat.js +++ b/src/components/DatePicker/transformFormat.js @@ -11,8 +11,6 @@ const momentFormattingTokensRegExp = new RegExp( const dateFnsformattingTokensRegExp = /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g; -const cache = new Map(); - const tokenMapping = { YY: 'yy', YYYY: 'yyyy', @@ -136,7 +134,3 @@ export function transform(format) { return result; } - -export function clearCache() { - cache.clear(); -} diff --git a/src/components/DatePicker/transformFormat.spec.js b/src/components/DatePicker/transformFormat.spec.js index 7054b009b..155c96a72 100644 --- a/src/components/DatePicker/transformFormat.spec.js +++ b/src/components/DatePicker/transformFormat.spec.js @@ -1,14 +1,10 @@ import moment from 'moment'; import { format } from 'date-fns'; -import { transform, clearCache } from './transformFormat'; +import { transform } from './transformFormat'; describe('', () => { const date = new Date('2021-11-10T02:42:58.797Z'); - beforeEach(() => { - clearCache(); - }); - it('should format common format correctly', () => { const formats = [ 'YYYY-MM-DD', diff --git a/src/components/ListPicker/index.jsx b/src/components/ListPicker/index.jsx index f17b006ea..31a791150 100644 --- a/src/components/ListPicker/index.jsx +++ b/src/components/ListPicker/index.jsx @@ -45,11 +45,9 @@ const ListPicker = ({ const [disableApplyButton, setDisableApplyButton] = React.useState(getApplyButtonState(initialSelection)); const selectItem = (item) => { - if (!allowMultiSelection) selectedItems.length = 0; - - selectedItems.push(item); - setSelectedItems(selectedItems); - setDisableApplyButton(getApplyButtonState(selectedItems)); + const newSelectedItems = allowMultiSelection ? [...selectedItems, item] : [item]; + setSelectedItems(newSelectedItems); + setDisableApplyButton(getApplyButtonState(newSelectedItems)); }; const deselectItem = (item) => { diff --git a/src/components/ListPickerPure/index.jsx b/src/components/ListPickerPure/index.jsx index 13b06c5f2..d3af22190 100644 --- a/src/components/ListPickerPure/index.jsx +++ b/src/components/ListPickerPure/index.jsx @@ -43,31 +43,18 @@ const ListPickerPure = ({ const handleChange = (item) => { return () => { const isSelected = isItemSelected(item); - updateSelectedItems(item, isSelected); if (isSelected) { + setSelectedItems((_selectedItems) => + allowMultiSelection ? _.reject(_selectedItems, { id: item.id }) : [item] + ); deselectItem(item, allowMultiSelection); } else { + setSelectedItems((_selectedItems) => (allowMultiSelection ? [..._selectedItems, item] : [item])); selectItem(item, allowMultiSelection); } }; }; - const updateSelectedItems = (item, isSelected) => { - const newSelectedItemsArray = _.clone(selectedItems); - - if (allowMultiSelection) { - if (isSelected) { - _.remove(newSelectedItemsArray, { id: item.id }); - } else { - newSelectedItemsArray.push(item); - } - - setSelectedItems(newSelectedItemsArray); - } else { - setSelectedItems([item]); - } - }; - const ToggleComponent = allowMultiSelection ? Checkbox : Radio; return ( diff --git a/src/styles/bootstrap-custom.css b/src/styles/bootstrap-custom.css index 1fd36614e..248625fbf 100644 --- a/src/styles/bootstrap-custom.css +++ b/src/styles/bootstrap-custom.css @@ -4688,7 +4688,7 @@ button.close { height: auto; line-height: 1; } -@media all and (transform-3d), (-webkit-transform-3d) { +@media all and (-webkit-transform-3d) { .carousel-inner > .item { -webkit-transition: -webkit-transform 0.6s ease-in-out; -moz-transition: -moz-transform 0.6s ease-in-out; @@ -4937,6 +4937,7 @@ button.close { .text-hide { font: 0/0 a; + font-family: inherit; color: transparent; text-shadow: none; background-color: transparent;