Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
woocommerce/plugins/woocommerce-blocks/patches/wordpress-components+11.1.5...

268 lines
10 KiB
Diff
Raw Blame History

diff --git a/node_modules/wordpress-components/build-module/combobox-control/index.js b/node_modules/wordpress-components/build-module/combobox-control/index.js
index 51c59c1..61bda14 100644
--- a/node_modules/wordpress-components/build-module/combobox-control/index.js
+++ b/node_modules/wordpress-components/build-module/combobox-control/index.js
@@ -1,19 +1,10 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
import { createElement } from "@wordpress/element";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
-
/**
* External dependencies
*/
import classnames from 'classnames';
+import { noop, deburr } from 'lodash';
/**
* WordPress dependencies
*/
@@ -34,77 +25,46 @@ import BaseControl from '../base-control';
import Button from '../button';
import { Flex, FlexBlock, FlexItem } from '../flex';
import withFocusOutside from '../higher-order/with-focus-outside';
-var DetectOutside = withFocusOutside( /*#__PURE__*/function (_Component) {
- _inherits(_class, _Component);
-
- var _super = _createSuper(_class);
-
- function _class() {
- _classCallCheck(this, _class);
-
- return _super.apply(this, arguments);
+const DetectOutside = withFocusOutside(class extends Component {
+ handleFocusOutside(event) {
+ this.props.onFocusOutside(event);
}
- _createClass(_class, [{
- key: "handleFocusOutside",
- value: function handleFocusOutside(event) {
- this.props.onFocusOutside(event);
- }
- }, {
- key: "render",
- value: function render() {
- return this.props.children;
- }
- }]);
-
- return _class;
-}(Component));
+ render() {
+ return this.props.children;
+ }
-function ComboboxControl(_ref) {
+});
+
+function ComboboxControl({
+ value,
+ label,
+ options,
+ onChange,
+ onFilterValueChange = noop,
+ hideLabelFromVision,
+ help,
+ allowReset = true,
+ className,
+ messages = {
+ selected: __('Item selected.')
+ }
+}) {
var _currentOption$label;
- var value = _ref.value,
- label = _ref.label,
- options = _ref.options,
- onChange = _ref.onChange,
- onFilterValueChange = _ref.onFilterValueChange,
- hideLabelFromVision = _ref.hideLabelFromVision,
- help = _ref.help,
- _ref$allowReset = _ref.allowReset,
- allowReset = _ref$allowReset === void 0 ? true : _ref$allowReset,
- className = _ref.className,
- _ref$messages = _ref.messages,
- messages = _ref$messages === void 0 ? {
- selected: __('Item selected.')
- } : _ref$messages;
- var instanceId = useInstanceId(ComboboxControl);
-
- var _useState = useState(null),
- _useState2 = _slicedToArray(_useState, 2),
- selectedSuggestion = _useState2[0],
- setSelectedSuggestion = _useState2[1];
-
- var _useState3 = useState(false),
- _useState4 = _slicedToArray(_useState3, 2),
- isExpanded = _useState4[0],
- setIsExpanded = _useState4[1];
-
- var _useState5 = useState(''),
- _useState6 = _slicedToArray(_useState5, 2),
- inputValue = _useState6[0],
- setInputValue = _useState6[1];
-
- var inputContainer = useRef();
- var currentOption = options.find(function (option) {
- return option.value === value;
- });
- var currentLabel = (_currentOption$label = currentOption === null || currentOption === void 0 ? void 0 : currentOption.label) !== null && _currentOption$label !== void 0 ? _currentOption$label : '';
- var matchingSuggestions = useMemo(function () {
- var startsWithMatch = [];
- var containsMatch = [];
- var match = inputValue.toLocaleLowerCase();
- options.forEach(function (option) {
- var index = option.label.toLocaleLowerCase().indexOf(match);
+ const currentOption = options.find(option => option.value === value);
+ const currentLabel = (_currentOption$label = currentOption === null || currentOption === void 0 ? void 0 : currentOption.label) !== null && _currentOption$label !== void 0 ? _currentOption$label : '';
+ const instanceId = useInstanceId(ComboboxControl);
+ const [selectedSuggestion, setSelectedSuggestion] = useState(currentOption || null);
+ const [isExpanded, setIsExpanded] = useState(false);
+ const [inputValue, setInputValue] = useState('');
+ const inputContainer = useRef();
+ const matchingSuggestions = useMemo(() => {
+ const startsWithMatch = [];
+ const containsMatch = [];
+ const match = deburr(inputValue.toLocaleLowerCase());
+ options.forEach(option => {
+ const index = deburr(option.label).toLocaleLowerCase().indexOf(match);
if (index === 0) {
startsWithMatch.push(option);
@@ -115,7 +75,7 @@ function ComboboxControl(_ref) {
return startsWithMatch.concat(containsMatch);
}, [inputValue, options, value]);
- var onSuggestionSelected = function onSuggestionSelected(newSelectedSuggestion) {
+ const onSuggestionSelected = newSelectedSuggestion => {
onChange(newSelectedSuggestion.value);
speak(messages.selected, 'assertive');
setSelectedSuggestion(newSelectedSuggestion);
@@ -123,10 +83,9 @@ function ComboboxControl(_ref) {
setIsExpanded(false);
};
- var handleArrowNavigation = function handleArrowNavigation() {
- var offset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
- var index = matchingSuggestions.indexOf(selectedSuggestion);
- var nextIndex = index + offset;
+ const handleArrowNavigation = (offset = 1) => {
+ const index = matchingSuggestions.indexOf(selectedSuggestion);
+ let nextIndex = index + offset;
if (nextIndex < 0) {
nextIndex = matchingSuggestions.length - 1;
@@ -138,8 +97,12 @@ function ComboboxControl(_ref) {
setIsExpanded(true);
};
- var onKeyDown = function onKeyDown(event) {
- var preventDefault = false;
+ const onKeyDown = event => {
+ let preventDefault = false;
+
+ if (event.defaultPrevented) {
+ return;
+ }
switch (event.keyCode) {
case ENTER:
@@ -164,7 +127,6 @@ function ComboboxControl(_ref) {
setIsExpanded(false);
setSelectedSuggestion(null);
preventDefault = true;
- event.stopPropagation();
break;
default:
@@ -176,34 +138,44 @@ function ComboboxControl(_ref) {
}
};
- var onFocus = function onFocus() {
+ const onFocus = () => {
setIsExpanded(true);
onFilterValueChange('');
setInputValue('');
};
- var onFocusOutside = function onFocusOutside() {
+ const onFocusOutside = () => {
setIsExpanded(false);
};
- var onInputChange = function onInputChange(event) {
- var text = event.value;
+ const onInputChange = event => {
+ const text = event.value;
setInputValue(text);
onFilterValueChange(text);
setIsExpanded(true);
};
- var handleOnReset = function handleOnReset() {
+ const handleOnReset = () => {
onChange(null);
inputContainer.current.input.focus();
- }; // Announcements
+ }; // Update current selections when the filter input changes.
- useEffect(function () {
- var hasMatchingSuggestions = matchingSuggestions.length > 0;
+ useEffect(() => {
+ const hasMatchingSuggestions = matchingSuggestions.length > 0;
+ const hasSelectedMatchingSuggestions = matchingSuggestions.indexOf(selectedSuggestion) > 0;
+
+ if (hasMatchingSuggestions && !hasSelectedMatchingSuggestions) {
+ // If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.
+ setSelectedSuggestion(matchingSuggestions[0]);
+ }
+ }, [matchingSuggestions, selectedSuggestion]); // Announcements
+
+ useEffect(() => {
+ const hasMatchingSuggestions = matchingSuggestions.length > 0;
if (isExpanded) {
- var message = hasMatchingSuggestions ? sprintf(
+ const message = hasMatchingSuggestions ? sprintf(
/* translators: %d: number of results. */
_n('%d result found, use up and down arrow keys to navigate.', '%d results found, use up and down arrow keys to navigate.', matchingSuggestions.length), matchingSuggestions.length) : __('No results.');
speak(message, 'polite');
@@ -220,7 +192,7 @@ function ComboboxControl(_ref) {
className: classnames(className, 'components-combobox-control'),
tabIndex: "-1",
label: label,
- id: "components-form-token-input-".concat(instanceId),
+ id: `components-form-token-input-${instanceId}`,
hideLabelFromVision: hideLabelFromVision,
help: help
}, createElement("div", {
@@ -232,7 +204,7 @@ function ComboboxControl(_ref) {
instanceId: instanceId,
ref: inputContainer,
value: isExpanded ? inputValue : currentLabel,
- "aria-label": currentLabel ? "".concat(currentLabel, ", ").concat(label) : null,
+ "aria-label": currentLabel ? `${currentLabel}, ${label}` : null,
onFocus: onFocus,
isExpanded: isExpanded,
selectedSuggestionIndex: matchingSuggestions.indexOf(selectedSuggestion),
@@ -248,9 +220,7 @@ function ComboboxControl(_ref) {
match: {
label: inputValue
},
- displayTransform: function displayTransform(suggestion) {
- return suggestion.label;
- },
+ displayTransform: suggestion => suggestion.label,
suggestions: matchingSuggestions,
selectedIndex: matchingSuggestions.indexOf(selectedSuggestion),
onHover: setSelectedSuggestion,
Reference in New Issue View Git Blame Copy Permalink