wj-elements 0.3.7 → 0.4.0

package/dist/wje-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-element.js","sources":["../packages/wje-element/element.js"],"sourcesContent":["import { UniversalService } from '../utils/universal-service.js';\nimport { Permissions } from '../utils/permissions.js';\nimport { WjElementUtils } from '../utils/element-utils.js';\nimport { event } from '../utils/event.js';\nimport { defaultStoreActions, store } from '../wje-store/store.js';\n\nconst template = document.createElement('template');\ntemplate.innerHTML = ``;\n\nexport default class WJElement extends HTMLElement {\n\t#drawingStatus;\n\t#isAttached;\n\t#isRendering;\n\t#originalVisibility;\n\t#pristine;\n\n\t/**\n\t * Initializes a new instance of the WJElement class.\n\t */\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// Initialize ElementInternals when supported.\n\t\tif (typeof this.attachInternals === 'function') {\n\t\t\tthis.internals = this.attachInternals();\n\t\t}\n\n\t\tthis.#isAttached = false;\n\t\tthis.service = new UniversalService({\n\t\t\tstore: store,\n\t\t});\n\n\t\t// definujeme vsetky zavislosti.\n\t\t// Do zavislosti patria len komponenty, ktore su zavisle od ktoreho je zavisly tento komponent\n\t\tthis.defineDependencies();\n\n\t\tthis.#isRendering = false;\n\t\tthis._dependencies = {};\n\n\t\t/**\n\t\t * @typedef {object} DrawingStatuses\n\t\t * @property {number} CREATED - The component has been created.\n\t\t * @property {number} ATTACHED - The component has been attached to the DOM.\n\t\t * @property {number} BEGINING - The component is beginning to draw.\n\t\t * @property {number} START - The component has started drawing.\n\t\t * @property {number} DRAWING - The component is drawing.\n\t\t * @property {number} DONE - The component has finished drawing.\n\t\t * @property {number} DISCONNECTED - The component has been disconnected from the DOM.\n\t\t */\n\n\t\t/**\n\t\t * WJElement is a base class for custom web components with managed lifecycle, attribute/property sync,\n\t\t * permission-based visibility, and extensibility hooks.\n\t\t * @property {boolean} isAttached - True if the component is currently attached to the DOM.\n\t\t * @property {DrawingStatuses} drawingStatuses - Enum of possible drawing states.\n\t\t * @property {number} drawingStatus - Current drawing status (see drawingStatuses).\n\t\t * @property {boolean} _pristine - True if the component has not been updated since last render.\n\t\t * @property {boolean} isRendering - True if a render is currently in progress.\n\t\t * @property {number|null} rafId - ID of the scheduled animation frame for rendering, or null.\n\t\t * @property {string|null} originalVisibility - Stores the original CSS visibility before rendering.\n\t\t * @property {object} params - Stores the current attributes/properties for rendering.\n\t\t * @property {Promise<void>} updateComplete - Promise resolved when the current update/render is complete.\n\t\t * @property {string[]} permission - List of required permissions (from 'permission' attribute).\n\t\t * @property {boolean} isPermissionCheck - Whether permission checking is enabled (from 'permission-check' attribute).\n\t\t * @property {boolean} noShow - Whether the element should be hidden (from 'no-show' attribute).\n\t\t * @property {string|undefined} isShadowRoot - Value of the 'shadow' attribute, if present.\n\t\t * @property {boolean} hasShadowRoot - True if the 'shadow' attribute is present.\n\t\t * @property {string} shadowType - Type of shadow root ('open' by default).\n\t\t * @property {object} store - Reference to the global store instance.\n\t\t * @property {object} defaultStoreActions - Default store actions for arrays and objects.\n\t\t * @property {string[]|undefined} removeClassAfterConnect - Classes to remove after connect (from 'remove-class-after-connect' attribute).\n\t\t * @property {object} dependencies - Registered component dependencies.\n\t\t * @property {HTMLElement|ShadowRoot} context - The rendering context (shadow root or element itself).\n\t\t */\n\t\tthis.drawingStatuses = {\n\t\t\tCREATED: 0,\n\t\t\tATTACHED: 1,\n\t\t\tBEGINING: 2,\n\t\t\tSTART: 3,\n\t\t\tDRAWING: 4,\n\t\t\tDONE: 5,\n\t\t\tDISCONNECTED: 6,\n\t\t};\n\n\t\tthis.#drawingStatus = this.drawingStatuses.CREATED;\n\n\t\tthis.#pristine = true;\n\t\tthis.#isRendering = false;\n\t\tthis.rafId = null;\n\t\tthis.#originalVisibility = null;\n\t\tthis.params = {};\n\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\t}\n\n\tget drawingStatus() {\n\t\treturn this.#drawingStatus;\n\t}\n\n\t/**\n\t * Sets the value of the 'permission' attribute.\n\t * @param {string[]} value The value to set for the 'permission' attribute.\n\t */\n\tset permission(value) {\n\t\tthis.setAttribute('permission', value.join(','));\n\t}\n\n\t/**\n\t * Gets the value of the 'permission-check' attribute.\n\t * @returns {string[]} The value of the 'permission' attribute.\n\t */\n\tget permission() {\n\t\treturn this.getAttribute('permission')?.split(',') || [];\n\t}\n\n\t/**\n\t * Sets the 'permission-check' attribute.\n\t * @param {boolean} value The value to set for the 'permission-check' attribute.\n\t */\n\tset isPermissionCheck(value) {\n\t\tif (value) this.setAttribute('permission-check', '');\n\t\telse this.removeAttribute('permission-check');\n\t}\n\n\t/**\n\t * Checks if the 'permission-check' attribute is present.\n\t * @returns {boolean} True if the 'permission-check' attribute is present.\n\t */\n\tget isPermissionCheck() {\n\t\treturn this.hasAttribute('permission-check');\n\t}\n\n\tset noShow(value) {\n\t\tif (value) this.setAttribute('no-show', '');\n\t\telse this.removeAttribute('no-show');\n\t}\n\n\t/**\n\t * Checks if the 'show' attribute is present.\n\t * @returns {boolean} True if the 'show' attribute is present.\n\t */\n\tget noShow() {\n\t\treturn this.hasAttribute('no-show');\n\t}\n\n\t/**\n\t * Sets the 'shadow' attribute.\n\t * @param {string} value The value to set for the 'shadow' attribute.\n\t */\n\tset isShadowRoot(value) {\n\t\treturn this.setAttribute('shadow', value);\n\t}\n\n\tget isShadowRoot() {\n\t\treturn this.getAttribute('shadow');\n\t}\n\n\t/**\n\t * Checks if the 'shadow' attribute is present.\n\t * @returns {boolean} True if the 'shadow' attribute is present.\n\t */\n\tget hasShadowRoot() {\n\t\treturn this.hasAttribute('shadow');\n\t}\n\n\t/**\n\t * Gets the value of the 'shadow' attribute or 'open' if not set.\n\t * @returns {string} The value of the 'shadow' attribute or 'open'.\n\t */\n\tget shadowType() {\n\t\treturn this.getAttribute('shadow') || 'open';\n\t}\n\n\t/**\n\t * Gets the rendering context, either the shadow root or the component itself.\n\t * @returns The rendering context.\n\t */\n\tget context() {\n\t\tif (this.hasShadowRoot) {\n\t\t\treturn this.shadowRoot;\n\t\t} else {\n\t\t\treturn this;\n\t\t}\n\t}\n\n\t/**\n\t * Gets the store instance.\n\t * @returns {object} The store instance.\n\t */\n\tget store() {\n\t\treturn store;\n\t}\n\n\t/**\n\t * Returns ElementInternals when available.\n\t * @returns {ElementInternals|null}\n\t */\n\tgetInternals() {\n\t\treturn this.internals || null;\n\t}\n\n\t/**\n\t * Sets ARIA state via attributes.\n\t * Accepts camelCase keys without the \"aria\" prefix, plus \"role\".\n\t * Example: setAriaState({ role: 'tab', selected: true, controls: 'panel-1' })\n\t * @param {object} state\n\t */\n\tsetAriaState(state = {}) {\n\t\tif (!state || typeof state !== 'object') return;\n\n\t\tObject.entries(state).forEach(([key, value]) => {\n\t\t\tif (value === undefined || value === null) return;\n\n\t\t\tif (key === 'role') {\n\t\t\t\tthis.setAttribute('role', value);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tlet attr;\n\t\t\tif (key === 'labelledBy') attr = 'aria-labelledby';\n\t\t\telse if (key === 'describedBy') attr = 'aria-describedby';\n\t\t\telse attr = `aria-${key.replace(/([A-Z])/g, '-$1').toLowerCase()}`;\n\t\t\t// Convert booleans to \"true\"/\"false\" strings for aria attributes.\n\t\t\tconst normalized = (typeof value === 'boolean') ? (value ? 'true' : 'false') : value;\n\t\t\tthis.setAttribute(attr, normalized);\n\t\t});\n\t}\n\n\t/**\n\t * @typedef {object} ArrayActions\n\t * @property {Function} addAction - Adds an item to the array.\n\t * @property {Function} deleteAction - Deletes an item from the array.\n\t * @property {Function} loadAction - Loads an array.\n\t * @property {Function} updateAction - Updates an item in the array.\n\t * @property {Function} addManyAction - Adds many items to the array.\n\t */\n\n\t/**\n\t * @typedef {object} ObjectActions\n\t * @property {Function} addAction - Replace old object with new object\n\t * @property {Function} deleteAction - Delete item based on key\n\t * @property {Function} updateAction - Update item based on key\n\t */\n\n\t/**\n\t * Gets the default store actions.\n\t * @returns The default store actions for arrays and objects.\n\t */\n\tget defaultStoreActions() {\n\t\treturn defaultStoreActions;\n\t}\n\n\t/**\n\t * Gets the classes to be removed after the component is connected.\n\t * @returns An array of class names to remove.\n\t */\n\tget removeClassAfterConnect() {\n\t\treturn this.getAttribute('remove-class-after-connect')?.split(' ');\n\t}\n\n\t/**\n\t * Sets the component dependencies.\n\t * @param value The dependencies to set.\n\t */\n\tset dependencies(value) {\n\t\tthis._dependencies = value;\n\t}\n\n\t/**\n\t * Gets the component dependencies.\n\t * @returns The component dependencies.\n\t */\n\tget dependencies() {\n\t\treturn this._dependencies;\n\t}\n\n\t/**\n\t * Processes and combines two templates into one.\n\t * @param pTemplate The primary template.\n\t * @param inputTemplate The secondary template.\n\t * @returns The combined template.\n\t */\n\tstatic processTemplates = (pTemplate, inputTemplate) => {\n\t\tconst newTemplate = document.createElement('template');\n\t\tnewTemplate.innerHTML = [inputTemplate.innerHTML, pTemplate?.innerHTML || ''].join('');\n\t\treturn newTemplate;\n\t};\n\n\t/**\n\t * Defines a custom element if not already defined.\n\t * @param name The name of the custom element.\n\t * @param [elementConstructor] The constructor for the custom element.\n\t * @param [options] Additional options for defining the element.\n\t */\n\tstatic define(name, elementConstructor = this, options = {}) {\n\t\tconst definedElement = customElements.get(name);\n\n\t\tif (!definedElement) {\n\t\t\tcustomElements.define(name, elementConstructor, options);\n\t\t}\n\t}\n\n\t/**\n\t * Defines component dependencies by registering custom elements.\n\t */\n\tdefineDependencies() {\n\t\tif (this.dependencies) {\n\t\t\tObject.entries(this.dependencies).forEach(([name, component]) => WJElement.define(name, component));\n\t\t}\n\t}\n\n\t/**\n\t * Hook for extending behavior before drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tbeforeDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior before drawing\n\t}\n\n\t/**\n\t * Renders the component within the provided context.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj\n\t * @param params Additional parameters or attributes for rendering the component.\n\t * @returns This implementation does not render anything and returns `null`.\n\t * @description\n\t * The `draw` method is responsible for rendering the component's content.\n\t * Override this method in subclasses to define custom rendering logic.\n\t * @example\n\t * class MyComponent extends WJElement {\n\t *   draw(context, appStoreObj, params) {\n\t *     const div = document.createElement('div');\n\t *     div.textContent = 'Hello, world!';\n\t *     context.appendChild(div);\n\t *   }\n\t * }\n\t */\n\tdraw(context, appStoreObj, params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Hook for extending behavior after drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tafterDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior after drawing\n\t}\n\n\t/**\n\t * Optional hook: return skeleton markup used while async draw is in progress.\n\t * Prefer declarative skeleton via `<div slot=\"skeleton\">...</div>`.\n\t * Return: string | Node | DocumentFragment | null | Promise of those.\n\t */\n\trenderSkeleton(params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Retrieves the delay duration for the skeleton display, determining the value based on a hierarchy of overrides and defaults.\n\t * The method prioritizes in the following order:\n\t * 1. A finite number set as the `_wjSkeletonDelayOverride` property.\n\t * 2. A valid numeric value from the `skeleton-delay` attribute.\n\t * 3. The `skeletonDelayMs` property, if defined with a finite number.\n\t * 4. A default value of 150 if none of the above are set.\n\t * @returns {number} The delay in milliseconds before the skeleton is displayed.\n\t */\n\tget skeletonDelay() {\n\t\tif (Number.isFinite(this._wjSkeletonDelayOverride)) return this._wjSkeletonDelayOverride;\n\n\t\tconst v = this.getAttribute('skeleton-delay');\n\t\tconst n = (v === null || v === undefined) ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\tif (Number.isFinite(this.skeletonDelayMs)) return this.skeletonDelayMs;\n\n\t\treturn 150;\n\t}\n\n\t/**\n\t * Retrieves the minimum duration for the skeleton animation.\n\t * The method checks for an internally stored finite value. If unavailable,\n\t * it retrieves the value from the 'skeleton-min-duration' attribute,\n\t * converts it to a number if possible, and uses it. If neither is valid,\n\t * a default duration of 300 is returned.\n\t * @returns {number} The minimum duration for the skeleton animation in milliseconds.\n\t */\n\tget skeletonMinDuration() {\n\t\tif (Number.isFinite(this._wjSkeletonMinDurationOverride)) return this._wjSkeletonMinDurationOverride;\n\n\t\tconst v = this.getAttribute('skeleton-min-duration');\n\t\tconst n = (v === null || v === undefined) ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\treturn 300;\n\t}\n\n\t/**\n\t * Sets the minimum duration for the skeleton state. If the provided value is null, undefined, or an empty string,\n\t * the override for the minimum duration is removed.\n\t * @param {string|number|null|undefined} value The minimum duration to be set for the skeleton state. It can be a numeric value, string representation of a number, or null/undefined to reset the value.\n\t */\n\tset skeletonMinDuration(value) {\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonMinDurationOverride;\n\t\t\tthis.removeAttribute('skeleton-min-duration');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonMinDurationOverride = n;\n\t\t\tthis.setAttribute('skeleton-min-duration', String(n));\n\t\t}\n\t}\n\n\t/**\n\t * Sets or removes the 'skeleton' attribute based on the provided value.\n\t * @param {boolean} value A boolean value indicating whether to set ('true') or remove ('false') the 'skeleton' attribute.\n\t */\n\tset skeleton(value) {\n\t\tif (value) this.setAttribute('skeleton', '');\n\t\telse this.removeAttribute('skeleton');\n\t}\n\n\t/**\n\t * Checks if the 'skeleton' attribute is present on the element.\n\t * @returns {boolean} True if the 'skeleton' attribute exists, false otherwise.\n\t */\n\tget skeleton() {\n\t\treturn this.hasAttribute('skeleton');\n\t}\n\n\t/**\n\t * Sets the delay for the skeleton loading indicator.\n\t * @param {string|number|null|undefined} value The delay value to be set. Accepts a numerical value,\n\t * a string that can be converted to a number, null, or undefined.\n\t * If null or undefined is provided, the skeleton delay will be cleared.\n\t */\n\tset skeletonDelay(value) {\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonDelayOverride;\n\t\t\tthis.removeAttribute('skeleton-delay');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonDelayOverride = n;\n\t\t\tthis.setAttribute('skeleton-delay', String(n));\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the delay value used for skeleton loading.\n\t * @returns {number} The delay value for the skeleton loader.\n\t */\n\tget skeletonDelayValue() {\n\t\treturn this.skeletonDelay;\n\t}\n\n\t/**\n\t * Lifecycle method invoked when the component is connected to the DOM.\n\t */\n\tconnectedCallback() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.#originalVisibility = this.#originalVisibility ?? this.style.visibility;\n\t\t\tthis.style.visibility = 'hidden';\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.ATTACHED;\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\t/**\n\t * Initializes the component, setting up attributes and rendering.\n\t * @param [force] Whether to force initialization.\n\t * @returns A promise that resolves when initialization is complete.\n\t */\n\tinitWjElement = (force = false) => {\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tthis.#drawingStatus = this.drawingStatuses.BEGINING;\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\tif (!this.shadowRoot) this.attachShadow({ mode: this.shadowType || 'open', delegatesFocus: true });\n\t\t\t}\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.START;\n\n\t\t\t// Adopt component + skeleton styles BEFORE display, so skeleton is visible in Shadow DOM.\n\t\t\tconst sheet = new CSSStyleSheet();\n\t\t\tsheet.replaceSync(this.constructor.cssStyleSheet);\n\n\t\t\tif (this.shadowRoot) {\n\t\t\t\tconst existing = this.shadowRoot.adoptedStyleSheets || [];\n\t\t\t\tconst next = [...existing];\n\n\t\t\t\tif (!next.includes(sheet)) next.push(sheet);\n\n\t\t\t\tthis.shadowRoot.adoptedStyleSheets = next;\n\t\t\t}\n\n\t\t\tawait this.display(force);\n\n\t\t\tresolve();\n\t\t});\n\t};\n\n\t/**\n\t * Sets up attributes and event listeners for the component.\n\t * This method retrieves all custom events defined for the component\n\t * and adds event listeners for each of them. When an event is triggered,\n\t * it calls the corresponding method on the host element.\n\t */\n\tsetupAttributes() {\n\t\t// Keď neaký element si zadefinuje funkciu \"setupAttributes\" tak sa obsah tejto funkcie nezavolá\n\n\t\tlet allEvents = WjElementUtils.getEvents(this);\n\t\tallEvents.forEach((customEvent, domEvent) => {\n\t\t\tthis.addEventListener(domEvent, (e) => {\n\t\t\t\tthis.getRootNode().host[customEvent]?.();\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Hook for extending behavior before disconnecting the component.\n\t */\n\tbeforeDisconnect() {\n\t\t// Hook for extending behavior before disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior after disconnecting the component.\n\t */\n\tafterDisconnect() {\n\t\t// Hook for extending behavior after disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior before redrawing the component.\n\t */\n\tbeforeRedraw() {\n\t\t// Hook for extending behavior before redrawing\n\t}\n\n\t/**\n\t * Cleans up resources and event listeners for the component.\n\t */\n\tcomponentCleanup() {\n\t\t// Hook for cleaning up the component\n\t}\n\n\t/**\n\t * Lifecycle method invoked when the component is disconnected from the DOM.\n\t */\n\tdisconnectedCallback() {\n\t\tif (this.#isAttached) {\n\t\t\tthis.beforeDisconnect?.();\n\t\t\tthis.context.innerHTML = '';\n\t\t\tthis.afterDisconnect?.();\n\t\t\tthis.#isAttached = false;\n\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\tthis.#originalVisibility = null;\n\t\t}\n\n\t\tif (this.#isRendering) {\n\t\t\tthis.stopRenderLoop();\n\t\t}\n\n\t\tthis.#drawingStatus = this.drawingStatuses.DISCONNECTED;\n\n\t\tthis.componentCleanup();\n\t}\n\n\t/**\n\t * Enqueues an update for the component.\n\t * This method processes the current render promise and then refreshes the component.\n\t */\n\t#enqueueUpdate() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t}\n\t}\n\n\t/**\n\t * Lifecycle method invoked when an observed attribute changes.\n\t * @param name The name of the attribute that changed.\n\t * @param old The old value of the attribute.\n\t * @param newName The new value of the attribute.\n\t */\n\tattributeChangedCallback(name, old, newName) {\n\t\tif (old !== newName) {\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\t/**\n\t * Triggers a refresh operation by initializing the update lifecycle and setting up promises\n\t * to track its completion or failure status. Marks the instance as not pristine and queues\n\t * an update.\n\t * @returns {void} Does not return a value.\n\t */\n\trefresh() {\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\n\t\tthis.#pristine = false;\n\t\tthis.#enqueueUpdate();\n\t}\n\n\t/**\n\t * Refreshes the component by reinitializing it if it is in a drawing state.\n\t * This method checks if the component's drawing status is at least in the START state.\n\t * If so, it performs the following steps:\n\t * 1. Calls the `beforeRedraw` hook if defined.\n\t * 2. Calls the `beforeDisconnect` hook if defined.\n\t * 3. Refreshes the update promise to manage the rendering lifecycle.\n\t * 4. Calls the `afterDisconnect` hook if defined.\n\t * 5. Reinitializes the component by calling `initWjElement` with `true` to force initialization.\n\t * If the component is not in a drawing state, it simply returns a resolved promise.\n\t */\n\tasync #refresh() {\n\t\tif (this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t\treturn; // Skip if async render is still processing\n\t\t}\n\n\t\tif (!this.#pristine) {\n\t\t\tthis.#pristine = true;\n\t\t\tthis.#isRendering = true;\n\n\t\t\tif (this.#isAttached) {\n\t\t\t\tthis.beforeRedraw?.();\n\t\t\t\tthis.beforeDisconnect?.();\n\t\t\t\tthis.afterDisconnect?.();\n\t\t\t} else {\n\t\t\t\tthis.stopRenderLoop();\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tawait this.initWjElement(true);\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Render error:', error);\n\t\t\t} finally {\n\t\t\t\tthis.#isRendering = false;\n\n\t\t\t\tif (!this.#pristine) {\n\t\t\t\t\tthis.#pristine = false;\n\t\t\t\t\tthis.#enqueueUpdate();\n\t\t\t\t} else {\n\t\t\t\t\tthis.finisPromise();\n\t\t\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Stops the current render loop if it is running by canceling the requestAnimationFrame.\n\t * @returns {void} This method does not return a value.\n\t */\n\tstopRenderLoop() {\n\t\tif (this.rafId) {\n\t\t\tcancelAnimationFrame(this.rafId);\n\t\t\tthis.rafId = null;\n\t\t}\n\t}\n\n\t/**\n\t * Displays the component's content, optionally forcing a re-render.\n\t * @param [force] Whether to force a re-render.\n\t * @returns A promise that resolves when the display is complete.\n\t */\n\tdisplay(force = false) {\n\t\tthis.template = this.constructor.customTemplate || document.createElement('template');\n\n\t\t// Build the next context offscreen\n\t\tconst nextContext = document.createDocumentFragment();\n\t\tnextContext.append(this.template.content.cloneNode(true));\n\n\t\t// Check permission/noShow before DOM swap\n\t\tif (this.noShow || (this.isPermissionCheck && !Permissions.isPermissionFulfilled(this.permission))) {\n\t\t\tthis.remove();\n\t\t\treturn Promise.resolve();\n\t\t}\n\n\t\tlet skeletonTimer = null;\n\t\tlet renderFinished = false;\n\t\tlet skeletonShownAt = null;\n\n\t\tconst clearSkeletonTimer = () => {\n\t\t\tif (skeletonTimer) {\n\t\t\t\tclearTimeout(skeletonTimer);\n\t\t\t\tskeletonTimer = null;\n\t\t\t}\n\t\t};\n\n\t\tconst buildSkeletonFragment = async () => {\n\t\t\tconst slotted = this.querySelector('[slot=\"skeleton\"]');\n\n\t\t\tif (slotted) {\n\t\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\t\tconst slot = document.createElement('slot');\n\t\t\t\t\tslot.name = 'skeleton';\n\t\t\t\t\tfrag.append(slot);\n\t\t\t\t\treturn frag;\n\t\t\t\t}\n\n\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\tfrag.append(slotted.cloneNode(true));\n\t\t\t\treturn frag;\n\t\t\t}\n\n\t\t\tconst frag = document.createDocumentFragment();\n\n\t\t\tlet skel = this.renderSkeleton?.(WjElementUtils.getAttributes(this));\n\n\t\t\tif (skel instanceof Promise || skel?.constructor?.name === 'Promise') {\n\t\t\t\tskel = await skel;\n\t\t\t}\n\n\t\t\tif (skel === null || skel === undefined) return null;\n\n\t\t\tlet node;\n\n\t\t\tif (skel instanceof HTMLElement || skel instanceof DocumentFragment) {\n\t\t\t\tnode = skel;\n\t\t\t} else {\n\t\t\t\tconst t = document.createElement('template');\n\t\t\t\tt.innerHTML = skel;\n\t\t\t\tnode = t.content.cloneNode(true);\n\t\t\t}\n\t\t\tfrag.append(node);\n\t\t\treturn frag;\n\t\t};\n\n\t\tconst showSkeleton = async () => {\n\t\t\tif (renderFinished) return;\n\t\t\tif (!this.hasAttribute('skeleton')) return;\n\n\t\t\tconst frag = await buildSkeletonFragment();\n\t\t\tif (!frag) return;\n\n\t\t\ttry {\n\t\t\t\tconst cs = getComputedStyle(this);\n\t\t\t\tif (cs.display === 'inline') this.style.display = 'block';\n\t\t\t\tif (cs.width === '0px') this.style.width = '100%';\n\t\t\t} catch (e) {\n\t\t\t\t// ignore\n\t\t\t}\n\n\t\t\t// REPLACE mode only\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\tthis.shadowRoot.replaceChildren(frag);\n\t\t\t} else {\n\t\t\t\tthis.replaceChildren(frag);\n\t\t\t}\n\n\t\t\tskeletonShownAt = performance.now();\n\n\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:show', {\n\t\t\t\tdetail: { delay: this.skeletonDelay },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}));\n\t\t\tif (this.hasAttribute('debug-skeleton')) {\n\t\t\t\tdebugger;\n\t\t\t}\n\t\t};\n\n\t\tif (this.hasAttribute('skeleton') && this.style.visibility === 'hidden') {\n\t\t\tthis.style.visibility = this.#originalVisibility ?? 'visible';\n\t\t}\n\n\t\tlet skeletonPlannedAt;\n\n\t\tif (this.hasAttribute('skeleton')) {\n\t\t\tskeletonPlannedAt = performance.now();\n\t\t\tskeletonTimer = setTimeout(() => {\n\t\t\t\tshowSkeleton();\n\t\t\t}, this.skeletonDelay);\n\t\t}\n\n\t\treturn this.#resolveRender(nextContext, { skipAfterDraw: true })\n\t\t\t.then(async () => {\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\n\t\t\t\tif (skeletonShownAt === null) {\n\t\t\t\t\tconst elapsed = skeletonPlannedAt ? (performance.now() - skeletonPlannedAt) : 0;\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:skip', {\n\t\t\t\t\t\tdetail: { reason: 'render-finished-fast', elapsedMs: elapsed, delay: this.skeletonDelay },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t} else {\n\t\t\t\t\t// Skeleton was shown: enforce minimum visible duration to avoid flashing\n\t\t\t\t\tconst now = performance.now();\n\t\t\t\t\tconst visibleFor = now - skeletonShownAt;\n\t\t\t\t\tconst remaining = this.skeletonMinDuration - visibleFor;\n\t\t\t\t\tif (remaining > 0) {\n\t\t\t\t\t\tawait new Promise((r) => setTimeout(r, remaining));\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t\tthis.shadowRoot.replaceChildren(nextContext);\n\t\t\t\t} else {\n\t\t\t\t\tthis.replaceChildren(nextContext);\n\t\t\t\t}\n\n\t\t\t\tif (skeletonShownAt !== null) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:hide', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\treason: 'render-finished',\n\t\t\t\t\t\t\tvisibleMs: Math.max(this.skeletonMinDuration, performance.now() - skeletonShownAt),\n\t\t\t\t\t\t\tdelay: this.skeletonDelay,\n\t\t\t\t\t\t\tminDuration: this.skeletonMinDuration,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\n\t\t\t\tconst liveContext = this.hasShadowRoot ? this.shadowRoot : this;\n\t\t\t\tconst _afterDraw = this.afterDraw?.(liveContext, this.store, WjElementUtils.getAttributes(this));\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t})\n\t\t\t.finally(() => {\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\t\t\t\tif (!this.#isRendering) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:hide', {\n\t\t\t\t\t\tdetail: { reason: 'finally' },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\t\t\t});\n\t}\n\n\t/**\n\t * Renders the content into the provided target context.\n\t * This method handles asynchronous rendering, processes the output from the `draw` method,\n\t * and appends the resulting content to the specified target context.\n\t * @returns {Promise<void>} A promise that resolves once the render operation is complete and the content is appended to the target context.\n\t * @param targetContext\n\t */\n\tasync render(targetContext = this.context) {\n\t\tthis.#drawingStatus = this.drawingStatuses.DRAWING;\n\n\t\tlet _draw = this.draw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\tif (_draw instanceof Promise || _draw?.constructor.name === 'Promise') {\n\t\t\t_draw = await _draw;\n\t\t}\n\n\t\tlet rend = _draw;\n\t\tlet element;\n\n\t\tif (rend instanceof HTMLElement || rend instanceof DocumentFragment) {\n\t\t\telement = rend;\n\t\t} else {\n\t\t\tlet inputTemplate = document.createElement('template');\n\t\t\tinputTemplate.innerHTML = rend;\n\t\t\telement = inputTemplate.content.cloneNode(true);\n\t\t}\n\n\t\tlet rendered = element;\n\n\t\ttargetContext.appendChild(rendered);\n\t}\n\n\t/**\n\t * Sanitizes a given name by converting it from kebab-case to camelCase.\n\t * @param {string} name The name in kebab-case format (e.g., \"example-name\").\n\t * @returns {string} The sanitized name in camelCase format (e.g., \"exampleName\").\n\t * @example\n\t * sanitizeName('example-name');\n\t * @example\n\t * sanitizeName('my-custom-component');\n\t */\n\tsanitizeName(name) {\n\t\tlet parts = name.split('-');\n\t\treturn [parts.shift(), ...parts.map((n) => n[0].toUpperCase() + n.slice(1))].join('');\n\t}\n\n\t/**\n\t * Checks if a property on an object has a getter or setter method defined.\n\t * @param {object} obj The object on which the property is defined.\n\t * @param {string} property The name of the property to check.\n\t * @returns {object} An object indicating the presence of getter and setter methods.\n\t * @property {Function|null} hasGetter The getter function if it exists, otherwise `null`.\n\t * @property {Function|null} hasSetter The setter function if it exists, otherwise `null`.\n\t * @example\n\t * const obj = {\n\t *   get name() { return 'value'; },\n\t *   set name(val) { console.log(val); }\n\t * };\n\t * checkGetterSetter(obj, 'name');\n\t * @example\n\t * const obj = { prop: 42 };\n\t * checkGetterSetter(obj, 'prop');\n\t */\n\tcheckGetterSetter(obj, property) {\n\t\tlet descriptor = Object.getOwnPropertyDescriptor(obj, property);\n\n\t\tif (descriptor) {\n\t\t\treturn {\n\t\t\t\thasGetter: typeof descriptor.get === 'function' ? descriptor.get : null,\n\t\t\t\thasSetter: typeof descriptor.set === 'function' ? descriptor.set : null,\n\t\t\t};\n\t\t}\n\n\t\tlet proto = Object.getPrototypeOf(obj);\n\t\tif (proto) {\n\t\t\treturn this.checkGetterSetter(proto, property);\n\t\t}\n\n\t\treturn { hasGetter: null, hasSetter: null };\n\t}\n\n\t/**\n\t * Sets up accessors (getter and setter) for all attributes of the current object.\n\t * This method retrieves the attribute names, sanitizes them, and dynamically defines\n\t * property accessors for each attribute using `Object.defineProperty`.\n\t * @returns {void} This method does not return any value.\n\t */\n\tsetUpAccessors() {\n\t\tlet attrs = this.getAttributeNames();\n\t\tattrs.forEach((name) => {\n\t\t\tconst sanitizedName = this.sanitizeName(name);\n\n\t\t\tconst { hasGetter, hasSetter } = this.checkGetterSetter(this, sanitizedName);\n\n\t\t\tObject.defineProperty(this, sanitizedName, {\n\t\t\t\tset: hasSetter ?? ((value) => this.setAttribute(name, value)),\n\t\t\t\tget: hasGetter ?? (() => this.getAttribute(name)),\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Resolves the rendering process of the component, using the given target context.\n\t * @param {HTMLElement|ShadowRoot|DocumentFragment} targetContext Target for rendering (defaults to this.context)\n\t * @returns A promise that resolves when rendering is complete.\n\t * @private\n\t */\n\t#resolveRender(targetContext = this.context, { skipAfterDraw = false } = {}) {\n\t\tthis.params = WjElementUtils.getAttributes(this);\n\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tconst _beforeDraw = this.beforeDraw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\tif (_beforeDraw instanceof Promise || _beforeDraw?.constructor.name === 'Promise') {\n\t\t\t\tawait _beforeDraw;\n\t\t\t}\n\n\t\t\tawait this.render(targetContext);\n\n\t\t\tif (!skipAfterDraw) {\n\t\t\t\tconst _afterDraw = this.afterDraw?.(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// RHR toto je bicykel pre slickRouter  pretože routovanie nieje vykonané pokiaľ sa nezavolá updateComplete promise,\n\t\t\t// toto bude treba rozšíriť aby sme lepšie vedeli kontrolovať vykreslovanie elementov, a flow hookov.\n\t\t\tthis.#isRendering = false;\n\t\t\tthis.#isAttached = true;\n\n\t\t\tif (this.removeClassAfterConnect) {\n\t\t\t\tthis.classList.remove(...this.removeClassAfterConnect);\n\t\t\t}\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.DONE;\n\n\t\t\tresolve();\n\t\t}).catch((e) => {\n\t\t\tconsole.error(e);\n\t\t});\n\t}\n}\n\nlet __esModule = 'true';\nexport { __esModule, Permissions, WjElementUtils, event };\n"],"names":["frag"],"mappings":"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"}
+{"version":3,"file":"wje-element.js","sources":["../packages/wje-element/element.js"],"sourcesContent":["import { UniversalService } from '../utils/universal-service.js';\nimport { Permissions } from '../utils/permissions.js';\nimport { WjElementUtils } from '../utils/element-utils.js';\nimport { event } from '../utils/event.js';\nimport { defaultStoreActions, store } from '../wje-store/store.js';\n\nconst template = document.createElement('template');\ntemplate.innerHTML = ``;\n\nexport default class WJElement extends HTMLElement {\n\t#drawingStatus;\n\t#isAttached;\n\t#isRendering;\n\t#originalVisibility;\n\t#pristine;\n\n\t/**\n\t * Initializes a new instance of the WJElement class.\n\t */\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// Initialize ElementInternals when supported.\n\t\tif (typeof this.attachInternals === 'function') {\n\t\t\tthis.internals = this.attachInternals();\n\t\t}\n\n\t\tthis.#isAttached = false;\n\t\tthis.service = new UniversalService({\n\t\t\tstore: store,\n\t\t});\n\n\t\t// definujeme vsetky zavislosti.\n\t\t// Do zavislosti patria len komponenty, ktore su zavisle od ktoreho je zavisly tento komponent\n\t\tthis.defineDependencies();\n\n\t\tthis.#isRendering = false;\n\t\tthis._dependencies = {};\n\n\t\t/**\n\t\t * @typedef {object} DrawingStatuses\n\t\t * @property {number} CREATED - The component has been created.\n\t\t * @property {number} ATTACHED - The component has been attached to the DOM.\n\t\t * @property {number} BEGINING - The component is beginning to draw.\n\t\t * @property {number} START - The component has started drawing.\n\t\t * @property {number} DRAWING - The component is drawing.\n\t\t * @property {number} DONE - The component has finished drawing.\n\t\t * @property {number} DISCONNECTED - The component has been disconnected from the DOM.\n\t\t */\n\n\t\t/**\n\t\t * WJElement is a base class for custom web components with managed lifecycle, attribute/property sync,\n\t\t * permission-based visibility, and extensibility hooks.\n\t\t * @property {boolean} isAttached - True if the component is currently attached to the DOM.\n\t\t * @property {DrawingStatuses} drawingStatuses - Enum of possible drawing states.\n\t\t * @property {number} drawingStatus - Current drawing status (see drawingStatuses).\n\t\t * @property {boolean} _pristine - True if the component has not been updated since last render.\n\t\t * @property {boolean} isRendering - True if a render is currently in progress.\n\t\t * @property {number|null} rafId - ID of the scheduled animation frame for rendering, or null.\n\t\t * @property {string|null} originalVisibility - Stores the original CSS visibility before rendering.\n\t\t * @property {object} params - Stores the current attributes/properties for rendering.\n\t\t * @property {Promise<void>} updateComplete - Promise resolved when the current update/render is complete.\n\t\t * @property {string[]} permission - List of required permissions (from 'permission' attribute).\n\t\t * @property {boolean} isPermissionCheck - Whether permission checking is enabled (from 'permission-check' attribute).\n\t\t * @property {boolean} noShow - Whether the element should be hidden (from 'no-show' attribute).\n\t\t * @property {string|undefined} isShadowRoot - Value of the 'shadow' attribute, if present.\n\t\t * @property {boolean} hasShadowRoot - True if the 'shadow' attribute is present.\n\t\t * @property {string} shadowType - Type of shadow root ('open' by default).\n\t\t * @property {object} store - Reference to the global store instance.\n\t\t * @property {object} defaultStoreActions - Default store actions for arrays and objects.\n\t\t * @property {string[]|undefined} removeClassAfterConnect - Classes to remove after connect (from 'remove-class-after-connect' attribute).\n\t\t * @property {object} dependencies - Registered component dependencies.\n\t\t * @property {HTMLElement|ShadowRoot} context - The rendering context (shadow root or element itself).\n\t\t */\n\t\tthis.drawingStatuses = {\n\t\t\tCREATED: 0,\n\t\t\tATTACHED: 1,\n\t\t\tBEGINING: 2,\n\t\t\tSTART: 3,\n\t\t\tDRAWING: 4,\n\t\t\tDONE: 5,\n\t\t\tDISCONNECTED: 6,\n\t\t};\n\n\t\tthis.#drawingStatus = this.drawingStatuses.CREATED;\n\n\t\tthis.#pristine = true;\n\t\tthis.#isRendering = false;\n\t\tthis.rafId = null;\n\t\tthis.#originalVisibility = null;\n\t\tthis.params = {};\n\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\t}\n\n\tget drawingStatus() {\n\t\treturn this.#drawingStatus;\n\t}\n\n\t/**\n\t * Sets the value of the 'permission' attribute.\n\t * @param {string[]} value The value to set for the 'permission' attribute.\n\t */\n\tset permission(value) {\n\t\tthis.setAttribute('permission', value.join(','));\n\t}\n\n\t/**\n\t * Gets the value of the 'permission-check' attribute.\n\t * @returns {string[]} The value of the 'permission' attribute.\n\t */\n\tget permission() {\n\t\treturn this.getAttribute('permission')?.split(',') || [];\n\t}\n\n\t/**\n\t * Sets the 'permission-check' attribute.\n\t * @param {boolean} value The value to set for the 'permission-check' attribute.\n\t */\n\tset isPermissionCheck(value) {\n\t\tif (value) this.setAttribute('permission-check', '');\n\t\telse this.removeAttribute('permission-check');\n\t}\n\n\t/**\n\t * Checks if the 'permission-check' attribute is present.\n\t * @returns {boolean} True if the 'permission-check' attribute is present.\n\t */\n\tget isPermissionCheck() {\n\t\treturn this.hasAttribute('permission-check');\n\t}\n\n\tset noShow(value) {\n\t\tif (value) this.setAttribute('no-show', '');\n\t\telse this.removeAttribute('no-show');\n\t}\n\n\t/**\n\t * Checks if the 'show' attribute is present.\n\t * @returns {boolean} True if the 'show' attribute is present.\n\t */\n\tget noShow() {\n\t\treturn this.hasAttribute('no-show');\n\t}\n\n\t/**\n\t * Sets the 'shadow' attribute.\n\t * @param {string} value The value to set for the 'shadow' attribute.\n\t */\n\tset isShadowRoot(value) {\n\t\treturn this.setAttribute('shadow', value);\n\t}\n\n\tget isShadowRoot() {\n\t\treturn this.getAttribute('shadow');\n\t}\n\n\t/**\n\t * Checks if the 'shadow' attribute is present.\n\t * @returns {boolean} True if the 'shadow' attribute is present.\n\t */\n\tget hasShadowRoot() {\n\t\treturn this.hasAttribute('shadow');\n\t}\n\n\t/**\n\t * Gets the value of the 'shadow' attribute or 'open' if not set.\n\t * @returns {string} The value of the 'shadow' attribute or 'open'.\n\t */\n\tget shadowType() {\n\t\treturn this.getAttribute('shadow') || 'open';\n\t}\n\n\t/**\n\t * Gets the rendering context, either the shadow root or the component itself.\n\t * @returns The rendering context.\n\t */\n\tget context() {\n\t\tif (this.hasShadowRoot) {\n\t\t\treturn this.shadowRoot;\n\t\t} else {\n\t\t\treturn this;\n\t\t}\n\t}\n\n\t/**\n\t * Gets the store instance.\n\t * @returns {object} The store instance.\n\t */\n\tget store() {\n\t\treturn store;\n\t}\n\n\t/**\n\t * Returns ElementInternals when available.\n\t * @returns {ElementInternals|null}\n\t */\n\tgetInternals() {\n\t\treturn this.internals || null;\n\t}\n\n\t/**\n\t * Sets ARIA state via attributes.\n\t * Accepts camelCase keys without the \"aria\" prefix, plus \"role\".\n\t * Example: setAriaState({ role: 'tab', selected: true, controls: 'panel-1' })\n\t * @param {object} state\n\t */\n\tsetAriaState(state = {}) {\n\t\tif (!state || typeof state !== 'object') return;\n\n\t\tObject.entries(state).forEach(([key, value]) => {\n\t\t\tif (value === undefined || value === null) return;\n\n\t\t\tif (key === 'role') {\n\t\t\t\tthis.setAttribute('role', value);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tlet attr;\n\t\t\tif (key === 'labelledBy') attr = 'aria-labelledby';\n\t\t\telse if (key === 'describedBy') attr = 'aria-describedby';\n\t\t\telse attr = `aria-${key.replace(/([A-Z])/g, '-$1').toLowerCase()}`;\n\t\t\t// Convert booleans to \"true\"/\"false\" strings for aria attributes.\n\t\t\tconst normalized = (typeof value === 'boolean') ? (value ? 'true' : 'false') : value;\n\t\t\tthis.setAttribute(attr, normalized);\n\t\t});\n\t}\n\n\t/**\n\t * @typedef {object} ArrayActions\n\t * @property {Function} addAction - Adds an item to the array.\n\t * @property {Function} deleteAction - Deletes an item from the array.\n\t * @property {Function} loadAction - Loads an array.\n\t * @property {Function} updateAction - Updates an item in the array.\n\t * @property {Function} addManyAction - Adds many items to the array.\n\t */\n\n\t/**\n\t * @typedef {object} ObjectActions\n\t * @property {Function} addAction - Replace old object with new object\n\t * @property {Function} deleteAction - Delete item based on key\n\t * @property {Function} updateAction - Update item based on key\n\t */\n\n\t/**\n\t * Gets the default store actions.\n\t * @returns The default store actions for arrays and objects.\n\t */\n\tget defaultStoreActions() {\n\t\treturn defaultStoreActions;\n\t}\n\n\t/**\n\t * Gets the classes to be removed after the component is connected.\n\t * @returns An array of class names to remove.\n\t */\n\tget removeClassAfterConnect() {\n\t\treturn this.getAttribute('remove-class-after-connect')?.split(' ');\n\t}\n\n\t/**\n\t * Sets the component dependencies.\n\t * @param value The dependencies to set.\n\t */\n\tset dependencies(value) {\n\t\tthis._dependencies = value;\n\t}\n\n\t/**\n\t * Gets the component dependencies.\n\t * @returns The component dependencies.\n\t */\n\tget dependencies() {\n\t\treturn this._dependencies;\n\t}\n\n\t/**\n\t * Processes and combines two templates into one.\n\t * @param pTemplate The primary template.\n\t * @param inputTemplate The secondary template.\n\t * @returns The combined template.\n\t */\n\tstatic processTemplates = (pTemplate, inputTemplate) => {\n\t\tconst newTemplate = document.createElement('template');\n\t\tnewTemplate.innerHTML = [inputTemplate.innerHTML, pTemplate?.innerHTML || ''].join('');\n\t\treturn newTemplate;\n\t};\n\n\t/**\n\t * Defines a custom element if not already defined.\n\t * @param name The name of the custom element.\n\t * @param [elementConstructor] The constructor for the custom element.\n\t * @param [options] Additional options for defining the element.\n\t */\n\tstatic define(name, elementConstructor = this, options = {}) {\n\t\tconst definedElement = customElements.get(name);\n\n\t\tif (!definedElement) {\n\t\t\tcustomElements.define(name, elementConstructor, options);\n\t\t}\n\t}\n\n\t/**\n\t * Defines component dependencies by registering custom elements.\n\t */\n\tdefineDependencies() {\n\t\tif (this.dependencies) {\n\t\t\tObject.entries(this.dependencies).forEach(([name, component]) => WJElement.define(name, component));\n\t\t}\n\t}\n\n\t/**\n\t * Hook for extending behavior before drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tbeforeDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior before drawing\n\t}\n\n\t/**\n\t * Renders the component within the provided context.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj\n\t * @param params Additional parameters or attributes for rendering the component.\n\t * @returns This implementation does not render anything and returns `null`.\n\t * @description\n\t * The `draw` method is responsible for rendering the component's content.\n\t * Override this method in subclasses to define custom rendering logic.\n\t * @example\n\t * class MyComponent extends WJElement {\n\t *   draw(context, appStoreObj, params) {\n\t *     const div = document.createElement('div');\n\t *     div.textContent = 'Hello, world!';\n\t *     context.appendChild(div);\n\t *   }\n\t * }\n\t */\n\tdraw(context, appStoreObj, params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Hook for extending behavior after drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tafterDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior after drawing\n\t}\n\n\t/**\n\t * Optional hook: return skeleton markup used while async draw is in progress.\n\t * Prefer declarative skeleton via `<div slot=\"skeleton\">...</div>`.\n\t * Return: string | Node | DocumentFragment | null | Promise of those.\n\t */\n\trenderSkeleton(params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Retrieves the delay duration for the skeleton display, determining the value based on a hierarchy of overrides and defaults.\n\t * The method prioritizes in the following order:\n\t * 1. A finite number set as the `_wjSkeletonDelayOverride` property.\n\t * 2. A valid numeric value from the `skeleton-delay` attribute.\n\t * 3. The `skeletonDelayMs` property, if defined with a finite number.\n\t * 4. A default value of 150 if none of the above are set.\n\t * @returns {number} The delay in milliseconds before the skeleton is displayed.\n\t */\n\tget skeletonDelay() {\n\t\tif (Number.isFinite(this._wjSkeletonDelayOverride)) return this._wjSkeletonDelayOverride;\n\n\t\tconst v = this.getAttribute('skeleton-delay');\n\t\tconst n = (v === null || v === undefined) ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\tif (Number.isFinite(this.skeletonDelayMs)) return this.skeletonDelayMs;\n\n\t\treturn 150;\n\t}\n\n\t/**\n\t * Retrieves the minimum duration for the skeleton animation.\n\t * The method checks for an internally stored finite value. If unavailable,\n\t * it retrieves the value from the 'skeleton-min-duration' attribute,\n\t * converts it to a number if possible, and uses it. If neither is valid,\n\t * a default duration of 300 is returned.\n\t * @returns {number} The minimum duration for the skeleton animation in milliseconds.\n\t */\n\tget skeletonMinDuration() {\n\t\tif (Number.isFinite(this._wjSkeletonMinDurationOverride)) return this._wjSkeletonMinDurationOverride;\n\n\t\tconst v = this.getAttribute('skeleton-min-duration');\n\t\tconst n = (v === null || v === undefined) ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\treturn 300;\n\t}\n\n\t/**\n\t * Sets the minimum duration for the skeleton state. If the provided value is null, undefined, or an empty string,\n\t * the override for the minimum duration is removed.\n\t * @param {string|number|null|undefined} value The minimum duration to be set for the skeleton state. It can be a numeric value, string representation of a number, or null/undefined to reset the value.\n\t */\n\tset skeletonMinDuration(value) {\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonMinDurationOverride;\n\t\t\tthis.removeAttribute('skeleton-min-duration');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonMinDurationOverride = n;\n\t\t\tthis.setAttribute('skeleton-min-duration', String(n));\n\t\t}\n\t}\n\n\t/**\n\t * Sets or removes the 'skeleton' attribute based on the provided value.\n\t * @param {boolean} value A boolean value indicating whether to set ('true') or remove ('false') the 'skeleton' attribute.\n\t */\n\tset skeleton(value) {\n\t\tif (value) this.setAttribute('skeleton', '');\n\t\telse this.removeAttribute('skeleton');\n\t}\n\n\t/**\n\t * Checks if the 'skeleton' attribute is present on the element.\n\t * @returns {boolean} True if the 'skeleton' attribute exists, false otherwise.\n\t */\n\tget skeleton() {\n\t\treturn this.hasAttribute('skeleton');\n\t}\n\n\t/**\n\t * Sets the delay for the skeleton loading indicator.\n\t * @param {string|number|null|undefined} value The delay value to be set. Accepts a numerical value,\n\t * a string that can be converted to a number, null, or undefined.\n\t * If null or undefined is provided, the skeleton delay will be cleared.\n\t */\n\tset skeletonDelay(value) {\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonDelayOverride;\n\t\t\tthis.removeAttribute('skeleton-delay');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonDelayOverride = n;\n\t\t\tthis.setAttribute('skeleton-delay', String(n));\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the delay value used for skeleton loading.\n\t * @returns {number} The delay value for the skeleton loader.\n\t */\n\tget skeletonDelayValue() {\n\t\treturn this.skeletonDelay;\n\t}\n\n\t/**\n\t * Lifecycle method invoked when the component is connected to the DOM.\n\t */\n\tconnectedCallback() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.#originalVisibility = this.#originalVisibility ?? this.style.visibility;\n\t\t\tthis.style.visibility = 'hidden';\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.ATTACHED;\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\t/**\n\t * Initializes the component, setting up attributes and rendering.\n\t * @param [force] Whether to force initialization.\n\t * @returns A promise that resolves when initialization is complete.\n\t */\n\tinitWjElement = (force = false) => {\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tthis.#drawingStatus = this.drawingStatuses.BEGINING;\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\tif (!this.shadowRoot) this.attachShadow({ mode: this.shadowType || 'open', delegatesFocus: true });\n\t\t\t}\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.START;\n\n\t\t\t// Adopt component + skeleton styles BEFORE display, so skeleton is visible in Shadow DOM.\n\t\t\tconst sheet = new CSSStyleSheet();\n\t\t\tsheet.replaceSync(this.constructor.cssStyleSheet);\n\n\t\t\tif (this.shadowRoot) {\n\t\t\t\tconst existing = this.shadowRoot.adoptedStyleSheets || [];\n\t\t\t\tconst next = [...existing];\n\n\t\t\t\tif (!next.includes(sheet)) next.push(sheet);\n\n\t\t\t\tthis.shadowRoot.adoptedStyleSheets = next;\n\t\t\t}\n\n\t\t\tawait this.display(force);\n\n\t\t\tresolve();\n\t\t});\n\t};\n\n\t/**\n\t * Sets up attributes and event listeners for the component.\n\t * This method retrieves all custom events defined for the component\n\t * and adds event listeners for each of them. When an event is triggered,\n\t * it calls the corresponding method on the host element.\n\t */\n\tsetupAttributes() {\n\t\t// Keď neaký element si zadefinuje funkciu \"setupAttributes\" tak sa obsah tejto funkcie nezavolá\n\n\t\tlet allEvents = WjElementUtils.getEvents(this);\n\t\tallEvents.forEach((customEvent, domEvent) => {\n\t\t\tthis.addEventListener(domEvent, (e) => {\n\t\t\t\tthis.getRootNode().host[customEvent]?.();\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Hook for extending behavior before disconnecting the component.\n\t */\n\tbeforeDisconnect() {\n\t\t// Hook for extending behavior before disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior after disconnecting the component.\n\t */\n\tafterDisconnect() {\n\t\t// Hook for extending behavior after disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior before redrawing the component.\n\t */\n\tbeforeRedraw() {\n\t\t// Hook for extending behavior before redrawing\n\t}\n\n\t/**\n\t * Cleans up resources and event listeners for the component.\n\t */\n\tcomponentCleanup() {\n\t\t// Hook for cleaning up the component\n\t}\n\n\t/**\n\t * Lifecycle method invoked when the component is disconnected from the DOM.\n\t */\n\tdisconnectedCallback() {\n\t\tif (this.#isAttached) {\n\t\t\tthis.beforeDisconnect?.();\n\t\t\tthis.context.innerHTML = '';\n\t\t\tthis.afterDisconnect?.();\n\t\t\tthis.#isAttached = false;\n\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\tthis.#originalVisibility = null;\n\t\t}\n\n\t\tif (this.#isRendering) {\n\t\t\tthis.stopRenderLoop();\n\t\t}\n\n\t\tthis.#drawingStatus = this.drawingStatuses.DISCONNECTED;\n\n\t\tthis.componentCleanup();\n\t}\n\n\t/**\n\t * Enqueues an update for the component.\n\t * This method processes the current render promise and then refreshes the component.\n\t */\n\t#enqueueUpdate() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t}\n\t}\n\n\t/**\n\t * Lifecycle method invoked when an observed attribute changes.\n\t * @param name The name of the attribute that changed.\n\t * @param old The old value of the attribute.\n\t * @param newName The new value of the attribute.\n\t */\n\tattributeChangedCallback(name, old, newName) {\n\t\tif (old !== newName) {\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\t/**\n\t * Triggers a refresh operation by initializing the update lifecycle and setting up promises\n\t * to track its completion or failure status. Marks the instance as not pristine and queues\n\t * an update.\n\t * @returns {void} Does not return a value.\n\t */\n\trefresh() {\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\n\t\tthis.#pristine = false;\n\t\tthis.#enqueueUpdate();\n\t}\n\n\t/**\n\t * Refreshes the component by reinitializing it if it is in a drawing state.\n\t * This method checks if the component's drawing status is at least in the START state.\n\t * If so, it performs the following steps:\n\t * 1. Calls the `beforeRedraw` hook if defined.\n\t * 2. Calls the `beforeDisconnect` hook if defined.\n\t * 3. Refreshes the update promise to manage the rendering lifecycle.\n\t * 4. Calls the `afterDisconnect` hook if defined.\n\t * 5. Reinitializes the component by calling `initWjElement` with `true` to force initialization.\n\t * If the component is not in a drawing state, it simply returns a resolved promise.\n\t */\n\tasync #refresh() {\n\t\tif (this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t\treturn; // Skip if async render is still processing\n\t\t}\n\n\t\tif (!this.#pristine) {\n\t\t\tthis.#pristine = true;\n\t\t\tthis.#isRendering = true;\n\n\t\t\tif (this.#isAttached) {\n\t\t\t\tthis.beforeRedraw?.();\n\t\t\t\tthis.beforeDisconnect?.();\n\t\t\t\tthis.afterDisconnect?.();\n\t\t\t} else {\n\t\t\t\tthis.stopRenderLoop();\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tawait this.initWjElement(true);\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Render error:', error);\n\t\t\t} finally {\n\t\t\t\tthis.#isRendering = false;\n\n\t\t\t\tif (!this.#pristine) {\n\t\t\t\t\tthis.#pristine = false;\n\t\t\t\t\tthis.#enqueueUpdate();\n\t\t\t\t} else {\n\t\t\t\t\tthis.finisPromise();\n\t\t\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Stops the current render loop if it is running by canceling the requestAnimationFrame.\n\t * @returns {void} This method does not return a value.\n\t */\n\tstopRenderLoop() {\n\t\tif (this.rafId) {\n\t\t\tcancelAnimationFrame(this.rafId);\n\t\t\tthis.rafId = null;\n\t\t}\n\t}\n\n\t/**\n\t * Displays the component's content, optionally forcing a re-render.\n\t * @param [force] Whether to force a re-render.\n\t * @returns A promise that resolves when the display is complete.\n\t */\n\tdisplay(force = false) {\n\t\tthis.template = this.constructor.customTemplate || document.createElement('template');\n\n\t\t// Build the next context offscreen\n\t\tconst nextContext = document.createDocumentFragment();\n\t\tnextContext.append(this.template.content.cloneNode(true));\n\n\t\t// Check permission/noShow before DOM swap\n\t\tif (this.noShow || (this.isPermissionCheck && !Permissions.isPermissionFulfilled(this.permission))) {\n\t\t\tthis.remove();\n\t\t\treturn Promise.resolve();\n\t\t}\n\n\t\tlet skeletonTimer = null;\n\t\tlet renderFinished = false;\n\t\tlet skeletonShownAt = null;\n\n\t\tconst clearSkeletonTimer = () => {\n\t\t\tif (skeletonTimer) {\n\t\t\t\tclearTimeout(skeletonTimer);\n\t\t\t\tskeletonTimer = null;\n\t\t\t}\n\t\t};\n\n\t\tconst buildSkeletonFragment = async () => {\n\t\t\tconst slotted = this.querySelector('[slot=\"skeleton\"]');\n\n\t\t\tif (slotted) {\n\t\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\t\tconst slot = document.createElement('slot');\n\t\t\t\t\tslot.name = 'skeleton';\n\t\t\t\t\tfrag.append(slot);\n\t\t\t\t\treturn frag;\n\t\t\t\t}\n\n\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\tfrag.append(slotted.cloneNode(true));\n\t\t\t\treturn frag;\n\t\t\t}\n\n\t\t\tconst frag = document.createDocumentFragment();\n\n\t\t\tlet skel = this.renderSkeleton?.(WjElementUtils.getAttributes(this));\n\n\t\t\tif (skel instanceof Promise || skel?.constructor?.name === 'Promise') {\n\t\t\t\tskel = await skel;\n\t\t\t}\n\n\t\t\tif (skel === null || skel === undefined) return null;\n\n\t\t\tlet node;\n\n\t\t\tif (skel instanceof HTMLElement || skel instanceof DocumentFragment) {\n\t\t\t\tnode = skel;\n\t\t\t} else {\n\t\t\t\tconst t = document.createElement('template');\n\t\t\t\tt.innerHTML = skel;\n\t\t\t\tnode = t.content.cloneNode(true);\n\t\t\t}\n\t\t\tfrag.append(node);\n\t\t\treturn frag;\n\t\t};\n\n\t\tconst showSkeleton = async () => {\n\t\t\tif (renderFinished) return;\n\t\t\tif (!this.hasAttribute('skeleton')) return;\n\n\t\t\tconst frag = await buildSkeletonFragment();\n\t\t\tif (!frag) return;\n\n\t\t\ttry {\n\t\t\t\tconst cs = getComputedStyle(this);\n\t\t\t\tif (cs.display === 'inline') this.style.display = 'block';\n\t\t\t\tif (cs.width === '0px') this.style.width = '100%';\n\t\t\t} catch (e) {\n\t\t\t\t// ignore\n\t\t\t}\n\n\t\t\t// REPLACE mode only\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\tthis.shadowRoot.replaceChildren(frag);\n\t\t\t} else {\n\t\t\t\tthis.replaceChildren(frag);\n\t\t\t}\n\n\t\t\tskeletonShownAt = performance.now();\n\n\t\t\tthis.dispatchEvent(new CustomEvent('wj-skeleton:show', {\n\t\t\t\tdetail: { delay: this.skeletonDelay },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}));\n\t\t\tif (this.hasAttribute('debug-skeleton')) {\n\t\t\t\tdebugger;\n\t\t\t}\n\t\t};\n\n\t\tif (this.hasAttribute('skeleton') && this.style.visibility === 'hidden') {\n\t\t\tthis.style.visibility = this.#originalVisibility ?? 'visible';\n\t\t}\n\n\t\tlet skeletonPlannedAt;\n\n\t\tif (this.hasAttribute('skeleton')) {\n\t\t\tskeletonPlannedAt = performance.now();\n\t\t\tskeletonTimer = setTimeout(() => {\n\t\t\t\tshowSkeleton();\n\t\t\t}, this.skeletonDelay);\n\t\t}\n\n\t\treturn this.#resolveRender(nextContext, { skipAfterDraw: true })\n\t\t\t.then(async () => {\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\n\t\t\t\tif (skeletonShownAt === null) {\n\t\t\t\t\tconst elapsed = skeletonPlannedAt ? (performance.now() - skeletonPlannedAt) : 0;\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj-skeleton:skip', {\n\t\t\t\t\t\tdetail: { reason: 'render-finished-fast', elapsedMs: elapsed, delay: this.skeletonDelay },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t} else {\n\t\t\t\t\t// Skeleton was shown: enforce minimum visible duration to avoid flashing\n\t\t\t\t\tconst now = performance.now();\n\t\t\t\t\tconst visibleFor = now - skeletonShownAt;\n\t\t\t\t\tconst remaining = this.skeletonMinDuration - visibleFor;\n\t\t\t\t\tif (remaining > 0) {\n\t\t\t\t\t\tawait new Promise((r) => setTimeout(r, remaining));\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t\tthis.shadowRoot.replaceChildren(nextContext);\n\t\t\t\t} else {\n\t\t\t\t\tthis.replaceChildren(nextContext);\n\t\t\t\t}\n\n\t\t\t\tif (skeletonShownAt !== null) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj-skeleton:hide', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\treason: 'render-finished',\n\t\t\t\t\t\t\tvisibleMs: Math.max(this.skeletonMinDuration, performance.now() - skeletonShownAt),\n\t\t\t\t\t\t\tdelay: this.skeletonDelay,\n\t\t\t\t\t\t\tminDuration: this.skeletonMinDuration,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\n\t\t\t\tconst liveContext = this.hasShadowRoot ? this.shadowRoot : this;\n\t\t\t\tconst _afterDraw = this.afterDraw?.(liveContext, this.store, WjElementUtils.getAttributes(this));\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t})\n\t\t\t.finally(() => {\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\t\t\t\tif (!this.#isRendering) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj-skeleton:hide', {\n\t\t\t\t\t\tdetail: { reason: 'finally' },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\t\t\t});\n\t}\n\n\t/**\n\t * Renders the content into the provided target context.\n\t * This method handles asynchronous rendering, processes the output from the `draw` method,\n\t * and appends the resulting content to the specified target context.\n\t * @returns {Promise<void>} A promise that resolves once the render operation is complete and the content is appended to the target context.\n\t * @param targetContext\n\t */\n\tasync render(targetContext = this.context) {\n\t\tthis.#drawingStatus = this.drawingStatuses.DRAWING;\n\n\t\tlet _draw = this.draw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\tif (_draw instanceof Promise || _draw?.constructor.name === 'Promise') {\n\t\t\t_draw = await _draw;\n\t\t}\n\n\t\tlet rend = _draw;\n\t\tlet element;\n\n\t\tif (rend instanceof HTMLElement || rend instanceof DocumentFragment) {\n\t\t\telement = rend;\n\t\t} else {\n\t\t\tlet inputTemplate = document.createElement('template');\n\t\t\tinputTemplate.innerHTML = rend;\n\t\t\telement = inputTemplate.content.cloneNode(true);\n\t\t}\n\n\t\tlet rendered = element;\n\n\t\ttargetContext.appendChild(rendered);\n\t}\n\n\t/**\n\t * Sanitizes a given name by converting it from kebab-case to camelCase.\n\t * @param {string} name The name in kebab-case format (e.g., \"example-name\").\n\t * @returns {string} The sanitized name in camelCase format (e.g., \"exampleName\").\n\t * @example\n\t * sanitizeName('example-name');\n\t * @example\n\t * sanitizeName('my-custom-component');\n\t */\n\tsanitizeName(name) {\n\t\tlet parts = name.split('-');\n\t\treturn [parts.shift(), ...parts.map((n) => n[0].toUpperCase() + n.slice(1))].join('');\n\t}\n\n\t/**\n\t * Checks if a property on an object has a getter or setter method defined.\n\t * @param {object} obj The object on which the property is defined.\n\t * @param {string} property The name of the property to check.\n\t * @returns {object} An object indicating the presence of getter and setter methods.\n\t * @property {Function|null} hasGetter The getter function if it exists, otherwise `null`.\n\t * @property {Function|null} hasSetter The setter function if it exists, otherwise `null`.\n\t * @example\n\t * const obj = {\n\t *   get name() { return 'value'; },\n\t *   set name(val) { console.log(val); }\n\t * };\n\t * checkGetterSetter(obj, 'name');\n\t * @example\n\t * const obj = { prop: 42 };\n\t * checkGetterSetter(obj, 'prop');\n\t */\n\tcheckGetterSetter(obj, property) {\n\t\tlet descriptor = Object.getOwnPropertyDescriptor(obj, property);\n\n\t\tif (descriptor) {\n\t\t\treturn {\n\t\t\t\thasGetter: typeof descriptor.get === 'function' ? descriptor.get : null,\n\t\t\t\thasSetter: typeof descriptor.set === 'function' ? descriptor.set : null,\n\t\t\t};\n\t\t}\n\n\t\tlet proto = Object.getPrototypeOf(obj);\n\t\tif (proto) {\n\t\t\treturn this.checkGetterSetter(proto, property);\n\t\t}\n\n\t\treturn { hasGetter: null, hasSetter: null };\n\t}\n\n\t/**\n\t * Sets up accessors (getter and setter) for all attributes of the current object.\n\t * This method retrieves the attribute names, sanitizes them, and dynamically defines\n\t * property accessors for each attribute using `Object.defineProperty`.\n\t * @returns {void} This method does not return any value.\n\t */\n\tsetUpAccessors() {\n\t\tlet attrs = this.getAttributeNames();\n\t\tattrs.forEach((name) => {\n\t\t\tconst sanitizedName = this.sanitizeName(name);\n\n\t\t\tconst { hasGetter, hasSetter } = this.checkGetterSetter(this, sanitizedName);\n\n\t\t\tObject.defineProperty(this, sanitizedName, {\n\t\t\t\tset: hasSetter ?? ((value) => this.setAttribute(name, value)),\n\t\t\t\tget: hasGetter ?? (() => this.getAttribute(name)),\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Resolves the rendering process of the component, using the given target context.\n\t * @param {HTMLElement|ShadowRoot|DocumentFragment} targetContext Target for rendering (defaults to this.context)\n\t * @returns A promise that resolves when rendering is complete.\n\t * @private\n\t */\n\t#resolveRender(targetContext = this.context, { skipAfterDraw = false } = {}) {\n\t\tthis.params = WjElementUtils.getAttributes(this);\n\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tconst _beforeDraw = this.beforeDraw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\tif (_beforeDraw instanceof Promise || _beforeDraw?.constructor.name === 'Promise') {\n\t\t\t\tawait _beforeDraw;\n\t\t\t}\n\n\t\t\tawait this.render(targetContext);\n\n\t\t\tif (!skipAfterDraw) {\n\t\t\t\tconst _afterDraw = this.afterDraw?.(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// RHR toto je bicykel pre slickRouter  pretože routovanie nieje vykonané pokiaľ sa nezavolá updateComplete promise,\n\t\t\t// toto bude treba rozšíriť aby sme lepšie vedeli kontrolovať vykreslovanie elementov, a flow hookov.\n\t\t\tthis.#isRendering = false;\n\t\t\tthis.#isAttached = true;\n\n\t\t\tif (this.removeClassAfterConnect) {\n\t\t\t\tthis.classList.remove(...this.removeClassAfterConnect);\n\t\t\t}\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.DONE;\n\n\t\t\tresolve();\n\t\t}).catch((e) => {\n\t\t\tconsole.error(e);\n\t\t});\n\t}\n}\n\nlet __esModule = 'true';\nexport { __esModule, Permissions, WjElementUtils, event };\n"],"names":["frag"],"mappings":"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"}

package/dist/wje-file-upload-item.js

@@ -5,7 +5,7 @@ import { Localizer } from "./localize.js";
 import Button from "./wje-button.js";
 import WJElement from "./wje-element.js";
 import FormatDigital from "./wje-format-digital.js";
-import { I as Icon } from "./icon-DVyMc4Wv.js";
+import { I as Icon } from "./icon-CReYMzAK.js";
 import Slider from "./wje-slider.js";
 import { event } from "./event.js";
 const styles = "/*\n[ WJ File Upload Item ]\n*/\n\n:host {\n    width: 100%;\n}\n\n.native-file-upload-item {\n    display: grid;\n    grid-template-columns: auto 1fr 1fr;\n    grid-template-rows: auto auto auto;\n    gap: 0.5rem;\n    grid-template-areas:\n        'image name actions'\n        'image size actions'\n        'progress progress progress';\n    padding: 0.5rem;\n    border-width: var(--wje-file-upload-item-border-width);\n    border-style: var(--wje-file-upload-item-border-style);\n    border-color: var(--wje-file-upload-item-border-color);\n    border-radius: var(--wje-border-radius-medium);\n}\n\n.image {\n    grid-area: image;\n    align-items: center;\n    display: flex;\n}\n\n::slotted([slot='img']) {\n    --wje-img-border-radius: var(--wje-border-radius-medium) !important;\n}\n\n.name {\n    grid-area: name;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-weight: bold;\n}\n\n.size {\n    grid-area: size;\n    display: flex;\n}\n\n.actions {\n    grid-area: actions;\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n}\n\n.file-progress {\n    grid-area: progress;\n}\n\n.file-info > span {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\nwje-slider {\n    flex-basis: 100%;\n    margin-top: 0.5rem;\n}\n\nwje-slider::part(slider) {\n    color: yellow;\n}\n\nwje-slider::part(slider)::-webkit-slider-thumb {\n    visibility: hidden;\n}\n\nwje-slider::part(slider)::-moz-range-thumb {\n    visibility: hidden;\n}\n\nwje-slider::part(slider)::-ms-thumb {\n    visibility: hidden;\n}\n\nwje-img {\n    width: 50px;\n    height: 50px;\n    display: flex;\n    align-items: center;\n    padding: 0.25rem;\n    border: 1px solid var(--wje-border-color);\n    border-radius: var(--wje-border-radius-medium);\n}\n";

package/dist/wje-icon.js

@@ -1,4 +1,4 @@
-import { I } from "./icon-DVyMc4Wv.js";
+import { I } from "./icon-CReYMzAK.js";
 export {
   I as default
 };

package/dist/wje-img-comparer.js

@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import WJElement from "./wje-element.js";
-import { I as Icon } from "./icon-DVyMc4Wv.js";
+import { I as Icon } from "./icon-CReYMzAK.js";
 function drag(container, options) {
   function move(pointerEvent) {
     const dims = container.getBoundingClientRect();

package/dist/wje-master.js

@@ -9,7 +9,7 @@ import { fetchAndParseCSS } from "./animations.js";
 import { getBasePath, setBasePath } from "./base-path.js";
 import { formatDate } from "./date.js";
 import { toSafeDate } from "./date.js";
-import { I, r, u } from "./icon-DVyMc4Wv.js";
+import { I, r, u } from "./icon-CReYMzAK.js";
 import { event } from "./event.js";
 import { default as default2 } from "./wje-accordion.js";
 import { default as default3 } from "./wje-accordion-item.js";
@@ -122,7 +122,8 @@ const skSk = {
   "wj.pagination.first": "Prvá stránka",
   "wj.pagination.prev": "Predchádzajúca",
   "wj.pagination.next": "Ďalšia",
-  "wj.pagination.last": "Posledná stránka"
+  "wj.pagination.last": "Posledná stránka",
+  "wj.select.empty": "Žiadne dáta"
 };
 Localizer.registerTranslation(skSk);
 const enGb = {
@@ -141,7 +142,8 @@ const enGb = {
   "wj.pagination.first": "First page",
   "wj.pagination.prev": "Previous",
   "wj.pagination.next": "Next",
-  "wj.pagination.last": "Last page"
+  "wj.pagination.last": "Last page",
+  "wj.select.empty": "No data"
 };
 Localizer.registerTranslation(enGb);
 const styles$1 = ".native-timeline {\n    position: relative;\n}\n\n.vertical-line {\n    position: absolute;\n    margin-left: calc(var(--wje-spacing-x-large) + 1px);\n    top: 0;\n    bottom: 0;\n    width: 1px;\n    background-color: var(--wje-color-info-3);\n}\n";

package/dist/wje-master.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-master.js","sources":["../packages/translations/sk-sk.js","../packages/translations/en-gb.js","../packages/wje-timeline/timeline.element.js","../packages/wje-timeline/timeline.js","../packages/wje-timeline-item/timeline-item.element.js","../packages/wje-timeline-item/timeline-item.js"],"sourcesContent":["import { Localizer } from '../utils/localize.js';\n\nexport const skSk = {\n    code: 'sk-sk',\n    name: 'Slovak',\n    dir: 'ltr',\n\n    welcome: 'Vitajte',\n    'wj.file.upload.button': 'Vybrať súbor',\n    'wj.file.upload.uploaded': 'Nahraných: ',\n    'wj.file.upload.from': 'z',\n    'wj.stepper.button.next': 'Ďalej',\n    'wj.stepper.button.finish': 'Dokončiť',\n    'wj.stepper.button.previous': 'Späť',\n    'wj.stepper.step': 'Krok',\n    'wj.pagination.of': 'z',\n    'wj.pagination.first': 'Prvá stránka',\n    'wj.pagination.prev': 'Predchádzajúca',\n    'wj.pagination.next': 'Ďalšia',\n    'wj.pagination.last': 'Posledná stránka',\n};\n\nLocalizer.registerTranslation(skSk);\n","import { Localizer } from '../utils/localize.js';\n\nexport const enGb = {\n    code: 'en-gb',\n    name: 'English',\n    dir: 'ltr',\n\n    welcome: 'Welcome',\n    'wj.file.upload.button': 'Browse files',\n    'wj.file.upload.uploaded': 'Uploaded: ',\n    'wj.file.upload.from': 'from',\n    'wj.stepper.button.next': 'Next',\n    'wj.stepper.button.finish': 'Finish',\n    'wj.stepper.button.previous': 'Previous',\n    'wj.stepper.step': 'Step',\n    'wj.pagination.of': 'of',\n    'wj.pagination.first': 'First page',\n    'wj.pagination.prev': 'Previous',\n    'wj.pagination.next': 'Next',\n    'wj.pagination.last': 'Last page',\n};\n\nLocalizer.registerTranslation(enGb);\n","import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Timeline` is a custom web component that represents a timeline.\n * @summary This element represents a timeline.\n * @documentation https://elements.webjet.sk/components/timeline\n * @status stable\n * @augments WJElement\n * @slot - Slot for the timeline items.\n * @csspart native - The native part of the rating component.\n * @csspart vertical-line - The vertical line part of the rating component.\n * @tag wje-timeline\n */\nexport default class Timeline extends WJElement {\n    /**\n     * Creates an instance of Timeline.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * The class name for the component.\n     */\n    className = 'Timeline';\n\n    /**\n     * Returns the CSS stylesheet for the component.\n     * @static\n     * @returns {CSSStyleSheet} The CSS stylesheet\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.syncAria();\n    }\n\n    /**\n     * Draws the component for the timeline.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        const native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-timeline');\n\n        const verticalLine = document.createElement('div');\n        verticalLine.setAttribute('part', 'vertical-line');\n        verticalLine.classList.add('vertical-line');\n\n        const slot = document.createElement('slot');\n\n        native.appendChild(verticalLine);\n        native.appendChild(slot);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Sync ARIA attributes on host.\n     */\n    syncAria() {\n        if (!this.hasAttribute('role')) {\n            this.setAriaState({ role: 'list' });\n        }\n    }\n}\n","import Timeline from './timeline.element.js';\n\nexport default Timeline;\n\nTimeline.define('wje-timeline', Timeline);\n","import { formatDate } from '../utils/date.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * The TimelineItem component.\n * @summary This element represents a timeline item.\n * @documentation https://elements.webjet.sk/components/timeline-item\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the timeline item.\n * @csspart content-container - The content container part of the timeline item.\n * @csspart default-icon - The default icon part of the timeline item.\n * @slot - Slot for the content of the timeline item.\n * @slot status - Slot for the status of the timeline item.\n * @tag wje-timeline-item\n */\nexport default class TimelineItem extends WJElement {\n    constructor() {\n        super();\n    }\n\n    /**\n     * Returns the class name of the tab.\n     * @returns {string} The class name of the tab.\n     */\n    className = 'TimelineItem';\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     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.setAttribute('relative-time', '');\n    }\n\n    /**\n     * Draws the component for the timeline item.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-timeline-item');\n\n        let contentContainer = document.createElement('div');\n        contentContainer.setAttribute('part', 'content-container');\n        contentContainer.classList.add('content-container');\n\n        let tooltip = document.createElement('wje-tooltip');\n        tooltip.setAttribute('text', this.getAttribute('tooltip') || '');\n        tooltip.setAttribute('position', 'top');\n        tooltip.setAttribute('content', formatDate(this.datetime, 'dd.MM.yyyy HH:mm'));\n\n        let relativeTime = document.createElement('wje-relative-time');\n        relativeTime.setAttribute('date', this.datetime || '');\n        relativeTime.setAttribute('format', this.getAttribute('format') || '');\n\n        tooltip.appendChild(relativeTime);\n\n        let event = document.createElement('h3');\n        event.classList.add('event');\n        event.textContent = this.getAttribute('event') || '';\n\n        // additional text content\n        let slot = document.createElement('slot');\n\n        // status slot\n        let slotStatus = document.createElement('wje-icon');\n        slotStatus.setAttribute('name', 'circle-dot');\n        slotStatus.setAttribute('filled', '');\n        slotStatus.setAttribute('part', 'default-icon');\n\n        // if status slot is present\n        if (this.querySelector('[slot=\"status\"]')) {\n            slotStatus = document.createElement('slot');\n            slotStatus.setAttribute('name', 'status');\n        }\n\n        contentContainer.appendChild(tooltip);\n        contentContainer.appendChild(event);\n        contentContainer.appendChild(slot);\n\n        native.appendChild(slotStatus);\n        native.appendChild(contentContainer);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n}\n","import TimelineItem from './timeline-item.element.js';\n\nexport default TimelineItem;\n\nTimelineItem.define('wje-timeline-item', TimelineItem);\n"],"names":["styles","event"],"mappings":"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"}
+{"version":3,"file":"wje-master.js","sources":["../packages/translations/sk-sk.js","../packages/translations/en-gb.js","../packages/wje-timeline/timeline.element.js","../packages/wje-timeline/timeline.js","../packages/wje-timeline-item/timeline-item.element.js","../packages/wje-timeline-item/timeline-item.js"],"sourcesContent":["import { Localizer } from '../utils/localize.js';\n\nexport const skSk = {\n    code: 'sk-sk',\n    name: 'Slovak',\n    dir: 'ltr',\n\n    welcome: 'Vitajte',\n    'wj.file.upload.button': 'Vybrať súbor',\n    'wj.file.upload.uploaded': 'Nahraných: ',\n    'wj.file.upload.from': 'z',\n    'wj.stepper.button.next': 'Ďalej',\n    'wj.stepper.button.finish': 'Dokončiť',\n    'wj.stepper.button.previous': 'Späť',\n    'wj.stepper.step': 'Krok',\n    'wj.pagination.of': 'z',\n    'wj.pagination.first': 'Prvá stránka',\n    'wj.pagination.prev': 'Predchádzajúca',\n    'wj.pagination.next': 'Ďalšia',\n    'wj.pagination.last': 'Posledná stránka',\n    'wj.select.empty': 'Žiadne dáta',\n};\n\nLocalizer.registerTranslation(skSk);\n","import { Localizer } from '../utils/localize.js';\n\nexport const enGb = {\n    code: 'en-gb',\n    name: 'English',\n    dir: 'ltr',\n\n    welcome: 'Welcome',\n    'wj.file.upload.button': 'Browse files',\n    'wj.file.upload.uploaded': 'Uploaded: ',\n    'wj.file.upload.from': 'from',\n    'wj.stepper.button.next': 'Next',\n    'wj.stepper.button.finish': 'Finish',\n    'wj.stepper.button.previous': 'Previous',\n    'wj.stepper.step': 'Step',\n    'wj.pagination.of': 'of',\n    'wj.pagination.first': 'First page',\n    'wj.pagination.prev': 'Previous',\n    'wj.pagination.next': 'Next',\n    'wj.pagination.last': 'Last page',\n    'wj.select.empty': 'No data',\n};\n\nLocalizer.registerTranslation(enGb);\n","import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Timeline` is a custom web component that represents a timeline.\n * @summary This element represents a timeline.\n * @documentation https://elements.webjet.sk/components/timeline\n * @status stable\n * @augments WJElement\n * @slot - Slot for the timeline items.\n * @csspart native - The native part of the rating component.\n * @csspart vertical-line - The vertical line part of the rating component.\n * @tag wje-timeline\n */\nexport default class Timeline extends WJElement {\n    /**\n     * Creates an instance of Timeline.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * The class name for the component.\n     */\n    className = 'Timeline';\n\n    /**\n     * Returns the CSS stylesheet for the component.\n     * @static\n     * @returns {CSSStyleSheet} The CSS stylesheet\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.syncAria();\n    }\n\n    /**\n     * Draws the component for the timeline.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        const native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-timeline');\n\n        const verticalLine = document.createElement('div');\n        verticalLine.setAttribute('part', 'vertical-line');\n        verticalLine.classList.add('vertical-line');\n\n        const slot = document.createElement('slot');\n\n        native.appendChild(verticalLine);\n        native.appendChild(slot);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Sync ARIA attributes on host.\n     */\n    syncAria() {\n        if (!this.hasAttribute('role')) {\n            this.setAriaState({ role: 'list' });\n        }\n    }\n}\n","import Timeline from './timeline.element.js';\n\nexport default Timeline;\n\nTimeline.define('wje-timeline', Timeline);\n","import { formatDate } from '../utils/date.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * The TimelineItem component.\n * @summary This element represents a timeline item.\n * @documentation https://elements.webjet.sk/components/timeline-item\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the timeline item.\n * @csspart content-container - The content container part of the timeline item.\n * @csspart default-icon - The default icon part of the timeline item.\n * @slot - Slot for the content of the timeline item.\n * @slot status - Slot for the status of the timeline item.\n * @tag wje-timeline-item\n */\nexport default class TimelineItem extends WJElement {\n    constructor() {\n        super();\n    }\n\n    /**\n     * Returns the class name of the tab.\n     * @returns {string} The class name of the tab.\n     */\n    className = 'TimelineItem';\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     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.setAttribute('relative-time', '');\n    }\n\n    /**\n     * Draws the component for the timeline item.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-timeline-item');\n\n        let contentContainer = document.createElement('div');\n        contentContainer.setAttribute('part', 'content-container');\n        contentContainer.classList.add('content-container');\n\n        let tooltip = document.createElement('wje-tooltip');\n        tooltip.setAttribute('text', this.getAttribute('tooltip') || '');\n        tooltip.setAttribute('position', 'top');\n        tooltip.setAttribute('content', formatDate(this.datetime, 'dd.MM.yyyy HH:mm'));\n\n        let relativeTime = document.createElement('wje-relative-time');\n        relativeTime.setAttribute('date', this.datetime || '');\n        relativeTime.setAttribute('format', this.getAttribute('format') || '');\n\n        tooltip.appendChild(relativeTime);\n\n        let event = document.createElement('h3');\n        event.classList.add('event');\n        event.textContent = this.getAttribute('event') || '';\n\n        // additional text content\n        let slot = document.createElement('slot');\n\n        // status slot\n        let slotStatus = document.createElement('wje-icon');\n        slotStatus.setAttribute('name', 'circle-dot');\n        slotStatus.setAttribute('filled', '');\n        slotStatus.setAttribute('part', 'default-icon');\n\n        // if status slot is present\n        if (this.querySelector('[slot=\"status\"]')) {\n            slotStatus = document.createElement('slot');\n            slotStatus.setAttribute('name', 'status');\n        }\n\n        contentContainer.appendChild(tooltip);\n        contentContainer.appendChild(event);\n        contentContainer.appendChild(slot);\n\n        native.appendChild(slotStatus);\n        native.appendChild(contentContainer);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n}\n","import TimelineItem from './timeline-item.element.js';\n\nexport default TimelineItem;\n\nTimelineItem.define('wje-timeline-item', TimelineItem);\n"],"names":["styles","event"],"mappings":"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"}

package/dist/wje-option.js

@@ -9,7 +9,7 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
 var _Option_instances, isCheckbox_fn, setCheckbox_fn;
 import WJElement from "./wje-element.js";
-import { I as Icon } from "./icon-DVyMc4Wv.js";
+import { I as Icon } from "./icon-CReYMzAK.js";
 import Checkbox from "./wje-checkbox.js";
 import { event } from "./event.js";
 const styles = `/*

package/dist/wje-pagination.js

@@ -3,7 +3,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import { Localizer } from "./localize.js";
 import WJElement from "./wje-element.js";
-import { I as Icon } from "./icon-DVyMc4Wv.js";
+import { I as Icon } from "./icon-CReYMzAK.js";
 import Button from "./wje-button.js";
 import { event } from "./event.js";
 function paginate(totalItems, currentPage = 1, pageSize = 10, maxPages = 5) {

package/dist/wje-select.js

@@ -9,12 +9,13 @@ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read fr
 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);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _addedOptions, _htmlOptions, _Select_instances, htmlSelectedItem_fn, getSelectedOptions_fn, _applySearchFilter, _onMenuItemClickCapture, syncOptionCheckbox_fn;
+var _addedOptions, _htmlOptions, _Select_instances, htmlSelectedItem_fn, getSelectedOptions_fn, hasVisibleOptions_fn, updateEmptyState_fn, _applySearchFilter, _onMenuItemClickCapture, syncOptionCheckbox_fn;
 import { F as FormAssociatedElement } from "./form-associated-element-DEQ4y-jn.js";
 import { event } from "./event.js";
+import { Localizer } from "./localize.js";
 import Button from "./wje-button.js";
 import "./wje-popup.js";
-import { I as Icon } from "./icon-DVyMc4Wv.js";
+import { I as Icon } from "./icon-CReYMzAK.js";
 import Label from "./wje-label.js";
 import Chip from "./wje-chip.js";
 import Input from "./wje-input.js";
@@ -22,7 +23,7 @@ import Option from "./wje-option.js";
 import Options from "./wje-options.js";
 import Checkbox from "./wje-checkbox.js";
 import { P as Popup } from "./popup.element-DklicGea.js";
-const styles = "/*\n[ WJ Select ]\n*/\n\n:host {\n    margin-bottom: var(--wje-select-margin-bottom);\n    width: 100%;\n    display: block;\n    [slot='arrow'] {\n        transform: rotate(0deg);\n        transition: all 0.2s ease-in;\n    }\n    label {\n        margin: var(--wje-select-label-margin);\n        padding: var(--wje-select-label-padding);\n        display: var(--wje-select-label-display);\n        opacity: 1;\n        cursor: text;\n        transition: opacity 0.2s ease;\n        line-height: var(--wje-select-label-line-height);\n        font-size: var(--wje-select-label-font-size);\n    }\n}\n\n.native-select {\n    position: relative;\n    &.default {\n        .wrapper {\n            display: block;\n						background-color: var(--wje-select-background);\n            border-width: var(--wje-select-border-width);\n            border-style: var(--wje-select-border-style);\n            border-color: var(--wje-select-border-color);\n            border-radius: var(--wje-select-border-radius);\n            padding-inline: 0.5rem;\n            padding-top: 0.125rem;\n            padding-bottom: 0.125rem;\n        }\n        .input-wrapper {\n            padding: 0;\n            min-height: 28px;\n            margin-top: -4px;\n        }\n        &.focused {\n            wje-label {\n                opacity: 0.67;\n                font-size: 12px;\n                letter-spacing: normal;\n            }\n        }\n        label {\n            &.fade {\n                opacity: 0.5;\n                font-size: 12px;\n                letter-spacing: normal;\n            }\n        }\n    }\n    &.standard {\n        .wrapper {\n            height: var(--wje-select-height);\n            box-sizing: border-box;\n            background-color: var(--wje-select-background);\n            border-width: var(--wje-select-border-width);\n            border-style: var(--wje-select-border-style);\n            border-color: var(--wje-select-border-color);\n            border-radius: var(--wje-select-border-radius);\n        }\n        .input-wrapper {\n            background: transparent;\n            width: 100%;\n        }\n        slot[name='error'] {\n            position: static;\n\n            background: transparent;\n            padding: 0.25rem 0;\n            left: auto;\n            transform: none;\n            color: var(--wje-input-color-invalid);\n            font-size: 12px;\n            line-height: normal;\n        }\n    }\n}\n\n.wrapper {\n    display: flex;\n    width: 100%;\n}\n\n.input-wrapper {\n    display: grid;\n    grid-template-columns: auto 1fr auto auto auto;\n    align-items: center;\n    background-color: var(--wje-select-background);\n    /*min-height: 28px;*/\n    color: var(--wje-select-color);\n    line-height: var(--wje-select-line-height);\n    appearance: none;\n    padding: 2px 0.5rem;\n    font-size: 14px !important;\n    font-weight: normal;\n    vertical-align: middle;\n    input[readonly] {\n        pointer-events: none;\n        caret-color: transparent;\n    }\n}\n\ninput {\n    color: var(--wje-select-color);\n    line-height: var(--wje-select-line-height);\n    font-size: 14px !important;\n    font-weight: 400;\n    letter-spacing: 0.01em;\n    border: medium;\n    height: 25px;\n    min-height: 25px;\n    padding: 0;\n    background: none;\n    box-shadow: none;\n    width: 100%;\n    outline: 0;\n    font-size: 14px !important;\n}\n\n::placeholder {\n    opacity: 1;\n}\n\n:host [active] {\n    .wrapper {\n        border-radius: var(--wje-select-border-radius);\n    }\n    [slot='arrow'] {\n        transform: rotate(180deg);\n        transition: all 0.2s ease-in;\n    }\n}\n\n.options-wrapper {\n    border-width: var(--wje-select-options-border-width);\n    border-style: var(--wje-select-options-border-style);\n    border-color: var(--wje-select-options-border-color);\n    border-radius: var(--wje-select-options-border-radius);\n    margin-top: calc(0px - var(--wje-select-border-width));\n    background-color: var(--wje-select-options-background-color);\n    overflow: hidden;\n}\n\n.find {\n    margin-block: var(--wje-select-find-margin-block);\n    margin-inline: var(--wje-select-find-margin-inline);\n    width: var(--wje-select-find-width);\n}\n\n.list {\n    overflow: auto;\n    height: 100%;\n}\n\n.options-wrapper:has(.find) .list {\n    height: calc(100% - 32px - 2 * var(--wje-select-find-margin-block));\n}\n\n:host([multiple]) input {\n    position: absolute;\n    z-index: -1;\n    top: 0;\n    left: 0;\n    width: 0;\n    height: 0;\n    opacity: 0;\n}\n\n:host([multiple]) .chips {\n    display: flex;\n    flex: 1;\n    align-items: center;\n    flex-wrap: wrap;\n    gap: var(--wje-spacing-3x-small);\n}\n\n:host([disabled]) .input-wrapper {\n    opacity: 0.5;\n    pointer-events: none;\n    cursor: not-allowed;\n}\n\n.counter {\n    padding-inline: 0.5rem;\n}\n\nwje-chip {\n    --wje-chip-margin: 0 0.25rem 0 0;\n}\n\nwje-button {\n    --wje-padding-top: 0.25rem;\n    --wje-padding-start: 0.25rem;\n    --wje-padding-end: 0.25rem;\n    --wje-padding-bottom: 0.25rem;\n    --wje-button-margin-inline: 0 0.25rem;\n}\n\n.slot-start,\n.slot-end {\n    &:not(:empty) {\n        margin-right: 0.5rem;\n    }\n}\n\nslot[name='error'] {\n    display: none;\n}\n\n:host([invalid]) slot[name='error'] {\n    display: block;\n}\n\nslot[name='error'] {\n    display: none;\n    position: absolute;\n    max-width: 100%;\n    min-width: auto;\n    border-radius: 50px;\n    background: black;\n    padding: 0.25rem 0.5rem;\n    top: 0;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    color: white;\n    font-size: var(--wje-font-size-small);\n    width: max-content;\n    line-height: normal;\n}\n\n.input-hidden{\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    padding: 0;\n    margin: 0;\n    opacity: 0;\n    z-index: -1;\n}\n\n:host([required]) .wrapper::after {\n    color: var(--wje-input-color-invalid);\n    content: var(--wje-input-required-symbol);\n    font-size: 24px;\n    position: absolute;\n    right: 12px;\n    top: 0;\n}\n\n:host([required]) .standard .input-wrapper::after {\n    right: 13px;\n    top: -20px;\n}";
+const styles = "/*\n[ WJ Select ]\n*/\n\n:host {\n    margin-bottom: var(--wje-select-margin-bottom);\n    width: 100%;\n    display: block;\n    [slot='arrow'] {\n        transform: rotate(0deg);\n        transition: all 0.2s ease-in;\n    }\n    label {\n        margin: var(--wje-select-label-margin);\n        padding: var(--wje-select-label-padding);\n        display: var(--wje-select-label-display);\n        opacity: 1;\n        cursor: text;\n        transition: opacity 0.2s ease;\n        line-height: var(--wje-select-label-line-height);\n        font-size: var(--wje-select-label-font-size);\n    }\n}\n\n.native-select {\n    position: relative;\n    &.default {\n        .wrapper {\n            display: block;\n						background-color: var(--wje-select-background);\n            border-width: var(--wje-select-border-width);\n            border-style: var(--wje-select-border-style);\n            border-color: var(--wje-select-border-color);\n            border-radius: var(--wje-select-border-radius);\n            padding-inline: 0.5rem;\n            padding-top: 0.125rem;\n            padding-bottom: 0.125rem;\n        }\n        .input-wrapper {\n            padding: 0;\n            min-height: 28px;\n            margin-top: -4px;\n        }\n        &.focused {\n            wje-label {\n                opacity: 0.67;\n                font-size: 12px;\n                letter-spacing: normal;\n            }\n        }\n        label {\n            &.fade {\n                opacity: 0.5;\n                font-size: 12px;\n                letter-spacing: normal;\n            }\n        }\n    }\n    &.standard {\n        .wrapper {\n            height: var(--wje-select-height);\n            box-sizing: border-box;\n            background-color: var(--wje-select-background);\n            border-width: var(--wje-select-border-width);\n            border-style: var(--wje-select-border-style);\n            border-color: var(--wje-select-border-color);\n            border-radius: var(--wje-select-border-radius);\n        }\n        .input-wrapper {\n            background: transparent;\n            width: 100%;\n        }\n        slot[name='error'] {\n            position: static;\n\n            background: transparent;\n            padding: 0.25rem 0;\n            left: auto;\n            transform: none;\n            color: var(--wje-input-color-invalid);\n            font-size: 12px;\n            line-height: normal;\n        }\n    }\n}\n\n.wrapper {\n    display: flex;\n    width: 100%;\n}\n\n.input-wrapper {\n    display: grid;\n    grid-template-columns: auto 1fr auto auto auto;\n    align-items: center;\n    background-color: var(--wje-select-background);\n    /*min-height: 28px;*/\n    color: var(--wje-select-color);\n    line-height: var(--wje-select-line-height);\n    appearance: none;\n    padding: 2px 0.5rem;\n    font-size: 14px !important;\n    font-weight: normal;\n    vertical-align: middle;\n    input[readonly] {\n        pointer-events: none;\n        caret-color: transparent;\n    }\n}\n\ninput {\n    color: var(--wje-select-color);\n    line-height: var(--wje-select-line-height);\n    font-size: 14px !important;\n    font-weight: 400;\n    letter-spacing: 0.01em;\n    border: medium;\n    height: 25px;\n    min-height: 25px;\n    padding: 0;\n    background: none;\n    box-shadow: none;\n    width: 100%;\n    outline: 0;\n    font-size: 14px !important;\n}\n\n::placeholder {\n    opacity: 1;\n}\n\n:host [active] {\n    .wrapper {\n        border-radius: var(--wje-select-border-radius);\n    }\n    [slot='arrow'] {\n        transform: rotate(180deg);\n        transition: all 0.2s ease-in;\n    }\n}\n\n.options-wrapper {\n    border-width: var(--wje-select-options-border-width);\n    border-style: var(--wje-select-options-border-style);\n    border-color: var(--wje-select-options-border-color);\n    border-radius: var(--wje-select-options-border-radius);\n    margin-top: calc(0px - var(--wje-select-border-width));\n    background-color: var(--wje-select-options-background-color);\n    overflow: hidden;\n}\n\n.find {\n    margin-block: var(--wje-select-find-margin-block);\n    margin-inline: var(--wje-select-find-margin-inline);\n    width: var(--wje-select-find-width);\n}\n\n.list {\n    overflow: auto;\n    height: 100%;\n    position: relative;\n}\n\n.list:has(.empty:not([hidden])) {\n    min-height: 44px;\n}\n\n.empty {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--wje-spacing-small);\n    color: var(--wje-select-color);\n    text-align: center;\n    background-color: var(--wje-select-options-background-color);\n    pointer-events: none;\n}\n\n.empty[hidden] {\n    display: none;\n}\n\n.options-wrapper:has(.find) .list {\n    height: calc(100% - 32px - 2 * var(--wje-select-find-margin-block));\n}\n\n:host([multiple]) input {\n    position: absolute;\n    z-index: -1;\n    top: 0;\n    left: 0;\n    width: 0;\n    height: 0;\n    opacity: 0;\n}\n\n:host([multiple]) .chips {\n    display: flex;\n    flex: 1;\n    align-items: center;\n    flex-wrap: wrap;\n    gap: var(--wje-spacing-3x-small);\n}\n\n:host([disabled]) .input-wrapper {\n    opacity: 0.5;\n    pointer-events: none;\n    cursor: not-allowed;\n}\n\n.counter {\n    padding-inline: 0.5rem;\n}\n\nwje-chip {\n    --wje-chip-margin: 0 0.25rem 0 0;\n}\n\nwje-button {\n    --wje-padding-top: 0.25rem;\n    --wje-padding-start: 0.25rem;\n    --wje-padding-end: 0.25rem;\n    --wje-padding-bottom: 0.25rem;\n    --wje-button-margin-inline: 0 0.25rem;\n}\n\n.slot-start,\n.slot-end {\n    &:not(:empty) {\n        margin-right: 0.5rem;\n    }\n}\n\nslot[name='error'] {\n    display: none;\n}\n\n:host([invalid]) slot[name='error'] {\n    display: block;\n}\n\nslot[name='error'] {\n    display: none;\n    position: absolute;\n    max-width: 100%;\n    min-width: auto;\n    border-radius: 50px;\n    background: black;\n    padding: 0.25rem 0.5rem;\n    top: 0;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    color: white;\n    font-size: var(--wje-font-size-small);\n    width: max-content;\n    line-height: normal;\n}\n\n.input-hidden{\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    padding: 0;\n    margin: 0;\n    opacity: 0;\n    z-index: -1;\n}\n\n:host([required]) .wrapper::after {\n    color: var(--wje-input-color-invalid);\n    content: var(--wje-input-required-symbol);\n    font-size: 24px;\n    position: absolute;\n    right: 12px;\n    top: 0;\n}\n\n:host([required]) .standard .input-wrapper::after {\n    right: 13px;\n    top: -20px;\n}\n";
 const _Select = class _Select extends FormAssociatedElement {
   constructor() {
     super();
@@ -142,6 +143,7 @@ const _Select = class _Select extends FormAssociatedElement {
             option.style.display = "none";
           }
         });
+        __privateMethod(this, _Select_instances, updateEmptyState_fn).call(this);
       }
     });
     /**
@@ -161,6 +163,7 @@ const _Select = class _Select extends FormAssociatedElement {
       }
       e.stopPropagation();
     });
+    this.localizer = new Localizer(this);
     this.counterEl = null;
     this._wasOppened = false;
     this.native = null;
@@ -172,6 +175,7 @@ const _Select = class _Select extends FormAssociatedElement {
     this.chips = null;
     this.clear = null;
     this.list = null;
+    this.emptyState = null;
     this._value = [];
     this._selectedOptions = [];
     this._instanceId = ++_Select._instanceId;
@@ -530,6 +534,14 @@ const _Select = class _Select extends FormAssociatedElement {
     list.setAttribute("role", "listbox");
     if (this.hasAttribute("multiple")) list.setAttribute("aria-multiselectable", "true");
     let slot = document.createElement("slot");
+    let emptyState = document.createElement("div");
+    emptyState.setAttribute("part", "empty");
+    emptyState.setAttribute("role", "option");
+    emptyState.setAttribute("aria-disabled", "true");
+    emptyState.setAttribute("aria-selected", "false");
+    emptyState.classList.add("empty");
+    emptyState.hidden = true;
+    emptyState.textContent = this.localizer.translate("wj.select.empty");
     let clear = document.createElement("wje-button");
     clear.setAttribute("fill", "link");
     clear.setAttribute("part", "clear");
@@ -569,7 +581,7 @@ const _Select = class _Select extends FormAssociatedElement {
     if (this.hasAttribute("clearable")) inputWrapper.append(clear);
     inputWrapper.appendChild(slotEnd);
     inputWrapper.appendChild(arrow);
-    list.appendChild(slot);
+    list.append(slot, emptyState);
     if (this.hasAttribute("find")) {
       let find = document.createElement("wje-input");
       find.setAttribute("variant", "standard");
@@ -602,6 +614,7 @@ const _Select = class _Select extends FormAssociatedElement {
     this.chips = chips;
     this.clear = clear;
     this.list = list;
+    this.emptyState = emptyState;
     this.slotFooter = slotFooter;
     this.syncAria();
     return fragment;
@@ -705,6 +718,7 @@ const _Select = class _Select extends FormAssociatedElement {
       });
       this.selectedOptions = __privateMethod(this, _Select_instances, getSelectedOptions_fn).call(this);
       this.selections(true);
+      __privateMethod(this, _Select_instances, updateEmptyState_fn).call(this);
       this.list.scrollTo(0, 0);
       event.dispatchCustomEvent(this.popup, "wje-popup:content-ready");
     });
@@ -712,6 +726,7 @@ const _Select = class _Select extends FormAssociatedElement {
       event.addListener(this.findEl, "keyup", "", __privateGet(this, _applySearchFilter));
       event.addListener(this.findEl, "wje-input:clear", "", __privateGet(this, _applySearchFilter));
     }
+    __privateMethod(this, _Select_instances, updateEmptyState_fn).call(this);
   }
   /**
    * Returns all the options as HTML.
@@ -864,10 +879,12 @@ const _Select = class _Select extends FormAssociatedElement {
     const optionsElement = this.querySelector("wje-options");
     if (optionsElement) {
       optionsElement.addOption(optionData, silent, map);
+      __privateMethod(this, _Select_instances, updateEmptyState_fn).call(this);
       return;
     }
     let option = this.htmlOption(optionData, map);
     this.appendChild(option);
+    __privateMethod(this, _Select_instances, updateEmptyState_fn).call(this);
   }
   /**
    * Adds one or more options to a collection. If the input is an array, it adds each option within the array.
@@ -1017,6 +1034,26 @@ htmlSelectedItem_fn = function(item) {
 getSelectedOptions_fn = function() {
   return Array.from(this.querySelectorAll("wje-option[selected]"));
 };
+/**
+ * Determines whether the select currently contains at least one visible option.
+ * @returns {boolean} Returns true when at least one option is visible, otherwise false.
+ */
+hasVisibleOptions_fn = function() {
+  return Array.from(this.getAllOptions()).some((option) => {
+    if (option.hidden || option.hasAttribute("hidden")) {
+      return false;
+    }
+    return getComputedStyle(option).display !== "none";
+  });
+};
+/**
+ * Toggles the empty state message based on whether any visible options are available.
+ * @returns {void} Does not return a value.
+ */
+updateEmptyState_fn = function() {
+  if (!(this.emptyState instanceof HTMLElement)) return;
+  this.emptyState.hidden = __privateMethod(this, _Select_instances, hasVisibleOptions_fn).call(this);
+};
 _applySearchFilter = new WeakMap();
 _onMenuItemClickCapture = new WeakMap();
 syncOptionCheckbox_fn = function(option) {