UNPKG

devextreme

Version:

HTML5 JavaScript Component Suite for Responsive Web Development

112 lines (110 loc) 4.25 kB
/** * DevExtreme (cjs/__internal/ui/toolbar/internal/m_toolbar.menu.list.js) * Version: 24.2.6 * Build date: Mon Mar 17 2025 * * Copyright (c) 2012 - 2025 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.default = void 0; var _renderer = _interopRequireDefault(require("../../../../core/renderer")); var _iterator = require("../../../../core/utils/iterator"); var _m_list = require("../../../ui/list/m_list.base"); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e } } const TOOLBAR_MENU_ACTION_CLASS = "dx-toolbar-menu-action"; const TOOLBAR_HIDDEN_BUTTON_CLASS = "dx-toolbar-hidden-button"; const TOOLBAR_HIDDEN_BUTTON_GROUP_CLASS = "dx-toolbar-hidden-button-group"; const TOOLBAR_MENU_SECTION_CLASS = "dx-toolbar-menu-section"; const TOOLBAR_MENU_CUSTOM_CLASS = "dx-toolbar-menu-custom"; const TOOLBAR_MENU_LAST_SECTION_CLASS = "dx-toolbar-menu-last-section"; const SCROLLVIEW_CONTENT_CLASS = "dx-scrollview-content"; class ToolbarMenuList extends _m_list.ListBase { _init() { super._init(); this._activeStateUnit = ".dx-toolbar-menu-action:not(.dx-toolbar-hidden-button-group)" } _initMarkup() { this._renderSections(); super._initMarkup(); this._setMenuRole() } _getSections() { return this._itemContainer().children() } _itemElements() { return this._getSections().children(this._itemSelector()) } _renderSections() { const $container = this._itemContainer(); (0, _iterator.each)(["before", "center", "after", "menu"], ((_, section) => { const sectionName = `_$${section}Section`; if (!this[sectionName]) { this[sectionName] = (0, _renderer.default)("<div>").addClass("dx-toolbar-menu-section") } this[sectionName].appendTo($container) })) } _renderItems() { super._renderItems.apply(this, arguments); this._updateSections() } _setMenuRole() { const $menuContainer = this.$element().find(".dx-scrollview-content"); $menuContainer.attr("role", "menu") } _updateSections() { const $sections = this.$element().find(".dx-toolbar-menu-section"); $sections.removeClass("dx-toolbar-menu-last-section"); $sections.not(":empty").eq(-1).addClass("dx-toolbar-menu-last-section") } _renderItem(index, item, itemContainer, $after) { const location = item.location ?? "menu"; const $container = this[`_$${location}Section`]; const itemElement = super._renderItem(index, item, $container, $after); if (this._getItemTemplateName({ itemData: item })) { itemElement.addClass("dx-toolbar-menu-custom") } if ("menu" === location || "dxButton" === item.widget || "dxButtonGroup" === item.widget || item.isAction) { itemElement.addClass("dx-toolbar-menu-action") } if ("dxButton" === item.widget) { itemElement.addClass("dx-toolbar-hidden-button") } if ("dxButtonGroup" === item.widget) { itemElement.addClass("dx-toolbar-hidden-button-group") } itemElement.addClass(item.cssClass); return itemElement } _getItemTemplateName(args) { const template = super._getItemTemplateName(args); const data = args.itemData; const menuTemplate = null === data || void 0 === data ? void 0 : data.menuItemTemplate; return menuTemplate || template } _dataSourceOptions() { return { paginate: false } } _itemClickHandler(e, args, config) { if ((0, _renderer.default)(e.target).closest(".dx-toolbar-menu-action").length) { super._itemClickHandler(e, args, config) } } _clean() { this._getSections().empty(); super._clean() } } exports.default = ToolbarMenuList;