wj-elements 0.1.171 → 0.1.173

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"wje-chip.js","sources":["../packages/wje-chip/chip.element.js","../packages/wje-chip/chip.js"],"sourcesContent":["import { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This method dispatches a custom event named \"wje-chip:remove\".\n * It is triggered when the remove button is clicked, which happens when the chip is removed.\n * The event is dispatched on the current instance of the Chip class.\n * @documentation https://elements.webjet.sk/components/chip\n * @status stable\n * @augments WJElement\n * @slot - The chip main content.\n * @csspart native - The component's native wrapper.\n * //@fires wje-chip:remove - Dispatched when the chip is removed;\n */\nexport default class Chip extends WJElement {\n /**\n * Chip constructor method.\n */\n constructor() {\n super();\n }\n\n /**\n * Class name for the Chip element.\n * @type {string}\n */\n className = 'Chip';\n\n /**\n * Getter for the CSS stylesheet.\n * @returns {*}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for the observed attributes.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the Chip element.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native-chip');\n\n let slot = document.createElement('slot');\n\n let slotEnd = document.createElement('slot');\n slotEnd.setAttribute('name', 'end');\n\n let remove = document.createElement('wje-button');\n remove.setAttribute('part', 'remove');\n remove.setAttribute('fill', 'link');\n remove.setAttribute('color', this.color || 'default');\n remove.innerHTML = `<wje-icon name=\"x\"></wje-icon>`;\n\n let active = document.createElement('wje-icon');\n active.setAttribute('name', 'check');\n active.classList.add('check');\n\n // Add color\n if (this.hasAttribute('color')) native.classList.add('wje-color-' + this.color, 'wje-color');\n else native.classList.add('wje-color-default', 'wje-color');\n\n if (this.disabled) this.classList.add('wje-disabled');\n\n if (this.outline) this.classList.add('wje-outline');\n\n native.appendChild(slot);\n native.appendChild(slotEnd);\n native.appendChild(active);\n\n if (this.hasAttribute('removable')) native.appendChild(remove);\n\n fragment.appendChild(native);\n\n this.removeElement = remove;\n this.slotEnd = slotEnd;\n\n return fragment;\n }\n\n /**\n * Getter for the observed attributes.\n */\n afterDraw() {\n if (WjElementUtils.hasSlotContent(this.context, 'end')) this.slotEnd.classList.add('has-content');\n\n event.addListener(this.removeElement, 'click', 'wje:chip-remove', null, { stopPropagation: true });\n }\n\n /**\n * Before disconnect event for the Chip element.\n */\n beforeDisconnect() {\n event.removeListener(this.removeElement, 'click', 'wje:chip-remove');\n }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Chip from './chip.element.js';\n\n// export * from \"./chip.element.js\";\nexport default Chip;\n\nWJElement.define('wje-chip', Chip);\n"],"names":[],"mappings":";;;;;AAce,MAAM,aAAa,UAAU;AAAA;AAAA;AAAA;AAAA,EAIxC,cAAc;AACV,UAAO;AAOX;AAAA;AAAA;AAAA;AAAA,qCAAY;AAAA,EANhB;AAAA;AAAA;AAAA;AAAA;AAAA,EAYI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,UAAU,IAAI,aAAa;AAElC,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,QAAI,UAAU,SAAS,cAAc,MAAM;AAC3C,YAAQ,aAAa,QAAQ,KAAK;AAElC,QAAI,SAAS,SAAS,cAAc,YAAY;AAChD,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,aAAa,QAAQ,MAAM;AAClC,WAAO,aAAa,SAAS,KAAK,SAAS,SAAS;AACpD,WAAO,YAAY;AAEnB,QAAI,SAAS,SAAS,cAAc,UAAU;AAC9C,WAAO,aAAa,QAAQ,OAAO;AACnC,WAAO,UAAU,IAAI,OAAO;AAG5B,QAAI,KAAK,aAAa,OAAO,EAAG,QAAO,UAAU,IAAI,eAAe,KAAK,OAAO,WAAW;AAAA,QACtF,QAAO,UAAU,IAAI,qBAAqB,WAAW;AAE1D,QAAI,KAAK,SAAU,MAAK,UAAU,IAAI,cAAc;AAEpD,QAAI,KAAK,QAAS,MAAK,UAAU,IAAI,aAAa;AAElD,WAAO,YAAY,IAAI;AACvB,WAAO,YAAY,OAAO;AAC1B,WAAO,YAAY,MAAM;AAEzB,QAAI,KAAK,aAAa,WAAW,EAAG,QAAO,YAAY,MAAM;AAE7D,aAAS,YAAY,MAAM;AAE3B,SAAK,gBAAgB;AACrB,SAAK,UAAU;AAEf,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,QAAI,eAAe,eAAe,KAAK,SAAS,KAAK,EAAG,MAAK,QAAQ,UAAU,IAAI,aAAa;AAEhG,UAAM,YAAY,KAAK,eAAe,SAAS,mBAAmB,MAAM,EAAE,iBAAiB,MAAM;AAAA,EACzG;AAAA;AAAA;AAAA;AAAA,EAKI,mBAAmB;AACf,UAAM,eAAe,KAAK,eAAe,SAAS,iBAAiB;AAAA,EAC3E;AACA;ACnGA,UAAU,OAAO,YAAY,IAAI;"}
1
+ {"version":3,"file":"wje-chip.js","sources":["../packages/wje-chip/chip.element.js","../packages/wje-chip/chip.js"],"sourcesContent":["import { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This method dispatches a custom event named \"wje-chip:remove\".\n * It is triggered when the remove button is clicked, which happens when the chip is removed.\n * The event is dispatched on the current instance of the Chip class.\n * @documentation https://elements.webjet.sk/components/chip\n * @status stable\n * @augments WJElement\n * @slot - The chip main content.\n * @csspart native - The component's native wrapper.\n * //@fires wje-chip:remove - Dispatched when the chip is removed;\n */\nexport default class Chip extends WJElement {\n /**\n * Chip constructor method.\n */\n constructor() {\n super();\n }\n\n /**\n * Sets or removes the \"round\" attribute on the element based on the provided value.\n * @param {boolean} value Determines whether the \"round\" attribute should be set or removed.\n * If true, the \"round\" attribute is added. If false, the \"round\"\n * attribute is removed.\n */\n set round(value) {\n if (value) {\n this.setAttribute('round', '');\n } else {\n this.removeAttribute('round');\n }\n }\n\n /**\n * Checks if the 'round' attribute is present on the element.\n * @returns {boolean} Returns true if the 'round' attribute exists, otherwise false.\n */\n get round() {\n return this.hasAttribute('round');\n }\n\n /**\n * Sets the size attribute of the element.\n * @param {string} value The value to set for the size attribute.\n */\n set size(value) {\n this.setAttribute('size', value);\n }\n\n /**\n * Retrieves the 'size' attribute of the current element.\n * @returns {string | null} The value of the 'size' attribute, or null if the attribute is not set.\n */\n get size() {\n return this.getAttribute('size');\n }\n\n /**\n * Sets or removes the \"removable\" attribute on the element.\n * @param {boolean} value A boolean indicating whether the element should have the \"removable\" attribute.\n * If true, the \"removable\" attribute is added;\n * if false, the \"removable\" attribute is removed.\n */\n set removable(value) {\n if (value) {\n this.setAttribute('removable', '');\n } else {\n this.removeAttribute('removable');\n }\n }\n\n /**\n * Determines if the element has the 'removable' attribute.\n * @returns {boolean} True if the element has the 'removable' attribute, otherwise false.\n */\n get removable() {\n return this.hasAttribute('removable');\n }\n\n /**\n * Class name for the Chip element.\n * @type {string}\n */\n className = 'Chip';\n\n /**\n * Getter for the CSS stylesheet.\n * @returns {*}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for the observed attributes.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the Chip element.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native-chip');\n\n let slot = document.createElement('slot');\n\n let slotEnd = document.createElement('slot');\n slotEnd.setAttribute('name', 'end');\n\n let remove = document.createElement('wje-button');\n remove.setAttribute('part', 'remove');\n remove.setAttribute('fill', 'link');\n remove.setAttribute('color', this.color || 'default');\n remove.round = !this.round;\n\n if(this.hasAttribute('size')) {\n if(this.size === 'small') {\n remove.innerHTML = `<wje-icon name=\"x\" size=\"small\"></wje-icon>`;\n } else if (this.size === 'large') {\n remove.innerHTML = `<wje-icon name=\"x\"></wje-icon>`;\n }\n } else {\n remove.innerHTML = `<wje-icon name=\"x\"></wje-icon>`;\n }\n\n let active = document.createElement('wje-icon');\n active.setAttribute('name', 'check');\n active.classList.add('check');\n\n // Add color\n if (this.hasAttribute('color')) native.classList.add('wje-color-' + this.color, 'wje-color');\n else native.classList.add('wje-color-default', 'wje-color');\n\n if (this.disabled) this.classList.add('wje-disabled');\n\n if (this.outline) this.classList.add('wje-outline');\n\n native.appendChild(slot);\n native.appendChild(slotEnd);\n native.appendChild(active);\n\n if (this.removable) native.appendChild(remove);\n\n fragment.appendChild(native);\n\n this.removeElement = remove;\n this.slotEnd = slotEnd;\n\n return fragment;\n }\n\n /**\n * Getter for the observed attributes.\n */\n afterDraw() {\n if (WjElementUtils.hasSlotContent(this.context, 'end')) this.slotEnd.classList.add('has-content');\n\n event.addListener(this.removeElement, 'click', 'wje:chip-remove', null, { stopPropagation: true });\n }\n\n /**\n * Before disconnect event for the Chip element.\n */\n beforeDisconnect() {\n event.removeListener(this.removeElement, 'click', 'wje:chip-remove');\n }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Chip from './chip.element.js';\n\n// export * from \"./chip.element.js\";\nexport default Chip;\n\nWJElement.define('wje-chip', Chip);\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"wje-format-digital.js","sources":["../packages/wje-format-digital/format-digital.element.js","../packages/wje-format-digital/format-digital.js"],"sourcesContent":["import { Localizer } from '../utils/localize.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This element formats and displays digital values such as file sizes or data transfer rates.\n * `FormatDigital` is a custom web component that represents a formatted digital value with units like\n * bytes or bits. It extends from `WJElement` and utilizes the `Localizer` class for locale-aware formatting.\n * @documentation https://elements.webjet.sk/components/format-digital\n * @status stable\n * @augments {WJElement}\n * @attribute {number} value - The numeric value to format (e.g., 1024 for 1 KB).\n * @attribute {string} unit - The unit of the value (`byte` or `bit`). Defaults to `byte`.\n * @attribute {string} unitDisplay - The display style of the unit (`short`, `long`, or `narrow`). Defaults to `short`.\n * @csspart native - The native part of the component.\n * @csspart formatted - The part representing the formatted value.\n * @csspart start - Slot for content before the formatted value.\n * @csspart end - Slot for content after the formatted value.\n * @cssproperty [--wje-format-digital-font-size=1rem] - The font size of the formatted digital value.\n * @cssproperty [--wje-format-digital-color=var(--wje-text-color)] - The color of the formatted text.\n * @cssproperty [--wje-format-digital-padding=.5rem] - The padding around the component.\n * @cssproperty [--wje-format-digital-border-radius=var(--wje-border-radius-small)] - The border radius of the component.\n * @tag wje-format-digital\n */\n\nexport default class FormatDigital extends WJElement {\n /**\n * Creates an instance of FormatDigital.\n * Initializes the `Localizer` for locale-specific formatting.\n */\n constructor() {\n super();\n this.localizer = new Localizer(this);\n }\n\n /**\n * Sets the value of the digital format.\n * This value determines the size in bytes or bits to be displayed.\n * @param {number} value The value to set.\n */\n set value(value) {\n this.setAttribute('value', value);\n }\n\n /**\n * Returns the value of the digital format.\n * @returns {number} The current value of the component.\n */\n get value() {\n return +this.getAttribute('value');\n }\n\n /**\n * Sets the unit of the digital format.\n * Valid values are `bit` or `byte`.\n * @param {string} value The unit to set.\n */\n set unit(value) {\n this.removeAttribute('unit');\n if (value) {\n this.setAttribute('unit', value);\n }\n }\n\n /**\n * Returns the unit of the digital format.\n * Defaults to `byte` if no unit is set.\n * @returns {string} The current unit (`bit` or `byte`).\n */\n get unit() {\n return this.hasAttribute('unit') ? this.getAttribute('unit') : 'byte';\n }\n\n /**\n * Sets the unit display style for the digital format.\n * Valid values are `short`, `long`, or `narrow`.\n * @param {string} value The unit display style to set.\n */\n set unitDisplay(value) {\n this.removeAttribute('unit-display');\n if (value) {\n this.setAttribute('unit-display', value);\n }\n }\n\n /**\n * Returns the unit display style for the digital format.\n * Defaults to `short` if not set.\n * @returns {string} - The current unit display style.\n */\n get unitDisplay() {\n return this.hasAttribute('unit-display') ? this.getAttribute('unit-display') : 'short';\n }\n\n /**\n * The class name identifier for this component.\n * @type {string}\n */\n className = 'FormatDigital';\n\n /**\n * Returns the CSS styles for the component.\n * Encapsulated using shadow DOM.\n * @static\n * @returns {CSSStyleSheet} - The CSS styles for the component.\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of attributes to observe for changes.\n * Observes `value` and `unit-display` for re-rendering.\n * @static\n * @returns {Array<string>} - The attributes to observe.\n */\n static get observedAttributes() {\n return ['value', 'unit-display'];\n }\n\n /**\n * Sets up the attributes for the component.\n * Initializes the shadow DOM.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Prepares the component before rendering.\n * Computes the formatted value based on the input value and unit.\n */\n beforeDraw() {\n if (this.value < 0) return;\n const bitPrefixes = ['', 'kilo', 'mega', 'giga', 'tera'];\n const bytePrefixes = ['', 'kilo', 'mega', 'giga', 'tera', 'peta'];\n const prefix = this.unit === 'bit' ? bitPrefixes : bytePrefixes;\n const index = Math.max(0, Math.min(Math.floor(Math.log10(this.value) / 3), prefix.length - 1)) || 0;\n const unit = prefix[index] + this.unit;\n const value = parseFloat((this.value / Math.pow(1000, index)).toPrecision(3));\n\n this.formattedValue = this.localizer.formatNumber(value, {\n style: 'unit',\n unit: unit,\n unitDisplay: this.unitDisplay || 'short',\n });\n }\n\n /**\n * Renders the component and returns a document fragment.\n * The rendered structure includes a formatted value wrapped in a container\n * with slots for additional customization.\n * @returns {DocumentFragment} - The DOM structure for the component.\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let element = document.createElement('div');\n element.setAttribute('part', 'native');\n element.classList.add('native-format-digital');\n\n let formatted = document.createElement('span');\n formatted.setAttribute('part', 'formatted');\n formatted.innerText = this.formattedValue;\n\n let start = document.createElement('slot');\n start.setAttribute('name', 'start');\n\n let end = document.createElement('slot');\n end.setAttribute('name', 'end');\n\n element.appendChild(start);\n element.appendChild(formatted);\n element.appendChild(end);\n\n fragment.appendChild(element);\n\n return fragment;\n }\n}\n","import FormatDigital from './format-digital.element.js';\n\nexport default FormatDigital;\n\nFormatDigital.define('wje-format-digital', FormatDigital);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"wje-format-digital.js","sources":["../packages/wje-format-digital/format-digital.element.js","../packages/wje-format-digital/format-digital.js"],"sourcesContent":["import { Localizer } from '../utils/localize.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This element formats and displays digital values such as file sizes or data transfer rates.\n * `FormatDigital` is a custom web component that represents a formatted digital value with units like\n * bytes or bits. It extends from `WJElement` and utilizes the `Localizer` class for locale-aware formatting.\n * @documentation https://elements.webjet.sk/components/format-digital\n * @status stable\n * @augments {WJElement}\n * @attribute {number} value - The numeric value to format (e.g., 1024 for 1 KB).\n * @attribute {string} unit - The unit of the value (`byte` or `bit`). Defaults to `byte`.\n * @attribute {string} unitDisplay - The display style of the unit (`short`, `long`, or `narrow`). Defaults to `short`.\n * @csspart native - The native part of the component.\n * @csspart formatted - The part representing the formatted value.\n * @csspart start - Slot for content before the formatted value.\n * @csspart end - Slot for content after the formatted value.\n * @tag wje-format-digital\n */\n\nexport default class FormatDigital extends WJElement {\n /**\n * Creates an instance of FormatDigital.\n * Initializes the `Localizer` for locale-specific formatting.\n */\n constructor() {\n super();\n this.localizer = new Localizer(this);\n }\n\n /**\n * Sets the value of the digital format.\n * This value determines the size in bytes or bits to be displayed.\n * @param {number} value The value to set.\n */\n set value(value) {\n this.setAttribute('value', value);\n }\n\n /**\n * Returns the value of the digital format.\n * @returns {number} The current value of the component.\n */\n get value() {\n return +this.getAttribute('value');\n }\n\n /**\n * Sets the unit of the digital format.\n * Valid values are `bit` or `byte`.\n * @param {string} value The unit to set.\n */\n set unit(value) {\n this.removeAttribute('unit');\n if (value) {\n this.setAttribute('unit', value);\n }\n }\n\n /**\n * Returns the unit of the digital format.\n * Defaults to `byte` if no unit is set.\n * @returns {string} The current unit (`bit` or `byte`).\n */\n get unit() {\n return this.hasAttribute('unit') ? this.getAttribute('unit') : 'byte';\n }\n\n /**\n * Sets the unit display style for the digital format.\n * Valid values are `short`, `long`, or `narrow`.\n * @param {string} value The unit display style to set.\n */\n set unitDisplay(value) {\n this.removeAttribute('unit-display');\n if (value) {\n this.setAttribute('unit-display', value);\n }\n }\n\n /**\n * Returns the unit display style for the digital format.\n * Defaults to `short` if not set.\n * @returns {string} - The current unit display style.\n */\n get unitDisplay() {\n return this.hasAttribute('unit-display') ? this.getAttribute('unit-display') : 'short';\n }\n\n /**\n * The class name identifier for this component.\n * @type {string}\n */\n className = 'FormatDigital';\n\n /**\n * Returns the CSS styles for the component.\n * Encapsulated using shadow DOM.\n * @static\n * @returns {CSSStyleSheet} - The CSS styles for the component.\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of attributes to observe for changes.\n * Observes `value` and `unit-display` for re-rendering.\n * @static\n * @returns {Array<string>} - The attributes to observe.\n */\n static get observedAttributes() {\n return ['value', 'unit-display'];\n }\n\n /**\n * Sets up the attributes for the component.\n * Initializes the shadow DOM.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Prepares the component before rendering.\n * Computes the formatted value based on the input value and unit.\n */\n beforeDraw() {\n if (this.value < 0) return;\n const bitPrefixes = ['', 'kilo', 'mega', 'giga', 'tera'];\n const bytePrefixes = ['', 'kilo', 'mega', 'giga', 'tera', 'peta'];\n const prefix = this.unit === 'bit' ? bitPrefixes : bytePrefixes;\n const index = Math.max(0, Math.min(Math.floor(Math.log10(this.value) / 3), prefix.length - 1)) || 0;\n const unit = prefix[index] + this.unit;\n const value = parseFloat((this.value / Math.pow(1000, index)).toPrecision(3));\n\n this.formattedValue = this.localizer.formatNumber(value, {\n style: 'unit',\n unit: unit,\n unitDisplay: this.unitDisplay || 'short',\n });\n }\n\n /**\n * Renders the component and returns a document fragment.\n * The rendered structure includes a formatted value wrapped in a container\n * with slots for additional customization.\n * @returns {DocumentFragment} - The DOM structure for the component.\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let element = document.createElement('div');\n element.setAttribute('part', 'native');\n element.classList.add('native-format-digital');\n\n let formatted = document.createElement('span');\n formatted.setAttribute('part', 'formatted');\n formatted.innerText = this.formattedValue;\n\n let start = document.createElement('slot');\n start.setAttribute('name', 'start');\n\n let end = document.createElement('slot');\n end.setAttribute('name', 'end');\n\n element.appendChild(start);\n element.appendChild(formatted);\n element.appendChild(end);\n\n fragment.appendChild(element);\n\n return fragment;\n }\n}\n","import FormatDigital from './format-digital.element.js';\n\nexport default FormatDigital;\n\nFormatDigital.define('wje-format-digital', FormatDigital);\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"wje-kanban.js","sources":["../packages/wje-kanban/kanban.element.js","../packages/wje-kanban/kanban.js"],"sourcesContent":["import Checkbox from '../wje-checkbox/checkbox.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport MenuItem from '../wje-menu-item/menu-item.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Kanban` is a custom web component that represents a Kanban board with draggable columns and cards.\n * @summary This element represents a Kanban board.\n * @documentation https://elements.webjet.sk/components/kanban\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the Kanban board.\n * @csspart native - Styles the native part of the Kanban board.\n * @csspart pool - Styles the pool of the Kanban board.\n * @tag wje-kanban\n */\nexport default class Kanban extends WJElement {\n /**\n * Creates an instance of Kanban.\n * @class\n */\n constructor() {\n super();\n this.totalPages = 0; // Total number of pages\n this.isLoading = []; // Array to hold loading status of each page\n this._response = {}; // Response from the API\n this.isDragging = false; // Flag to indicate if an element is being dragged\n this.selectedCards = []; // Array to hold selected cards\n }\n\n /**\n * Dependencies of the Option component.\n */\n dependencies = {\n 'wje-checkbox': Checkbox,\n 'wje-menu-item': MenuItem,\n };\n\n /**\n * Sets the URL for fetching data.\n * @param value {string}\n */\n set response(value) {\n this._response = value;\n }\n\n /**\n * Gets the URL for fetching data.\n * @returns {*|{}|{}}\n */\n get response() {\n return this._response;\n }\n\n /**\n * Sets the URL for fetching data.\n * @param value {array}\n */\n set selectedItems(value) {\n this._selectedItems = value;\n }\n\n /**\n * Gets the URL for fetching data.\n * @returns {Array}\n */\n get selectedItems() {\n return this._selectedItems;\n }\n\n /**\n * Sets the URL for fetching data.\n * @type {string}\n */\n className = 'Kanban';\n\n /**\n * Returns the CSS styles for the component.\n * @static\n * @returns {CSSStyleSheet}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of attributes to observe for changes.\n * @static\n * @returns {Array<string>}\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Prepares the component before drawing.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n */\n async beforeDraw(context, store, params) {\n this.response = await this.getPages();\n }\n\n /**\n * Draws the component after it has been prepared.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native');\n native.setAttribute('part', 'native-infinite-scroll');\n\n let pools = this.getPool(this.response, this.poolName);\n\n // Add pools to the native element\n for (const statusName in pools) {\n if (pools.hasOwnProperty(statusName)) {\n let pool = this.htmlPool(statusName, pools[statusName].length);\n\n native.appendChild(pool);\n const items = pools[statusName];\n\n this.customForeach(pool, items);\n }\n }\n\n fragment.appendChild(native);\n\n return fragment;\n }\n\n /**\n * Called after the component has been drawn.\n */\n afterDraw() {\n this.ui = {\n elBoard: this.shadowRoot.getElementById('board'),\n elTotalCardCount: this.shadowRoot.getElementById('totalCards'),\n elCardPlaceholder: null,\n };\n\n this.setupDragAndDropEvents();\n this.setupSelectAllCardsEvent();\n this.setupMenuItemClickEvents();\n }\n\n /**\n * Iterates over a list of items, generates an HTML card for each, and appends it to the specified pool's content area.\n * @param {HTMLElement} pool The container element where the cards will be appended. It should contain an element with the class `.pool-content`.\n * @param {Array} items An array of items used to generate HTML cards.\n */\n customForeach = (pool, items) => {\n for (const item of items) {\n let card = this.htmlCard(item);\n pool.querySelector('.pool-content').appendChild(card);\n }\n };\n\n /**\n * Sets up the drag and drop events for the component.\n */\n setupDragAndDropEvents() {\n this.live('dragstart', '.pool .card', (e) => {\n this.isDragging = true;\n e.dataTransfer.clearData();\n e.dataTransfer.setData('text/plain', e.target.dataset.id);\n e.dataTransfer.dropEffect = 'move';\n e.target.style.opacity = '0.5';\n\n const rect = e.target.getBoundingClientRect();\n\n this.draggedElementWidth = rect.width;\n this.draggedElementHeight = rect.height;\n });\n\n this.live('dragend', '.pool .card', (e) => {\n e.target.style.opacity = '';\n if (this.ui.elCardPlaceholder) {\n this.ui.elCardPlaceholder.remove();\n }\n this.ui.elCardPlaceholder = null;\n this.isDragging = false;\n });\n\n this.live('dragover', '.pool, .pool .card, .pool .card-placeholder', (e) => {\n e.preventDefault();\n e.dataTransfer.dropEffect = 'move';\n\n if (e.target.classList.contains('pool')) {\n e.target.appendChild(this.getCardPlaceholder());\n } else if (e.target.classList.contains('card')) {\n e.target.parentNode.insertBefore(this.getCardPlaceholder(), e.target);\n }\n });\n\n this.live('drop', '.pool, .pool .card-placeholder', (e) => {\n e.preventDefault();\n if (!this.isDragging) return;\n\n const todo_id = +e.dataTransfer.getData('text');\n const card = this.shadowRoot.querySelector('.card[data-id=\"' + todo_id + '\"]');\n\n if (e.target.classList.contains('pool')) {\n e.target.querySelector('.pool-content').appendChild(card);\n } else if (e.target.classList.contains('card-placeholder')) {\n e.target.parentNode.replaceChild(card, e.target);\n }\n\n window.setTimeout(this.updateColumnItemCount, 100);\n });\n }\n\n /**\n * Sets up the select all cards event for the component.\n */\n setupSelectAllCardsEvent() {\n // Event listener for selecting all cards in a pool\n this.live('wje-toggle:change', '.select-all-cards', (e) => {\n const pool = e.target.closest('.pool');\n this.updateSelectedCards(pool, e.target.checked);\n });\n\n // Event listener for selecting individual cards\n this.live('wje-toggle:change', '.select-card', (e) => {\n const card = e.target.closest('.card');\n this.setSelectedCards(e.target.checked, card);\n\n if (this.selectedCards.length === 0) {\n e.target.closest('.pool').querySelector('.select-all-cards').checked = false;\n }\n\n this.setSelectedItems();\n });\n }\n\n /**\n * Sets up the menu item click events for the component.\n */\n setupMenuItemClickEvents() {\n this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n menuItem.removeEventListener('wje-menu-item:click', this.menuItemClickHandler);\n });\n\n this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n menuItem.addEventListener('wje-menu-item:click', this.menuItemClickHandler);\n });\n }\n\n /**\n * Handles the menu item click event.\n * @param e\n */\n menuItemClickHandler = (e) => {\n const action = e.target.dataset.action;\n const pool = e.target.closest('.pool');\n\n this.handlePoolAction(action, pool);\n };\n\n /**\n * Updates the selected cards in the pool.\n * @param pool {HTMLElement}\n * @param isChecked {boolean}\n */\n updateSelectedCards(pool, isChecked) {\n const cards = pool.querySelectorAll('.pool-content .card');\n\n cards.forEach((card) => {\n const checkbox = card.querySelector('wje-checkbox');\n if (checkbox) {\n checkbox.checked = isChecked;\n }\n\n this.setSelectedCards(isChecked, card);\n });\n\n this.setSelectedItems();\n }\n\n /**\n * Updates the column item count.\n */\n updateColumnItemCount = () => {\n const pools = this.shadowRoot.querySelectorAll('.pool');\n\n pools.forEach((pool) => {\n const itemCount = pool.querySelectorAll('.pool-content .card').length;\n let itemCountDisplay = pool.querySelector('.item-count');\n\n itemCountDisplay.innerHTML = itemCount;\n });\n };\n\n /**\n * Handles the pool action.\n * @param action {string}\n * @param pool {HTMLElement}\n */\n handlePoolAction(action, pool) {\n switch (action) {\n case 'move-left':\n this.movePool(pool, 'left');\n break;\n case 'move-right':\n this.movePool(pool, 'right');\n break;\n case 'rename-pool':\n this.renamePool(pool);\n break;\n default:\n console.log(`Neznáma akcia: ${action}`);\n }\n }\n\n /**\n * Moves the pool in the specified direction.\n * @param pool {HTMLElement}\n * @param direction {string}\n */\n movePool(pool, direction) {\n const parent = pool.parentElement;\n\n // Najprv odstránime všetky event listenery z aktuálnych stĺpcov (pools)\n // Array.from(parent.children).forEach(removeEventListeners);\n\n if (direction === 'left' && pool.previousElementSibling) {\n // Presunieme pool doľava\n parent.insertBefore(pool, pool.previousElementSibling);\n } else if (direction === 'right' && pool.nextElementSibling) {\n // Presunieme pool doprava\n parent.insertBefore(pool.nextElementSibling, pool);\n }\n\n // Po presune stĺpcov (pools) musíme znova pripojiť event listenery\n this.setupMenuItemClickEvents();\n }\n\n /**\n * Renames the pool.\n * @param pool {HTMLElement}\n */\n renamePool(pool) {\n const newName = prompt('Zadajte nový názov pre stĺpec:');\n if (newName) {\n const header = pool.querySelector('.pool-header h4');\n header.innerHTML = `${newName} (<span class=\"item-count\">0</span> položiek)`;\n this.updateColumnItemCount(); // Aktualizovať počet položiek po premenovaní\n }\n }\n\n /**\n * Gets the card placeholder.\n * @returns {null|*}\n */\n getCardPlaceholder() {\n if (!this.ui.elCardPlaceholder) {\n this.ui.elCardPlaceholder = document.createElement('div');\n this.ui.elCardPlaceholder.className = 'card-placeholder';\n\n this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n } else {\n this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n }\n return this.ui.elCardPlaceholder;\n }\n\n /**\n * Adds a live event listener to the component.\n * @param eventType {string}\n * @param selector {string}\n * @param callback {function}\n */\n live(eventType, selector, callback) {\n const attachListener = (root) => {\n root.addEventListener(\n eventType,\n (e) => {\n if (e.target.matches(selector)) {\n callback.call(e.target, e);\n }\n },\n false\n );\n };\n\n const traverseAndAttach = (root) => {\n attachListener(root);\n\n root.querySelectorAll('*').forEach((node) => {\n if (node.shadowRoot) {\n traverseAndAttach(node.shadowRoot);\n }\n });\n };\n\n traverseAndAttach(this.shadowRoot || this); // Start from the Shadow DOM if it exists\n }\n\n /**\n * Sets the selected cards.\n * @param isChecked {boolean}\n * @param card {HTMLElement}\n */\n setSelectedCards(isChecked, card) {\n if (isChecked) {\n if (!this.selectedCards.includes(card)) {\n this.selectedCards.push(card);\n }\n } else {\n this.selectedCards = this.selectedCards.filter((selectedCard) => selectedCard !== card);\n }\n }\n\n /**\n * Sets the selected items.\n */\n setSelectedItems() {\n const selectedIds = this.selectedCards.map((card) => card.getAttribute('data-id'));\n this.selectedItems = this.response.filter((item) => selectedIds.includes(item.id));\n }\n\n /**\n * Fetches the pages.\n * @param page\n * @returns {Promise<any>}\n */\n async getPages(page = 0) {\n let hasParams = this.url.includes('?');\n const response = await fetch(\n `${this.url}${hasParams ? '&' : '?'}page=${page}&size=${this.size}${this?.queryParams}`\n );\n if (!response.ok) {\n throw new Error(`An error occurred: ${response.status}`);\n }\n return await response.json();\n }\n\n /**\n * Gets the pool.\n * @param data {Array}\n * @param poolName {string}\n * @returns {*}\n */\n getPool = (data, poolName) => {\n return data.reduce((acc, item) => {\n const statusName = item.status.name;\n if (!acc[statusName]) {\n acc[statusName] = [];\n }\n acc[statusName].push(item);\n return acc;\n }, {});\n };\n\n /**\n * Returns the HTML for the pool.\n * @param title {string}\n * @param countItems {number}\n * @returns {Element}\n */\n htmlPool = (title, countItems) => {\n let poolHtml = document.createElement('div');\n poolHtml.classList.add('pool');\n\n let header = document.createElement('div');\n header.classList.add('pool-header');\n\n let checkbox = document.createElement('wje-checkbox');\n checkbox.setAttribute('type', 'checkbox');\n checkbox.classList.add('select-all-cards');\n checkbox.title = 'Select all cards';\n\n let h4 = document.createElement('h4');\n h4.textContent = title;\n\n let badge = document.createElement('wje-badge');\n badge.setAttribute('color', 'danger');\n badge.classList.add('item-count');\n badge.textContent = countItems;\n\n let dropdown = document.createElement('wje-dropdown');\n dropdown.setAttribute('placement', 'bottom-start');\n dropdown.setAttribute('offset', '5');\n dropdown.setAttribute('collapsible', '');\n dropdown.innerHTML = `\n <wje-button fill=\"link\" slot=\"trigger\" size=\"small\" round>\n <wje-icon name=\"dots-vertical\"></wje-icon>\n </wje-button>\n <wje-menu active>\n <wje-menu-item data-action=\"rename-pool\">\n <wj-label>Zmeniť názov</wj-label>\n </wje-menu-item>\n <wje-menu-item data-action=\"move-left\">\n <wj-label>Posunúť doľava</wj-label>\n </wje-menu-item>\n <wje-menu-item data-action=\"move-right\">\n <wj-label>Posunúť doprava</wj-label>\n </wje-menu-item>\n </wje-menu>\n `;\n\n header.appendChild(checkbox);\n header.appendChild(h4);\n header.appendChild(badge);\n header.appendChild(dropdown);\n\n let content = document.createElement('div');\n content.classList.add('pool-content');\n\n poolHtml.appendChild(header);\n poolHtml.appendChild(content);\n\n return poolHtml;\n };\n\n /**\n * Returns the HTML for the card.\n * @param item {Object}\n * @returns {Element}\n */\n htmlCard = (item) => {\n let card = document.createElement('div');\n card.classList.add('card');\n card.draggable = true;\n card.setAttribute('data-id', item.id);\n card.innerHTML = `\n <wje-checkbox type=\"checkbox\" class=\"select-card\" title=\"Select card\"></wje-checkbox>\n <div>${item.body}</div>\n `;\n\n return card;\n };\n\n dispatchEvent(event) {\n return false;\n }\n}\n","import Kanban from './kanban.element.js';\n\nexport default Kanban;\n\nKanban.define('wje-kanban', Kanban);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"wje-kanban.js","sources":["../packages/wje-kanban/kanban.element.js","../packages/wje-kanban/kanban.js"],"sourcesContent":["import Checkbox from '../wje-checkbox/checkbox.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport MenuItem from '../wje-menu-item/menu-item.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Kanban` is a custom web component that represents a Kanban board with draggable columns and cards.\n * @summary This element represents a Kanban board.\n * @documentation https://elements.webjet.sk/components/kanban\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the Kanban board.\n * @csspart native-infinite-scroll - Styles the native part of the Kanban board.\n * @tag wje-kanban\n */\nexport default class Kanban extends WJElement {\n /**\n * Creates an instance of Kanban.\n * @class\n */\n constructor() {\n super();\n this.totalPages = 0; // Total number of pages\n this.isLoading = []; // Array to hold loading status of each page\n this._response = {}; // Response from the API\n this.isDragging = false; // Flag to indicate if an element is being dragged\n this.selectedCards = []; // Array to hold selected cards\n }\n\n /**\n * Dependencies of the Option component.\n */\n dependencies = {\n 'wje-checkbox': Checkbox,\n 'wje-menu-item': MenuItem,\n };\n\n /**\n * Sets the URL for fetching data.\n * @param value {string}\n */\n set response(value) {\n this._response = value;\n }\n\n /**\n * Gets the URL for fetching data.\n * @returns {*|{}|{}}\n */\n get response() {\n return this._response;\n }\n\n /**\n * Sets the URL for fetching data.\n * @param value {array}\n */\n set selectedItems(value) {\n this._selectedItems = value;\n }\n\n /**\n * Gets the URL for fetching data.\n * @returns {Array}\n */\n get selectedItems() {\n return this._selectedItems;\n }\n\n /**\n * Sets the URL for fetching data.\n * @type {string}\n */\n className = 'Kanban';\n\n /**\n * Returns the CSS styles for the component.\n * @static\n * @returns {CSSStyleSheet}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of attributes to observe for changes.\n * @static\n * @returns {Array<string>}\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Prepares the component before drawing.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n */\n async beforeDraw(context, store, params) {\n this.response = await this.getPages();\n }\n\n /**\n * Draws the component after it has been prepared.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native');\n native.setAttribute('part', 'native-infinite-scroll');\n\n let pools = this.getPool(this.response, this.poolName);\n\n // Add pools to the native element\n for (const statusName in pools) {\n if (pools.hasOwnProperty(statusName)) {\n let pool = this.htmlPool(statusName, pools[statusName].length);\n\n native.appendChild(pool);\n const items = pools[statusName];\n\n this.customForeach(pool, items);\n }\n }\n\n fragment.appendChild(native);\n\n return fragment;\n }\n\n /**\n * Called after the component has been drawn.\n */\n afterDraw() {\n this.ui = {\n elBoard: this.shadowRoot.getElementById('board'),\n elTotalCardCount: this.shadowRoot.getElementById('totalCards'),\n elCardPlaceholder: null,\n };\n\n this.setupDragAndDropEvents();\n this.setupSelectAllCardsEvent();\n this.setupMenuItemClickEvents();\n }\n\n /**\n * Iterates over a list of items, generates an HTML card for each, and appends it to the specified pool's content area.\n * @param {HTMLElement} pool The container element where the cards will be appended. It should contain an element with the class `.pool-content`.\n * @param {Array} items An array of items used to generate HTML cards.\n */\n customForeach = (pool, items) => {\n for (const item of items) {\n let card = this.htmlCard(item);\n pool.querySelector('.pool-content').appendChild(card);\n }\n };\n\n /**\n * Sets up the drag and drop events for the component.\n */\n setupDragAndDropEvents() {\n this.live('dragstart', '.pool .card', (e) => {\n this.isDragging = true;\n e.dataTransfer.clearData();\n e.dataTransfer.setData('text/plain', e.target.dataset.id);\n e.dataTransfer.dropEffect = 'move';\n e.target.style.opacity = '0.5';\n\n const rect = e.target.getBoundingClientRect();\n\n this.draggedElementWidth = rect.width;\n this.draggedElementHeight = rect.height;\n });\n\n this.live('dragend', '.pool .card', (e) => {\n e.target.style.opacity = '';\n if (this.ui.elCardPlaceholder) {\n this.ui.elCardPlaceholder.remove();\n }\n this.ui.elCardPlaceholder = null;\n this.isDragging = false;\n });\n\n this.live('dragover', '.pool, .pool .card, .pool .card-placeholder', (e) => {\n e.preventDefault();\n e.dataTransfer.dropEffect = 'move';\n\n if (e.target.classList.contains('pool')) {\n e.target.appendChild(this.getCardPlaceholder());\n } else if (e.target.classList.contains('card')) {\n e.target.parentNode.insertBefore(this.getCardPlaceholder(), e.target);\n }\n });\n\n this.live('drop', '.pool, .pool .card-placeholder', (e) => {\n e.preventDefault();\n if (!this.isDragging) return;\n\n const todo_id = +e.dataTransfer.getData('text');\n const card = this.shadowRoot.querySelector('.card[data-id=\"' + todo_id + '\"]');\n\n if (e.target.classList.contains('pool')) {\n e.target.querySelector('.pool-content').appendChild(card);\n } else if (e.target.classList.contains('card-placeholder')) {\n e.target.parentNode.replaceChild(card, e.target);\n }\n\n window.setTimeout(this.updateColumnItemCount, 100);\n });\n }\n\n /**\n * Sets up the select all cards event for the component.\n */\n setupSelectAllCardsEvent() {\n // Event listener for selecting all cards in a pool\n this.live('wje-toggle:change', '.select-all-cards', (e) => {\n const pool = e.target.closest('.pool');\n this.updateSelectedCards(pool, e.target.checked);\n });\n\n // Event listener for selecting individual cards\n this.live('wje-toggle:change', '.select-card', (e) => {\n const card = e.target.closest('.card');\n this.setSelectedCards(e.target.checked, card);\n\n if (this.selectedCards.length === 0) {\n e.target.closest('.pool').querySelector('.select-all-cards').checked = false;\n }\n\n this.setSelectedItems();\n });\n }\n\n /**\n * Sets up the menu item click events for the component.\n */\n setupMenuItemClickEvents() {\n this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n menuItem.removeEventListener('wje-menu-item:click', this.menuItemClickHandler);\n });\n\n this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n menuItem.addEventListener('wje-menu-item:click', this.menuItemClickHandler);\n });\n }\n\n /**\n * Handles the menu item click event.\n * @param e\n */\n menuItemClickHandler = (e) => {\n const action = e.target.dataset.action;\n const pool = e.target.closest('.pool');\n\n this.handlePoolAction(action, pool);\n };\n\n /**\n * Updates the selected cards in the pool.\n * @param pool {HTMLElement}\n * @param isChecked {boolean}\n */\n updateSelectedCards(pool, isChecked) {\n const cards = pool.querySelectorAll('.pool-content .card');\n\n cards.forEach((card) => {\n const checkbox = card.querySelector('wje-checkbox');\n if (checkbox) {\n checkbox.checked = isChecked;\n }\n\n this.setSelectedCards(isChecked, card);\n });\n\n this.setSelectedItems();\n }\n\n /**\n * Updates the column item count.\n */\n updateColumnItemCount = () => {\n const pools = this.shadowRoot.querySelectorAll('.pool');\n\n pools.forEach((pool) => {\n const itemCount = pool.querySelectorAll('.pool-content .card').length;\n let itemCountDisplay = pool.querySelector('.item-count');\n\n itemCountDisplay.innerHTML = itemCount;\n });\n };\n\n /**\n * Handles the pool action.\n * @param action {string}\n * @param pool {HTMLElement}\n */\n handlePoolAction(action, pool) {\n switch (action) {\n case 'move-left':\n this.movePool(pool, 'left');\n break;\n case 'move-right':\n this.movePool(pool, 'right');\n break;\n case 'rename-pool':\n this.renamePool(pool);\n break;\n default:\n console.log(`Neznáma akcia: ${action}`);\n }\n }\n\n /**\n * Moves the pool in the specified direction.\n * @param pool {HTMLElement}\n * @param direction {string}\n */\n movePool(pool, direction) {\n const parent = pool.parentElement;\n\n // Najprv odstránime všetky event listenery z aktuálnych stĺpcov (pools)\n // Array.from(parent.children).forEach(removeEventListeners);\n\n if (direction === 'left' && pool.previousElementSibling) {\n // Presunieme pool doľava\n parent.insertBefore(pool, pool.previousElementSibling);\n } else if (direction === 'right' && pool.nextElementSibling) {\n // Presunieme pool doprava\n parent.insertBefore(pool.nextElementSibling, pool);\n }\n\n // Po presune stĺpcov (pools) musíme znova pripojiť event listenery\n this.setupMenuItemClickEvents();\n }\n\n /**\n * Renames the pool.\n * @param pool {HTMLElement}\n */\n renamePool(pool) {\n const newName = prompt('Zadajte nový názov pre stĺpec:');\n if (newName) {\n const header = pool.querySelector('.pool-header h4');\n header.innerHTML = `${newName} (<span class=\"item-count\">0</span> položiek)`;\n this.updateColumnItemCount(); // Aktualizovať počet položiek po premenovaní\n }\n }\n\n /**\n * Gets the card placeholder.\n * @returns {null|*}\n */\n getCardPlaceholder() {\n if (!this.ui.elCardPlaceholder) {\n this.ui.elCardPlaceholder = document.createElement('div');\n this.ui.elCardPlaceholder.className = 'card-placeholder';\n\n this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n } else {\n this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n }\n return this.ui.elCardPlaceholder;\n }\n\n /**\n * Adds a live event listener to the component.\n * @param eventType {string}\n * @param selector {string}\n * @param callback {function}\n */\n live(eventType, selector, callback) {\n const attachListener = (root) => {\n root.addEventListener(\n eventType,\n (e) => {\n if (e.target.matches(selector)) {\n callback.call(e.target, e);\n }\n },\n false\n );\n };\n\n const traverseAndAttach = (root) => {\n attachListener(root);\n\n root.querySelectorAll('*').forEach((node) => {\n if (node.shadowRoot) {\n traverseAndAttach(node.shadowRoot);\n }\n });\n };\n\n traverseAndAttach(this.shadowRoot || this); // Start from the Shadow DOM if it exists\n }\n\n /**\n * Sets the selected cards.\n * @param isChecked {boolean}\n * @param card {HTMLElement}\n */\n setSelectedCards(isChecked, card) {\n if (isChecked) {\n if (!this.selectedCards.includes(card)) {\n this.selectedCards.push(card);\n }\n } else {\n this.selectedCards = this.selectedCards.filter((selectedCard) => selectedCard !== card);\n }\n }\n\n /**\n * Sets the selected items.\n */\n setSelectedItems() {\n const selectedIds = this.selectedCards.map((card) => card.getAttribute('data-id'));\n this.selectedItems = this.response.filter((item) => selectedIds.includes(item.id));\n }\n\n /**\n * Fetches the pages.\n * @param page\n * @returns {Promise<any>}\n */\n async getPages(page = 0) {\n let hasParams = this.url.includes('?');\n const response = await fetch(\n `${this.url}${hasParams ? '&' : '?'}page=${page}&size=${this.size}${this?.queryParams}`\n );\n if (!response.ok) {\n throw new Error(`An error occurred: ${response.status}`);\n }\n return await response.json();\n }\n\n /**\n * Gets the pool.\n * @param data {Array}\n * @param poolName {string}\n * @returns {*}\n */\n getPool = (data, poolName) => {\n return data.reduce((acc, item) => {\n const statusName = item.status.name;\n if (!acc[statusName]) {\n acc[statusName] = [];\n }\n acc[statusName].push(item);\n return acc;\n }, {});\n };\n\n /**\n * Returns the HTML for the pool.\n * @param title {string}\n * @param countItems {number}\n * @returns {Element}\n */\n htmlPool = (title, countItems) => {\n let poolHtml = document.createElement('div');\n poolHtml.classList.add('pool');\n\n let header = document.createElement('div');\n header.classList.add('pool-header');\n\n let checkbox = document.createElement('wje-checkbox');\n checkbox.setAttribute('type', 'checkbox');\n checkbox.classList.add('select-all-cards');\n checkbox.title = 'Select all cards';\n\n let h4 = document.createElement('h4');\n h4.textContent = title;\n\n let badge = document.createElement('wje-badge');\n badge.setAttribute('color', 'danger');\n badge.classList.add('item-count');\n badge.textContent = countItems;\n\n let dropdown = document.createElement('wje-dropdown');\n dropdown.setAttribute('placement', 'bottom-start');\n dropdown.setAttribute('offset', '5');\n dropdown.setAttribute('collapsible', '');\n dropdown.innerHTML = `\n <wje-button fill=\"link\" slot=\"trigger\" size=\"small\" round>\n <wje-icon name=\"dots-vertical\"></wje-icon>\n </wje-button>\n <wje-menu active>\n <wje-menu-item data-action=\"rename-pool\">\n <wj-label>Zmeniť názov</wj-label>\n </wje-menu-item>\n <wje-menu-item data-action=\"move-left\">\n <wj-label>Posunúť doľava</wj-label>\n </wje-menu-item>\n <wje-menu-item data-action=\"move-right\">\n <wj-label>Posunúť doprava</wj-label>\n </wje-menu-item>\n </wje-menu>\n `;\n\n header.appendChild(checkbox);\n header.appendChild(h4);\n header.appendChild(badge);\n header.appendChild(dropdown);\n\n let content = document.createElement('div');\n content.classList.add('pool-content');\n\n poolHtml.appendChild(header);\n poolHtml.appendChild(content);\n\n return poolHtml;\n };\n\n /**\n * Returns the HTML for the card.\n * @param item {Object}\n * @returns {Element}\n */\n htmlCard = (item) => {\n let card = document.createElement('div');\n card.classList.add('card');\n card.draggable = true;\n card.setAttribute('data-id', item.id);\n card.innerHTML = `\n <wje-checkbox type=\"checkbox\" class=\"select-card\" title=\"Select card\"></wje-checkbox>\n <div>${item.body}</div>\n `;\n\n return card;\n };\n\n dispatchEvent(event) {\n return false;\n }\n}\n","import Kanban from './kanban.element.js';\n\nexport default Kanban;\n\nKanban.define('wje-kanban', Kanban);\n"],"names":[],"mappings":"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"}
@@ -1,6 +1,13 @@
1
1
  var __defProp = Object.defineProperty;
2
+ var __typeError = (msg) => {
3
+ throw TypeError(msg);
4
+ };
2
5
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
6
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
+ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
8
+ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
9
+ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
10
+ var _MenuItem_instances, populateCustomEvent_fn;
4
11
  import { b as bindRouterLinks } from "./router-links-CJnOdbas.js";
5
12
  import WJElement, { WjElementUtils, event } from "./wje-element.js";
6
13
  const styles = `/*
@@ -188,6 +195,7 @@ class MenuItem extends WJElement {
188
195
  */
189
196
  constructor() {
190
197
  super();
198
+ __privateAdd(this, _MenuItem_instances);
191
199
  __publicField(this, "className", "MenuItem");
192
200
  __publicField(this, "mouseenterHandler", (e) => {
193
201
  if (this.collapse || this.variant === "CONTEXT" && this.hasSubmenu) {
@@ -304,6 +312,35 @@ class MenuItem extends WJElement {
304
312
  if (this.closest("[collapse]")) return true;
305
313
  return false;
306
314
  }
315
+ /**
316
+ * Sets the value of the custom event attribute.
317
+ * @param {string} value The value to be assigned to the custom event attribute.
318
+ */
319
+ set customEvent(value) {
320
+ this.setAttribute("custom-event", value);
321
+ }
322
+ /**
323
+ * Retrieves the value of the 'custom-event' attribute from the element.
324
+ * @returns {string | null} The value of the 'custom-event' attribute, or null if the attribute is not set.
325
+ */
326
+ get customEvent() {
327
+ return this.getAttribute("custom-event");
328
+ }
329
+ /**
330
+ * Retrieves a mapped object containing custom event parameters extracted from the element's attributes.
331
+ * Attributes considered are those that begin with 'custom-event-'.
332
+ * The mapped object's keys are derived by removing the 'custom-event-' prefix from the attribute names,
333
+ * and the values are the corresponding attribute values.
334
+ * @returns {object} An object containing key-value pairs of custom event parameters.
335
+ */
336
+ get customEventParameters() {
337
+ const attributes = Array.from(this.attributes).filter((attr) => attr.name.startsWith("custom-event-"));
338
+ return attributes.reduce((acc, attr) => {
339
+ const key = attr.name.replace("custom-event-", "");
340
+ acc[key] = attr.value;
341
+ return acc;
342
+ }, {});
343
+ }
307
344
  /**
308
345
  * Getter for cssStyleSheet.
309
346
  * @returns {string} The styles imported from styles.css.
@@ -387,10 +424,7 @@ class MenuItem extends WJElement {
387
424
  native.appendChild(end);
388
425
  native.appendChild(submenuIcon);
389
426
  let isAppend = false;
390
- if (
391
- /*(this.collapse && this.variant === "NAV" && this.hasSubmenu) || */
392
- this.variant === "CONTEXT" && this.hasSubmenu
393
- ) {
427
+ if (this.variant === "CONTEXT" && this.hasSubmenu) {
394
428
  native.setAttribute("slot", "anchor");
395
429
  let popup = document.createElement("wje-popup");
396
430
  popup.setAttribute("anchor", "anchor");
@@ -425,6 +459,9 @@ class MenuItem extends WJElement {
425
459
  event.addListener(this, "mouseleave", null, this.shouldHideSubmenu);
426
460
  event.addListener(this, "focusout", null, this.shouldHideSubmenu);
427
461
  event.addListener(this, "click", null, this.clickHandler);
462
+ if (this.hasAttribute("custom-event")) {
463
+ event.addListener(this, "click", null, __privateMethod(this, _MenuItem_instances, populateCustomEvent_fn));
464
+ }
428
465
  }
429
466
  /**
430
467
  * Creates a tooltip for the MenuItem when it is collapsed.
@@ -537,6 +574,19 @@ class MenuItem extends WJElement {
537
574
  return text.trim();
538
575
  }
539
576
  }
577
+ _MenuItem_instances = new WeakSet();
578
+ /**
579
+ * Dispatches a custom event with specified parameters.
580
+ * This method uses the `customEvent` and `customEventParameters` properties
581
+ * to create and dispatch a `CustomEvent`. The event is configured to be
582
+ * composed and bubbles up through the DOM.
583
+ * @returns {void} This method does not return a value.
584
+ */
585
+ populateCustomEvent_fn = function() {
586
+ this.dispatchEvent(
587
+ new CustomEvent(this.customEvent, { detail: this.customEventParameters, composed: true, bubbles: true })
588
+ );
589
+ };
540
590
  MenuItem.define("wje-menu-item", MenuItem);
541
591
  export {
542
592
  MenuItem as default
@@ -1 +1 @@
1
- {"version":3,"file":"wje-menu-item.js","sources":["../packages/wje-menu-item/menu-item.element.js","../packages/wje-menu-item/menu-item.js"],"sourcesContent":["import { bindRouterLinks } from 'slick-router/middlewares/router-links.js';\n\nimport { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `MenuItem` is a custom web component that represents a menu item.\n * @summary This element represents a menu item.\n * @documentation https://elements.webjet.sk/components/menu-item\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the menu item.\n * @csspart submenu - The submenu part of the menu item.\n * @slot - The default slot for the menu item.\n * @slot start - The slot for the start of the menu item.\n * @slot end - The slot for the end of the menu item.\n * @slot submenu - The slot for the submenu of the menu item.\n * @cssproperty [--wje-menu-item-color=var(--wje-color)] - Sets the text color of a menu item. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background=transparent] - Defines the background color of a menu item. Default is `transparent`. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-hover=var(--wje-color-contrast-8)] - Specifies the text color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-hover=var(--wje-border-color)] - Sets the background color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-focus=var(--wje-color-contrast-8)] - Defines the text color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-focus=var(--wje-border-color)] - Specifies the background color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-active=var(--wje-color-contrast-8)] - Sets the text color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-active=var(--wje-border-color)] - Specifies the background color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-padding-top=.5rem] - Specifies the top padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-padding-bottom=.5rem] - Specifies the bottom padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-line-height=1.8rem] - Sets the line height for the text within a menu item. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-submenu-offset=0] - Determines the horizontal offset of a submenu relative to its parent. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-item-icon-visibility=hidden] - Controls the visibility of the icon in a menu item. Accepts `visible`, `hidden`, or `collapse`.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-x] - Specifies the x-coordinate of the cursor for the safe triangle area. Used for managing hover or focus transitions between menu items and submenus.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-y] - Specifies the y-coordinate of the cursor for the safe triangle area.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-x] - Defines the x-coordinate where the submenu's safe triangle starts. Helps prevent accidental submenu closing when navigating.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-y] - Defines the y-coordinate where the submenu's safe triangle starts.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-x] - Specifies the x-coordinate where the submenu's safe triangle ends.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-y] - Specifies the y-coordinate where the submenu's safe triangle ends.\n * @tag wje-menu-item\n */\nexport default class MenuItem extends WJElement {\n /**\n * Constructor for MenuItem class.\n * @class\n */\n constructor() {\n super();\n\n this._collapsible = false;\n }\n\n /**\n * Getter for placement attribute.\n * @returns {string} The placement attribute of the menu or \"right-start\" if it doesn't exist.\n */\n get placement() {\n let menu = this.querySelector('wje-menu');\n\n if (menu?.hasAttribute('placement')) {\n return menu.getAttribute('placement');\n }\n return 'right-start';\n }\n\n /**\n * Getter for offset attribute.\n * @returns {string} The offset attribute of the menu or \"0\" if it doesn't exist.\n */\n get offset() {\n let menu = this.querySelector('wje-menu');\n\n if (menu?.hasAttribute('offset')) {\n return menu.getAttribute('offset');\n }\n return '0';\n }\n\n /**\n * Getter for variant attribute.\n * @returns {string} The variant attribute of the menu or \"CONTEXT\" if it doesn't exist.\n */\n get variant() {\n let menu = this.querySelector('wje-menu');\n\n if (menu?.hasAttribute('variant') && !this.collapse) {\n return menu.getAttribute('variant').toUpperCase();\n }\n\n return 'CONTEXT';\n }\n\n /**\n * Getter for collapse attribute.\n * @returns {boolean} True if the closest parent has the collapse attribute, false otherwise.\n */\n get collapse() {\n if (this.closest('[collapse]')) return true;\n\n return false;\n }\n\n className = 'MenuItem';\n\n /**\n * Getter for cssStyleSheet.\n * @returns {string} The styles imported from styles.css.\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for observedAttributes.\n * @returns {Array} An empty array as no attributes are being observed.\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the MenuItem element.\n */\n setupAttributes() {\n super.setupAttributes();\n this.isShadowRoot = 'open';\n this.setAttribute('active-class', 'open');\n }\n\n /**\n * Removes the active attribute from the menu before drawing the MenuItem.\n */\n beforeDraw() {\n this.querySelector('wje-menu')?.removeAttribute('active');\n }\n\n /**\n * Draws the MenuItem element and sets the variant and collapse attributes.\n * @returns {DocumentFragment} The fragment to be appended to the MenuItem.\n */\n draw() {\n this.hasSubmenu = WjElementUtils.hasSlot(this, 'submenu');\n\n let fragment = document.createDocumentFragment();\n\n this.setAttribute('tabindex', '0');\n\n this.classList.forEach((className) => {\n // Ak trieda začína na \"wje-menu-variant-\", odstráňte ju\n if (className.startsWith('wje-menu-variant-')) {\n this.classList.remove(className);\n }\n });\n\n this.classList.remove('collapse');\n this.classList.add('wje-menu-variant-' + this.variant.toLowerCase());\n\n if (!this.collapse) {\n this.querySelector('wje-menu')?.setAttribute('variant', this.variant.toLowerCase());\n } else if (this.parentElement?.hasAttribute('collapse')) {\n this.classList.add('collapse');\n }\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.setAttribute('id', 'anchor');\n native.classList.add('native-menu-item');\n\n // CHECKED - Icon\n let checkedIcon = document.createElement('span');\n checkedIcon.setAttribute('part', 'check');\n checkedIcon.classList.add('check-icon');\n checkedIcon.innerHTML = `<wje-icon name=\"check\"></wje-icon>`;\n\n if (this.hasAttribute('checked')) checkedIcon.classList.add('checked');\n else checkedIcon.classList.remove('checked');\n\n // SLOT - Start\n let start = document.createElement('slot');\n start.name = 'start';\n\n // SLOT\n let slot = document.createElement('slot');\n slot.classList.add('label');\n\n // SLOT - End\n let end = document.createElement('slot');\n end.setAttribute('part', 'end');\n end.name = 'end';\n\n // SLOT - Submenu\n let submenu = document.createElement('slot');\n submenu.setAttribute('part', 'submenu');\n submenu.name = 'submenu';\n\n // SUBMENU - Icon\n let submenuIconClass = this.collapse ? 'collapse' : 'expand';\n let submenuIcon = document.createElement('span');\n submenuIcon.setAttribute('part', 'submenu-icon');\n submenuIcon.classList.add('submenu-icon', submenuIconClass);\n submenuIcon.innerHTML = this.collapse\n ? `<wje-icon name=\"chevron-down\"></wje-icon>`\n : `<wje-icon name=\"chevron-right\"></wje-icon>`;\n\n if (this.hasSubmenu) native.classList.add('has-submenu');\n else native.classList.remove('has-submenu');\n\n native.appendChild(checkedIcon);\n native.appendChild(start);\n native.appendChild(slot);\n native.appendChild(end);\n native.appendChild(submenuIcon);\n\n let isAppend = false;\n // ak je variant typu CONTEXT zobrazime submenu ako popup\n if (\n /*(this.collapse && this.variant === \"NAV\" && this.hasSubmenu) || */ this.variant === 'CONTEXT' &&\n this.hasSubmenu\n ) {\n native.setAttribute('slot', 'anchor'); // pridame slot anchor pre popup\n\n let popup = document.createElement('wje-popup');\n popup.setAttribute('anchor', 'anchor');\n popup.setAttribute('placement', this.placement);\n popup.setAttribute('offset', this.offset);\n\n popup.appendChild(native);\n popup.appendChild(submenu);\n\n this.popup = popup;\n fragment.appendChild(popup);\n isAppend = true;\n }\n\n if (this.parentElement?.hasAttribute('collapse') && !this.hasSubmenu) {\n fragment.appendChild(this.collapseItem(native));\n } else if (!isAppend) {\n fragment.appendChild(native);\n }\n\n if ((!this.collapse && this.variant === 'NAV') || (this.variant === 'MEGAMENU' && this.hasSubmenu)) {\n fragment.appendChild(submenu);\n }\n\n this.native = native;\n this.submenu = submenu;\n\n return fragment;\n }\n\n /**\n * Adds event listeners after drawing the MenuItem.\n */\n afterDraw() {\n this.unbindRouterLinks = bindRouterLinks(this.parentElement, { selector: false });\n\n this.addEventListener('mousemove', this.dispatchMove);\n this.addEventListener('wje-popup:reposition', this.dispatchReposition);\n\n // Event na zobrazenie submenu\n event.addListener(this, 'mouseenter', null, this.mouseenterHandler);\n // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n event.addListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n event.addListener(this, 'focusout', null, this.shouldHideSubmenu);\n event.addListener(this, 'click', null, this.clickHandler);\n }\n\n mouseenterHandler = (e) => {\n if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n if (this.hasAttribute('manual') || (this.variant === 'NAV' && this.collapse)) return;\n\n this.activateSubmenu(e);\n\n e.stopPropagation();\n\n this.showSubmenu();\n // this.focus();\n }\n };\n\n /**\n * Handles the click event on the MenuItem.\n * @param {object} e\n */\n clickHandler = (e) => {\n switch (this.variant) {\n case 'NAV':\n if (!this.collapse && this.hasSubmenu) {\n this.submenuToggle(e);\n this.hideSubmenu();\n e.stopPropagation();\n } else {\n event.dispatchCustomEvent(this, 'wje-menu-item:click');\n event.dispatchCustomEvent(this, this.dialog);\n }\n break;\n case 'CONTEXT':\n if (!this.collapse && this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (submenuElements?.hasAttribute('active')) {\n this.shouldHideSubmenu(e);\n } else {\n this.activateSubmenu(e);\n this.showSubmenu(e);\n }\n } else {\n event.dispatchCustomEvent(this, 'wje-menu-item:click');\n event.dispatchCustomEvent(this, this.dialog);\n }\n\n break;\n }\n };\n\n /**\n * Checks if the submenu should be hidden based on the event.\n * @param {Event} e The event object.\n */\n shouldHideSubmenu = (e) => {\n if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n if ((e.relatedTarget && this.contains(e.relatedTarget)) || (this.variant === 'NAV' && !this.collapse)) {\n return;\n }\n\n this.deactivateSubmenu();\n this.hideSubmenu();\n }\n };\n\n /**\n * Creates a tooltip for the MenuItem when it is collapsed.\n * @param {HTMLElement} native The native MenuItem element.\n * @returns {HTMLElement} The tooltip element.\n */\n collapseItem(native) {\n let tooltipStart = document.createElement('slot');\n tooltipStart.setAttribute('slot', 'start');\n tooltipStart.setAttribute('name', 'tooltip-start');\n\n let tooltipEnd = document.createElement('slot');\n tooltipEnd.setAttribute('slot', 'end');\n tooltipEnd.setAttribute('name', 'tooltip-end');\n\n let tooltip = document.createElement('wje-tooltip');\n tooltip.setAttribute('content', this.getTextFromElement(this));\n tooltip.setAttribute('placement', 'right');\n tooltip.setAttribute('offset', this.offset || '0');\n\n tooltip.appendChild(tooltipStart);\n tooltip.appendChild(tooltipEnd);\n tooltip.appendChild(native);\n\n return tooltip;\n }\n\n /**\n * Dispatches a mousemove event.\n */\n dispatchMove = (e) => {\n this.style.setProperty('--wje-menu-item-safe-triangle-cursor-x', `${e.clientX}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-cursor-y', `${e.clientY}px`);\n };\n\n /**\n * Dispatches a reposition event.\n */\n dispatchReposition = (e) => {\n // ak nemame submenu tak to ukoncime\n if (this.submenu.assignedNodes().length === 0) return;\n\n let submenu = this.submenu.assignedNodes()[0];\n const { left, top, width, height } = submenu.getBoundingClientRect();\n\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-x', `${left}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-y', `${top}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-x', `${left}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-y', `${top + height}px`);\n };\n\n /**\n * Shows the submenu of the MenuItem.\n */\n showSubmenu() {\n this.tabIndex = -1;\n if (this.hasSubmenu) {\n this.popup?.show();\n this.classList.add('expanded-submenu');\n this.native.classList.add('expanded-submenu');\n }\n }\n\n /**\n * Hides the submenu of the MenuItem.\n */\n hideSubmenu() {\n this.tabIndex = 0;\n if (this.hasSubmenu) {\n this.popup?.hide();\n this.classList.remove('expanded-submenu');\n this.native.classList.remove('expanded-submenu');\n }\n }\n\n /**\n * Toggles the active state of the submenu element.\n * If the submenu is not active, it sets the \"active\" attribute.\n * If the submenu is already active, it removes the \"active\" attribute.\n * @param {Event} e The event object.\n */\n submenuToggle(e) {\n if (this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (!submenuElements.hasAttribute('active')) {\n submenuElements.setAttribute('active', '');\n } else {\n if (this === e.target) submenuElements.removeAttribute('active');\n }\n }\n }\n\n /**\n * Deactivates the submenu by removing the \"active\" attribute.\n */\n deactivateSubmenu() {\n if (this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (submenuElements.hasAttribute('active')) {\n submenuElements.removeAttribute('active');\n }\n }\n }\n\n /**\n * Activates the submenu of the menu item.\n */\n activateSubmenu() {\n if (this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (!submenuElements.hasAttribute('active')) {\n submenuElements.setAttribute('active', '');\n }\n }\n }\n\n /**\n * Gets the text from the element and returns it.\n */\n beforeDisconnect() {\n this.removeEventListener('mousemove', this.dispatchMove);\n this.removeEventListener('wje-popup:reposition', this.dispatchReposition);\n\n event.removeListener(this, 'mouseenter', null, this.mouseenterHandler);\n event.removeListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n event.removeListener(this, 'focusout', null, this.shouldHideSubmenu);\n event.removeListener(this, 'click', null, this.clickHandler);\n\n this.unbindRouterLinks?.();\n }\n\n /**\n * Extracts and returns the concatenated text content from all text nodes within the specified element.\n * @param {HTMLElement} element The HTML element from which to extract text content.\n * @returns {string} The concatenated and trimmed text content from the element's text nodes.\n */\n getTextFromElement(element) {\n let text = '';\n for (let node of element.childNodes) {\n if (node.nodeType === Node.TEXT_NODE) {\n text += node.textContent;\n }\n }\n return text.trim();\n }\n}\n","import MenuItem from './menu-item.element.js';\n\nexport default MenuItem;\n\nMenuItem.define('wje-menu-item', MenuItem);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"wje-menu-item.js","sources":["../packages/wje-menu-item/menu-item.element.js","../packages/wje-menu-item/menu-item.js"],"sourcesContent":["import { bindRouterLinks } from 'slick-router/middlewares/router-links.js';\n\nimport { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `MenuItem` is a custom web component that represents a menu item.\n * @summary This element represents a menu item.\n * @documentation https://elements.webjet.sk/components/menu-item\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the menu item.\n * @csspart submenu - The submenu part of the menu item.\n * @slot - The default slot for the menu item.\n * @slot start - The slot for the start of the menu item.\n * @slot end - The slot for the end of the menu item.\n * @slot submenu - The slot for the submenu of the menu item.\n * @cssproperty [--wje-menu-item-color=var(--wje-color)] - Sets the text color of a menu item. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background=transparent] - Defines the background color of a menu item. Default is `transparent`. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-hover=var(--wje-color-contrast-8)] - Specifies the text color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-hover=var(--wje-border-color)] - Sets the background color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-focus=var(--wje-color-contrast-8)] - Defines the text color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-focus=var(--wje-border-color)] - Specifies the background color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-active=var(--wje-color-contrast-8)] - Sets the text color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-active=var(--wje-border-color)] - Specifies the background color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-padding-top=.5rem] - Specifies the top padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-padding-bottom=.5rem] - Specifies the bottom padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-line-height=1.8rem] - Sets the line height for the text within a menu item. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-submenu-offset=0] - Determines the horizontal offset of a submenu relative to its parent. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-item-icon-visibility=hidden] - Controls the visibility of the icon in a menu item. Accepts `visible`, `hidden`, or `collapse`.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-x] - Specifies the x-coordinate of the cursor for the safe triangle area. Used for managing hover or focus transitions between menu items and submenus.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-y] - Specifies the y-coordinate of the cursor for the safe triangle area.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-x] - Defines the x-coordinate where the submenu's safe triangle starts. Helps prevent accidental submenu closing when navigating.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-y] - Defines the y-coordinate where the submenu's safe triangle starts.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-x] - Specifies the x-coordinate where the submenu's safe triangle ends.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-y] - Specifies the y-coordinate where the submenu's safe triangle ends.\n * @tag wje-menu-item\n */\nexport default class MenuItem extends WJElement {\n /**\n * Constructor for MenuItem class.\n * @class\n */\n constructor() {\n super();\n\n this._collapsible = false;\n }\n\n /**\n * Getter for placement attribute.\n * @returns {string} The placement attribute of the menu or \"right-start\" if it doesn't exist.\n */\n get placement() {\n let menu = this.querySelector('wje-menu');\n\n if (menu?.hasAttribute('placement')) {\n return menu.getAttribute('placement');\n }\n return 'right-start';\n }\n\n /**\n * Getter for offset attribute.\n * @returns {string} The offset attribute of the menu or \"0\" if it doesn't exist.\n */\n get offset() {\n let menu = this.querySelector('wje-menu');\n\n if (menu?.hasAttribute('offset')) {\n return menu.getAttribute('offset');\n }\n return '0';\n }\n\n /**\n * Getter for variant attribute.\n * @returns {string} The variant attribute of the menu or \"CONTEXT\" if it doesn't exist.\n */\n get variant() {\n let menu = this.querySelector('wje-menu');\n\n if (menu?.hasAttribute('variant') && !this.collapse) {\n return menu.getAttribute('variant').toUpperCase();\n }\n\n return 'CONTEXT';\n }\n\n /**\n * Getter for collapse attribute.\n * @returns {boolean} True if the closest parent has the collapse attribute, false otherwise.\n */\n get collapse() {\n if (this.closest('[collapse]')) return true;\n\n return false;\n }\n\n /**\n * Sets the value of the custom event attribute.\n * @param {string} value The value to be assigned to the custom event attribute.\n */\n set customEvent(value) {\n this.setAttribute('custom-event', value);\n }\n\n /**\n * Retrieves the value of the 'custom-event' attribute from the element.\n * @returns {string | null} The value of the 'custom-event' attribute, or null if the attribute is not set.\n */\n get customEvent() {\n return this.getAttribute('custom-event');\n }\n\n /**\n * Retrieves a mapped object containing custom event parameters extracted from the element's attributes.\n * Attributes considered are those that begin with 'custom-event-'.\n * The mapped object's keys are derived by removing the 'custom-event-' prefix from the attribute names,\n * and the values are the corresponding attribute values.\n * @returns {object} An object containing key-value pairs of custom event parameters.\n */\n get customEventParameters() {\n const attributes = Array.from(this.attributes).filter((attr) => attr.name.startsWith('custom-event-'));\n\n return attributes.reduce((acc, attr) => {\n const key = attr.name.replace('custom-event-', '');\n acc[key] = attr.value;\n\n return acc;\n }, {});\n }\n\n className = 'MenuItem';\n\n /**\n * Getter for cssStyleSheet.\n * @returns {string} The styles imported from styles.css.\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for observedAttributes.\n * @returns {Array} An empty array as no attributes are being observed.\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the MenuItem element.\n */\n setupAttributes() {\n super.setupAttributes();\n this.isShadowRoot = 'open';\n this.setAttribute('active-class', 'open');\n }\n\n /**\n * Removes the active attribute from the menu before drawing the MenuItem.\n */\n beforeDraw() {\n this.querySelector('wje-menu')?.removeAttribute('active');\n }\n\n /**\n * Draws the MenuItem element and sets the variant and collapse attributes.\n * @returns {DocumentFragment} The fragment to be appended to the MenuItem.\n */\n draw() {\n this.hasSubmenu = WjElementUtils.hasSlot(this, 'submenu');\n\n let fragment = document.createDocumentFragment();\n\n this.setAttribute('tabindex', '0');\n\n this.classList.forEach((className) => {\n // Ak trieda začína na \"wje-menu-variant-\", odstráňte ju\n if (className.startsWith('wje-menu-variant-')) {\n this.classList.remove(className);\n }\n });\n\n this.classList.remove('collapse');\n this.classList.add('wje-menu-variant-' + this.variant.toLowerCase());\n\n if (!this.collapse) {\n this.querySelector('wje-menu')?.setAttribute('variant', this.variant.toLowerCase());\n } else if (this.parentElement?.hasAttribute('collapse')) {\n this.classList.add('collapse');\n }\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.setAttribute('id', 'anchor');\n native.classList.add('native-menu-item');\n\n // CHECKED - Icon\n let checkedIcon = document.createElement('span');\n checkedIcon.setAttribute('part', 'check');\n checkedIcon.classList.add('check-icon');\n checkedIcon.innerHTML = `<wje-icon name=\"check\"></wje-icon>`;\n\n if (this.hasAttribute('checked')) checkedIcon.classList.add('checked');\n else checkedIcon.classList.remove('checked');\n\n // SLOT - Start\n let start = document.createElement('slot');\n start.name = 'start';\n\n // SLOT\n let slot = document.createElement('slot');\n slot.classList.add('label');\n\n // SLOT - End\n let end = document.createElement('slot');\n end.setAttribute('part', 'end');\n end.name = 'end';\n\n // SLOT - Submenu\n let submenu = document.createElement('slot');\n submenu.setAttribute('part', 'submenu');\n submenu.name = 'submenu';\n\n // SUBMENU - Icon\n let submenuIconClass = this.collapse ? 'collapse' : 'expand';\n let submenuIcon = document.createElement('span');\n submenuIcon.setAttribute('part', 'submenu-icon');\n submenuIcon.classList.add('submenu-icon', submenuIconClass);\n submenuIcon.innerHTML = this.collapse\n ? `<wje-icon name=\"chevron-down\"></wje-icon>`\n : `<wje-icon name=\"chevron-right\"></wje-icon>`;\n\n if (this.hasSubmenu) native.classList.add('has-submenu');\n else native.classList.remove('has-submenu');\n\n native.appendChild(checkedIcon);\n native.appendChild(start);\n native.appendChild(slot);\n native.appendChild(end);\n native.appendChild(submenuIcon);\n\n let isAppend = false;\n // ak je variant typu CONTEXT zobrazime submenu ako popup\n if (this.variant === 'CONTEXT' && this.hasSubmenu) {\n native.setAttribute('slot', 'anchor'); // pridame slot anchor pre popup\n\n let popup = document.createElement('wje-popup');\n popup.setAttribute('anchor', 'anchor');\n popup.setAttribute('placement', this.placement);\n popup.setAttribute('offset', this.offset);\n\n popup.appendChild(native);\n popup.appendChild(submenu);\n\n this.popup = popup;\n fragment.appendChild(popup);\n isAppend = true;\n }\n\n if (this.parentElement?.hasAttribute('collapse') && !this.hasSubmenu) {\n fragment.appendChild(this.collapseItem(native));\n } else if (!isAppend) {\n fragment.appendChild(native);\n }\n\n if ((!this.collapse && this.variant === 'NAV') || (this.variant === 'MEGAMENU' && this.hasSubmenu)) {\n fragment.appendChild(submenu);\n }\n\n this.native = native;\n this.submenu = submenu;\n\n return fragment;\n }\n\n /**\n * Adds event listeners after drawing the MenuItem.\n */\n afterDraw() {\n this.unbindRouterLinks = bindRouterLinks(this.parentElement, { selector: false });\n\n this.addEventListener('mousemove', this.dispatchMove);\n this.addEventListener('wje-popup:reposition', this.dispatchReposition);\n\n // Event na zobrazenie submenu\n event.addListener(this, 'mouseenter', null, this.mouseenterHandler);\n // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n event.addListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n event.addListener(this, 'focusout', null, this.shouldHideSubmenu);\n event.addListener(this, 'click', null, this.clickHandler);\n\n if (this.hasAttribute('custom-event')) {\n event.addListener(this, 'click', null, this.#populateCustomEvent);\n }\n }\n\n mouseenterHandler = (e) => {\n if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n if (this.hasAttribute('manual') || (this.variant === 'NAV' && this.collapse)) return;\n\n this.activateSubmenu(e);\n\n e.stopPropagation();\n\n this.showSubmenu();\n // this.focus();\n }\n };\n\n /**\n * Handles the click event on the MenuItem.\n * @param {object} e\n */\n clickHandler = (e) => {\n switch (this.variant) {\n case 'NAV':\n if (!this.collapse && this.hasSubmenu) {\n this.submenuToggle(e);\n this.hideSubmenu();\n e.stopPropagation();\n } else {\n event.dispatchCustomEvent(this, 'wje-menu-item:click');\n event.dispatchCustomEvent(this, this.dialog);\n }\n break;\n case 'CONTEXT':\n if (!this.collapse && this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (submenuElements?.hasAttribute('active')) {\n this.shouldHideSubmenu(e);\n } else {\n this.activateSubmenu(e);\n this.showSubmenu(e);\n }\n } else {\n event.dispatchCustomEvent(this, 'wje-menu-item:click');\n event.dispatchCustomEvent(this, this.dialog);\n }\n\n break;\n }\n }\n\n /**\n * Checks if the submenu should be hidden based on the event.\n * @param {Event} e The event object.\n */\n shouldHideSubmenu = (e) => {\n if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n if ((e.relatedTarget && this.contains(e.relatedTarget)) || (this.variant === 'NAV' && !this.collapse)) {\n return;\n }\n\n this.deactivateSubmenu();\n this.hideSubmenu();\n }\n };\n\n /**\n * Creates a tooltip for the MenuItem when it is collapsed.\n * @param {HTMLElement} native The native MenuItem element.\n * @returns {HTMLElement} The tooltip element.\n */\n collapseItem(native) {\n let tooltipStart = document.createElement('slot');\n tooltipStart.setAttribute('slot', 'start');\n tooltipStart.setAttribute('name', 'tooltip-start');\n\n let tooltipEnd = document.createElement('slot');\n tooltipEnd.setAttribute('slot', 'end');\n tooltipEnd.setAttribute('name', 'tooltip-end');\n\n let tooltip = document.createElement('wje-tooltip');\n tooltip.setAttribute('content', this.getTextFromElement(this));\n tooltip.setAttribute('placement', 'right');\n tooltip.setAttribute('offset', this.offset || '0');\n\n tooltip.appendChild(tooltipStart);\n tooltip.appendChild(tooltipEnd);\n tooltip.appendChild(native);\n\n return tooltip;\n }\n\n /**\n * Dispatches a mousemove event.\n */\n dispatchMove = (e) => {\n this.style.setProperty('--wje-menu-item-safe-triangle-cursor-x', `${e.clientX}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-cursor-y', `${e.clientY}px`);\n };\n\n /**\n * Dispatches a reposition event.\n */\n dispatchReposition = (e) => {\n // ak nemame submenu tak to ukoncime\n if (this.submenu.assignedNodes().length === 0) return;\n\n let submenu = this.submenu.assignedNodes()[0];\n const { left, top, width, height } = submenu.getBoundingClientRect();\n\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-x', `${left}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-y', `${top}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-x', `${left}px`);\n this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-y', `${top + height}px`);\n };\n\n /**\n * Shows the submenu of the MenuItem.\n */\n showSubmenu() {\n this.tabIndex = -1;\n if (this.hasSubmenu) {\n this.popup?.show();\n this.classList.add('expanded-submenu');\n this.native.classList.add('expanded-submenu');\n }\n }\n\n /**\n * Hides the submenu of the MenuItem.\n */\n hideSubmenu() {\n this.tabIndex = 0;\n if (this.hasSubmenu) {\n this.popup?.hide();\n this.classList.remove('expanded-submenu');\n this.native.classList.remove('expanded-submenu');\n }\n }\n\n /**\n * Toggles the active state of the submenu element.\n * If the submenu is not active, it sets the \"active\" attribute.\n * If the submenu is already active, it removes the \"active\" attribute.\n * @param {Event} e The event object.\n */\n submenuToggle(e) {\n if (this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (!submenuElements.hasAttribute('active')) {\n submenuElements.setAttribute('active', '');\n } else {\n if (this === e.target) submenuElements.removeAttribute('active');\n }\n }\n }\n\n /**\n * Deactivates the submenu by removing the \"active\" attribute.\n */\n deactivateSubmenu() {\n if (this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (submenuElements.hasAttribute('active')) {\n submenuElements.removeAttribute('active');\n }\n }\n }\n\n /**\n * Activates the submenu of the menu item.\n */\n activateSubmenu() {\n if (this.hasSubmenu) {\n let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n if (!submenuElements.hasAttribute('active')) {\n submenuElements.setAttribute('active', '');\n }\n }\n }\n\n /**\n * Gets the text from the element and returns it.\n */\n beforeDisconnect() {\n this.removeEventListener('mousemove', this.dispatchMove);\n this.removeEventListener('wje-popup:reposition', this.dispatchReposition);\n\n event.removeListener(this, 'mouseenter', null, this.mouseenterHandler);\n event.removeListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n event.removeListener(this, 'focusout', null, this.shouldHideSubmenu);\n event.removeListener(this, 'click', null, this.clickHandler);\n\n this.unbindRouterLinks?.();\n }\n\n /**\n * Extracts and returns the concatenated text content from all text nodes within the specified element.\n * @param {HTMLElement} element The HTML element from which to extract text content.\n * @returns {string} The concatenated and trimmed text content from the element's text nodes.\n */\n getTextFromElement(element) {\n let text = '';\n for (let node of element.childNodes) {\n if (node.nodeType === Node.TEXT_NODE) {\n text += node.textContent;\n }\n }\n return text.trim();\n }\n\n /**\n * Dispatches a custom event with specified parameters.\n * This method uses the `customEvent` and `customEventParameters` properties\n * to create and dispatch a `CustomEvent`. The event is configured to be\n * composed and bubbles up through the DOM.\n * @returns {void} This method does not return a value.\n */\n #populateCustomEvent() {\n this.dispatchEvent(\n new CustomEvent(this.customEvent, { detail: this.customEventParameters, composed: true, bubbles: true })\n );\n }\n}\n","import MenuItem from './menu-item.element.js';\n\nexport default MenuItem;\n\nMenuItem.define('wje-menu-item', MenuItem);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCe,MAAM,iBAAiB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAK5C,cAAc;AACV,UAAO;AANA;AA+FX,qCAAY;AAuKZ,6CAAoB,CAAC,MAAM;AACvB,UAAI,KAAK,YAAa,KAAK,YAAY,aAAa,KAAK,YAAa;AAClE,YAAI,KAAK,aAAa,QAAQ,KAAM,KAAK,YAAY,SAAS,KAAK,SAAW;AAE9E,aAAK,gBAAgB,CAAC;AAEtB,UAAE,gBAAiB;AAEnB,aAAK,YAAa;AAAA,MAE9B;AAAA,IACK;AAMD;AAAA;AAAA;AAAA;AAAA,wCAAe,CAAC,MAAM;AAClB,cAAQ,KAAK,SAAO;AAAA,QAChB,KAAK;AACD,cAAI,CAAC,KAAK,YAAY,KAAK,YAAY;AACnC,iBAAK,cAAc,CAAC;AACpB,iBAAK,YAAa;AAClB,cAAE,gBAAiB;AAAA,UACvC,OAAuB;AACH,kBAAM,oBAAoB,MAAM,qBAAqB;AACrD,kBAAM,oBAAoB,MAAM,KAAK,MAAM;AAAA,UAC/D;AACgB;AAAA,QACJ,KAAK;AACD,cAAI,CAAC,KAAK,YAAY,KAAK,YAAY;AACnC,gBAAI,kBAAkB,KAAK,QAAQ,iBAAiB,EAAE,SAAS,MAAM,EAAE,CAAC;AACxE,gBAAI,mDAAiB,aAAa,WAAW;AACzC,mBAAK,kBAAkB,CAAC;AAAA,YAChD,OAA2B;AACH,mBAAK,gBAAgB,CAAC;AACtB,mBAAK,YAAY,CAAC;AAAA,YAC1C;AAAA,UACA,OAAuB;AACH,kBAAM,oBAAoB,MAAM,qBAAqB;AACrD,kBAAM,oBAAoB,MAAM,KAAK,MAAM;AAAA,UAC/D;AAEgB;AAAA,MAChB;AAAA,IACA;AAMI;AAAA;AAAA;AAAA;AAAA,6CAAoB,CAAC,MAAM;AACvB,UAAI,KAAK,YAAa,KAAK,YAAY,aAAa,KAAK,YAAa;AAClE,YAAK,EAAE,iBAAiB,KAAK,SAAS,EAAE,aAAa,KAAO,KAAK,YAAY,SAAS,CAAC,KAAK,UAAW;AACnG;AAAA,QAChB;AAEY,aAAK,kBAAmB;AACxB,aAAK,YAAa;AAAA,MAC9B;AAAA,IACK;AA+BD;AAAA;AAAA;AAAA,wCAAe,CAAC,MAAM;AAClB,WAAK,MAAM,YAAY,0CAA0C,GAAG,EAAE,OAAO,IAAI;AACjF,WAAK,MAAM,YAAY,0CAA0C,GAAG,EAAE,OAAO,IAAI;AAAA,IACpF;AAKD;AAAA;AAAA;AAAA,8CAAqB,CAAC,MAAM;AAExB,UAAI,KAAK,QAAQ,cAAa,EAAG,WAAW,EAAG;AAE/C,UAAI,UAAU,KAAK,QAAQ,cAAa,EAAG,CAAC;AAC5C,YAAM,EAAE,MAAM,KAAK,OAAO,OAAQ,IAAG,QAAQ,sBAAuB;AAEpE,WAAK,MAAM,YAAY,iDAAiD,GAAG,IAAI,IAAI;AACnF,WAAK,MAAM,YAAY,iDAAiD,GAAG,GAAG,IAAI;AAClF,WAAK,MAAM,YAAY,+CAA+C,GAAG,IAAI,IAAI;AACjF,WAAK,MAAM,YAAY,+CAA+C,GAAG,MAAM,MAAM,IAAI;AAAA,IAC5F;AA5WG,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY;AACZ,QAAI,OAAO,KAAK,cAAc,UAAU;AAExC,QAAI,6BAAM,aAAa,cAAc;AACjC,aAAO,KAAK,aAAa,WAAW;AAAA,IAChD;AACQ,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,SAAS;AACT,QAAI,OAAO,KAAK,cAAc,UAAU;AAExC,QAAI,6BAAM,aAAa,WAAW;AAC9B,aAAO,KAAK,aAAa,QAAQ;AAAA,IAC7C;AACQ,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU;AACV,QAAI,OAAO,KAAK,cAAc,UAAU;AAExC,SAAI,6BAAM,aAAa,eAAc,CAAC,KAAK,UAAU;AACjD,aAAO,KAAK,aAAa,SAAS,EAAE,YAAa;AAAA,IAC7D;AAEQ,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,WAAW;AACX,QAAI,KAAK,QAAQ,YAAY,EAAG,QAAO;AAEvC,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY,OAAO;AACnB,SAAK,aAAa,gBAAgB,KAAK;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,cAAc;AACd,WAAO,KAAK,aAAa,cAAc;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,IAAI,wBAAwB;AACxB,UAAM,aAAa,MAAM,KAAK,KAAK,UAAU,EAAE,OAAO,CAAC,SAAS,KAAK,KAAK,WAAW,eAAe,CAAC;AAErG,WAAO,WAAW,OAAO,CAAC,KAAK,SAAS;AACpC,YAAM,MAAM,KAAK,KAAK,QAAQ,iBAAiB,EAAE;AACjD,UAAI,GAAG,IAAI,KAAK;AAEhB,aAAO;AAAA,IACV,GAAE,EAAE;AAAA,EACb;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,WAAW,qBAAqB;AAC5B,WAAO,CAAE;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,UAAM,gBAAiB;AACvB,SAAK,eAAe;AACpB,SAAK,aAAa,gBAAgB,MAAM;AAAA,EAChD;AAAA;AAAA;AAAA;AAAA,EAKI,aAAa;;AACT,eAAK,cAAc,UAAU,MAA7B,mBAAgC,gBAAgB;AAAA,EACxD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;;AACH,SAAK,aAAa,eAAe,QAAQ,MAAM,SAAS;AAExD,QAAI,WAAW,SAAS,uBAAwB;AAEhD,SAAK,aAAa,YAAY,GAAG;AAEjC,SAAK,UAAU,QAAQ,CAAC,cAAc;AAElC,UAAI,UAAU,WAAW,mBAAmB,GAAG;AAC3C,aAAK,UAAU,OAAO,SAAS;AAAA,MAC/C;AAAA,IACA,CAAS;AAED,SAAK,UAAU,OAAO,UAAU;AAChC,SAAK,UAAU,IAAI,sBAAsB,KAAK,QAAQ,aAAa;AAEnE,QAAI,CAAC,KAAK,UAAU;AAChB,iBAAK,cAAc,UAAU,MAA7B,mBAAgC,aAAa,WAAW,KAAK,QAAQ;IACxE,YAAU,UAAK,kBAAL,mBAAoB,aAAa,aAAa;AACrD,WAAK,UAAU,IAAI,UAAU;AAAA,IACzC;AAEQ,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,aAAa,MAAM,QAAQ;AAClC,WAAO,UAAU,IAAI,kBAAkB;AAGvC,QAAI,cAAc,SAAS,cAAc,MAAM;AAC/C,gBAAY,aAAa,QAAQ,OAAO;AACxC,gBAAY,UAAU,IAAI,YAAY;AACtC,gBAAY,YAAY;AAExB,QAAI,KAAK,aAAa,SAAS,EAAG,aAAY,UAAU,IAAI,SAAS;AAAA,QAChE,aAAY,UAAU,OAAO,SAAS;AAG3C,QAAI,QAAQ,SAAS,cAAc,MAAM;AACzC,UAAM,OAAO;AAGb,QAAI,OAAO,SAAS,cAAc,MAAM;AACxC,SAAK,UAAU,IAAI,OAAO;AAG1B,QAAI,MAAM,SAAS,cAAc,MAAM;AACvC,QAAI,aAAa,QAAQ,KAAK;AAC9B,QAAI,OAAO;AAGX,QAAI,UAAU,SAAS,cAAc,MAAM;AAC3C,YAAQ,aAAa,QAAQ,SAAS;AACtC,YAAQ,OAAO;AAGf,QAAI,mBAAmB,KAAK,WAAW,aAAa;AACpD,QAAI,cAAc,SAAS,cAAc,MAAM;AAC/C,gBAAY,aAAa,QAAQ,cAAc;AAC/C,gBAAY,UAAU,IAAI,gBAAgB,gBAAgB;AAC1D,gBAAY,YAAY,KAAK,WACvB,8CACA;AAEN,QAAI,KAAK,WAAY,QAAO,UAAU,IAAI,aAAa;AAAA,QAClD,QAAO,UAAU,OAAO,aAAa;AAE1C,WAAO,YAAY,WAAW;AAC9B,WAAO,YAAY,KAAK;AACxB,WAAO,YAAY,IAAI;AACvB,WAAO,YAAY,GAAG;AACtB,WAAO,YAAY,WAAW;AAE9B,QAAI,WAAW;AAEf,QAAI,KAAK,YAAY,aAAa,KAAK,YAAY;AAC/C,aAAO,aAAa,QAAQ,QAAQ;AAEpC,UAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,YAAM,aAAa,UAAU,QAAQ;AACrC,YAAM,aAAa,aAAa,KAAK,SAAS;AAC9C,YAAM,aAAa,UAAU,KAAK,MAAM;AAExC,YAAM,YAAY,MAAM;AACxB,YAAM,YAAY,OAAO;AAEzB,WAAK,QAAQ;AACb,eAAS,YAAY,KAAK;AAC1B,iBAAW;AAAA,IACvB;AAEQ,UAAI,UAAK,kBAAL,mBAAoB,aAAa,gBAAe,CAAC,KAAK,YAAY;AAClE,eAAS,YAAY,KAAK,aAAa,MAAM,CAAC;AAAA,IAC1D,WAAmB,CAAC,UAAU;AAClB,eAAS,YAAY,MAAM;AAAA,IACvC;AAEQ,QAAK,CAAC,KAAK,YAAY,KAAK,YAAY,SAAW,KAAK,YAAY,cAAc,KAAK,YAAa;AAChG,eAAS,YAAY,OAAO;AAAA,IACxC;AAEQ,SAAK,SAAS;AACd,SAAK,UAAU;AAEf,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,SAAK,oBAAoB,gBAAgB,KAAK,eAAe,EAAE,UAAU,OAAO;AAEhF,SAAK,iBAAiB,aAAa,KAAK,YAAY;AACpD,SAAK,iBAAiB,wBAAwB,KAAK,kBAAkB;AAGrE,UAAM,YAAY,MAAM,cAAc,MAAM,KAAK,iBAAiB;AAElE,UAAM,YAAY,MAAM,cAAc,MAAM,KAAK,iBAAiB;AAElE,UAAM,YAAY,MAAM,YAAY,MAAM,KAAK,iBAAiB;AAChE,UAAM,YAAY,MAAM,SAAS,MAAM,KAAK,YAAY;AAExD,QAAI,KAAK,aAAa,cAAc,GAAG;AACnC,YAAM,YAAY,MAAM,SAAS,MAAM,sBAAK,4CAAoB;AAAA,IAC5E;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqEI,aAAa,QAAQ;AACjB,QAAI,eAAe,SAAS,cAAc,MAAM;AAChD,iBAAa,aAAa,QAAQ,OAAO;AACzC,iBAAa,aAAa,QAAQ,eAAe;AAEjD,QAAI,aAAa,SAAS,cAAc,MAAM;AAC9C,eAAW,aAAa,QAAQ,KAAK;AACrC,eAAW,aAAa,QAAQ,aAAa;AAE7C,QAAI,UAAU,SAAS,cAAc,aAAa;AAClD,YAAQ,aAAa,WAAW,KAAK,mBAAmB,IAAI,CAAC;AAC7D,YAAQ,aAAa,aAAa,OAAO;AACzC,YAAQ,aAAa,UAAU,KAAK,UAAU,GAAG;AAEjD,YAAQ,YAAY,YAAY;AAChC,YAAQ,YAAY,UAAU;AAC9B,YAAQ,YAAY,MAAM;AAE1B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EA6BI,cAAc;;AACV,SAAK,WAAW;AAChB,QAAI,KAAK,YAAY;AACjB,iBAAK,UAAL,mBAAY;AACZ,WAAK,UAAU,IAAI,kBAAkB;AACrC,WAAK,OAAO,UAAU,IAAI,kBAAkB;AAAA,IACxD;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAKI,cAAc;;AACV,SAAK,WAAW;AAChB,QAAI,KAAK,YAAY;AACjB,iBAAK,UAAL,mBAAY;AACZ,WAAK,UAAU,OAAO,kBAAkB;AACxC,WAAK,OAAO,UAAU,OAAO,kBAAkB;AAAA,IAC3D;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,cAAc,GAAG;AACb,QAAI,KAAK,YAAY;AACjB,UAAI,kBAAkB,KAAK,QAAQ,iBAAiB,EAAE,SAAS,MAAM,EAAE,CAAC;AACxE,UAAI,CAAC,gBAAgB,aAAa,QAAQ,GAAG;AACzC,wBAAgB,aAAa,UAAU,EAAE;AAAA,MACzD,OAAmB;AACH,YAAI,SAAS,EAAE,OAAQ,iBAAgB,gBAAgB,QAAQ;AAAA,MAC/E;AAAA,IACA;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAKI,oBAAoB;AAChB,QAAI,KAAK,YAAY;AACjB,UAAI,kBAAkB,KAAK,QAAQ,iBAAiB,EAAE,SAAS,MAAM,EAAE,CAAC;AACxE,UAAI,gBAAgB,aAAa,QAAQ,GAAG;AACxC,wBAAgB,gBAAgB,QAAQ;AAAA,MACxD;AAAA,IACA;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,QAAI,KAAK,YAAY;AACjB,UAAI,kBAAkB,KAAK,QAAQ,iBAAiB,EAAE,SAAS,MAAM,EAAE,CAAC;AACxE,UAAI,CAAC,gBAAgB,aAAa,QAAQ,GAAG;AACzC,wBAAgB,aAAa,UAAU,EAAE;AAAA,MACzD;AAAA,IACA;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAKI,mBAAmB;;AACf,SAAK,oBAAoB,aAAa,KAAK,YAAY;AACvD,SAAK,oBAAoB,wBAAwB,KAAK,kBAAkB;AAExE,UAAM,eAAe,MAAM,cAAc,MAAM,KAAK,iBAAiB;AACrE,UAAM,eAAe,MAAM,cAAc,MAAM,KAAK,iBAAiB;AACrE,UAAM,eAAe,MAAM,YAAY,MAAM,KAAK,iBAAiB;AACnE,UAAM,eAAe,MAAM,SAAS,MAAM,KAAK,YAAY;AAE3D,eAAK,sBAAL;AAAA,EACR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,mBAAmB,SAAS;AACxB,QAAI,OAAO;AACX,aAAS,QAAQ,QAAQ,YAAY;AACjC,UAAI,KAAK,aAAa,KAAK,WAAW;AAClC,gBAAQ,KAAK;AAAA,MAC7B;AAAA,IACA;AACQ,WAAO,KAAK,KAAM;AAAA,EAC1B;AAcA;AAjee;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA4dX,yBAAoB,WAAG;AACnB,OAAK;AAAA,IACH,IAAI,YAAY,KAAK,aAAa,EAAE,QAAQ,KAAK,uBAAuB,UAAU,MAAM,SAAS,KAAM,CAAA;AAAA,EACxG;AACT;AClgBA,SAAS,OAAO,iBAAiB,QAAQ;"}
@@ -1372,7 +1372,7 @@ class Routerx extends WJElement {
1372
1372
  const parser = new DOMParser();
1373
1373
  const htmlDocument = parser.parseFromString(htmlString, "text/html");
1374
1374
  const rootElement = htmlDocument.querySelector("wje-router");
1375
- const routes = this.data ? this.data : this.parseElement(rootElement).root;
1375
+ const routes = this.parseElement(rootElement).root;
1376
1376
  this.router = new Router2({
1377
1377
  outlet: this.outlet || "wje-router-outlet",
1378
1378
  log: false,