@scaleflex/widget-common 4.3.0 → 4.4.0
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/CHANGELOG.md +8 -0
- package/package.json +4 -4
- package/dist/style.css +0 -1126
- package/dist/style.min.css +0 -1
- package/lib/ApprovalStatus/ApprovalStatus.styled.js +0 -21
- package/lib/ApprovalStatus/index.js +0 -104
- package/lib/AssetPreview.js +0 -53
- package/lib/AutoSuggest.js +0 -166
- package/lib/Avatar/Avatar.styled.js +0 -25
- package/lib/Avatar/index.js +0 -83
- package/lib/AvatarWithStatus/AvatarWithStatus.styled.js +0 -12
- package/lib/AvatarWithStatus/index.js +0 -30
- package/lib/BackButton.js +0 -46
- package/lib/BackdropOverlay.js +0 -77
- package/lib/BadgeButton.js +0 -35
- package/lib/BaseButton.js +0 -36
- package/lib/Button.js +0 -29
- package/lib/Carousel/Carousel.styled.js +0 -19
- package/lib/Carousel/index.js +0 -136
- package/lib/Checkbox.js +0 -55
- package/lib/CloseButton.js +0 -46
- package/lib/ColorPicker/ColorPicker.styled.js +0 -29
- package/lib/ColorPicker/index.js +0 -117
- package/lib/ColorPickerModal/ColorPickerModal.styled.js +0 -17
- package/lib/ColorPickerModal/index.js +0 -103
- package/lib/DatePicker/MyDatePicker.js +0 -350
- package/lib/DatePicker/index.js +0 -1
- package/lib/DropFilesWindow.js +0 -45
- package/lib/FilterItem/FilterItem.styled.js +0 -42
- package/lib/FilterItem/index.js +0 -48
- package/lib/FilterPopup/FilterPopup.styled.js +0 -16
- package/lib/FilterPopup/index.js +0 -85
- package/lib/FormControl.js +0 -25
- package/lib/FormGroup.js +0 -18
- package/lib/FormHelperText.js +0 -29
- package/lib/IconLabeledButton.js +0 -32
- package/lib/Image/Image.styled.js +0 -16
- package/lib/Image/index.js +0 -95
- package/lib/ImagePreview/ImagePreview.styled.js +0 -19
- package/lib/ImagePreview/index.js +0 -198
- package/lib/InputAndLabel.js +0 -77
- package/lib/InputGroupTime.js +0 -6
- package/lib/InputLabel.js +0 -18
- package/lib/ItemButtonOverlay/ItemButtonOverlay.styled.js +0 -33
- package/lib/ItemButtonOverlay/index.js +0 -23
- package/lib/ItemHoverTopOptions.js +0 -58
- package/lib/LoaderView/LoaderView.styled.js +0 -37
- package/lib/LoaderView/index.js +0 -32
- package/lib/MetaData/FilterMetadataFields.js +0 -115
- package/lib/MetaData/FilterMetadataFields.styled.js +0 -16
- package/lib/MetaData/MetaDataField.js +0 -246
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldBooleanType.js +0 -36
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldDateType.js +0 -53
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldMultiSelectType.js +0 -71
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldNumericType.js +0 -45
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldSelectType.js +0 -69
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldTagsType.js +0 -143
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldTextType.js +0 -42
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldTextareaType.js +0 -72
- package/lib/MetaData/MetaDataFieldTypes/MetaDataFieldTypes.styled.js +0 -57
- package/lib/MetaData/MetaDataFieldTypes/MetadataAttachmentsFieldType/AttachmentsAssetsMetadataAccordion.styled.js +0 -95
- package/lib/MetaData/MetaDataFieldTypes/MetadataAttachmentsFieldType/MetadataAttachmentsAction.js +0 -188
- package/lib/MetaData/MetaDataFieldTypes/MetadataAttachmentsFieldType/MetadataAttachmentsFieldType.constants.js +0 -48
- package/lib/MetaData/MetaDataFieldTypes/MetadataAttachmentsFieldType/MetadataAttachmentsInfo.js +0 -93
- package/lib/MetaData/MetaDataFieldTypes/MetadataAttachmentsFieldType/index.js +0 -114
- package/lib/MetaData/MetaDataFieldTypes/MetadataFieldUriType.js +0 -71
- package/lib/MetaData/MetaDataFieldTypes/MetadataGeoPointField/MetadataGeoPointField.styled.js +0 -8
- package/lib/MetaData/MetaDataFieldTypes/MetadataGeoPointField/constants.js +0 -10
- package/lib/MetaData/MetaDataFieldTypes/MetadataGeoPointField/index.js +0 -135
- package/lib/MetaData/MetaDataFieldTypes/index.js +0 -9
- package/lib/MetaData/MetaDataFieldTypes.hooks.js +0 -53
- package/lib/OverlayCard/OverlayCard.styled.js +0 -8
- package/lib/OverlayCard/index.js +0 -28
- package/lib/PoweredBy.js +0 -12
- package/lib/Radiobox.js +0 -63
- package/lib/RegionalVariantsFilters/RegionalVariantFilters.styled.js +0 -17
- package/lib/RegionalVariantsFilters/index.js +0 -160
- package/lib/SVGUrlToElement.js +0 -73
- package/lib/SearchGroup/SearchGroup.styled.js +0 -93
- package/lib/SearchGroup/index.js +0 -293
- package/lib/Spinner.js +0 -40
- package/lib/SuggestedSelectInput/SuggestedSelectInput.styled.js +0 -57
- package/lib/SuggestedSelectInput/index.js +0 -238
- package/lib/SuggestedTagsInput/SuggestedTagsInput.js +0 -295
- package/lib/SuggestedTagsInput/SuggestedTagsInput.styled.js +0 -83
- package/lib/SuggestedTagsInput/SuggestedTagsInput.utils.js +0 -15
- package/lib/SuggestedTagsInput/SuggestedTagsInputSkeleton.js +0 -14
- package/lib/Tabs.js +0 -62
- package/lib/ToggleButton/ToggleButton.styled.js +0 -16
- package/lib/ToggleButton/index.js +0 -16
- package/lib/Transitions/SlideTransition.js +0 -24
- package/lib/Transitions/TransitionWrapper.js +0 -83
- package/lib/Transitions/Transitions.styled.js +0 -8
- package/lib/Transitions/index.js +0 -2
- package/lib/Typography/Typography.js +0 -47
- package/lib/Typography/Typography.mixin.js +0 -46
- package/lib/Typography/Typography.styled.js +0 -18
- package/lib/Typography/index.js +0 -3
- package/lib/Typography/types/index.js +0 -1
- package/lib/Typography/types/variant.js +0 -9
- package/lib/UploadFileFloatyLabel/UploadFileFloatyLabel.mixin.js +0 -23
- package/lib/UploadFileFloatyLabel/UploadFileFloatyLabel.styled.js +0 -24
- package/lib/UploadFileFloatyLabel/index.js +0 -12
- package/lib/UsersAutocomplete/Tag.js +0 -25
- package/lib/UsersAutocomplete/Tag.styled.js +0 -35
- package/lib/UsersAutocomplete/UsersAutocomplete.styled.js +0 -94
- package/lib/UsersAutocomplete/index.js +0 -303
- package/lib/VirtualGrid/VirtualGrid.styled.js +0 -33
- package/lib/VirtualGrid/VirtualGrid.utils.js +0 -38
- package/lib/VirtualGrid/VirtualGridItem.js +0 -15
- package/lib/VirtualGrid/index.js +0 -252
- package/lib/VirtualList/VirtualListItem.js +0 -14
- package/lib/VirtualList/index.js +0 -105
- package/lib/hooks/index.js +0 -4
- package/lib/hooks/useDebounce.js +0 -24
- package/lib/hooks/useInputWithLocaleNumber.js +0 -115
- package/lib/hooks/useIsUnMountedRef.js +0 -12
- package/lib/hooks/useKeyboardNavigation.js +0 -60
- package/lib/hooks/useUpdateEffect.js +0 -19
- package/lib/index.js +0 -36
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
3
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
4
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
5
|
-
import { memo, cloneElement } from 'react';
|
|
6
|
-
var VirtualLayoutItem = function VirtualLayoutItem(_ref) {
|
|
7
|
-
var item = _ref.item,
|
|
8
|
-
children = _ref.children,
|
|
9
|
-
itemPropName = _ref.itemPropName,
|
|
10
|
-
index = _ref.index;
|
|
11
|
-
var childrenWithItem = /*#__PURE__*/cloneElement(children, _defineProperty(_defineProperty({}, itemPropName, item), "index", index));
|
|
12
|
-
return childrenWithItem;
|
|
13
|
-
};
|
|
14
|
-
export default /*#__PURE__*/memo(VirtualLayoutItem);
|
package/lib/VirtualList/index.js
DELETED
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
2
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
3
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
4
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
5
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
6
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
7
|
-
import { memo, useCallback, useEffect, useRef } from 'react';
|
|
8
|
-
import { ViewportList } from 'react-viewport-list';
|
|
9
|
-
import getScrollableParent from '@scaleflex/widget-explorer/lib/utils/getScrollableParent';
|
|
10
|
-
import VirtualListItem from './VirtualListItem';
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* A Virtual list that applies (windowing) concept for reusing the DOM elements and avoid rerendering for all items.
|
|
14
|
-
* @param {Array} items - The items that will be used in the list (required).
|
|
15
|
-
* @param {ReactNode} children - The children that will be rendered for each item (required).
|
|
16
|
-
* @param {String} injectedItemPropName - The name of the prop that will be injected in the children (optional).
|
|
17
|
-
* @param {Number} overscan - The number of items that will be rendered before and after the viewport (optional).
|
|
18
|
-
* @param {Function} getItemKey - The function that will be used to get the item key (optional).
|
|
19
|
-
* @param {Function} renderSpacer - The function that will be used to render the spacer (optional).
|
|
20
|
-
* @param {ReactRef} parentRef - the reference for the parent wrapper for the virtual list to be used in recognized the scroller/viewport element, not required if the virtual list is the parent and u don't need to have the apiRef (optional)
|
|
21
|
-
* @param {ReactRef} apiRef - the reference that will contain the api functions to deal with the grid (optional)
|
|
22
|
-
* 1- `scrollToItem({ key, index })` function that scrolls the grid to the specified item's key, the key should be the same property that's returned from getItemKey, index should be the item's index.
|
|
23
|
-
* @returns {ReactNode} - The VirtualList component.
|
|
24
|
-
*/
|
|
25
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
26
|
-
var defaultGetItemKey = function defaultGetItemKey(item, index) {
|
|
27
|
-
return (_typeof(item) === 'object' ? item.uuid || item.id : item) || index;
|
|
28
|
-
};
|
|
29
|
-
var VirtualList = function VirtualList(_ref) {
|
|
30
|
-
var children = _ref.children,
|
|
31
|
-
_ref$items = _ref.items,
|
|
32
|
-
items = _ref$items === void 0 ? [] : _ref$items,
|
|
33
|
-
_ref$injectedItemProp = _ref.injectedItemPropName,
|
|
34
|
-
injectedItemPropName = _ref$injectedItemProp === void 0 ? 'item' : _ref$injectedItemProp,
|
|
35
|
-
_ref$overscan = _ref.overscan,
|
|
36
|
-
overscan = _ref$overscan === void 0 ? 1 : _ref$overscan,
|
|
37
|
-
apiRef = _ref.apiRef,
|
|
38
|
-
renderSpacer = _ref.renderSpacer,
|
|
39
|
-
_ref$getItemKey = _ref.getItemKey,
|
|
40
|
-
getItemKey = _ref$getItemKey === void 0 ? defaultGetItemKey : _ref$getItemKey,
|
|
41
|
-
_ref$parentRef = _ref.parentRef,
|
|
42
|
-
parentRef = _ref$parentRef === void 0 ? null : _ref$parentRef;
|
|
43
|
-
var scrollableElemRef = useRef();
|
|
44
|
-
var listRef = useRef();
|
|
45
|
-
var scrollToItem = useCallback(function (_ref2) {
|
|
46
|
-
var key = _ref2.key,
|
|
47
|
-
index = _ref2.index;
|
|
48
|
-
if ((key || index || index === 0 || key === 0) && items.length > 0) {
|
|
49
|
-
var itemIndex = index !== null && index !== void 0 ? index : items.findIndex(function (item) {
|
|
50
|
-
return getItemKey(item) === key;
|
|
51
|
-
});
|
|
52
|
-
if (itemIndex > -1 && parentRef.current) {
|
|
53
|
-
var _ref3;
|
|
54
|
-
// get the parent's top offset to start exactly from the container/parent start.
|
|
55
|
-
var containerOffset = scrollableElemRef.current.scrollHeight - parentRef.current.scrollHeight;
|
|
56
|
-
|
|
57
|
-
// If the parent's top offset is less than the container's offset means that the parent is the current visible block, hence no need to offset the container.
|
|
58
|
-
if (parentRef.current.offsetTop < containerOffset) {
|
|
59
|
-
containerOffset = 0;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
// As the spacer should be the same type/tag as the item HTML element container, hence we use it.
|
|
63
|
-
var itemContainerTagType = (renderSpacer === null || renderSpacer === void 0 ? void 0 : renderSpacer().type) || 'tr';
|
|
64
|
-
var itemHeight = (_ref3 = parentRef.current.querySelector("".concat(itemContainerTagType, "[data-filerobot-focusable-uuid]")) || parentRef.current.querySelector("".concat(itemContainerTagType, "[data-filerobot-focusable-id]"))) === null || _ref3 === void 0 ? void 0 : _ref3.offsetHeight;
|
|
65
|
-
if (itemHeight) {
|
|
66
|
-
var itemScrollPosition = itemHeight * itemIndex;
|
|
67
|
-
var topMarginReplacer = 12;
|
|
68
|
-
scrollableElemRef.current.scrollTo({
|
|
69
|
-
top: containerOffset + itemScrollPosition + topMarginReplacer,
|
|
70
|
-
behavior: 'smooth'
|
|
71
|
-
});
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
}, [items]);
|
|
76
|
-
useEffect(function () {
|
|
77
|
-
if (parentRef !== null && parentRef !== void 0 && parentRef.current) {
|
|
78
|
-
scrollableElemRef.current = getScrollableParent(parentRef.current);
|
|
79
|
-
}
|
|
80
|
-
}, []);
|
|
81
|
-
useEffect(function () {
|
|
82
|
-
if (apiRef && parentRef !== null && parentRef !== void 0 && parentRef.current) {
|
|
83
|
-
apiRef.current = _objectSpread(_objectSpread({}, apiRef.current), {}, {
|
|
84
|
-
scrollToItem: scrollToItem
|
|
85
|
-
});
|
|
86
|
-
}
|
|
87
|
-
}, [scrollToItem]);
|
|
88
|
-
var renderItem = useCallback(function (item, index) {
|
|
89
|
-
return /*#__PURE__*/_jsx(VirtualListItem, {
|
|
90
|
-
item: item,
|
|
91
|
-
index: index,
|
|
92
|
-
itemPropName: injectedItemPropName,
|
|
93
|
-
children: children
|
|
94
|
-
}, getItemKey(item, index));
|
|
95
|
-
}, [items, children]);
|
|
96
|
-
return /*#__PURE__*/_jsx(ViewportList, {
|
|
97
|
-
items: items,
|
|
98
|
-
overscan: overscan,
|
|
99
|
-
renderSpacer: renderSpacer,
|
|
100
|
-
ref: listRef,
|
|
101
|
-
viewportRef: parentRef !== null && parentRef !== void 0 && parentRef.current ? scrollableElemRef : undefined,
|
|
102
|
-
children: renderItem
|
|
103
|
-
});
|
|
104
|
-
};
|
|
105
|
-
export default /*#__PURE__*/memo(VirtualList);
|
package/lib/hooks/index.js
DELETED
package/lib/hooks/useDebounce.js
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
2
|
-
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."); }
|
|
3
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
4
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
5
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
7
|
-
import { useState, useEffect } from 'react';
|
|
8
|
-
function useDebounce(value) {
|
|
9
|
-
var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 300;
|
|
10
|
-
var _useState = useState(value),
|
|
11
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
12
|
-
debouncedValue = _useState2[0],
|
|
13
|
-
setDebouncedValue = _useState2[1];
|
|
14
|
-
useEffect(function () {
|
|
15
|
-
var handler = setTimeout(function () {
|
|
16
|
-
setDebouncedValue(value);
|
|
17
|
-
}, delay);
|
|
18
|
-
return function () {
|
|
19
|
-
clearTimeout(handler);
|
|
20
|
-
};
|
|
21
|
-
}, [value]);
|
|
22
|
-
return debouncedValue;
|
|
23
|
-
}
|
|
24
|
-
export { useDebounce };
|
|
@@ -1,115 +0,0 @@
|
|
|
1
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
5
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
6
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
-
import { useEffect, useMemo, useRef } from 'react';
|
|
8
|
-
import { convertToLocaleNumber, toInitialNumber, getLocaleNumberSeparator } from '@scaleflex/widget-utils/lib/formatNumbers';
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Helper hook that can adapt number input value to selected locale format (ex: "1,000,000.12" for "us"
|
|
12
|
-
* and "1 000 000,12" for "fr"), but store changed value in number format like 1000000.12
|
|
13
|
-
*/
|
|
14
|
-
|
|
15
|
-
var CHARS_COUNT_TO_SEPARATE = 4;
|
|
16
|
-
var SPACE_REMOVAL_REMAINDER_GUIDE = 3;
|
|
17
|
-
var ALPHA_ADD_REMOVE_REMAINDER_GUIDE = 0;
|
|
18
|
-
var getNewCaretMoveSteps = function getNewCaretMoveSteps(_ref) {
|
|
19
|
-
var isClearing = _ref.isClearing,
|
|
20
|
-
isClearingFormatChar = _ref.isClearingFormatChar,
|
|
21
|
-
newValueLength = _ref.newValueLength;
|
|
22
|
-
var newFormatCharRemainder = newValueLength % CHARS_COUNT_TO_SEPARATE;
|
|
23
|
-
if (isClearingFormatChar) {
|
|
24
|
-
return newFormatCharRemainder === SPACE_REMOVAL_REMAINDER_GUIDE ? -1 : 0;
|
|
25
|
-
} else {
|
|
26
|
-
return newFormatCharRemainder === ALPHA_ADD_REMOVE_REMAINDER_GUIDE ? isClearing && -1 || 1 : 0;
|
|
27
|
-
}
|
|
28
|
-
};
|
|
29
|
-
var useInputWithLocaleNumber = function useInputWithLocaleNumber(_ref2) {
|
|
30
|
-
var value = _ref2.value,
|
|
31
|
-
_onChange = _ref2.onChange,
|
|
32
|
-
locale = _ref2.locale,
|
|
33
|
-
inputWrapperRef = _ref2.inputWrapperRef,
|
|
34
|
-
_ref2$enabled = _ref2.enabled,
|
|
35
|
-
enabled = _ref2$enabled === void 0 ? true : _ref2$enabled,
|
|
36
|
-
onKeyDown = _ref2.onKeyDown,
|
|
37
|
-
onBlur = _ref2.onBlur;
|
|
38
|
-
var expectedCaretPosition = useRef(value === null || value === void 0 ? void 0 : value.length);
|
|
39
|
-
var inputRef = useRef();
|
|
40
|
-
var localeProps = useMemo(function () {
|
|
41
|
-
if (!enabled || !locale) {
|
|
42
|
-
return {};
|
|
43
|
-
}
|
|
44
|
-
var separator = getLocaleNumberSeparator(locale);
|
|
45
|
-
var localNumber = convertToLocaleNumber(value === null || value === void 0 ? void 0 : value.toString(), locale);
|
|
46
|
-
var formattedValue = "".concat(localNumber).concat(((value === null || value === void 0 ? void 0 : value.toString()) || '').slice(-1) === '.' && localNumber.slice(-1) !== separator ? separator : '');
|
|
47
|
-
var handleOnChange = function handleOnChange(event) {
|
|
48
|
-
var _event$target = event.target,
|
|
49
|
-
newValue = _event$target.value,
|
|
50
|
-
caretPosition = _event$target.selectionStart;
|
|
51
|
-
if (newValue === '.' || newValue === ',') {
|
|
52
|
-
return 0;
|
|
53
|
-
}
|
|
54
|
-
var oldInitialValue = toInitialNumber(value, separator);
|
|
55
|
-
var newInitialValue = toInitialNumber(newValue, separator);
|
|
56
|
-
if (Number.MIN_SAFE_INTEGER >= newInitialValue || Number.MAX_SAFE_INTEGER <= newInitialValue) {
|
|
57
|
-
return;
|
|
58
|
-
}
|
|
59
|
-
var isClearingFormatChar = oldInitialValue === newInitialValue;
|
|
60
|
-
var isClearing = isClearingFormatChar || newInitialValue.length < oldInitialValue.length;
|
|
61
|
-
if (isClearingFormatChar) {
|
|
62
|
-
var _event$nativeEvent;
|
|
63
|
-
var isClearingForwardByDelKey = ((_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 ? void 0 : _event$nativeEvent.inputType) === 'deleteContentForward';
|
|
64
|
-
var stringBeforeSpace = newValue.slice(0, caretPosition - (isClearingForwardByDelKey ? 0 : 1));
|
|
65
|
-
var stringAfterSpace = newValue.slice(caretPosition + (isClearingForwardByDelKey ? 1 : 0));
|
|
66
|
-
newValue = "".concat(stringBeforeSpace).concat(stringAfterSpace);
|
|
67
|
-
newInitialValue = toInitialNumber(newValue, separator);
|
|
68
|
-
}
|
|
69
|
-
_onChange(newInitialValue ? +newInitialValue : '', event);
|
|
70
|
-
caretPosition = caretPosition + getNewCaretMoveSteps({
|
|
71
|
-
isClearing: isClearing,
|
|
72
|
-
isClearingFormatChar: isClearingFormatChar,
|
|
73
|
-
newValueLength: newValue.length
|
|
74
|
-
});
|
|
75
|
-
expectedCaretPosition.current = caretPosition;
|
|
76
|
-
};
|
|
77
|
-
var handleOnKeyDown = function handleOnKeyDown(event) {
|
|
78
|
-
if (event.key.length === 1 && !event.altKey && !event.ctrlKey && !event.shiftKey && !event.metaKey && (!new RegExp("[0-9".concat(separator, "]")).test(event.key) || event.key === separator && event.target.value.includes(separator))) {
|
|
79
|
-
event.preventDefault();
|
|
80
|
-
}
|
|
81
|
-
if (typeof onKeyDown === 'function') {
|
|
82
|
-
onKeyDown(event);
|
|
83
|
-
}
|
|
84
|
-
};
|
|
85
|
-
var handleOnBlur = function handleOnBlur(event) {
|
|
86
|
-
if (typeof onBlur === 'function') {
|
|
87
|
-
onBlur(event);
|
|
88
|
-
}
|
|
89
|
-
};
|
|
90
|
-
return {
|
|
91
|
-
value: formattedValue,
|
|
92
|
-
onChange: handleOnChange,
|
|
93
|
-
onKeyDown: handleOnKeyDown,
|
|
94
|
-
onBlur: handleOnBlur,
|
|
95
|
-
type: 'text'
|
|
96
|
-
};
|
|
97
|
-
}, [value, onBlur, _onChange, locale, enabled, onKeyDown]);
|
|
98
|
-
useEffect(function () {
|
|
99
|
-
if (inputWrapperRef !== null && inputWrapperRef !== void 0 && inputWrapperRef.current) {
|
|
100
|
-
inputRef.current = inputWrapperRef.current.querySelector('input');
|
|
101
|
-
}
|
|
102
|
-
}, []);
|
|
103
|
-
useEffect(function () {
|
|
104
|
-
if (inputRef !== null && inputRef !== void 0 && inputRef.current && localeProps.value) {
|
|
105
|
-
inputRef.current.setSelectionRange(expectedCaretPosition.current, expectedCaretPosition.current);
|
|
106
|
-
}
|
|
107
|
-
}, [localeProps.value]);
|
|
108
|
-
return _objectSpread({
|
|
109
|
-
value: value,
|
|
110
|
-
onChange: function onChange(event) {
|
|
111
|
-
return _onChange(event.target.value, event);
|
|
112
|
-
}
|
|
113
|
-
}, localeProps);
|
|
114
|
-
};
|
|
115
|
-
export default useInputWithLocaleNumber;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { useRef, useEffect } from 'react';
|
|
2
|
-
var useIsUnMountedRef = function useIsUnMountedRef() {
|
|
3
|
-
var isUnMounted = useRef();
|
|
4
|
-
useEffect(function () {
|
|
5
|
-
isUnMounted.current = false;
|
|
6
|
-
return function () {
|
|
7
|
-
isUnMounted.current = true;
|
|
8
|
-
};
|
|
9
|
-
}, []);
|
|
10
|
-
return isUnMounted;
|
|
11
|
-
};
|
|
12
|
-
export default useIsUnMountedRef;
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
2
|
-
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."); }
|
|
3
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
4
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
5
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
7
|
-
import { useState, useEffect, useRef } from 'react';
|
|
8
|
-
var useKeyboardNavigation = function useKeyboardNavigation(_ref) {
|
|
9
|
-
var items = _ref.items,
|
|
10
|
-
onSelectItem = _ref.onSelectItem,
|
|
11
|
-
containerRef = _ref.containerRef,
|
|
12
|
-
onEscape = _ref.onEscape;
|
|
13
|
-
var _useState = useState(-1),
|
|
14
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
15
|
-
focusedIndex = _useState2[0],
|
|
16
|
-
setFocusedIndex = _useState2[1];
|
|
17
|
-
var itemRefs = useRef([]);
|
|
18
|
-
useEffect(function () {
|
|
19
|
-
var _itemRefs$current$foc;
|
|
20
|
-
(_itemRefs$current$foc = itemRefs.current[focusedIndex]) === null || _itemRefs$current$foc === void 0 ? void 0 : _itemRefs$current$foc.focus();
|
|
21
|
-
}, [focusedIndex]);
|
|
22
|
-
var handleKeyDown = function handleKeyDown(event) {
|
|
23
|
-
var _itemRefs$current$;
|
|
24
|
-
var numColumns = containerRef !== null && containerRef !== void 0 && containerRef.current ? Math.floor(containerRef.current.clientWidth / ((_itemRefs$current$ = itemRefs.current[0]) === null || _itemRefs$current$ === void 0 ? void 0 : _itemRefs$current$.clientWidth)) : 1;
|
|
25
|
-
if (event.key === 'Enter') {
|
|
26
|
-
onSelectItem(items[focusedIndex]);
|
|
27
|
-
} else if (event.key === 'ArrowUp') {
|
|
28
|
-
event.preventDefault();
|
|
29
|
-
setFocusedIndex(function (prevIndex) {
|
|
30
|
-
var newIndex = prevIndex - numColumns;
|
|
31
|
-
return newIndex >= 0 ? newIndex : (items.length + newIndex) % items.length;
|
|
32
|
-
});
|
|
33
|
-
} else if (event.key === 'ArrowDown') {
|
|
34
|
-
event.preventDefault();
|
|
35
|
-
setFocusedIndex(function (prevIndex) {
|
|
36
|
-
var newIndex = prevIndex + numColumns;
|
|
37
|
-
return newIndex < items.length ? newIndex : newIndex % items.length;
|
|
38
|
-
});
|
|
39
|
-
} else if (event.key === 'ArrowLeft') {
|
|
40
|
-
event.preventDefault();
|
|
41
|
-
setFocusedIndex(function (prevIndex) {
|
|
42
|
-
return prevIndex > 0 ? prevIndex - 1 : items.length - 1;
|
|
43
|
-
});
|
|
44
|
-
} else if (event.key === 'ArrowRight') {
|
|
45
|
-
event.preventDefault();
|
|
46
|
-
setFocusedIndex(function (prevIndex) {
|
|
47
|
-
return prevIndex < items.length - 1 ? prevIndex + 1 : 0;
|
|
48
|
-
});
|
|
49
|
-
} else if (onEscape && event.key === 'Escape') {
|
|
50
|
-
onEscape(event);
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
return {
|
|
54
|
-
itemRefs: itemRefs,
|
|
55
|
-
focusedIndex: focusedIndex,
|
|
56
|
-
setFocusedIndex: setFocusedIndex,
|
|
57
|
-
handleKeyDown: handleKeyDown
|
|
58
|
-
};
|
|
59
|
-
};
|
|
60
|
-
export default useKeyboardNavigation;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { useEffect, useRef } from 'react';
|
|
2
|
-
var useUpdateEffect = function useUpdateEffect(effectCallback, dependencies) {
|
|
3
|
-
var isFirstRender = useRef(true);
|
|
4
|
-
useEffect(function () {
|
|
5
|
-
return function () {
|
|
6
|
-
isFirstRender.current = true;
|
|
7
|
-
};
|
|
8
|
-
}, []);
|
|
9
|
-
useEffect(function () {
|
|
10
|
-
if (isFirstRender.current) {
|
|
11
|
-
isFirstRender.current = false;
|
|
12
|
-
} else {
|
|
13
|
-
if (typeof effectCallback === 'function') {
|
|
14
|
-
return effectCallback();
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
}, dependencies);
|
|
18
|
-
};
|
|
19
|
-
export default useUpdateEffect;
|
package/lib/index.js
DELETED
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
export { default as Button } from './Button';
|
|
2
|
-
export { default as IconLabeledButton } from './IconLabeledButton';
|
|
3
|
-
export { default as BadgeButton } from './BadgeButton';
|
|
4
|
-
export { default as BackdropOverlay } from './BackdropOverlay';
|
|
5
|
-
export { default as Radiobox } from './Radiobox';
|
|
6
|
-
export { default as Checkbox } from './Checkbox';
|
|
7
|
-
export { default as FormGroup } from './FormGroup';
|
|
8
|
-
export { default as FormControl } from './FormControl';
|
|
9
|
-
export { default as InputLabel } from './InputLabel';
|
|
10
|
-
export { default as FormHelperText } from './FormHelperText';
|
|
11
|
-
export * from './Transitions';
|
|
12
|
-
export * from './DatePicker';
|
|
13
|
-
export { default as LoaderView } from './LoaderView';
|
|
14
|
-
export { default as ImagePreview } from './ImagePreview';
|
|
15
|
-
export { default as Tabs } from './Tabs';
|
|
16
|
-
export { default as InputAndLabel } from './InputAndLabel';
|
|
17
|
-
export { default as AutoSuggest } from './AutoSuggest';
|
|
18
|
-
export { default as Image } from './Image';
|
|
19
|
-
export { default as Spinner } from './Spinner';
|
|
20
|
-
export { default as ItemHoverTopOptions } from './ItemHoverTopOptions';
|
|
21
|
-
export { default as BackButton } from './BackButton';
|
|
22
|
-
export { default as CloseButton } from './CloseButton';
|
|
23
|
-
export { default as DropFilesWindow } from './DropFilesWindow';
|
|
24
|
-
export { default as SVGUrlToElement } from './SVGUrlToElement';
|
|
25
|
-
export { default as PoweredBy } from './PoweredBy';
|
|
26
|
-
export { default as Typography, PC, FV, PSH } from './Typography';
|
|
27
|
-
export { default as UsersAutocomplete } from './UsersAutocomplete';
|
|
28
|
-
export { default as Carousel } from './Carousel';
|
|
29
|
-
export { default as RegionalVariantFilters } from './RegionalVariantsFilters';
|
|
30
|
-
export { default as OverlayCard } from './OverlayCard';
|
|
31
|
-
export { default as VirtualGrid } from './VirtualGrid';
|
|
32
|
-
export { default as VirtualList } from './VirtualList';
|
|
33
|
-
export { default as SearchGroup } from './SearchGroup';
|
|
34
|
-
export { default as ColorPickerModal } from './ColorPickerModal';
|
|
35
|
-
export { default as AssetPreview } from './AssetPreview';
|
|
36
|
-
export { default as InputGroupTime } from './InputGroupTime';
|