Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
woocommerce/1772.77d022b7.iframe.bundle...

875 lines
55 KiB
JavaScript
Raw Permalink Blame History

"use strict";
(self["webpackChunk_woocommerce_storybook"] = self["webpackChunk_woocommerce_storybook"] || []).push([[1772],{
/***/ "../../packages/js/components/src/experimental-select-control/combo-box.tsx":
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ a: () => (/* binding */ ComboBox)
/* harmony export */ });
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/library/chevron-down.js");
/**
* External dependencies
*/
var ToggleButton = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(function (props, ref) {
// using forwardRef here because getToggleButtonProps injects a ref prop
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .A)({
className: "woocommerce-experimental-select-control__combox-box-toggle-button"
}, props, {
ref: ref
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .A, {
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .A
}));
});
var ComboBox = function ComboBox(_ref) {
var children = _ref.children,
comboBoxProps = _ref.comboBoxProps,
_ref$getToggleButtonP = _ref.getToggleButtonProps,
getToggleButtonProps = _ref$getToggleButtonP === void 0 ? function () {
return {};
} : _ref$getToggleButtonP,
inputProps = _ref.inputProps,
suffix = _ref.suffix,
showToggleButton = _ref.showToggleButton;
var inputRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
var maybeFocusInput = function maybeFocusInput(event) {
if (!inputRef || !inputRef.current) {
return;
}
if (document.activeElement !== inputRef.current) {
event.preventDefault();
inputRef.current.focus();
event.stopPropagation();
}
};
return (
// Disable reason: The click event is purely for accidental clicks around the input.
// Keyboard users are still able to tab to and interact with elements in the combobox.
/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */
(0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: classnames__WEBPACK_IMPORTED_MODULE_1___default()('woocommerce-experimental-select-control__combo-box-wrapper', {
'woocommerce-experimental-select-control__combo-box-wrapper--disabled': inputProps.disabled
}),
onMouseDown: maybeFocusInput
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "woocommerce-experimental-select-control__items-wrapper"
}, children, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .A)({}, comboBoxProps, {
className: "woocommerce-experimental-select-control__combox-box"
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .A)({}, inputProps, {
ref: function ref(node) {
inputRef.current = node;
if (typeof inputProps.ref === 'function') {
inputProps.ref(node);
}
}
})))), suffix && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "woocommerce-experimental-select-control__suffix"
}, suffix), showToggleButton && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(ToggleButton, getToggleButtonProps()))
);
};
try {
// @ts-ignore
ComboBox.displayName = "ComboBox";
// @ts-ignore
ComboBox.__docgenInfo = { "description": "", "displayName": "ComboBox", "props": { "comboBoxProps": { "defaultValue": null, "description": "", "name": "comboBoxProps", "required": true, "type": { "name": "DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>" } }, "inputProps": { "defaultValue": null, "description": "", "name": "inputProps", "required": true, "type": { "name": "DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>" } }, "getToggleButtonProps": { "defaultValue": { value: "() => ( {} )" }, "description": "", "name": "getToggleButtonProps", "required": false, "type": { "name": "(() => Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, \"ref\">)" } }, "suffix": { "defaultValue": null, "description": "", "name": "suffix", "required": false, "type": { "name": "Element | null" } }, "showToggleButton": { "defaultValue": null, "description": "", "name": "showToggleButton", "required": false, "type": { "name": "boolean" } } } };
// @ts-ignore
if (typeof STORYBOOK_REACT_CLASSES !== "undefined")
// @ts-ignore
STORYBOOK_REACT_CLASSES["../../packages/js/components/src/experimental-select-control/combo-box.tsx#ComboBox"] = { docgenInfo: ComboBox.__docgenInfo, name: "ComboBox", path: "../../packages/js/components/src/experimental-select-control/combo-box.tsx#ComboBox" };
}
catch (__react_docgen_typescript_loader_error) { }
/***/ }),
/***/ "../../packages/js/components/src/experimental-select-control/menu-item.tsx":
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ D: () => (/* binding */ MenuItem)
/* harmony export */ });
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../node_modules/.pnpm/@wordpress+components@19.8.5_@types+react@17.0.71_react-dom@17.0.2_react@17.0.2__react-with-d_oli5xz3n7pc4ztqokra47llglu/node_modules/@wordpress/components/build-module/tooltip/index.js");
/**
* External dependencies
*/
/**
* Internal dependencies
*/
var MenuItem = function MenuItem(_ref) {
var children = _ref.children,
getItemProps = _ref.getItemProps,
index = _ref.index,
isActive = _ref.isActive,
_ref$activeStyle = _ref.activeStyle,
activeStyle = _ref$activeStyle === void 0 ? {
backgroundColor: '#bde4ff'
} : _ref$activeStyle,
item = _ref.item,
tooltipText = _ref.tooltipText,
className = _ref.className;
function renderListItem() {
var itemProps = getItemProps({
item: item,
index: index
});
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("li", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .A)({}, itemProps, {
style: isActive ? activeStyle : itemProps.style,
className: classnames__WEBPACK_IMPORTED_MODULE_0___default()('woocommerce-experimental-select-control__menu-item', itemProps.className, className)
}), children);
}
if (tooltipText) {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .A, {
text: tooltipText,
position: "top center"
}, renderListItem());
}
return renderListItem();
};
try {
// @ts-ignore
MenuItem.displayName = "MenuItem";
// @ts-ignore
MenuItem.__docgenInfo = { "description": "", "displayName": "MenuItem", "props": { "index": { "defaultValue": null, "description": "", "name": "index", "required": true, "type": { "name": "number" } }, "isActive": { "defaultValue": null, "description": "", "name": "isActive", "required": true, "type": { "name": "boolean" } }, "item": { "defaultValue": null, "description": "", "name": "item", "required": true, "type": { "name": "ItemType" } }, "getItemProps": { "defaultValue": null, "description": "", "name": "getItemProps", "required": true, "type": { "name": "getItemPropsType<ItemType>" } }, "activeStyle": { "defaultValue": { value: "{ backgroundColor: '#bde4ff' }" }, "description": "", "name": "activeStyle", "required": false, "type": { "name": "CSSProperties" } }, "tooltipText": { "defaultValue": null, "description": "", "name": "tooltipText", "required": false, "type": { "name": "string" } }, "className": { "defaultValue": null, "description": "", "name": "className", "required": false, "type": { "name": "string" } } } };
// @ts-ignore
if (typeof STORYBOOK_REACT_CLASSES !== "undefined")
// @ts-ignore
STORYBOOK_REACT_CLASSES["../../packages/js/components/src/experimental-select-control/menu-item.tsx#MenuItem"] = { docgenInfo: MenuItem.__docgenInfo, name: "MenuItem", path: "../../packages/js/components/src/experimental-select-control/menu-item.tsx#MenuItem" };
}
catch (__react_docgen_typescript_loader_error) { }
/***/ }),
/***/ "../../packages/js/components/src/experimental-select-control/menu.tsx":
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ W: () => (/* binding */ Menu),
/* harmony export */ c: () => (/* binding */ MenuSlot)
/* harmony export */ });
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../node_modules/.pnpm/@wordpress+components@19.8.5_@types+react@17.0.71_react-dom@17.0.2_react@17.0.2__react-with-d_oli5xz3n7pc4ztqokra47llglu/node_modules/@wordpress/components/build-module/popover/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../node_modules/.pnpm/react-dom@18.3.1_react@18.3.1/node_modules/react-dom/index.js");
/**
* External dependencies
*/
/**
* Internal dependencies
*/
var Menu = function Menu(_ref) {
var _selectControlMenuRef2;
var children = _ref.children,
getMenuProps = _ref.getMenuProps,
isOpen = _ref.isOpen,
className = _ref.className,
_ref$position = _ref.position,
position = _ref$position === void 0 ? 'bottom right' : _ref$position,
_ref$scrollIntoViewOn = _ref.scrollIntoViewOnOpen,
scrollIntoViewOnOpen = _ref$scrollIntoViewOn === void 0 ? false : _ref$scrollIntoViewOn;
var selectControlMenuRef = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);
var popoverRef = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useLayoutEffect)(function () {
var _selectControlMenuRef, _popoverRef$current;
var comboboxWrapper = (_selectControlMenuRef = selectControlMenuRef.current) === null || _selectControlMenuRef === void 0 ? void 0 : _selectControlMenuRef.closest('.woocommerce-experimental-select-control__combo-box-wrapper');
var popoverContent = (_popoverRef$current = popoverRef.current) === null || _popoverRef$current === void 0 ? void 0 : _popoverRef$current.querySelector('.components-popover__content');
if (comboboxWrapper && (comboboxWrapper === null || comboboxWrapper === void 0 ? void 0 : comboboxWrapper.clientWidth) > 0) {
if (popoverContent) {
popoverContent.style.width = "".concat(comboboxWrapper.getBoundingClientRect().width, "px");
}
}
}, [selectControlMenuRef.current, (_selectControlMenuRef2 = selectControlMenuRef.current) === null || _selectControlMenuRef2 === void 0 ? void 0 : _selectControlMenuRef2.clientWidth, popoverRef.current]);
// Scroll the selected item into view when the menu opens.
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {
if (isOpen && scrollIntoViewOnOpen) {
var _selectControlMenuRef3;
(_selectControlMenuRef3 = selectControlMenuRef.current) === null || _selectControlMenuRef3 === void 0 || _selectControlMenuRef3.scrollIntoView();
}
}, [isOpen, scrollIntoViewOnOpen]);
/* eslint-disable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events */
/* Disabled because of the onmouseup on the ul element below. */
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
ref: selectControlMenuRef,
className: "woocommerce-experimental-select-control__menu"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .A
// @ts-expect-error this prop does exist, see: https://github.com/WordPress/gutenberg/blob/trunk/packages/components/src/popover/index.tsx#L180.
, {
__unstableSlotName: "woocommerce-select-control-menu",
focusOnMount: false,
className: classnames__WEBPACK_IMPORTED_MODULE_0___default()('woocommerce-experimental-select-control__popover-menu', {
'is-open': isOpen,
'has-results': _wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Children.count(children) > 0
}),
position: position,
animate: false,
resize: false,
ref: popoverRef
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("ul", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .A)({}, getMenuProps(), {
className: classnames__WEBPACK_IMPORTED_MODULE_0___default()('woocommerce-experimental-select-control__popover-menu-container', className),
onMouseUp: function onMouseUp(e) {
return (
// Fix to prevent select control dropdown from closing when selecting within the Popover.
e.stopPropagation()
);
}
}), isOpen && children))));
/* eslint-enable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events */
};
var MenuSlot = function MenuSlot() {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.createPortal)((0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
"aria-live": "off"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .A.Slot, {
name: "woocommerce-select-control-menu"
})), document.body);
};
try {
// @ts-ignore
Menu.displayName = "Menu";
// @ts-ignore
Menu.__docgenInfo = { "description": "", "displayName": "Menu", "props": { "getMenuProps": { "defaultValue": null, "description": "", "name": "getMenuProps", "required": true, "type": { "name": "getMenuPropsType" } }, "isOpen": { "defaultValue": null, "description": "", "name": "isOpen", "required": true, "type": { "name": "boolean" } }, "className": { "defaultValue": null, "description": "", "name": "className", "required": false, "type": { "name": "string" } }, "position": { "defaultValue": { value: "bottom right" }, "description": "", "name": "position", "required": false, "type": { "name": "enum", "value": [{ "value": "\"top left\"" }, { "value": "\"top right\"" }, { "value": "\"top center\"" }, { "value": "\"middle left\"" }, { "value": "\"middle right\"" }, { "value": "\"middle center\"" }, { "value": "\"bottom left\"" }, { "value": "\"bottom right\"" }, { "value": "\"bottom center\"" }] } }, "scrollIntoViewOnOpen": { "defaultValue": { value: "false" }, "description": "", "name": "scrollIntoViewOnOpen", "required": false, "type": { "name": "boolean" } } } };
// @ts-ignore
if (typeof STORYBOOK_REACT_CLASSES !== "undefined")
// @ts-ignore
STORYBOOK_REACT_CLASSES["../../packages/js/components/src/experimental-select-control/menu.tsx#Menu"] = { docgenInfo: Menu.__docgenInfo, name: "Menu", path: "../../packages/js/components/src/experimental-select-control/menu.tsx#Menu" };
}
catch (__react_docgen_typescript_loader_error) { }
try {
// @ts-ignore
MenuSlot.displayName = "MenuSlot";
// @ts-ignore
MenuSlot.__docgenInfo = { "description": "", "displayName": "MenuSlot", "props": {} };
// @ts-ignore
if (typeof STORYBOOK_REACT_CLASSES !== "undefined")
// @ts-ignore
STORYBOOK_REACT_CLASSES["../../packages/js/components/src/experimental-select-control/menu.tsx#MenuSlot"] = { docgenInfo: MenuSlot.__docgenInfo, name: "MenuSlot", path: "../../packages/js/components/src/experimental-select-control/menu.tsx#MenuSlot" };
}
catch (__react_docgen_typescript_loader_error) { }
/***/ }),
/***/ "../../packages/js/components/src/experimental-select-control/select-control.tsx":
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
Y: () => (/* binding */ SelectControl),
U: () => (/* binding */ selectControlStateChangeTypes)
});
// EXTERNAL MODULE: ../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/extends.js
var esm_extends = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/extends.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/defineProperty.js
var defineProperty = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/defineProperty.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js + 1 modules
var objectWithoutProperties = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/slicedToArray.js + 1 modules
var slicedToArray = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js
var react = __webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.map.js
var es_array_map = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.map.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.concat.js
var es_array_concat = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.concat.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.is-array.js
var es_array_is_array = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.is-array.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.filter.js
var es_array_filter = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.filter.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.to-string.js
var es_object_to_string = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.to-string.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.keys.js
var es_object_keys = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.keys.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.symbol.js
var es_symbol = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.symbol.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.get-own-property-descriptor.js
var es_object_get_own_property_descriptor = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.get-own-property-descriptor.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.for-each.js
var es_array_for_each = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.for-each.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/web.dom-collections.for-each.js
var web_dom_collections_for_each = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/web.dom-collections.for-each.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.get-own-property-descriptors.js
var es_object_get_own_property_descriptors = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.get-own-property-descriptors.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.define-properties.js
var es_object_define_properties = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.define-properties.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.define-property.js
var es_object_define_property = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.object.define-property.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js
var classnames = __webpack_require__("../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js");
var classnames_default = /*#__PURE__*/__webpack_require__.n(classnames);
// EXTERNAL MODULE: ../../node_modules/.pnpm/downshift@6.1.12_react@17.0.2/node_modules/downshift/dist/downshift.esm.js + 1 modules
var downshift_esm = __webpack_require__("../../node_modules/.pnpm/downshift@6.1.12_react@17.0.2/node_modules/downshift/dist/downshift.esm.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/@wordpress+compose@5.4.1_react@17.0.2/node_modules/@wordpress/compose/build-module/hooks/use-instance-id/index.js
var use_instance_id = __webpack_require__("../../node_modules/.pnpm/@wordpress+compose@5.4.1_react@17.0.2/node_modules/@wordpress/compose/build-module/hooks/use-instance-id/index.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/library/chevron-down.js
var chevron_down = __webpack_require__("../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/library/chevron-down.js");
// EXTERNAL MODULE: ../../packages/js/components/src/experimental-select-control/selected-items.tsx
var selected_items = __webpack_require__("../../packages/js/components/src/experimental-select-control/selected-items.tsx");
// EXTERNAL MODULE: ../../packages/js/components/src/experimental-select-control/combo-box.tsx
var combo_box = __webpack_require__("../../packages/js/components/src/experimental-select-control/combo-box.tsx");
// EXTERNAL MODULE: ../../packages/js/components/src/experimental-select-control/menu.tsx
var menu = __webpack_require__("../../packages/js/components/src/experimental-select-control/menu.tsx");
// EXTERNAL MODULE: ../../packages/js/components/src/experimental-select-control/menu-item.tsx
var menu_item = __webpack_require__("../../packages/js/components/src/experimental-select-control/menu-item.tsx");
// EXTERNAL MODULE: ../../packages/js/components/src/experimental-select-control/suffix-icon.tsx
var suffix_icon = __webpack_require__("../../packages/js/components/src/experimental-select-control/suffix-icon.tsx");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.regexp.exec.js
var es_regexp_exec = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.regexp.exec.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.string.replace.js
var es_string_replace = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.string.replace.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.regexp.constructor.js
var es_regexp_constructor = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.regexp.constructor.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.regexp.to-string.js
var es_regexp_to_string = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.regexp.to-string.js");
// EXTERNAL MODULE: ../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.index-of.js
var es_array_index_of = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.index-of.js");
;// CONCATENATED MODULE: ../../packages/js/components/src/experimental-select-control/utils.ts
/**
* Internal dependencies
*/
function isDefaultItemType(item) {
return Boolean(item) && item.label !== undefined && item.value !== undefined;
}
var defaultGetItemLabel = function defaultGetItemLabel(item) {
if (isDefaultItemType(item)) {
return item.label;
}
return '';
};
var defaultGetItemValue = function defaultGetItemValue(item) {
if (isDefaultItemType(item)) {
return item.value;
}
return '';
};
var defaultGetFilteredItems = function defaultGetFilteredItems(allItems, inputValue, selectedItems, getItemLabel) {
var escapedInputValue = inputValue.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
var re = new RegExp(escapedInputValue, 'gi');
return allItems.filter(function (item) {
return selectedItems.indexOf(item) < 0 && re.test(getItemLabel(item).toLowerCase());
});
};
;// CONCATENATED MODULE: ../../packages/js/components/src/experimental-select-control/select-control.tsx
var _excluded = ["inputValue"];
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;
}
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) {
(0,defineProperty/* default */.A)(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;
}
/**
* External dependencies
*/
/**
* Internal dependencies
*/
var selectControlStateChangeTypes = downshift_esm/* useCombobox */.Bp.stateChangeTypes;
function SelectControl(_ref) {
var _ref$getItemLabel = _ref.getItemLabel,
getItemLabel = _ref$getItemLabel === void 0 ? defaultGetItemLabel : _ref$getItemLabel,
_ref$getItemValue = _ref.getItemValue,
getItemValue = _ref$getItemValue === void 0 ? defaultGetItemValue : _ref$getItemValue,
_ref$hasExternalTags = _ref.hasExternalTags,
hasExternalTags = _ref$hasExternalTags === void 0 ? false : _ref$hasExternalTags,
_ref$children = _ref.children,
children = _ref$children === void 0 ? function (_ref2) {
var renderItems = _ref2.items,
highlightedIndex = _ref2.highlightedIndex,
getItemProps = _ref2.getItemProps,
getMenuProps = _ref2.getMenuProps,
isOpen = _ref2.isOpen;
return (0,react.createElement)(menu/* Menu */.W, {
getMenuProps: getMenuProps,
isOpen: isOpen
}, renderItems.map(function (item, index) {
return (0,react.createElement)(menu_item/* MenuItem */.D, {
key: "".concat(getItemValue(item)).concat(index),
index: index,
isActive: highlightedIndex === index,
item: item,
getItemProps: getItemProps
}, getItemLabel(item));
}));
} : _ref$children,
_ref$multiple = _ref.multiple,
multiple = _ref$multiple === void 0 ? false : _ref$multiple,
items = _ref.items,
label = _ref.label,
_ref$getFilteredItems = _ref.getFilteredItems,
getFilteredItems = _ref$getFilteredItems === void 0 ? defaultGetFilteredItems : _ref$getFilteredItems,
_ref$onInputChange = _ref.onInputChange,
onInputChange = _ref$onInputChange === void 0 ? function () {
return null;
} : _ref$onInputChange,
_ref$onRemove = _ref.onRemove,
onRemove = _ref$onRemove === void 0 ? function () {
return null;
} : _ref$onRemove,
_ref$onSelect = _ref.onSelect,
onSelect = _ref$onSelect === void 0 ? function () {
return null;
} : _ref$onSelect,
_ref$onFocus = _ref.onFocus,
_onFocus = _ref$onFocus === void 0 ? function () {
return null;
} : _ref$onFocus,
_ref$onKeyDown = _ref.onKeyDown,
onKeyDown = _ref$onKeyDown === void 0 ? function () {
return null;
} : _ref$onKeyDown,
_ref$stateReducer = _ref.stateReducer,
_stateReducer = _ref$stateReducer === void 0 ? function (state, actionAndChanges) {
return actionAndChanges.changes;
} : _ref$stateReducer,
placeholder = _ref.placeholder,
selected = _ref.selected,
className = _ref.className,
disabled = _ref.disabled,
_ref$inputProps = _ref.inputProps,
inputProps = _ref$inputProps === void 0 ? {} : _ref$inputProps,
_ref$suffix = _ref.suffix,
suffix = _ref$suffix === void 0 ? (0,react.createElement)(suffix_icon/* SuffixIcon */.f, {
icon: chevron_down/* default */.A
}) : _ref$suffix,
_ref$showToggleButton = _ref.showToggleButton,
showToggleButton = _ref$showToggleButton === void 0 ? false : _ref$showToggleButton,
_ref$readOnlyWhenClos = _ref.readOnlyWhenClosed,
readOnlyWhenClosed = _ref$readOnlyWhenClos === void 0 ? true : _ref$readOnlyWhenClos,
_ref$__experimentalOp = _ref.__experimentalOpenMenuOnFocus,
__experimentalOpenMenuOnFocus = _ref$__experimentalOp === void 0 ? false : _ref$__experimentalOp;
var _useState = (0,react.useState)(false),
_useState2 = (0,slicedToArray/* default */.A)(_useState, 2),
isFocused = _useState2[0],
setIsFocused = _useState2[1];
var _useState3 = (0,react.useState)(''),
_useState4 = (0,slicedToArray/* default */.A)(_useState3, 2),
inputValue = _useState4[0],
setInputValue = _useState4[1];
var instanceId = (0,use_instance_id/* default */.A)(SelectControl, 'woocommerce-experimental-select-control');
var innerInputClassName = 'woocommerce-experimental-select-control__input';
var selectControlWrapperRef = (0,react.useRef)(null);
var selectedItems = selected === null ? [] : selected;
selectedItems = Array.isArray(selectedItems) ? selectedItems : [selectedItems].filter(Boolean);
var singleSelectedItem = !multiple && selectedItems.length ? selectedItems[0] : null;
var filteredItems = getFilteredItems(items, inputValue, selectedItems, getItemLabel);
var _useMultipleSelection = (0,downshift_esm/* useMultipleSelection */.mH)({
itemToString: getItemLabel,
selectedItems: selectedItems
}),
getSelectedItemProps = _useMultipleSelection.getSelectedItemProps,
getDropdownProps = _useMultipleSelection.getDropdownProps,
removeSelectedItem = _useMultipleSelection.removeSelectedItem;
(0,react.useEffect)(function () {
if (multiple) {
return;
}
setInputValue(getItemLabel(singleSelectedItem));
}, [getItemLabel, multiple, singleSelectedItem]);
var _useCombobox = (0,downshift_esm/* useCombobox */.Bp)({
id: instanceId,
initialSelectedItem: singleSelectedItem,
inputValue: inputValue,
items: filteredItems,
selectedItem: multiple ? null : singleSelectedItem,
itemToString: getItemLabel,
onSelectedItemChange: function onSelectedItemChange(_ref3) {
var selectedItem = _ref3.selectedItem;
if (selectedItem) {
onSelect(selectedItem);
} else if (singleSelectedItem) {
onRemove(singleSelectedItem);
}
},
onInputValueChange: function onInputValueChange(_ref4) {
var value = _ref4.inputValue,
changes = (0,objectWithoutProperties/* default */.A)(_ref4, _excluded);
if (value !== undefined) {
setInputValue(value);
onInputChange(value, changes);
}
},
// @ts-expect-error We're allowed to use the property.
stateReducer: function stateReducer(state, actionAndChanges) {
var _changes$inputValue, _changes$inputValue2, _newChanges;
var changes = actionAndChanges.changes,
type = actionAndChanges.type;
var newChanges;
switch (type) {
case selectControlStateChangeTypes.InputBlur:
// Set input back to selected item if there is a selected item, blank otherwise.
newChanges = _objectSpread(_objectSpread({}, changes), {}, {
selectedItem: !((_changes$inputValue = changes.inputValue) !== null && _changes$inputValue !== void 0 && _changes$inputValue.length) && !multiple ? null : changes.selectedItem,
inputValue: changes.selectedItem === state.selectedItem && (_changes$inputValue2 = changes.inputValue) !== null && _changes$inputValue2 !== void 0 && _changes$inputValue2.length && !multiple ? getItemLabel(comboboxSingleSelectedItem) : ''
});
break;
case selectControlStateChangeTypes.InputKeyDownEnter:
case selectControlStateChangeTypes.FunctionSelectItem:
case selectControlStateChangeTypes.ItemClick:
if (changes.selectedItem && multiple) {
newChanges = _objectSpread(_objectSpread({}, changes), {}, {
inputValue: ''
});
}
break;
default:
break;
}
return _stateReducer(state, _objectSpread(_objectSpread({}, actionAndChanges), {}, {
changes: (_newChanges = newChanges) !== null && _newChanges !== void 0 ? _newChanges : changes
}));
}
}),
isOpen = _useCombobox.isOpen,
getLabelProps = _useCombobox.getLabelProps,
getMenuProps = _useCombobox.getMenuProps,
getToggleButtonProps = _useCombobox.getToggleButtonProps,
getInputProps = _useCombobox.getInputProps,
getComboboxProps = _useCombobox.getComboboxProps,
highlightedIndex = _useCombobox.highlightedIndex,
getItemProps = _useCombobox.getItemProps,
selectItem = _useCombobox.selectItem,
comboboxSingleSelectedItem = _useCombobox.selectedItem,
openMenu = _useCombobox.openMenu,
closeMenu = _useCombobox.closeMenu;
var isEventOutside = function isEventOutside(event) {
var selectControlWrapperElement = selectControlWrapperRef.current;
var menuElement = document.getElementById("".concat(instanceId, "-menu"));
var parentPopoverMenuElement = menuElement === null || menuElement === void 0 ? void 0 : menuElement.closest('.woocommerce-experimental-select-control__popover-menu');
return !(selectControlWrapperElement !== null && selectControlWrapperElement !== void 0 && selectControlWrapperElement.contains(event.relatedTarget)) && !(parentPopoverMenuElement !== null && parentPopoverMenuElement !== void 0 && parentPopoverMenuElement.contains(event.relatedTarget));
};
var onRemoveItem = function onRemoveItem(item) {
selectItem(null);
removeSelectedItem(item);
onRemove(item);
};
var isReadOnly = readOnlyWhenClosed && !isOpen && !isFocused;
var selectedItemTags = multiple ? (0,react.createElement)(selected_items/* SelectedItems */.K, {
items: selectedItems,
isReadOnly: isReadOnly,
getItemLabel: getItemLabel,
getItemValue: getItemValue,
getSelectedItemProps: getSelectedItemProps,
onRemove: onRemoveItem
}) : null;
return (0,react.createElement)("div", {
id: instanceId,
ref: selectControlWrapperRef,
className: classnames_default()('woocommerce-experimental-select-control', className, {
'is-read-only': isReadOnly,
'is-focused': isFocused,
'is-multiple': multiple,
'has-selected-items': selectedItems.length
})
}, label && (0,react.createElement)("label", (0,esm_extends/* default */.A)({}, getLabelProps(), {
className: "woocommerce-experimental-select-control__label"
}), label), (0,react.createElement)(combo_box/* ComboBox */.a, {
comboBoxProps: getComboboxProps(),
getToggleButtonProps: getToggleButtonProps,
inputProps: getInputProps(_objectSpread(_objectSpread({}, getDropdownProps({
preventKeyAction: isOpen
})), {}, {
className: innerInputClassName,
onFocus: function onFocus() {
setIsFocused(true);
_onFocus({
inputValue: inputValue
});
if (__experimentalOpenMenuOnFocus) {
openMenu();
}
},
onBlur: function onBlur(event) {
if (isEventOutside(event)) {
setIsFocused(false);
}
},
onKeyDown: onKeyDown,
placeholder: placeholder,
disabled: disabled
}, inputProps)),
suffix: suffix,
showToggleButton: showToggleButton
}, (0,react.createElement)(react.Fragment, null, children({
items: filteredItems,
highlightedIndex: highlightedIndex,
getItemProps: getItemProps,
getMenuProps: getMenuProps,
isOpen: isOpen,
getItemLabel: getItemLabel,
getItemValue: getItemValue,
selectItem: selectItem,
setInputValue: setInputValue,
openMenu: openMenu,
closeMenu: closeMenu
}), !hasExternalTags && selectedItemTags)), hasExternalTags && selectedItemTags);
}
try {
// @ts-ignore
SelectControl.displayName = "SelectControl";
// @ts-ignore
SelectControl.__docgenInfo = { "description": "", "displayName": "SelectControl", "props": { "items": { "defaultValue": null, "description": "", "name": "items", "required": true, "type": { "name": "ItemType[]" } }, "label": { "defaultValue": null, "description": "", "name": "label", "required": true, "type": { "name": "string | Element" } }, "getItemLabel": { "defaultValue": { value: "< ItemType >( item: ItemType | null ) => {\n\tif ( isDefaultItemType< ItemType >( item ) ) {\n\t\treturn item.label;\n\t}\n\treturn '';\n}" }, "description": "", "name": "getItemLabel", "required": false, "type": { "name": "getItemLabelType<ItemType>" } }, "getItemValue": { "defaultValue": { value: "< ItemType >( item: ItemType | null ) => {\n\tif ( isDefaultItemType< ItemType >( item ) ) {\n\t\treturn item.value;\n\t}\n\treturn '';\n}" }, "description": "", "name": "getItemValue", "required": false, "type": { "name": "getItemValueType<ItemType>" } }, "getFilteredItems": { "defaultValue": { value: "< ItemType >(\n\tallItems: ItemType[],\n\tinputValue: string,\n\tselectedItems: ItemType[],\n\tgetItemLabel: getItemLabelType< ItemType >\n) => {\n\tconst escapedInputValue = inputValue.replace(\n\t\t/[.*+?^${}()|[\\]\\\\]/g,\n\t\t'\\\\$&'\n\t);\n\tconst re = new RegExp( escapedInputValue, 'gi' );\n\n\treturn allItems.filter( ( item ) => {\n\t\treturn (\n\t\t\tselectedItems.indexOf( item ) < 0 &&\n\t\t\tre.test( getItemLabel( item ).toLowerCase() )\n\t\t);\n\t} );\n}" }, "description": "", "name": "getFilteredItems", "required": false, "type": { "name": "((allItems: ItemType[], inputValue: string, selectedItems: ItemType[], getItemLabel: getItemLabelType<ItemType>) => ItemType[])" } }, "hasExternalTags": { "defaultValue": { value: "false" }, "description": "", "name": "hasExternalTags", "required": false, "type": { "name": "boolean" } }, "multiple": { "defaultValue": { value: "false" }, "description": "", "name": "multiple", "required": false, "type": { "name": "boolean" } }, "onInputChange": { "defaultValue": { value: "() => null" }, "description": "", "name": "onInputChange", "required": false, "type": { "name": "((value: string, changes: Partial<Omit<UseComboboxState<ItemType>, \"inputValue\">>) => void)" } }, "onRemove": { "defaultValue": { value: "() => null" }, "description": "", "name": "onRemove", "required": false, "type": { "name": "((item: ItemType) => void)" } }, "onSelect": { "defaultValue": { value: "() => null" }, "description": "", "name": "onSelect", "required": false, "type": { "name": "((selected: ItemType) => void)" } }, "onKeyDown": { "defaultValue": { value: "() => null" }, "description": "", "name": "onKeyDown", "required": false, "type": { "name": "((e: KeyboardEvent) => void)" } }, "onFocus": { "defaultValue": { value: "() => null" }, "description": "", "name": "onFocus", "required": false, "type": { "name": "((data: { inputValue: string; }) => void)" } }, "stateReducer": { "defaultValue": { value: "( state, actionAndChanges ) => actionAndChanges.changes" }, "description": "", "name": "stateReducer", "required": false, "type": { "name": "((state: UseComboboxState<ItemType | null>, actionAndChanges: UseComboboxStateChangeOptions<ItemType | null>) => Partial<...>)" } }, "placeholder": { "defaultValue": null, "description": "", "name": "placeholder", "required": false, "type": { "name": "string" } }, "selected": { "defaultValue": null, "description": "", "name": "selected", "required": true, "type": { "name": "ItemType | ItemType[] | null" } }, "className": { "defaultValue": null, "description": "", "name": "className", "required": false, "type": { "name": "string" } }, "disabled": { "defaultValue": null, "description": "", "name": "disabled", "required": false, "type": { "name": "boolean" } }, "inputProps": { "defaultValue": { value: "{}" }, "description": "", "name": "inputProps", "required": false, "type": { "name": "GetInputPropsOptions" } }, "suffix": { "defaultValue": { value: "<SuffixIcon icon={ chevronDown } />" }, "description": "", "name": "suffix", "required": false, "type": { "name": "Element | null" } }, "showToggleButton": { "defaultValue": { value: "false" }, "description": "", "name": "showToggleButton", "required": false, "type": { "name": "boolean" } }, "readOnlyWhenClosed": { "defaultValue": { value: "true" }, "description": "", "name": "readOnlyWhenClosed", "required": false, "type": { "name": "boolean" } }, "__experimentalOpenMenuOnFocus": { "defaultValue": { value: "false" }, "description": "This is a feature already implemented in downshift@7.0.0 through the\nreducer. In order for us to use it this prop is added temporarily until\ncurrent downshift version get updated.\n@see https://www.downshift-js.com/use-multiple-selection#usage-with-combobox", "name": "__experimentalOpenMenuOnFocus", "required": false, "type": { "name": "boolean" } } } };
// @ts-ignore
if (typeof STORYBOOK_REACT_CLASSES !== "undefined")
// @ts-ignore
STORYBOOK_REACT_CLASSES["../../packages/js/components/src/experimental-select-control/select-control.tsx#SelectControl"] = { docgenInfo: SelectControl.__docgenInfo, name: "SelectControl", path: "../../packages/js/components/src/experimental-select-control/select-control.tsx#SelectControl" };
}
catch (__react_docgen_typescript_loader_error) { }
/***/ }),
/***/ "../../packages/js/components/src/experimental-select-control/selected-items.tsx":
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ K: () => (/* binding */ SelectedItems)
/* harmony export */ });
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js");
/* harmony import */ var core_js_modules_es_array_join_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.join.js");
/* harmony import */ var core_js_modules_es_array_join_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_join_js__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var core_js_modules_es_array_map_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../node_modules/.pnpm/core-js@3.34.0/node_modules/core-js/modules/es.array.map.js");
/* harmony import */ var core_js_modules_es_array_map_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_map_js__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_html_entities__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../node_modules/.pnpm/@wordpress+html-entities@3.6.1/node_modules/@wordpress/html-entities/build-module/index.js");
/* harmony import */ var _tag__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__("../../packages/js/components/src/tag/index.tsx");
/**
* External dependencies
*/
/**
* Internal dependencies
*/
var PrivateSelectedItems = function PrivateSelectedItems(_ref, ref) {
var isReadOnly = _ref.isReadOnly,
items = _ref.items,
getItemLabel = _ref.getItemLabel,
getItemValue = _ref.getItemValue,
getSelectedItemProps = _ref.getSelectedItemProps,
onRemove = _ref.onRemove,
onBlur = _ref.onBlur,
onSelectedItemsEnd = _ref.onSelectedItemsEnd;
var classes = classnames__WEBPACK_IMPORTED_MODULE_2___default()('woocommerce-experimental-select-control__selected-items', {
'is-read-only': isReadOnly
});
var lastRemoveButtonRef = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useRef)(null);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useImperativeHandle)(ref, function () {
return function () {
var _lastRemoveButtonRef$;
return (_lastRemoveButtonRef$ = lastRemoveButtonRef.current) === null || _lastRemoveButtonRef$ === void 0 ? void 0 : _lastRemoveButtonRef$.focus();
};
}, []);
if (isReadOnly) {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.createElement)("div", {
className: classes
}, items.map(function (item) {
return (0,_wordpress_html_entities__WEBPACK_IMPORTED_MODULE_4__/* .decodeEntities */ .S)(getItemLabel(item));
}).join(', '));
}
var focusSibling = function focusSibling(event) {
var selectedItem = event.target.closest('.woocommerce-experimental-select-control__selected-item');
var sibling = event.key === 'ArrowLeft' || event.key === 'Backspace' ? selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.previousSibling : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.nextSibling;
if (sibling) {
var _querySelector;
(_querySelector = sibling.querySelector('.woocommerce-tag__remove')) === null || _querySelector === void 0 || _querySelector.focus();
return true;
}
return false;
};
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.createElement)("div", {
className: classes
}, items.map(function (item, index) {
return (
// Disable reason: We prevent the default action to keep the input focused on click.
// Keyboard users are unaffected by this change.
/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.createElement)("div", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({
key: "selected-item-".concat(index),
className: "woocommerce-experimental-select-control__selected-item"
}, getSelectedItemProps({
selectedItem: item,
index: index
}), {
onMouseDown: function onMouseDown(event) {
event.preventDefault();
},
onClick: function onClick(event) {
event.preventDefault();
},
onKeyDown: function onKeyDown(event) {
if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {
var focused = focusSibling(event);
if (!focused && event.key === 'ArrowRight' && onSelectedItemsEnd) {
onSelectedItemsEnd();
}
} else if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
event.preventDefault(); // prevent unwanted scroll
} else if (event.key === 'Backspace') {
onRemove(item);
focusSibling(event);
}
},
onBlur: onBlur
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.createElement)(_tag__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .A, {
id: getItemValue(item),
remove: function remove() {
return function () {
return onRemove(item);
};
},
label: getItemLabel(item),
ref: index === items.length - 1 ? lastRemoveButtonRef : undefined
}))
);
}));
};
var SelectedItems = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.forwardRef)(PrivateSelectedItems);
try {
// @ts-ignore
SelectedItems.displayName = "SelectedItems";
// @ts-ignore
SelectedItems.__docgenInfo = { "description": "", "displayName": "SelectedItems", "props": { "isReadOnly": { "defaultValue": null, "description": "", "name": "isReadOnly", "required": true, "type": { "name": "boolean" } }, "items": { "defaultValue": null, "description": "", "name": "items", "required": true, "type": { "name": "ItemType[]" } }, "getItemLabel": { "defaultValue": null, "description": "", "name": "getItemLabel", "required": true, "type": { "name": "getItemLabelType<ItemType>" } }, "getItemValue": { "defaultValue": null, "description": "", "name": "getItemValue", "required": true, "type": { "name": "getItemValueType<ItemType>" } }, "getSelectedItemProps": { "defaultValue": null, "description": "", "name": "getSelectedItemProps", "required": true, "type": { "name": "({ selectedItem: any, index: any }: { selectedItem: any; index: any; }) => { [key: string]: string; }" } }, "onRemove": { "defaultValue": null, "description": "", "name": "onRemove", "required": true, "type": { "name": "(item: ItemType) => void" } }, "onBlur": { "defaultValue": null, "description": "", "name": "onBlur", "required": false, "type": { "name": "((event: FocusEvent<Element, Element>) => void)" } }, "onSelectedItemsEnd": { "defaultValue": null, "description": "", "name": "onSelectedItemsEnd", "required": false, "type": { "name": "(() => void)" } }, "ref": { "defaultValue": null, "description": "", "name": "ref", "required": false, "type": { "name": "ForwardedRef<SelectedItemFocusHandle>" } } } };
// @ts-ignore
if (typeof STORYBOOK_REACT_CLASSES !== "undefined")
// @ts-ignore
STORYBOOK_REACT_CLASSES["../../packages/js/components/src/experimental-select-control/selected-items.tsx#SelectedItems"] = { docgenInfo: SelectedItems.__docgenInfo, name: "SelectedItems", path: "../../packages/js/components/src/experimental-select-control/selected-items.tsx#SelectedItems" };
}
catch (__react_docgen_typescript_loader_error) { }
/***/ }),
/***/ "../../packages/js/components/src/experimental-select-control/suffix-icon.tsx":
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ f: () => (/* binding */ SuffixIcon)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_0__);
/**
* External dependencies
*/
var SuffixIcon = function SuffixIcon(_ref) {
var _ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
icon = _ref.icon;
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
className: classnames__WEBPACK_IMPORTED_MODULE_0___default()('woocommerce-experimental-select-control__suffix-icon', className)
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .A, {
icon: icon,
size: 24
}));
};
try {
// @ts-ignore
SuffixIcon.displayName = "SuffixIcon";
// @ts-ignore
SuffixIcon.__docgenInfo = { "description": "", "displayName": "SuffixIcon", "props": { "icon": { "defaultValue": null, "description": "", "name": "icon", "required": true, "type": { "name": "Element" } }, "className": { "defaultValue": { value: "" }, "description": "", "name": "className", "required": false, "type": { "name": "string" } } } };
// @ts-ignore
if (typeof STORYBOOK_REACT_CLASSES !== "undefined")
// @ts-ignore
STORYBOOK_REACT_CLASSES["../../packages/js/components/src/experimental-select-control/suffix-icon.tsx#SuffixIcon"] = { docgenInfo: SuffixIcon.__docgenInfo, name: "SuffixIcon", path: "../../packages/js/components/src/experimental-select-control/suffix-icon.tsx#SuffixIcon" };
}
catch (__react_docgen_typescript_loader_error) { }
/***/ })
}]);
Reference in New Issue View Git Blame Copy Permalink