UNPKG

wj-elements

Version:

WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.

73 lines (72 loc) 2.23 kB
var __defProp = Object.defineProperty; var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value); import WJElement from "./wje-element.js"; const styles = "/*\n[ WJ Toolbar Action ]\n*/\n\n:host {\n .native-toolbar-action {\n display: flex;\n }\n}\n"; class ToolbarAction extends WJElement { /** * Creates an instance of ToolbarAction. */ constructor() { super(); /** * The class name for the component. * @type {string} */ __publicField(this, "className", "ToolbarAction"); } /** * Returns the CSS stylesheet for the component. * @static * @returns {CSSStyleSheet} The CSS stylesheet */ static get cssStyleSheet() { return styles; } /** * Returns the list of observed attributes. * @static * @returns {Array} An empty array */ static get observedAttributes() { return []; } /** * Sets up the attributes for the component. */ setupAttributes() { this.isShadowRoot = "open"; } /** * Draws the component for the toolbar action. * @returns {object} Document fragment */ draw() { let fragment = document.createDocumentFragment(); let maxItems = +this.maxItems || 0; let actions = this.getActions(); let slot = document.createElement("slot"); let element = document.createElement("div"); element.setAttribute("part", "native"); element.classList.add("native-toolbar-action"); const shouldCollapse = maxItems !== 0 && actions.length > maxItems; if (shouldCollapse) { element = document.createElement("wje-dropdown"); } element.appendChild(slot); fragment.appendChild(element); return fragment; } /** * Returns the actions for the toolbar action. * @returns {Array} An array of wje-button elements */ getActions() { return Array.from(this.querySelectorAll("wje-button")); } } ToolbarAction.define("wje-toolbar-action", ToolbarAction); export { ToolbarAction as default }; //# sourceMappingURL=wje-toolbar-action.js.map