@wordpress/components
Version:
UI components for WordPress.
88 lines (85 loc) • 2.83 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _i18n = require("@wordpress/i18n");
var _element = require("@wordpress/element");
var _rangeControl = _interopRequireDefault(require("../range-control"));
var _selectControl = _interopRequireDefault(require("../select-control"));
var _categorySelect = _interopRequireDefault(require("./category-select"));
var _jsxRuntime = require("react/jsx-runtime");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const DEFAULT_MIN_ITEMS = 1;
const DEFAULT_MAX_ITEMS = 100;
const defaultOrderByOptions = [{
label: (0, _i18n.__)('Newest to oldest'),
value: 'date/desc'
}, {
label: (0, _i18n.__)('Oldest to newest'),
value: 'date/asc'
}, {
/* translators: Label for ordering posts by title in ascending order. */
label: (0, _i18n.__)('A → Z'),
value: 'title/asc'
}, {
/* translators: Label for ordering posts by title in descending order. */
label: (0, _i18n.__)('Z → A'),
value: 'title/desc'
}];
const QueryControls = (0, _element.memo)(({
categoriesList,
selectedCategoryId,
numberOfItems,
order,
orderBy,
orderByOptions = defaultOrderByOptions,
maxItems = DEFAULT_MAX_ITEMS,
minItems = DEFAULT_MIN_ITEMS,
onCategoryChange,
onNumberOfItemsChange,
onOrderChange,
onOrderByChange
}) => {
const onChange = (0, _element.useCallback)(value => {
const [newOrderBy, newOrder] = value.split('/');
if (newOrder !== order) {
onOrderChange(newOrder);
}
if (newOrderBy !== orderBy) {
onOrderByChange(newOrderBy);
}
}, [order, orderBy, onOrderByChange, onOrderChange]);
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
children: [onOrderChange && onOrderByChange && /*#__PURE__*/(0, _jsxRuntime.jsx)(_selectControl.default, {
label: (0, _i18n.__)('Order by'),
value: `${orderBy}/${order}`,
options: orderByOptions,
onChange: onChange,
hideCancelButton: true
}), onCategoryChange && /*#__PURE__*/(0, _jsxRuntime.jsx)(_categorySelect.default, {
categoriesList: categoriesList,
label: (0, _i18n.__)('Category'),
noOptionLabel: (0, _i18n._x)('All', 'categories'),
selectedCategoryId: selectedCategoryId,
onChange: onCategoryChange,
hideCancelButton: true
}), onNumberOfItemsChange && /*#__PURE__*/(0, _jsxRuntime.jsx)(_rangeControl.default, {
__next40pxDefaultSize: true,
label: (0, _i18n.__)('Number of items'),
value: numberOfItems,
onChange: onNumberOfItemsChange,
min: minItems,
max: maxItems,
required: true
})]
});
});
var _default = exports.default = QueryControls;
//# sourceMappingURL=index.native.js.map