devextreme
Version:
JavaScript/TypeScript Component Suite for Responsive Web Development
84 lines (83 loc) • 3.69 kB
JavaScript
/**
* DevExtreme (cjs/__internal/pagination/page_size/small.js)
* Version: 25.2.5
* Build date: Fri Feb 20 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.PageSizeSmall = void 0;
var _inferno = require("inferno");
var _index = require("../../core/r1/runtime/inferno/index");
var _pagination_props = require("../common/pagination_props");
var _select_box = require("../drop_down_editors/select_box");
var _calculate_values_fitted_width = require("../utils/calculate_values_fitted_width");
var _compatibility_utils = require("../utils/compatibility_utils");
var _get_element_width = require("../utils/get_element_width");
const PaginationSmallDefaultProps = {
allowedPageSizes: []
};
const PageSizeSmallDefaultProps = Object.assign({}, PaginationSmallDefaultProps, {
pageSize: _pagination_props.PaginationDefaultProps.pageSize,
pageSizeChangedInternal: _pagination_props.PaginationDefaultProps.pageSizeChangedInternal
});
class PageSizeSmall extends _index.InfernoComponent {
constructor(props) {
super(props);
this.state = {
minWidth: 10
};
this.refs = null;
this.updateWidth = this.updateWidth.bind(this)
}
componentWillUpdate(nextProps, nextState, context) {
super.componentWillUpdate(nextProps, nextState, context)
}
createEffects() {
const dependency = [this.props, this.state.minWidth, this.props.pageSize, this.props.pageSizeChangedInternal, this.props.allowedPageSizes];
return [new _index.InfernoEffect(this.updateWidth, dependency)]
}
updateEffects() {
var _this$_effects$;
const dependency = [this.props, this.state.minWidth, this.props.pageSize, this.props.pageSizeChangedInternal, this.props.allowedPageSizes];
null === (_this$_effects$ = this._effects[0]) || void 0 === _this$_effects$ || _this$_effects$.update(dependency)
}
updateWidth() {
var _this$props$parentRef;
const minWidth = (0, _get_element_width.getElementMinWidth)(null === (_this$props$parentRef = this.props.parentRef) || void 0 === _this$props$parentRef ? void 0 : _this$props$parentRef.current);
this.setState((state => ({
minWidth: minWidth > 0 ? minWidth : state.minWidth
})))
}
getWidth() {
var _this$props$allowedPa;
return (0, _calculate_values_fitted_width.calculateValuesFittedWidth)(this.state.minWidth, null === (_this$props$allowedPa = this.props.allowedPageSizes) || void 0 === _this$props$allowedPa ? void 0 : _this$props$allowedPa.map((p => p.value)))
}
getInputAttributes() {
return {
"aria-label": (0, _compatibility_utils.getLocalizationMessage)(this.context, "dxPagination-ariaPageSize")
}
}
render() {
const {
allowedPageSizes: allowedPageSizes,
pageSize: pageSize,
pageSizeChangedInternal: pageSizeChangedInternal
} = this.props;
return (0, _inferno.createComponentVNode)(2, _select_box.SelectBox, {
displayExpr: "text",
valueExpr: "value",
dataSource: allowedPageSizes,
value: pageSize,
valueChange: pageSizeChangedInternal,
width: this.getWidth(),
inputAttr: this.getInputAttributes()
})
}
}
exports.PageSizeSmall = PageSizeSmall;
PageSizeSmall.defaultProps = PageSizeSmallDefaultProps;