wj-elements 0.1.172 → 0.1.173

package/dist/packages/wje-button/button.element.d.ts

@@ -66,6 +66,18 @@ export default class Button extends WJElement {
      * @returns {boolean}
      */
     get caret(): boolean;
+    /**
+     * Sets the 'round' attribute on the element. If the value is true, the attribute is added;
+     * otherwise, it is removed from the element.
+     * @param {boolean} value A boolean indicating whether to set or remove the 'round' attribute.
+     */
+    set round(value: boolean);
+    /**
+     * Retrieves the value of the 'round' attribute as a boolean.
+     * Checks if the 'round' attribute is present on the element.
+     * @returns {boolean} True if the 'round' attribute exists, otherwise false.
+     */
+    get round(): boolean;
     /**
      * Set variant of the Button element.
      * @param value

package/dist/packages/wje-chip/chip.element.d.ts

@@ -16,6 +16,40 @@ export default class Chip extends WJElement {
      * @returns {*}
      */
     static get cssStyleSheet(): any;
+    /**
+     * Sets or removes the "round" attribute on the element based on the provided value.
+     * @param {boolean} value Determines whether the "round" attribute should be set or removed.
+     * If true, the "round" attribute is added. If false, the "round"
+     * attribute is removed.
+     */
+    set round(value: boolean);
+    /**
+     * Checks if the 'round' attribute is present on the element.
+     * @returns {boolean} Returns true if the 'round' attribute exists, otherwise false.
+     */
+    get round(): boolean;
+    /**
+     * Sets the size attribute of the element.
+     * @param {string} value The value to set for the size attribute.
+     */
+    set size(value: string);
+    /**
+     * Retrieves the 'size' attribute of the current element.
+     * @returns {string | null} The value of the 'size' attribute, or null if the attribute is not set.
+     */
+    get size(): string | null;
+    /**
+     * Sets or removes the "removable" attribute on the element.
+     * @param {boolean} value A boolean indicating whether the element should have the "removable" attribute.
+     * If true, the "removable" attribute is added;
+     * if false, the "removable" attribute is removed.
+     */
+    set removable(value: boolean);
+    /**
+     * Determines if the element has the 'removable' attribute.
+     * @returns {boolean} True if the element has the 'removable' attribute, otherwise false.
+     */
+    get removable(): boolean;
     /**
      * Draws the Chip element.
      * @returns {DocumentFragment}

package/dist/packages/wje-kanban/kanban.element.d.ts

@@ -8,8 +8,7 @@ import { default as MenuItem } from '../wje-menu-item/menu-item.js';
  * @status stable
  * @augments {WJElement}
  * @slot - The default slot for the Kanban board.
- * @csspart native - Styles the native part of the Kanban board.
- * @csspart pool - Styles the pool of the Kanban board.
+ * @csspart native-infinite-scroll - Styles the native part of the Kanban board.
  * @tag wje-kanban
  */
 export default class Kanban extends WJElement {

package/dist/packages/wje-select/select.element.d.ts

@@ -22,6 +22,7 @@ import { default as Options } from '../wje-options/options.js';
  * @property {Array} _selected - An array to store selected items.
  * @property {HTMLElement|null} counterEl - A reference to the counter element, initially null.
  * @property {ElementInternals} internals - The internal element API for managing state and attributes.
+ * @property {number} maxOptions - The maximum number of options allowed.
  * @property {boolean} _wasOppened - Tracks whether the select element was previously opened, initially false.
  * @cssproperty [--wje-select-border-width=1px] - Specifies the width of the border around the select component. Accepts any valid CSS length unit (e.g., `px`, `rem`, `em`).
  * @cssproperty [--wje-select-border-style=solid] - Defines the style of the border for the select component. Accepts standard CSS border styles, such as `solid`, `dashed`, or `dotted`.
@@ -132,6 +133,20 @@ export default class Select extends WJElement {
      */
     list: HTMLElement | null;
     selectedOptions: any[];
+    /**
+     * An object representing component dependencies with their respective classes.
+     * Each property in the object maps a custom component name (as a string key)
+     * to its corresponding class or constructor.
+     * @typedef {{[key: string]: Function}} Dependencies
+     * @property {Function} 'wje-button' Represents the Button component class.
+     * @property {Function} 'wje-popup' Represents the Popup component class.
+     * @property {Function} 'wje-icon' Represents the Icon component class.
+     * @property {Function} 'wje-label' Represents the Label component class.
+     * @property {Function} 'wje-chip' Represents the Chip component class.
+     * @property {Function} 'wje-input' Represents the Input component class.
+     * @property {Function} 'wje-option' Represents the Option component class.
+     * @property {Function} 'wje-options' Represents the Options component class.
+     */
     dependencies: {
         'wje-button': typeof Button;
         'wje-popup': typeof Popup;
@@ -172,6 +187,19 @@ export default class Select extends WJElement {
      * @returns {boolean} Whether the attribute is present.
      */
     get invalid(): boolean;
+    /**
+     * Sets the maximum number of options allowed.
+     * @param {string | number | null} value The value to set as the maximum number of options.
+     * If null, the 'max-options' attribute will be removed.
+     */
+    set maxOptions(value: string | number | null);
+    /**
+     * Retrieves the maximum number of options allowed.
+     * Parses the value of the 'max-options' attribute from the element and converts it to a number.
+     * If the attribute is not present or cannot be converted to a valid number, defaults to 0.
+     * @returns {number} The maximum number of options, or 0 if the attribute is not set or invalid.
+     */
+    get maxOptions(): number;
     /**
      * Getter for the form attribute.
      * @returns {HTMLFormElement} The form the input is associated with.
@@ -252,8 +280,22 @@ export default class Select extends WJElement {
      * @param {Event} e The event.
      */
     optionChange: (e: Event) => void;
-    processClickedOption: (option: any, multiple?: boolean) => void;
-    filterOutOption: (option: any) => void;
+    /**
+     * Handles the selection and deselection of an option element.
+     * @param {HTMLElement} option The option element that was clicked.
+     * @param {boolean} [multiple] Indicates whether multiple selection is allowed.
+     */
+    processClickedOption: (option: HTMLElement, multiple?: boolean) => void;
+    /**
+     * Filters out a specified option from the `selectedOptions` array.
+     * This function removes an option from the `selectedOptions` array if its value
+     * matches the value of the option provided as an argument. It allows for dynamically
+     * updating the selected options by excluding the specified option.
+     * @param {object} option The option to be removed from the `selectedOptions` array.
+     * Should be an object containing a `value` property that is compared to the
+     * `value` property of objects in the `selectedOptions` array.
+     */
+    filterOutOption: (option: object) => void;
     /**
      * Returns all the options as HTML.
      * @returns {NodeList} The options as HTML.
@@ -276,21 +318,10 @@ export default class Select extends WJElement {
      */
     selectionChanged(option?: Element, length?: number): void;
     /**
-     * Updates the selected options and their corresponding chips.
-     * @param {boolean} [silence] Determines whether to suppress the "wje-select:change" event.
-     * @returns {void}
-     * @description
-     * This method fetches the currently selected options and updates the `selectedOptions` array.
-     * It clears and rebuilds the chips representing the selected items in the UI.
-     * If the number of selected options reaches the maximum allowed (`maxOptions`), it stops updating the counter.
-     * Optionally, it dispatches a custom event when the selection changes unless `silence` is set to `true`.
-     * //@fires wje-select:change - Dispatched when the selection changes, unless `silence` is `true`.
-     * @example
-     * // Call the method and allow event dispatch
-     * selections();
-     * @example
-     * // Call the method without dispatching the event
-     * selections(true);
+     * Handles the selection of options and updates the UI chips accordingly.
+     * Also manages the max selection logic and fires an event when selections change.
+     * @param {boolean} [silence] Indicates whether to suppress the event dispatch when a change occurs.
+     * @returns {void} Does not return anything.
      */
     selections(silence?: boolean): void;
     /**
@@ -383,4 +414,11 @@ export default class Select extends WJElement {
      * @function
      */
     formDisabledCallback(disabled: boolean): void;
+    /**
+     * Checks if all elements in the `elements` array are present in the `options` array based on their `option` property.
+     * @param {Array} elements The array of elements to check. Each element should have an `option` property.
+     * @param {Array} options The array of options to verify against.
+     * @returns {boolean} Returns true if all elements in the `elements` array are found within the `options` array, otherwise returns false.
+     */
+    areAllElementsInOptions(elements: any[], options: any[]): boolean;
 }

package/dist/wje-button.js

@@ -86,6 +86,26 @@ class Button extends WJElement {
   get caret() {
     return this.hasAttribute("caret");
   }
+  /**
+   * Sets the 'round' attribute on the element. If the value is true, the attribute is added;
+   * otherwise, it is removed from the element.
+   * @param {boolean} value A boolean indicating whether to set or remove the 'round' attribute.
+   */
+  set round(value) {
+    if (value) {
+      this.setAttribute("round", "");
+    } else {
+      this.removeAttribute("round");
+    }
+  }
+  /**
+   * Retrieves the value of the 'round' attribute as a boolean.
+   * Checks if the 'round' attribute is present on the element.
+   * @returns {boolean} True if the 'round' attribute exists, otherwise false.
+   */
+  get round() {
+    return this.hasAttribute("round");
+  }
   /**
    * Set variant of the Button element.
    * @param value

package/dist/wje-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-button.js","sources":["../packages/utils/utils.js","../packages/wje-button/button.element.js","../packages/wje-button/button.js"],"sourcesContent":["export const bool = (v) => {\n    return v === 'false' || v === 'null' || v === 'NaN' || v === 'undefined' || v === '0' ? false : !!v;\n};\n","import { bindRouterLinks } from 'slick-router/middlewares/router-links.js';\n\nimport { bool } from '../utils/utils.js';\nimport { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport Icon from '../wje-icon/icon.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents Button element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/button\n * @status stable\n * @augments WJElement\n * @dependency wje-icon\n * @slot - The button main content.\n * @slot icon - The button icon.\n * @slot caret - The button caret.\n * @slot start - The button start slot.\n * @slot end - The button end slot.\n * @slot toggle - The button toggle slot.\n * @csspart native - The component's native wrapper.\n * @cssproperty [--wje-button-background-color=transparent] - Background color of the component;\n * @cssproperty [--wje-button-border-color=--wje-color-contrast-4] - Border color of the component;\n * @cssproperty [--wje-button-color=--wje-color-contrast-11] - Color of the component;\n * @cssproperty [--wje-button-border-radius=--wje-border-radius-medium] - Border radius of the component;\n * @cssproperty [--wje-button-border-width=1px] - Border width of the component;\n * @cssproperty [--wje-button-border-style=solid] - Border style of the component;\n * @cssproperty [--wje-button-border-color=--wje-color-contrast-1] - Border color of the component;\n * @cssproperty [--wje-button-margin-inline=0] - Margin inline of the component;\n */\n\nexport default class Button extends WJElement {\n    /**\n     * Button constructor method.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this.internals_ = this.attachInternals();\n    }\n\n    /**\n     * Dependencies of the Button element.\n     * @type {object}\n     */\n    dependencies = {\n        'wje-icon': Icon,\n    };\n\n    /**\n     * Properties of the element Button.\n     * @param value\n     */\n    set color(value) {\n        this.setAttribute('color', value || 'default');\n    }\n\n    /**\n     * Get color of the Button element.\n     * @returns {string|string}\n     */\n    get color() {\n        return this.getAttribute('color') || 'default';\n    }\n\n    /**\n     * Set variant of the Button element.\n     * @param value\n     */\n    set caret(value) {\n        this.setAttribute('caret', value);\n    }\n\n    /**\n     * Get variant of the Button element.\n     * @returns {boolean}\n     */\n    get caret() {\n        return this.hasAttribute('caret');\n    }\n\n    /**\n     * Set variant of the Button element.\n     * @param value\n     */\n    set tooltip(value) {\n        this.setAttribute('tooltip', value);\n    }\n\n    /**\n     * Get variant of the Button element.\n     * @returns {boolean}\n     */\n    get tooltip() {\n        return this.hasAttribute('tooltip');\n    }\n\n    /**\n     * Set variant of the Button element.\n     * @param value\n     */\n    set dialog(value) {\n        this.setAttribute('dialog', value);\n    }\n\n    /**\n     * Get variant of the Button element.\n     * @returns {string|object}\n     */\n    get dialog() {\n        return this.getAttribute('dialog');\n    }\n\n    /**\n     * Set active state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set active(value) {\n        this.setAttribute('active', '');\n    }\n\n    /**\n     * Get active state of the Button element.\n     * @returns {boolean} active - The active state\n     */\n    get active() {\n        return this.hasAttribute('active');\n    }\n\n    /**\n     * Set disabled state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set disabled(value) {\n        this.removeAttribute('disabled');\n\n        if (value) {\n            this.setAttribute('disabled', '');\n        }\n    }\n\n    /**\n     * Get disabled state of the Button element.\n     * @returns {boolean} disabled - The disabled state\n     */\n    get disabled() {\n        return this.hasAttribute('disabled');\n    }\n\n    /**\n     * Set fill of the Button element.\n     * @param {string} value The value to set\n     */\n    set fill(value) {\n        this.setAttribute('fill', value);\n    }\n\n    /**\n     * Get fill of the Button element.\n     * @returns {string} fill - The fill value\n     */\n    get fill() {\n        return this.getAttribute('fill') || 'solid';\n    }\n\n    /**\n     * Set outline state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set outline(value) {\n        this.setAttribute('outline', '');\n    }\n\n    /**\n     * Get outline state of the Button element.\n     * @returns {boolean} outline - The outline state\n     */\n    get outline() {\n        return this.hasAttribute('outline');\n    }\n\n    /**\n     * Set stop propagation state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set stopPropagation(value) {\n        this.setAttribute('stop-propagation', bool(value));\n    }\n\n    /**\n     * Get stop propagation state of the Button element.\n     * @returns {boolean} stopPropagation - The stop propagation state\n     */\n    get stopPropagation() {\n        return bool(this.getAttribute('stop-propagation'));\n    }\n\n    /**\n     * Sets the value of the custom event attribute.\n     * @param {string} value The value to be assigned to the custom event attribute.\n     */\n    set customEvent(value) {\n        this.setAttribute('custom-event', value);\n    }\n\n    /**\n     * Retrieves the value of the 'custom-event' attribute from the element.\n     * @returns {string | null} The value of the 'custom-event' attribute, or null if the attribute is not set.\n     */\n    get customEvent() {\n        return this.getAttribute('custom-event');\n    }\n\n    /**\n     * Retrieves a mapped object containing custom event parameters extracted from the element's attributes.\n     * Attributes considered are those that begin with 'custom-event-'.\n     * The mapped object's keys are derived by removing the 'custom-event-' prefix from the attribute names,\n     * and the values are the corresponding attribute values.\n     * @returns {object} An object containing key-value pairs of custom event parameters.\n     */\n    get customEventParameters() {\n        const attributes = Array.from(this.attributes).filter((attr) => attr.name.startsWith('custom-event-'));\n\n        return attributes.reduce((acc, attr) => {\n            const key = attr.name.replace('custom-event-', '');\n            acc[key] = attr.value;\n\n            return acc;\n        }, {});\n    }\n\n    /**\n     * Class name for the Button element\n     * @type {string}\n     */\n    className = 'Button';\n\n    /**\n     * Get CSS stylesheet for the Button element.\n     * @static\n     * @returns {CSSStyleSheet} styles - The CSS stylesheet for the Button element.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Get observed attributes for the Button element.\n     * @static\n     * @returns {Array<string>} observedAttributes - The observed attributes array for the Button element.\n     */\n    static get observedAttributes() {\n        return ['disabled'];\n    }\n\n    /**\n     * @summary A static property that indicates whether the custom element is form-associated or not.\n     * Form-associated custom elements are elements that can participate in form submission.\n     * @type {boolean}\n     */\n    static formAssociated = true;\n\n    /**\n     * @summary Callback function that is called when the custom element is associated with a form.\n     * This function sets the internal `_form` property to the associated form.\n     * @param {HTMLFormElement} form The form the custom element is associated with.\n     */\n    formAssociatedCallback(form) {\n        this._form = form;\n    }\n\n    /**\n     * @summary Callback function that is called when the form-associated state of the custom element changes.\n     * This function updates the 'disabled' attribute of the element based on the new state.\n     * @param {boolean} disabled The new form-associated state.\n     */\n    formDisabledCallback(disabled) {\n        if (disabled) {\n            this.setAttribute('disabled', '');\n        } else {\n            this.removeAttribute('disabled');\n        }\n    }\n\n    /**\n     * Setup attributes for the Button element.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draw method for the Button element.\n     * @returns {object} fragment - The document fragment containing the drawn element.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement(this.hasAttribute('href') ? 'a' : 'button');\n        if (this.hasAttribute('href')) {\n            native.setAttribute('href', this.getAttribute('href'));\n        } else {\n            if (this.type === 'submit') {\n                native.setAttribute('type', 'submit');\n            }\n        }\n\n        native.classList.add('native-button');\n        native.setAttribute('part', 'native');\n\n        this.classList.remove('wje-button-disabled');\n\n        if (this.disabled) native.classList.add('wje-button-disabled');\n\n        if (this.variant) native.classList.add('wje-button-' + this.variant);\n\n        if (this.hasAttribute('round')) native.classList.add('wje-button-round');\n\n        if (this.hasAttribute('circle')) native.classList.add('wje-button-circle');\n\n        if (this.outline) native.classList.add('wje-outline');\n\n        if (this.fill) native.classList.add('wje-button-' + this.fill);\n\n        if (this.size) native.classList.add('wje-button-' + this.size);\n\n        if (\n            (this.querySelectorAll('[slot=caret]').length < 1 && this.hasAttribute('caret')) ||\n            this.hasAttribute('only-caret')\n        ) {\n            let i = document.createElement('wje-icon');\n            i.style.setProperty('--wje-icon-size', '14px');\n            i.setAttribute('slot', 'caret');\n            i.setAttribute('name', 'chevron-down');\n            i.setAttribute('part', 'caret');\n\n            this.appendChild(i);\n        }\n\n        if (this.active) {\n            this.classList.add('wje-active');\n            let i = document.createElement('wje-icon');\n            i.setAttribute('name', 'check');\n\n            this.appendChild(i);\n        }\n\n        native.classList.add('wje-color-' + this.color, 'wje-color');\n\n        let span = document.createElement('span');\n        span.setAttribute('part', 'inner');\n        span.classList.add('button-inner');\n\n        let slot = document.createElement('slot');\n        slot.setAttribute('name', 'icon-only');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        slot.setAttribute('name', 'start');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        slot.setAttribute('name', 'end');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        slot.setAttribute('name', 'caret');\n        span.appendChild(slot);\n\n        this.hasToggle = WjElementUtils.hasSlot(this, 'toggle');\n\n        if (this.hasToggle) {\n            this.slotToggle = document.createElement('slot');\n            this.slotToggle.setAttribute('name', 'toggle');\n\n            span.appendChild(this.slotToggle);\n        }\n\n        native.appendChild(span);\n\n        if (this.tooltip) {\n            let tooltip = document.createElement('wje-tooltip');\n            tooltip.setAttribute('content', this.getAttribute('tooltip'));\n            tooltip.setAttribute('placement', this.getAttribute('tooltip-placement') || 'top');\n            tooltip.appendChild(native);\n\n            fragment.appendChild(tooltip);\n        } else {\n            fragment.appendChild(native);\n        }\n\n        return fragment;\n    }\n\n    /**\n     * After draw method for the Button element.\n     */\n    afterDraw() {\n        if (this.hasAttribute('route')) {\n            this.unbindRouterLinks = bindRouterLinks(this.parentElement, { selector: false });\n        }\n\n        // nastavenie toggle podla atributu, ak nie je nastaveny, tak sa zobrazi vzdy prvy element\n        if (this.hasToggle) {\n            if (this.toggle === 'off') {\n                this.slotToggle.assignedNodes()[1].classList.add('show');\n                this.setAttribute('value', 'off');\n            } else {\n                this.slotToggle.assignedNodes()[0].classList.add('show');\n                this.setAttribute('value', 'on');\n            }\n        }\n\n        if (this.hasAttribute('custom-event')) {\n            event.addListener(this, 'click', null, this.#populateCustomEvent);\n        }\n\n        if (this.hasAttribute('dialog')) {\n            event.addListener(this, 'click', null, this.eventDialogOpen);\n        } else {\n            event.addListener(this, 'click', 'wje-button:click', null); // { stopPropagation: this.stopPropagation } - zrusene kvoli dropdown kde som nevedel odchytit event click\n        }\n\n        if (this.hasToggle)\n            event.addListener(this, 'click', 'wje-button:toggle', this.toggleStates, {\n                stopPropagation: this.stopPropagation,\n            });\n\n        if (this.type === 'submit') {\n            event.addListener(this, 'click', 'wje-button:submit', () => {\n                console.log('submit', this.internals_.form);\n                event.dispatchCustomEvent(this.internals_.form, 'submit', {});\n            });\n        }\n\n        if (this.type === 'reset') {\n            event.addListener(this, 'click', 'wje-button:reset', () => {\n                this.internals_.form.reset();\n            });\n        }\n    }\n\n    /**\n     * Before disconnect method for the Button element.\n     */\n    beforeDisconnect() {\n        // remove all events from the button\n        event.removeListener(this, 'click', null, this.eventDialogOpen);\n        event.removeListener(this, 'click', 'wje-button:click', null);\n        event.removeListener(this, 'click', 'wje-button:toggle', this.toggleStates);\n        event.removeListener(this, 'click', null, this.#populateCustomEvent);\n        event.removeListener(this, 'click', 'wje-button:submit', null);\n        event.removeListener(this, 'click', 'wje-button:reset', null);\n\n        this.removeEventListener('click', this.eventDialogOpen);\n        this.unbindRouterLinks?.();\n    }\n\n    /**\n     * Event dialog open method for the Button element.\n     * @param {Event} e The event object\n     */\n    eventDialogOpen = (e) => {\n        event.dispatchCustomEvent(this, this.dialog);\n    };\n\n    /**\n     * Toggle states method for the Button element.\n     */\n    toggleStates = () => {\n        const nodes = this.slotToggle.assignedNodes().filter((node) => node.nodeType === Node.ELEMENT_NODE);\n\n        nodes.forEach((node, index) => {\n            if (node.classList.contains('show')) {\n                node.classList.remove('show');\n            } else {\n                node.classList.add('show');\n                this.setAttribute('value', index === 0 ? 'on' : 'off');\n            }\n        });\n    }\n\n    /**\n     * Dispatches a custom event with specified parameters.\n     * This method uses the `customEvent` and `customEventParameters` properties\n     * to create and dispatch a `CustomEvent`. The event is configured to be\n     * composed and bubbles up through the DOM.\n     * @returns {void} This method does not return a value.\n     */\n    #populateCustomEvent() {\n        this.dispatchEvent(\n          new CustomEvent(this.customEvent, { detail: this.customEventParameters, composed: true, bubbles: true })\n        );\n    }\n}\n","import Button from './button.element.js';\n\nexport default Button;\n\nButton.define('wje-button', Button);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-button.js","sources":["../packages/utils/utils.js","../packages/wje-button/button.element.js","../packages/wje-button/button.js"],"sourcesContent":["export const bool = (v) => {\n    return v === 'false' || v === 'null' || v === 'NaN' || v === 'undefined' || v === '0' ? false : !!v;\n};\n","import { bindRouterLinks } from 'slick-router/middlewares/router-links.js';\n\nimport { bool } from '../utils/utils.js';\nimport { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport Icon from '../wje-icon/icon.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents Button element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/button\n * @status stable\n * @augments WJElement\n * @dependency wje-icon\n * @slot - The button main content.\n * @slot icon - The button icon.\n * @slot caret - The button caret.\n * @slot start - The button start slot.\n * @slot end - The button end slot.\n * @slot toggle - The button toggle slot.\n * @csspart native - The component's native wrapper.\n * @cssproperty [--wje-button-background-color=transparent] - Background color of the component;\n * @cssproperty [--wje-button-border-color=--wje-color-contrast-4] - Border color of the component;\n * @cssproperty [--wje-button-color=--wje-color-contrast-11] - Color of the component;\n * @cssproperty [--wje-button-border-radius=--wje-border-radius-medium] - Border radius of the component;\n * @cssproperty [--wje-button-border-width=1px] - Border width of the component;\n * @cssproperty [--wje-button-border-style=solid] - Border style of the component;\n * @cssproperty [--wje-button-border-color=--wje-color-contrast-1] - Border color of the component;\n * @cssproperty [--wje-button-margin-inline=0] - Margin inline of the component;\n */\n\nexport default class Button extends WJElement {\n    /**\n     * Button constructor method.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this.internals_ = this.attachInternals();\n    }\n\n    /**\n     * Dependencies of the Button element.\n     * @type {object}\n     */\n    dependencies = {\n        'wje-icon': Icon,\n    };\n\n    /**\n     * Properties of the element Button.\n     * @param value\n     */\n    set color(value) {\n        this.setAttribute('color', value || 'default');\n    }\n\n    /**\n     * Get color of the Button element.\n     * @returns {string|string}\n     */\n    get color() {\n        return this.getAttribute('color') || 'default';\n    }\n\n    /**\n     * Set variant of the Button element.\n     * @param value\n     */\n    set caret(value) {\n        this.setAttribute('caret', value);\n    }\n\n    /**\n     * Get variant of the Button element.\n     * @returns {boolean}\n     */\n    get caret() {\n        return this.hasAttribute('caret');\n    }\n\n    /**\n     * Sets the 'round' attribute on the element. If the value is true, the attribute is added;\n     * otherwise, it is removed from the element.\n     * @param {boolean} value A boolean indicating whether to set or remove the 'round' attribute.\n     */\n    set round(value) {\n        if (value) {\n            this.setAttribute('round', '');\n        } else {\n            this.removeAttribute('round');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'round' attribute as a boolean.\n     * Checks if the 'round' attribute is present on the element.\n     * @returns {boolean} True if the 'round' attribute exists, otherwise false.\n     */\n    get round() {\n        return this.hasAttribute('round');\n    }\n\n    /**\n     * Set variant of the Button element.\n     * @param value\n     */\n    set tooltip(value) {\n        this.setAttribute('tooltip', value);\n    }\n\n    /**\n     * Get variant of the Button element.\n     * @returns {boolean}\n     */\n    get tooltip() {\n        return this.hasAttribute('tooltip');\n    }\n\n    /**\n     * Set variant of the Button element.\n     * @param value\n     */\n    set dialog(value) {\n        this.setAttribute('dialog', value);\n    }\n\n    /**\n     * Get variant of the Button element.\n     * @returns {string|object}\n     */\n    get dialog() {\n        return this.getAttribute('dialog');\n    }\n\n    /**\n     * Set active state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set active(value) {\n        this.setAttribute('active', '');\n    }\n\n    /**\n     * Get active state of the Button element.\n     * @returns {boolean} active - The active state\n     */\n    get active() {\n        return this.hasAttribute('active');\n    }\n\n    /**\n     * Set disabled state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set disabled(value) {\n        this.removeAttribute('disabled');\n\n        if (value) {\n            this.setAttribute('disabled', '');\n        }\n    }\n\n    /**\n     * Get disabled state of the Button element.\n     * @returns {boolean} disabled - The disabled state\n     */\n    get disabled() {\n        return this.hasAttribute('disabled');\n    }\n\n    /**\n     * Set fill of the Button element.\n     * @param {string} value The value to set\n     */\n    set fill(value) {\n        this.setAttribute('fill', value);\n    }\n\n    /**\n     * Get fill of the Button element.\n     * @returns {string} fill - The fill value\n     */\n    get fill() {\n        return this.getAttribute('fill') || 'solid';\n    }\n\n    /**\n     * Set outline state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set outline(value) {\n        this.setAttribute('outline', '');\n    }\n\n    /**\n     * Get outline state of the Button element.\n     * @returns {boolean} outline - The outline state\n     */\n    get outline() {\n        return this.hasAttribute('outline');\n    }\n\n    /**\n     * Set stop propagation state of the Button element.\n     * @param {boolean} value The value to set\n     */\n    set stopPropagation(value) {\n        this.setAttribute('stop-propagation', bool(value));\n    }\n\n    /**\n     * Get stop propagation state of the Button element.\n     * @returns {boolean} stopPropagation - The stop propagation state\n     */\n    get stopPropagation() {\n        return bool(this.getAttribute('stop-propagation'));\n    }\n\n    /**\n     * Sets the value of the custom event attribute.\n     * @param {string} value The value to be assigned to the custom event attribute.\n     */\n    set customEvent(value) {\n        this.setAttribute('custom-event', value);\n    }\n\n    /**\n     * Retrieves the value of the 'custom-event' attribute from the element.\n     * @returns {string | null} The value of the 'custom-event' attribute, or null if the attribute is not set.\n     */\n    get customEvent() {\n        return this.getAttribute('custom-event');\n    }\n\n    /**\n     * Retrieves a mapped object containing custom event parameters extracted from the element's attributes.\n     * Attributes considered are those that begin with 'custom-event-'.\n     * The mapped object's keys are derived by removing the 'custom-event-' prefix from the attribute names,\n     * and the values are the corresponding attribute values.\n     * @returns {object} An object containing key-value pairs of custom event parameters.\n     */\n    get customEventParameters() {\n        const attributes = Array.from(this.attributes).filter((attr) => attr.name.startsWith('custom-event-'));\n\n        return attributes.reduce((acc, attr) => {\n            const key = attr.name.replace('custom-event-', '');\n            acc[key] = attr.value;\n\n            return acc;\n        }, {});\n    }\n\n    /**\n     * Class name for the Button element\n     * @type {string}\n     */\n    className = 'Button';\n\n    /**\n     * Get CSS stylesheet for the Button element.\n     * @static\n     * @returns {CSSStyleSheet} styles - The CSS stylesheet for the Button element.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Get observed attributes for the Button element.\n     * @static\n     * @returns {Array<string>} observedAttributes - The observed attributes array for the Button element.\n     */\n    static get observedAttributes() {\n        return ['disabled'];\n    }\n\n    /**\n     * @summary A static property that indicates whether the custom element is form-associated or not.\n     * Form-associated custom elements are elements that can participate in form submission.\n     * @type {boolean}\n     */\n    static formAssociated = true;\n\n    /**\n     * @summary Callback function that is called when the custom element is associated with a form.\n     * This function sets the internal `_form` property to the associated form.\n     * @param {HTMLFormElement} form The form the custom element is associated with.\n     */\n    formAssociatedCallback(form) {\n        this._form = form;\n    }\n\n    /**\n     * @summary Callback function that is called when the form-associated state of the custom element changes.\n     * This function updates the 'disabled' attribute of the element based on the new state.\n     * @param {boolean} disabled The new form-associated state.\n     */\n    formDisabledCallback(disabled) {\n        if (disabled) {\n            this.setAttribute('disabled', '');\n        } else {\n            this.removeAttribute('disabled');\n        }\n    }\n\n    /**\n     * Setup attributes for the Button element.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draw method for the Button element.\n     * @returns {object} fragment - The document fragment containing the drawn element.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement(this.hasAttribute('href') ? 'a' : 'button');\n        if (this.hasAttribute('href')) {\n            native.setAttribute('href', this.getAttribute('href'));\n        } else {\n            if (this.type === 'submit') {\n                native.setAttribute('type', 'submit');\n            }\n        }\n\n        native.classList.add('native-button');\n        native.setAttribute('part', 'native');\n\n        this.classList.remove('wje-button-disabled');\n\n        if (this.disabled) native.classList.add('wje-button-disabled');\n\n        if (this.variant) native.classList.add('wje-button-' + this.variant);\n\n        if (this.hasAttribute('round')) native.classList.add('wje-button-round');\n\n        if (this.hasAttribute('circle')) native.classList.add('wje-button-circle');\n\n        if (this.outline) native.classList.add('wje-outline');\n\n        if (this.fill) native.classList.add('wje-button-' + this.fill);\n\n        if (this.size) native.classList.add('wje-button-' + this.size);\n\n        if (\n            (this.querySelectorAll('[slot=caret]').length < 1 && this.hasAttribute('caret')) ||\n            this.hasAttribute('only-caret')\n        ) {\n            let i = document.createElement('wje-icon');\n            i.style.setProperty('--wje-icon-size', '14px');\n            i.setAttribute('slot', 'caret');\n            i.setAttribute('name', 'chevron-down');\n            i.setAttribute('part', 'caret');\n\n            this.appendChild(i);\n        }\n\n        if (this.active) {\n            this.classList.add('wje-active');\n            let i = document.createElement('wje-icon');\n            i.setAttribute('name', 'check');\n\n            this.appendChild(i);\n        }\n\n        native.classList.add('wje-color-' + this.color, 'wje-color');\n\n        let span = document.createElement('span');\n        span.setAttribute('part', 'inner');\n        span.classList.add('button-inner');\n\n        let slot = document.createElement('slot');\n        slot.setAttribute('name', 'icon-only');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        slot.setAttribute('name', 'start');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        slot.setAttribute('name', 'end');\n        span.appendChild(slot);\n\n        slot = document.createElement('slot');\n        slot.setAttribute('name', 'caret');\n        span.appendChild(slot);\n\n        this.hasToggle = WjElementUtils.hasSlot(this, 'toggle');\n\n        if (this.hasToggle) {\n            this.slotToggle = document.createElement('slot');\n            this.slotToggle.setAttribute('name', 'toggle');\n\n            span.appendChild(this.slotToggle);\n        }\n\n        native.appendChild(span);\n\n        if (this.tooltip) {\n            let tooltip = document.createElement('wje-tooltip');\n            tooltip.setAttribute('content', this.getAttribute('tooltip'));\n            tooltip.setAttribute('placement', this.getAttribute('tooltip-placement') || 'top');\n            tooltip.appendChild(native);\n\n            fragment.appendChild(tooltip);\n        } else {\n            fragment.appendChild(native);\n        }\n\n        return fragment;\n    }\n\n    /**\n     * After draw method for the Button element.\n     */\n    afterDraw() {\n        if (this.hasAttribute('route')) {\n            this.unbindRouterLinks = bindRouterLinks(this.parentElement, { selector: false });\n        }\n\n        // nastavenie toggle podla atributu, ak nie je nastaveny, tak sa zobrazi vzdy prvy element\n        if (this.hasToggle) {\n            if (this.toggle === 'off') {\n                this.slotToggle.assignedNodes()[1].classList.add('show');\n                this.setAttribute('value', 'off');\n            } else {\n                this.slotToggle.assignedNodes()[0].classList.add('show');\n                this.setAttribute('value', 'on');\n            }\n        }\n\n        if (this.hasAttribute('custom-event')) {\n            event.addListener(this, 'click', null, this.#populateCustomEvent);\n        }\n\n        if (this.hasAttribute('dialog')) {\n            event.addListener(this, 'click', null, this.eventDialogOpen);\n        } else {\n            event.addListener(this, 'click', 'wje-button:click', null); // { stopPropagation: this.stopPropagation } - zrusene kvoli dropdown kde som nevedel odchytit event click\n        }\n\n        if (this.hasToggle)\n            event.addListener(this, 'click', 'wje-button:toggle', this.toggleStates, {\n                stopPropagation: this.stopPropagation,\n            });\n\n        if (this.type === 'submit') {\n            event.addListener(this, 'click', 'wje-button:submit', () => {\n                console.log('submit', this.internals_.form);\n                event.dispatchCustomEvent(this.internals_.form, 'submit', {});\n            });\n        }\n\n        if (this.type === 'reset') {\n            event.addListener(this, 'click', 'wje-button:reset', () => {\n                this.internals_.form.reset();\n            });\n        }\n    }\n\n    /**\n     * Before disconnect method for the Button element.\n     */\n    beforeDisconnect() {\n        // remove all events from the button\n        event.removeListener(this, 'click', null, this.eventDialogOpen);\n        event.removeListener(this, 'click', 'wje-button:click', null);\n        event.removeListener(this, 'click', 'wje-button:toggle', this.toggleStates);\n        event.removeListener(this, 'click', null, this.#populateCustomEvent);\n        event.removeListener(this, 'click', 'wje-button:submit', null);\n        event.removeListener(this, 'click', 'wje-button:reset', null);\n\n        this.removeEventListener('click', this.eventDialogOpen);\n        this.unbindRouterLinks?.();\n    }\n\n    /**\n     * Event dialog open method for the Button element.\n     * @param {Event} e The event object\n     */\n    eventDialogOpen = (e) => {\n        event.dispatchCustomEvent(this, this.dialog);\n    };\n\n    /**\n     * Toggle states method for the Button element.\n     */\n    toggleStates = () => {\n        const nodes = this.slotToggle.assignedNodes().filter((node) => node.nodeType === Node.ELEMENT_NODE);\n\n        nodes.forEach((node, index) => {\n            if (node.classList.contains('show')) {\n                node.classList.remove('show');\n            } else {\n                node.classList.add('show');\n                this.setAttribute('value', index === 0 ? 'on' : 'off');\n            }\n        });\n    }\n\n    /**\n     * Dispatches a custom event with specified parameters.\n     * This method uses the `customEvent` and `customEventParameters` properties\n     * to create and dispatch a `CustomEvent`. The event is configured to be\n     * composed and bubbles up through the DOM.\n     * @returns {void} This method does not return a value.\n     */\n    #populateCustomEvent() {\n        this.dispatchEvent(\n          new CustomEvent(this.customEvent, { detail: this.customEventParameters, composed: true, bubbles: true })\n        );\n    }\n}\n","import Button from './button.element.js';\n\nexport default Button;\n\nButton.define('wje-button', Button);\n"],"names":[],"mappings":"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"}

package/dist/wje-chip.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, { WjElementUtils, event } from "./wje-element.js";
-const styles = "/*\n[ WJ Chip ]\n*/\n\n.native-chip {\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 14px;\n    letter-spacing: -0.006em;\n    margin: 0;\n    padding: 0.5rem 0.75rem;\n    text-align: center;\n    cursor: pointer;\n    white-space: nowrap;\n    text-shadow: none;\n    box-shadow: none;\n    border: 0 none;\n    line-height: 14px;\n    min-height: 28px;\n    height: 28px;\n    width: 100%;\n    max-width: fit-content;\n    min-width: 28px;\n    position: relative;\n    transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);\n    border-radius: var(--wje-border-radius-pill);\n    overflow: hidden;\n    vertical-align: middle;\n    box-sizing: border-box;\n}\n\n:host(.focus) {\n    box-shadow: none;\n}\n\n:host(.wje-active) .native-chip {\n    border: 1px solid var(--wje-color-primary-11);\n    background-color: var(--wje-color-contrast-3);\n    color: var(--wje-color);\n}\n\n:host(:focus, :active:focus, .wje-active:focus) {\n    outline: none !important;\n}\n\n.check {\n    display: none;\n}\n\n:host([active]) {\n    .check {\n        display: block;\n        margin-inline: 4px 0;\n    }\n}\n\n:host([disabled]) {\n    opacity: 0.5;\n    border: 0;\n    pointer-events: none;\n    cursor: not-allowed;\n}\n\n::slotted(wje-avatar) {\n    width: 22px;\n    height: 22px;\n}\n\n::slotted(wje-avatar:first-child) {\n    margin-inline: -8px 8px;\n    margin-top: -4px;\n    margin-bottom: -4px;\n}\n\n::slotted(wje-icon:first-child) {\n    margin: -4px 8px -4px -4px;\n}\n\n::slotted(wje-icon:last-child) {\n    margin: -4px -4px -4px 8px;\n}\n\nslot[name='end'].has-content {\n    display: block;\n    margin-inline-start: 8px;\n}\n\nwje-button {\n    --wje-button-border-radius: 50%;\n    --wje-button-margin-inline: 0.25rem -0.5rem;\n    --wje-padding-top: 0.15rem;\n    --wje-padding-start: 0.15rem;\n    --wje-padding-end: 0.15rem;\n    --wje-padding-bottom: 0.15rem;\n}\n\n/*BG - TEXT*/\n.native-chip.wje-color-primary {\n    background-color: var(--wje-color-primary-1);\n    color: var(--wje-color-primary-9);\n}\n\n.native-chip.wje-color-complete {\n    background-color: var(--wje-color-complete-1);\n    color: var(--wje-color-complete-9);\n}\n\n.native-chip.wje-color-success {\n    background-color: var(--wje-color-success-1);\n    color: var(--wje-color-success-9);\n}\n\n.native-chip.wje-color-warning {\n    background-color: var(--wje-color-warning-2);\n    color: var(--wje-color-warning-11);\n}\n\n.native-chip.wje-color-danger {\n    background-color: var(--wje-color-danger-1);\n    color: var(--wje-color-danger-9);\n}\n\n.native-chip.wje-color-info {\n    background-color: var(--wje-color-info-1);\n    color: var(--wje-color-info-9);\n}\n\n.native-chip.wje-color-default {\n    background-color: var(--wje-color-contrast-3);\n    color: var(--wje-color-contrast-11);\n}\n\n/*HOVER*/\n@media (any-hover: hover) {\n    .native-chip.wje-color-primary:hover {\n        background-color: var(--wje-color-primary-4);\n        color: var(--wje-color-primary-10);\n    }\n\n    .native-chip.wje-color-complete:hover {\n        background-color: var(--wje-color-complete-4);\n        color: var(--wje-color-complete-10);\n    }\n\n    .native-chip.wje-color-success:hover {\n        background-color: var(--wje-color-success-4);\n        color: var(--wje-color-success-10);\n    }\n\n    .native-chip.wje-color-warning:hover {\n        background-color: var(--wje-color-warning-4);\n        color: var(--wje-color-warning-11);\n    }\n\n    .native-chip.wje-color-danger:hover {\n        background-color: var(--wje-color-danger-4);\n        color: var(--wje-color-danger-10);\n    }\n\n    .native-chip.wje-color-info:hover {\n        background-color: var(--wje-color-info-4);\n        color: var(--wje-color-info-10);\n    }\n\n    .native-chip.wje-color-default:hover {\n        background-color: var(--wje-color-contrast-4);\n        color: var(--wje-color-contrast-11);\n    }\n}\n";
+const styles = "/*\n[ WJ Chip ]\n*/\n\n:host {\n    display: inline-flex;\n    --wje-chip-round-border-radius: var(--wje-border-radius-large);\n    --wje-button-border-radius: var(--wje-chip-round-border-radius);\n}\n\n.native-chip {\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n    font-size: var(--wje-font-size);\n    line-height: 1;\n    letter-spacing: -0.006em;\n    margin: 0;\n    padding: 0 var(--wje-spacing-small);\n    text-align: center;\n    cursor: pointer;\n    white-space: nowrap;\n    text-shadow: none;\n    box-shadow: none;\n    border: 0 none;\n    width: 100%;\n    height: 28px;\n    max-width: fit-content;\n    position: relative;\n    transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);\n    border-radius: var(--wje-border-radius-pill);\n    overflow: hidden;\n    vertical-align: middle;\n    box-sizing: border-box;\n}\n\n:host(.focus) {\n    box-shadow: none;\n}\n\n:host(.wje-active) .native-chip {\n    border: 1px solid var(--wje-color-primary-11);\n    background-color: var(--wje-color-contrast-3);\n    color: var(--wje-color);\n}\n\n:host(:focus, :active:focus, .wje-active:focus) {\n    outline: none !important;\n}\n\n:host([size='small']) .native-chip {\n    font-size: var(--wje-font-size-small);\n    height: 24px;\n    padding: var(--wje-spacing-3x-small)  var(--wje-spacing-x-small);\n    wje-button {\n        --wje-button-margin-inline: var(--wje-spacing-3x-small) calc(-1 * var(--wje-spacing-3x-small));\n    }\n}\n\n:host([size='large']) .native-chip {\n    font-size: var(--wje-font-size-medium);\n    height: 34px;\n    padding: var(--wje-spacing-x-small) var(--wje-spacing-small);\n\n}\n\n:host([round]) .native-chip {\n    border-radius: var(--wje-chip-round-border-radius);\n}\n\n.check {\n    display: none;\n}\n\n:host([active]) {\n    .check {\n        display: block;\n        margin-inline: 4px 0;\n    }\n}\n\n:host([disabled]) {\n    opacity: 0.5;\n    border: 0;\n    pointer-events: none;\n    cursor: not-allowed;\n}\n\n::slotted(wje-avatar) {\n    width: 22px;\n    height: 22px;\n}\n\n::slotted(wje-avatar:first-child) {\n    margin-inline: -8px 8px;\n    margin-top: -4px;\n    margin-bottom: -4px;\n}\n\n::slotted(wje-icon:first-child) {\n    margin: -4px 8px -4px -4px;\n}\n\n::slotted(wje-icon:last-child) {\n    margin: -4px -4px -4px 8px;\n}\n\nslot[name='end'].has-content {\n    display: block;\n    margin-inline-start: 8px;\n}\n\nwje-button {\n    /*--wje-button-border-radius: 50%;*/\n    --wje-button-margin-inline: 0.25rem -0.5rem;\n    --wje-padding-top: 0.15rem;\n    --wje-padding-start: 0.15rem;\n    --wje-padding-end: 0.15rem;\n    --wje-padding-bottom: 0.15rem;\n}\n\n/*BG - TEXT*/\n.native-chip.wje-color-primary {\n    background-color: var(--wje-color-primary-1);\n    color: var(--wje-color-primary-9);\n}\n\n.native-chip.wje-color-complete {\n    background-color: var(--wje-color-complete-1);\n    color: var(--wje-color-complete-9);\n}\n\n.native-chip.wje-color-success {\n    background-color: var(--wje-color-success-1);\n    color: var(--wje-color-success-9);\n}\n\n.native-chip.wje-color-warning {\n    background-color: var(--wje-color-warning-2);\n    color: var(--wje-color-warning-11);\n}\n\n.native-chip.wje-color-danger {\n    background-color: var(--wje-color-danger-1);\n    color: var(--wje-color-danger-9);\n}\n\n.native-chip.wje-color-info {\n    background-color: var(--wje-color-info-1);\n    color: var(--wje-color-info-9);\n}\n\n.native-chip.wje-color-default {\n    background-color: var(--wje-color-contrast-3);\n    color: var(--wje-color-contrast-11);\n}\n\n/*HOVER*/\n@media (any-hover: hover) {\n    .native-chip.wje-color-primary:hover {\n        background-color: var(--wje-color-primary-4);\n        color: var(--wje-color-primary-10);\n    }\n\n    .native-chip.wje-color-complete:hover {\n        background-color: var(--wje-color-complete-4);\n        color: var(--wje-color-complete-10);\n    }\n\n    .native-chip.wje-color-success:hover {\n        background-color: var(--wje-color-success-4);\n        color: var(--wje-color-success-10);\n    }\n\n    .native-chip.wje-color-warning:hover {\n        background-color: var(--wje-color-warning-4);\n        color: var(--wje-color-warning-11);\n    }\n\n    .native-chip.wje-color-danger:hover {\n        background-color: var(--wje-color-danger-4);\n        color: var(--wje-color-danger-10);\n    }\n\n    .native-chip.wje-color-info:hover {\n        background-color: var(--wje-color-info-4);\n        color: var(--wje-color-info-10);\n    }\n\n    .native-chip.wje-color-default:hover {\n        background-color: var(--wje-color-contrast-4);\n        color: var(--wje-color-contrast-11);\n    }\n}\n";
 class Chip extends WJElement {
   /**
    * Chip constructor method.
@@ -15,6 +15,60 @@ class Chip extends WJElement {
      */
     __publicField(this, "className", "Chip");
   }
+  /**
+   * Sets or removes the "round" attribute on the element based on the provided value.
+   * @param {boolean} value Determines whether the "round" attribute should be set or removed.
+   * If true, the "round" attribute is added. If false, the "round"
+   * attribute is removed.
+   */
+  set round(value) {
+    if (value) {
+      this.setAttribute("round", "");
+    } else {
+      this.removeAttribute("round");
+    }
+  }
+  /**
+   * Checks if the 'round' attribute is present on the element.
+   * @returns {boolean} Returns true if the 'round' attribute exists, otherwise false.
+   */
+  get round() {
+    return this.hasAttribute("round");
+  }
+  /**
+   * Sets the size attribute of the element.
+   * @param {string} value The value to set for the size attribute.
+   */
+  set size(value) {
+    this.setAttribute("size", value);
+  }
+  /**
+   * Retrieves the 'size' attribute of the current element.
+   * @returns {string | null} The value of the 'size' attribute, or null if the attribute is not set.
+   */
+  get size() {
+    return this.getAttribute("size");
+  }
+  /**
+   * Sets or removes the "removable" attribute on the element.
+   * @param {boolean} value A boolean indicating whether the element should have the "removable" attribute.
+   * If true, the "removable" attribute is added;
+   * if false, the "removable" attribute is removed.
+   */
+  set removable(value) {
+    if (value) {
+      this.setAttribute("removable", "");
+    } else {
+      this.removeAttribute("removable");
+    }
+  }
+  /**
+   * Determines if the element has the 'removable' attribute.
+   * @returns {boolean} True if the element has the 'removable' attribute, otherwise false.
+   */
+  get removable() {
+    return this.hasAttribute("removable");
+  }
   /**
    * Getter for the CSS stylesheet.
    * @returns {*}
@@ -43,7 +97,16 @@ class Chip extends WJElement {
     remove.setAttribute("part", "remove");
     remove.setAttribute("fill", "link");
     remove.setAttribute("color", this.color || "default");
-    remove.innerHTML = `<wje-icon name="x"></wje-icon>`;
+    remove.round = !this.round;
+    if (this.hasAttribute("size")) {
+      if (this.size === "small") {
+        remove.innerHTML = `<wje-icon name="x" size="small"></wje-icon>`;
+      } else if (this.size === "large") {
+        remove.innerHTML = `<wje-icon name="x"></wje-icon>`;
+      }
+    } else {
+      remove.innerHTML = `<wje-icon name="x"></wje-icon>`;
+    }
     let active = document.createElement("wje-icon");
     active.setAttribute("name", "check");
     active.classList.add("check");
@@ -54,7 +117,7 @@ class Chip extends WJElement {
     native.appendChild(slot);
     native.appendChild(slotEnd);
     native.appendChild(active);
-    if (this.hasAttribute("removable")) native.appendChild(remove);
+    if (this.removable) native.appendChild(remove);
     fragment.appendChild(native);
     this.removeElement = remove;
     this.slotEnd = slotEnd;

package/dist/wje-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-chip.js","sources":["../packages/wje-chip/chip.element.js","../packages/wje-chip/chip.js"],"sourcesContent":["import { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This method dispatches a custom event named \"wje-chip:remove\".\n * It is triggered when the remove button is clicked, which happens when the chip is removed.\n * The event is dispatched on the current instance of the Chip class.\n * @documentation https://elements.webjet.sk/components/chip\n * @status stable\n * @augments WJElement\n * @slot - The chip main content.\n * @csspart native - The component's native wrapper.\n * //@fires wje-chip:remove - Dispatched when the chip is removed;\n */\nexport default class Chip extends WJElement {\n    /**\n     * Chip constructor method.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * Class name for the Chip element.\n     * @type {string}\n     */\n    className = 'Chip';\n\n    /**\n     * Getter for the CSS stylesheet.\n     * @returns {*}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the Chip element.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-chip');\n\n        let slot = document.createElement('slot');\n\n        let slotEnd = document.createElement('slot');\n        slotEnd.setAttribute('name', 'end');\n\n        let remove = document.createElement('wje-button');\n        remove.setAttribute('part', 'remove');\n        remove.setAttribute('fill', 'link');\n        remove.setAttribute('color', this.color || 'default');\n        remove.innerHTML = `<wje-icon name=\"x\"></wje-icon>`;\n\n        let active = document.createElement('wje-icon');\n        active.setAttribute('name', 'check');\n        active.classList.add('check');\n\n        // Add color\n        if (this.hasAttribute('color')) native.classList.add('wje-color-' + this.color, 'wje-color');\n        else native.classList.add('wje-color-default', 'wje-color');\n\n        if (this.disabled) this.classList.add('wje-disabled');\n\n        if (this.outline) this.classList.add('wje-outline');\n\n        native.appendChild(slot);\n        native.appendChild(slotEnd);\n        native.appendChild(active);\n\n        if (this.hasAttribute('removable')) native.appendChild(remove);\n\n        fragment.appendChild(native);\n\n        this.removeElement = remove;\n        this.slotEnd = slotEnd;\n\n        return fragment;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     */\n    afterDraw() {\n        if (WjElementUtils.hasSlotContent(this.context, 'end')) this.slotEnd.classList.add('has-content');\n\n        event.addListener(this.removeElement, 'click', 'wje:chip-remove', null, { stopPropagation: true });\n    }\n\n    /**\n     * Before disconnect event for the Chip element.\n     */\n    beforeDisconnect() {\n        event.removeListener(this.removeElement, 'click', 'wje:chip-remove');\n    }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Chip from './chip.element.js';\n\n// export * from \"./chip.element.js\";\nexport default Chip;\n\nWJElement.define('wje-chip', Chip);\n"],"names":[],"mappings":";;;;;AAce,MAAM,aAAa,UAAU;AAAA;AAAA;AAAA;AAAA,EAIxC,cAAc;AACV,UAAO;AAOX;AAAA;AAAA;AAAA;AAAA,qCAAY;AAAA,EANhB;AAAA;AAAA;AAAA;AAAA;AAAA,EAYI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,UAAU,IAAI,aAAa;AAElC,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,QAAI,UAAU,SAAS,cAAc,MAAM;AAC3C,YAAQ,aAAa,QAAQ,KAAK;AAElC,QAAI,SAAS,SAAS,cAAc,YAAY;AAChD,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,aAAa,QAAQ,MAAM;AAClC,WAAO,aAAa,SAAS,KAAK,SAAS,SAAS;AACpD,WAAO,YAAY;AAEnB,QAAI,SAAS,SAAS,cAAc,UAAU;AAC9C,WAAO,aAAa,QAAQ,OAAO;AACnC,WAAO,UAAU,IAAI,OAAO;AAG5B,QAAI,KAAK,aAAa,OAAO,EAAG,QAAO,UAAU,IAAI,eAAe,KAAK,OAAO,WAAW;AAAA,QACtF,QAAO,UAAU,IAAI,qBAAqB,WAAW;AAE1D,QAAI,KAAK,SAAU,MAAK,UAAU,IAAI,cAAc;AAEpD,QAAI,KAAK,QAAS,MAAK,UAAU,IAAI,aAAa;AAElD,WAAO,YAAY,IAAI;AACvB,WAAO,YAAY,OAAO;AAC1B,WAAO,YAAY,MAAM;AAEzB,QAAI,KAAK,aAAa,WAAW,EAAG,QAAO,YAAY,MAAM;AAE7D,aAAS,YAAY,MAAM;AAE3B,SAAK,gBAAgB;AACrB,SAAK,UAAU;AAEf,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,QAAI,eAAe,eAAe,KAAK,SAAS,KAAK,EAAG,MAAK,QAAQ,UAAU,IAAI,aAAa;AAEhG,UAAM,YAAY,KAAK,eAAe,SAAS,mBAAmB,MAAM,EAAE,iBAAiB,MAAM;AAAA,EACzG;AAAA;AAAA;AAAA;AAAA,EAKI,mBAAmB;AACf,UAAM,eAAe,KAAK,eAAe,SAAS,iBAAiB;AAAA,EAC3E;AACA;ACnGA,UAAU,OAAO,YAAY,IAAI;"}
+{"version":3,"file":"wje-chip.js","sources":["../packages/wje-chip/chip.element.js","../packages/wje-chip/chip.js"],"sourcesContent":["import { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This method dispatches a custom event named \"wje-chip:remove\".\n * It is triggered when the remove button is clicked, which happens when the chip is removed.\n * The event is dispatched on the current instance of the Chip class.\n * @documentation https://elements.webjet.sk/components/chip\n * @status stable\n * @augments WJElement\n * @slot - The chip main content.\n * @csspart native - The component's native wrapper.\n * //@fires wje-chip:remove - Dispatched when the chip is removed;\n */\nexport default class Chip extends WJElement {\n    /**\n     * Chip constructor method.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * Sets or removes the \"round\" attribute on the element based on the provided value.\n     * @param {boolean} value Determines whether the \"round\" attribute should be set or removed.\n     * If true, the \"round\" attribute is added. If false, the \"round\"\n     * attribute is removed.\n     */\n    set round(value) {\n        if (value) {\n            this.setAttribute('round', '');\n        } else {\n            this.removeAttribute('round');\n        }\n    }\n\n    /**\n     * Checks if the 'round' attribute is present on the element.\n     * @returns {boolean} Returns true if the 'round' attribute exists, otherwise false.\n     */\n    get round() {\n        return this.hasAttribute('round');\n    }\n\n    /**\n     * Sets the size attribute of the element.\n     * @param {string} value The value to set for the size attribute.\n     */\n    set size(value) {\n        this.setAttribute('size', value);\n    }\n\n    /**\n     * Retrieves the 'size' attribute of the current element.\n     * @returns {string | null} The value of the 'size' attribute, or null if the attribute is not set.\n     */\n    get size() {\n        return this.getAttribute('size');\n    }\n\n    /**\n     * Sets or removes the \"removable\" attribute on the element.\n     * @param {boolean} value A boolean indicating whether the element should have the \"removable\" attribute.\n     * If true, the \"removable\" attribute is added;\n     * if false, the \"removable\" attribute is removed.\n     */\n    set removable(value) {\n        if (value) {\n            this.setAttribute('removable', '');\n        } else {\n            this.removeAttribute('removable');\n        }\n    }\n\n    /**\n     * Determines if the element has the 'removable' attribute.\n     * @returns {boolean} True if the element has the 'removable' attribute, otherwise false.\n     */\n    get removable() {\n        return this.hasAttribute('removable');\n    }\n\n    /**\n     * Class name for the Chip element.\n     * @type {string}\n     */\n    className = 'Chip';\n\n    /**\n     * Getter for the CSS stylesheet.\n     * @returns {*}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the Chip element.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-chip');\n\n        let slot = document.createElement('slot');\n\n        let slotEnd = document.createElement('slot');\n        slotEnd.setAttribute('name', 'end');\n\n        let remove = document.createElement('wje-button');\n        remove.setAttribute('part', 'remove');\n        remove.setAttribute('fill', 'link');\n        remove.setAttribute('color', this.color || 'default');\n        remove.round = !this.round;\n\n        if(this.hasAttribute('size')) {\n            if(this.size === 'small') {\n                remove.innerHTML = `<wje-icon name=\"x\" size=\"small\"></wje-icon>`;\n            } else if (this.size === 'large') {\n                remove.innerHTML = `<wje-icon name=\"x\"></wje-icon>`;\n            }\n        } else {\n            remove.innerHTML = `<wje-icon name=\"x\"></wje-icon>`;\n        }\n\n        let active = document.createElement('wje-icon');\n        active.setAttribute('name', 'check');\n        active.classList.add('check');\n\n        // Add color\n        if (this.hasAttribute('color')) native.classList.add('wje-color-' + this.color, 'wje-color');\n        else native.classList.add('wje-color-default', 'wje-color');\n\n        if (this.disabled) this.classList.add('wje-disabled');\n\n        if (this.outline) this.classList.add('wje-outline');\n\n        native.appendChild(slot);\n        native.appendChild(slotEnd);\n        native.appendChild(active);\n\n        if (this.removable) native.appendChild(remove);\n\n        fragment.appendChild(native);\n\n        this.removeElement = remove;\n        this.slotEnd = slotEnd;\n\n        return fragment;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     */\n    afterDraw() {\n        if (WjElementUtils.hasSlotContent(this.context, 'end')) this.slotEnd.classList.add('has-content');\n\n        event.addListener(this.removeElement, 'click', 'wje:chip-remove', null, { stopPropagation: true });\n    }\n\n    /**\n     * Before disconnect event for the Chip element.\n     */\n    beforeDisconnect() {\n        event.removeListener(this.removeElement, 'click', 'wje:chip-remove');\n    }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Chip from './chip.element.js';\n\n// export * from \"./chip.element.js\";\nexport default Chip;\n\nWJElement.define('wje-chip', Chip);\n"],"names":[],"mappings":"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"}

package/dist/wje-kanban.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-kanban.js","sources":["../packages/wje-kanban/kanban.element.js","../packages/wje-kanban/kanban.js"],"sourcesContent":["import Checkbox from '../wje-checkbox/checkbox.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport MenuItem from '../wje-menu-item/menu-item.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Kanban` is a custom web component that represents a Kanban board with draggable columns and cards.\n * @summary This element represents a Kanban board.\n * @documentation https://elements.webjet.sk/components/kanban\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the Kanban board.\n * @csspart native - Styles the native part of the Kanban board.\n * @csspart pool - Styles the pool of the Kanban board.\n * @tag wje-kanban\n */\nexport default class Kanban extends WJElement {\n    /**\n     * Creates an instance of Kanban.\n     * @class\n     */\n    constructor() {\n        super();\n        this.totalPages = 0; // Total number of pages\n        this.isLoading = []; // Array to hold loading status of each page\n        this._response = {}; // Response from the API\n        this.isDragging = false; // Flag to indicate if an element is being dragged\n        this.selectedCards = []; // Array to hold selected cards\n    }\n\n    /**\n     * Dependencies of the Option component.\n     */\n    dependencies = {\n        'wje-checkbox': Checkbox,\n        'wje-menu-item': MenuItem,\n    };\n\n    /**\n     * Sets the URL for fetching data.\n     * @param value {string}\n     */\n    set response(value) {\n        this._response = value;\n    }\n\n    /**\n     * Gets the URL for fetching data.\n     * @returns {*|{}|{}}\n     */\n    get response() {\n        return this._response;\n    }\n\n    /**\n     * Sets the URL for fetching data.\n     * @param value {array}\n     */\n    set selectedItems(value) {\n        this._selectedItems = value;\n    }\n\n    /**\n     * Gets the URL for fetching data.\n     * @returns {Array}\n     */\n    get selectedItems() {\n        return this._selectedItems;\n    }\n\n    /**\n     * Sets the URL for fetching data.\n     * @type {string}\n     */\n    className = 'Kanban';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Prepares the component before drawing.\n     * @param {object} context The context for drawing.\n     * @param {object} store The store for drawing.\n     * @param {object} params The parameters for drawing.\n     */\n    async beforeDraw(context, store, params) {\n        this.response = await this.getPages();\n    }\n\n    /**\n     * Draws the component after it has been prepared.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native');\n        native.setAttribute('part', 'native-infinite-scroll');\n\n        let pools = this.getPool(this.response, this.poolName);\n\n        // Add pools to the native element\n        for (const statusName in pools) {\n            if (pools.hasOwnProperty(statusName)) {\n                let pool = this.htmlPool(statusName, pools[statusName].length);\n\n                native.appendChild(pool);\n                const items = pools[statusName];\n\n                this.customForeach(pool, items);\n            }\n        }\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Called after the component has been drawn.\n     */\n    afterDraw() {\n        this.ui = {\n            elBoard: this.shadowRoot.getElementById('board'),\n            elTotalCardCount: this.shadowRoot.getElementById('totalCards'),\n            elCardPlaceholder: null,\n        };\n\n        this.setupDragAndDropEvents();\n        this.setupSelectAllCardsEvent();\n        this.setupMenuItemClickEvents();\n    }\n\n    /**\n     * Iterates over a list of items, generates an HTML card for each, and appends it to the specified pool's content area.\n     * @param {HTMLElement} pool The container element where the cards will be appended. It should contain an element with the class `.pool-content`.\n     * @param {Array} items An array of items used to generate HTML cards.\n     */\n    customForeach = (pool, items) => {\n        for (const item of items) {\n            let card = this.htmlCard(item);\n            pool.querySelector('.pool-content').appendChild(card);\n        }\n    };\n\n    /**\n     * Sets up the drag and drop events for the component.\n     */\n    setupDragAndDropEvents() {\n        this.live('dragstart', '.pool .card', (e) => {\n            this.isDragging = true;\n            e.dataTransfer.clearData();\n            e.dataTransfer.setData('text/plain', e.target.dataset.id);\n            e.dataTransfer.dropEffect = 'move';\n            e.target.style.opacity = '0.5';\n\n            const rect = e.target.getBoundingClientRect();\n\n            this.draggedElementWidth = rect.width;\n            this.draggedElementHeight = rect.height;\n        });\n\n        this.live('dragend', '.pool .card', (e) => {\n            e.target.style.opacity = '';\n            if (this.ui.elCardPlaceholder) {\n                this.ui.elCardPlaceholder.remove();\n            }\n            this.ui.elCardPlaceholder = null;\n            this.isDragging = false;\n        });\n\n        this.live('dragover', '.pool, .pool .card, .pool .card-placeholder', (e) => {\n            e.preventDefault();\n            e.dataTransfer.dropEffect = 'move';\n\n            if (e.target.classList.contains('pool')) {\n                e.target.appendChild(this.getCardPlaceholder());\n            } else if (e.target.classList.contains('card')) {\n                e.target.parentNode.insertBefore(this.getCardPlaceholder(), e.target);\n            }\n        });\n\n        this.live('drop', '.pool, .pool .card-placeholder', (e) => {\n            e.preventDefault();\n            if (!this.isDragging) return;\n\n            const todo_id = +e.dataTransfer.getData('text');\n            const card = this.shadowRoot.querySelector('.card[data-id=\"' + todo_id + '\"]');\n\n            if (e.target.classList.contains('pool')) {\n                e.target.querySelector('.pool-content').appendChild(card);\n            } else if (e.target.classList.contains('card-placeholder')) {\n                e.target.parentNode.replaceChild(card, e.target);\n            }\n\n            window.setTimeout(this.updateColumnItemCount, 100);\n        });\n    }\n\n    /**\n     * Sets up the select all cards event for the component.\n     */\n    setupSelectAllCardsEvent() {\n        // Event listener for selecting all cards in a pool\n        this.live('wje-toggle:change', '.select-all-cards', (e) => {\n            const pool = e.target.closest('.pool');\n            this.updateSelectedCards(pool, e.target.checked);\n        });\n\n        // Event listener for selecting individual cards\n        this.live('wje-toggle:change', '.select-card', (e) => {\n            const card = e.target.closest('.card');\n            this.setSelectedCards(e.target.checked, card);\n\n            if (this.selectedCards.length === 0) {\n                e.target.closest('.pool').querySelector('.select-all-cards').checked = false;\n            }\n\n            this.setSelectedItems();\n        });\n    }\n\n    /**\n     * Sets up the menu item click events for the component.\n     */\n    setupMenuItemClickEvents() {\n        this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n            menuItem.removeEventListener('wje-menu-item:click', this.menuItemClickHandler);\n        });\n\n        this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n            menuItem.addEventListener('wje-menu-item:click', this.menuItemClickHandler);\n        });\n    }\n\n    /**\n     * Handles the menu item click event.\n     * @param e\n     */\n    menuItemClickHandler = (e) => {\n        const action = e.target.dataset.action;\n        const pool = e.target.closest('.pool');\n\n        this.handlePoolAction(action, pool);\n    };\n\n    /**\n     * Updates the selected cards in the pool.\n     * @param pool {HTMLElement}\n     * @param isChecked {boolean}\n     */\n    updateSelectedCards(pool, isChecked) {\n        const cards = pool.querySelectorAll('.pool-content .card');\n\n        cards.forEach((card) => {\n            const checkbox = card.querySelector('wje-checkbox');\n            if (checkbox) {\n                checkbox.checked = isChecked;\n            }\n\n            this.setSelectedCards(isChecked, card);\n        });\n\n        this.setSelectedItems();\n    }\n\n    /**\n     * Updates the column item count.\n     */\n    updateColumnItemCount = () => {\n        const pools = this.shadowRoot.querySelectorAll('.pool');\n\n        pools.forEach((pool) => {\n            const itemCount = pool.querySelectorAll('.pool-content .card').length;\n            let itemCountDisplay = pool.querySelector('.item-count');\n\n            itemCountDisplay.innerHTML = itemCount;\n        });\n    };\n\n    /**\n     * Handles the pool action.\n     * @param action {string}\n     * @param pool {HTMLElement}\n     */\n    handlePoolAction(action, pool) {\n        switch (action) {\n            case 'move-left':\n                this.movePool(pool, 'left');\n                break;\n            case 'move-right':\n                this.movePool(pool, 'right');\n                break;\n            case 'rename-pool':\n                this.renamePool(pool);\n                break;\n            default:\n                console.log(`Neznáma akcia: ${action}`);\n        }\n    }\n\n    /**\n     * Moves the pool in the specified direction.\n     * @param pool {HTMLElement}\n     * @param direction {string}\n     */\n    movePool(pool, direction) {\n        const parent = pool.parentElement;\n\n        // Najprv odstránime všetky event listenery z aktuálnych stĺpcov (pools)\n        // Array.from(parent.children).forEach(removeEventListeners);\n\n        if (direction === 'left' && pool.previousElementSibling) {\n            // Presunieme pool doľava\n            parent.insertBefore(pool, pool.previousElementSibling);\n        } else if (direction === 'right' && pool.nextElementSibling) {\n            // Presunieme pool doprava\n            parent.insertBefore(pool.nextElementSibling, pool);\n        }\n\n        // Po presune stĺpcov (pools) musíme znova pripojiť event listenery\n        this.setupMenuItemClickEvents();\n    }\n\n    /**\n     * Renames the pool.\n     * @param pool {HTMLElement}\n     */\n    renamePool(pool) {\n        const newName = prompt('Zadajte nový názov pre stĺpec:');\n        if (newName) {\n            const header = pool.querySelector('.pool-header h4');\n            header.innerHTML = `${newName} (<span class=\"item-count\">0</span> položiek)`;\n            this.updateColumnItemCount(); // Aktualizovať počet položiek po premenovaní\n        }\n    }\n\n    /**\n     * Gets the card placeholder.\n     * @returns {null|*}\n     */\n    getCardPlaceholder() {\n        if (!this.ui.elCardPlaceholder) {\n            this.ui.elCardPlaceholder = document.createElement('div');\n            this.ui.elCardPlaceholder.className = 'card-placeholder';\n\n            this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n            this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n        } else {\n            this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n            this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n        }\n        return this.ui.elCardPlaceholder;\n    }\n\n    /**\n     * Adds a live event listener to the component.\n     * @param eventType {string}\n     * @param selector {string}\n     * @param callback {function}\n     */\n    live(eventType, selector, callback) {\n        const attachListener = (root) => {\n            root.addEventListener(\n                eventType,\n                (e) => {\n                    if (e.target.matches(selector)) {\n                        callback.call(e.target, e);\n                    }\n                },\n                false\n            );\n        };\n\n        const traverseAndAttach = (root) => {\n            attachListener(root);\n\n            root.querySelectorAll('*').forEach((node) => {\n                if (node.shadowRoot) {\n                    traverseAndAttach(node.shadowRoot);\n                }\n            });\n        };\n\n        traverseAndAttach(this.shadowRoot || this); // Start from the Shadow DOM if it exists\n    }\n\n    /**\n     * Sets the selected cards.\n     * @param isChecked {boolean}\n     * @param card {HTMLElement}\n     */\n    setSelectedCards(isChecked, card) {\n        if (isChecked) {\n            if (!this.selectedCards.includes(card)) {\n                this.selectedCards.push(card);\n            }\n        } else {\n            this.selectedCards = this.selectedCards.filter((selectedCard) => selectedCard !== card);\n        }\n    }\n\n    /**\n     * Sets the selected items.\n     */\n    setSelectedItems() {\n        const selectedIds = this.selectedCards.map((card) => card.getAttribute('data-id'));\n        this.selectedItems = this.response.filter((item) => selectedIds.includes(item.id));\n    }\n\n    /**\n     * Fetches the pages.\n     * @param page\n     * @returns {Promise<any>}\n     */\n    async getPages(page = 0) {\n        let hasParams = this.url.includes('?');\n        const response = await fetch(\n            `${this.url}${hasParams ? '&' : '?'}page=${page}&size=${this.size}${this?.queryParams}`\n        );\n        if (!response.ok) {\n            throw new Error(`An error occurred: ${response.status}`);\n        }\n        return await response.json();\n    }\n\n    /**\n     * Gets the pool.\n     * @param data {Array}\n     * @param poolName {string}\n     * @returns {*}\n     */\n    getPool = (data, poolName) => {\n        return data.reduce((acc, item) => {\n            const statusName = item.status.name;\n            if (!acc[statusName]) {\n                acc[statusName] = [];\n            }\n            acc[statusName].push(item);\n            return acc;\n        }, {});\n    };\n\n    /**\n     * Returns the HTML for the pool.\n     * @param title {string}\n     * @param countItems {number}\n     * @returns {Element}\n     */\n    htmlPool = (title, countItems) => {\n        let poolHtml = document.createElement('div');\n        poolHtml.classList.add('pool');\n\n        let header = document.createElement('div');\n        header.classList.add('pool-header');\n\n        let checkbox = document.createElement('wje-checkbox');\n        checkbox.setAttribute('type', 'checkbox');\n        checkbox.classList.add('select-all-cards');\n        checkbox.title = 'Select all cards';\n\n        let h4 = document.createElement('h4');\n        h4.textContent = title;\n\n        let badge = document.createElement('wje-badge');\n        badge.setAttribute('color', 'danger');\n        badge.classList.add('item-count');\n        badge.textContent = countItems;\n\n        let dropdown = document.createElement('wje-dropdown');\n        dropdown.setAttribute('placement', 'bottom-start');\n        dropdown.setAttribute('offset', '5');\n        dropdown.setAttribute('collapsible', '');\n        dropdown.innerHTML = `\n            <wje-button fill=\"link\" slot=\"trigger\" size=\"small\" round>\n                <wje-icon name=\"dots-vertical\"></wje-icon>\n            </wje-button>\n            <wje-menu active>\n                <wje-menu-item data-action=\"rename-pool\">\n                    <wj-label>Zmeniť názov</wj-label>\n                </wje-menu-item>\n                <wje-menu-item data-action=\"move-left\">\n                    <wj-label>Posunúť doľava</wj-label>\n                </wje-menu-item>\n                <wje-menu-item data-action=\"move-right\">\n                    <wj-label>Posunúť doprava</wj-label>\n                </wje-menu-item>\n            </wje-menu>\n        `;\n\n        header.appendChild(checkbox);\n        header.appendChild(h4);\n        header.appendChild(badge);\n        header.appendChild(dropdown);\n\n        let content = document.createElement('div');\n        content.classList.add('pool-content');\n\n        poolHtml.appendChild(header);\n        poolHtml.appendChild(content);\n\n        return poolHtml;\n    };\n\n    /**\n     * Returns the HTML for the card.\n     * @param item {Object}\n     * @returns {Element}\n     */\n    htmlCard = (item) => {\n        let card = document.createElement('div');\n        card.classList.add('card');\n        card.draggable = true;\n        card.setAttribute('data-id', item.id);\n        card.innerHTML = `\n            <wje-checkbox type=\"checkbox\" class=\"select-card\" title=\"Select card\"></wje-checkbox>\n            <div>${item.body}</div>\n        `;\n\n        return card;\n    };\n\n    dispatchEvent(event) {\n        return false;\n    }\n}\n","import Kanban from './kanban.element.js';\n\nexport default Kanban;\n\nKanban.define('wje-kanban', Kanban);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-kanban.js","sources":["../packages/wje-kanban/kanban.element.js","../packages/wje-kanban/kanban.js"],"sourcesContent":["import Checkbox from '../wje-checkbox/checkbox.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport MenuItem from '../wje-menu-item/menu-item.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Kanban` is a custom web component that represents a Kanban board with draggable columns and cards.\n * @summary This element represents a Kanban board.\n * @documentation https://elements.webjet.sk/components/kanban\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the Kanban board.\n * @csspart native-infinite-scroll - Styles the native part of the Kanban board.\n * @tag wje-kanban\n */\nexport default class Kanban extends WJElement {\n    /**\n     * Creates an instance of Kanban.\n     * @class\n     */\n    constructor() {\n        super();\n        this.totalPages = 0; // Total number of pages\n        this.isLoading = []; // Array to hold loading status of each page\n        this._response = {}; // Response from the API\n        this.isDragging = false; // Flag to indicate if an element is being dragged\n        this.selectedCards = []; // Array to hold selected cards\n    }\n\n    /**\n     * Dependencies of the Option component.\n     */\n    dependencies = {\n        'wje-checkbox': Checkbox,\n        'wje-menu-item': MenuItem,\n    };\n\n    /**\n     * Sets the URL for fetching data.\n     * @param value {string}\n     */\n    set response(value) {\n        this._response = value;\n    }\n\n    /**\n     * Gets the URL for fetching data.\n     * @returns {*|{}|{}}\n     */\n    get response() {\n        return this._response;\n    }\n\n    /**\n     * Sets the URL for fetching data.\n     * @param value {array}\n     */\n    set selectedItems(value) {\n        this._selectedItems = value;\n    }\n\n    /**\n     * Gets the URL for fetching data.\n     * @returns {Array}\n     */\n    get selectedItems() {\n        return this._selectedItems;\n    }\n\n    /**\n     * Sets the URL for fetching data.\n     * @type {string}\n     */\n    className = 'Kanban';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Prepares the component before drawing.\n     * @param {object} context The context for drawing.\n     * @param {object} store The store for drawing.\n     * @param {object} params The parameters for drawing.\n     */\n    async beforeDraw(context, store, params) {\n        this.response = await this.getPages();\n    }\n\n    /**\n     * Draws the component after it has been prepared.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native');\n        native.setAttribute('part', 'native-infinite-scroll');\n\n        let pools = this.getPool(this.response, this.poolName);\n\n        // Add pools to the native element\n        for (const statusName in pools) {\n            if (pools.hasOwnProperty(statusName)) {\n                let pool = this.htmlPool(statusName, pools[statusName].length);\n\n                native.appendChild(pool);\n                const items = pools[statusName];\n\n                this.customForeach(pool, items);\n            }\n        }\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Called after the component has been drawn.\n     */\n    afterDraw() {\n        this.ui = {\n            elBoard: this.shadowRoot.getElementById('board'),\n            elTotalCardCount: this.shadowRoot.getElementById('totalCards'),\n            elCardPlaceholder: null,\n        };\n\n        this.setupDragAndDropEvents();\n        this.setupSelectAllCardsEvent();\n        this.setupMenuItemClickEvents();\n    }\n\n    /**\n     * Iterates over a list of items, generates an HTML card for each, and appends it to the specified pool's content area.\n     * @param {HTMLElement} pool The container element where the cards will be appended. It should contain an element with the class `.pool-content`.\n     * @param {Array} items An array of items used to generate HTML cards.\n     */\n    customForeach = (pool, items) => {\n        for (const item of items) {\n            let card = this.htmlCard(item);\n            pool.querySelector('.pool-content').appendChild(card);\n        }\n    };\n\n    /**\n     * Sets up the drag and drop events for the component.\n     */\n    setupDragAndDropEvents() {\n        this.live('dragstart', '.pool .card', (e) => {\n            this.isDragging = true;\n            e.dataTransfer.clearData();\n            e.dataTransfer.setData('text/plain', e.target.dataset.id);\n            e.dataTransfer.dropEffect = 'move';\n            e.target.style.opacity = '0.5';\n\n            const rect = e.target.getBoundingClientRect();\n\n            this.draggedElementWidth = rect.width;\n            this.draggedElementHeight = rect.height;\n        });\n\n        this.live('dragend', '.pool .card', (e) => {\n            e.target.style.opacity = '';\n            if (this.ui.elCardPlaceholder) {\n                this.ui.elCardPlaceholder.remove();\n            }\n            this.ui.elCardPlaceholder = null;\n            this.isDragging = false;\n        });\n\n        this.live('dragover', '.pool, .pool .card, .pool .card-placeholder', (e) => {\n            e.preventDefault();\n            e.dataTransfer.dropEffect = 'move';\n\n            if (e.target.classList.contains('pool')) {\n                e.target.appendChild(this.getCardPlaceholder());\n            } else if (e.target.classList.contains('card')) {\n                e.target.parentNode.insertBefore(this.getCardPlaceholder(), e.target);\n            }\n        });\n\n        this.live('drop', '.pool, .pool .card-placeholder', (e) => {\n            e.preventDefault();\n            if (!this.isDragging) return;\n\n            const todo_id = +e.dataTransfer.getData('text');\n            const card = this.shadowRoot.querySelector('.card[data-id=\"' + todo_id + '\"]');\n\n            if (e.target.classList.contains('pool')) {\n                e.target.querySelector('.pool-content').appendChild(card);\n            } else if (e.target.classList.contains('card-placeholder')) {\n                e.target.parentNode.replaceChild(card, e.target);\n            }\n\n            window.setTimeout(this.updateColumnItemCount, 100);\n        });\n    }\n\n    /**\n     * Sets up the select all cards event for the component.\n     */\n    setupSelectAllCardsEvent() {\n        // Event listener for selecting all cards in a pool\n        this.live('wje-toggle:change', '.select-all-cards', (e) => {\n            const pool = e.target.closest('.pool');\n            this.updateSelectedCards(pool, e.target.checked);\n        });\n\n        // Event listener for selecting individual cards\n        this.live('wje-toggle:change', '.select-card', (e) => {\n            const card = e.target.closest('.card');\n            this.setSelectedCards(e.target.checked, card);\n\n            if (this.selectedCards.length === 0) {\n                e.target.closest('.pool').querySelector('.select-all-cards').checked = false;\n            }\n\n            this.setSelectedItems();\n        });\n    }\n\n    /**\n     * Sets up the menu item click events for the component.\n     */\n    setupMenuItemClickEvents() {\n        this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n            menuItem.removeEventListener('wje-menu-item:click', this.menuItemClickHandler);\n        });\n\n        this.context.querySelectorAll('wje-menu-item').forEach((menuItem) => {\n            menuItem.addEventListener('wje-menu-item:click', this.menuItemClickHandler);\n        });\n    }\n\n    /**\n     * Handles the menu item click event.\n     * @param e\n     */\n    menuItemClickHandler = (e) => {\n        const action = e.target.dataset.action;\n        const pool = e.target.closest('.pool');\n\n        this.handlePoolAction(action, pool);\n    };\n\n    /**\n     * Updates the selected cards in the pool.\n     * @param pool {HTMLElement}\n     * @param isChecked {boolean}\n     */\n    updateSelectedCards(pool, isChecked) {\n        const cards = pool.querySelectorAll('.pool-content .card');\n\n        cards.forEach((card) => {\n            const checkbox = card.querySelector('wje-checkbox');\n            if (checkbox) {\n                checkbox.checked = isChecked;\n            }\n\n            this.setSelectedCards(isChecked, card);\n        });\n\n        this.setSelectedItems();\n    }\n\n    /**\n     * Updates the column item count.\n     */\n    updateColumnItemCount = () => {\n        const pools = this.shadowRoot.querySelectorAll('.pool');\n\n        pools.forEach((pool) => {\n            const itemCount = pool.querySelectorAll('.pool-content .card').length;\n            let itemCountDisplay = pool.querySelector('.item-count');\n\n            itemCountDisplay.innerHTML = itemCount;\n        });\n    };\n\n    /**\n     * Handles the pool action.\n     * @param action {string}\n     * @param pool {HTMLElement}\n     */\n    handlePoolAction(action, pool) {\n        switch (action) {\n            case 'move-left':\n                this.movePool(pool, 'left');\n                break;\n            case 'move-right':\n                this.movePool(pool, 'right');\n                break;\n            case 'rename-pool':\n                this.renamePool(pool);\n                break;\n            default:\n                console.log(`Neznáma akcia: ${action}`);\n        }\n    }\n\n    /**\n     * Moves the pool in the specified direction.\n     * @param pool {HTMLElement}\n     * @param direction {string}\n     */\n    movePool(pool, direction) {\n        const parent = pool.parentElement;\n\n        // Najprv odstránime všetky event listenery z aktuálnych stĺpcov (pools)\n        // Array.from(parent.children).forEach(removeEventListeners);\n\n        if (direction === 'left' && pool.previousElementSibling) {\n            // Presunieme pool doľava\n            parent.insertBefore(pool, pool.previousElementSibling);\n        } else if (direction === 'right' && pool.nextElementSibling) {\n            // Presunieme pool doprava\n            parent.insertBefore(pool.nextElementSibling, pool);\n        }\n\n        // Po presune stĺpcov (pools) musíme znova pripojiť event listenery\n        this.setupMenuItemClickEvents();\n    }\n\n    /**\n     * Renames the pool.\n     * @param pool {HTMLElement}\n     */\n    renamePool(pool) {\n        const newName = prompt('Zadajte nový názov pre stĺpec:');\n        if (newName) {\n            const header = pool.querySelector('.pool-header h4');\n            header.innerHTML = `${newName} (<span class=\"item-count\">0</span> položiek)`;\n            this.updateColumnItemCount(); // Aktualizovať počet položiek po premenovaní\n        }\n    }\n\n    /**\n     * Gets the card placeholder.\n     * @returns {null|*}\n     */\n    getCardPlaceholder() {\n        if (!this.ui.elCardPlaceholder) {\n            this.ui.elCardPlaceholder = document.createElement('div');\n            this.ui.elCardPlaceholder.className = 'card-placeholder';\n\n            this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n            this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n        } else {\n            this.ui.elCardPlaceholder.style.width = this.draggedElementWidth + 'px';\n            this.ui.elCardPlaceholder.style.height = this.draggedElementHeight + 'px';\n        }\n        return this.ui.elCardPlaceholder;\n    }\n\n    /**\n     * Adds a live event listener to the component.\n     * @param eventType {string}\n     * @param selector {string}\n     * @param callback {function}\n     */\n    live(eventType, selector, callback) {\n        const attachListener = (root) => {\n            root.addEventListener(\n                eventType,\n                (e) => {\n                    if (e.target.matches(selector)) {\n                        callback.call(e.target, e);\n                    }\n                },\n                false\n            );\n        };\n\n        const traverseAndAttach = (root) => {\n            attachListener(root);\n\n            root.querySelectorAll('*').forEach((node) => {\n                if (node.shadowRoot) {\n                    traverseAndAttach(node.shadowRoot);\n                }\n            });\n        };\n\n        traverseAndAttach(this.shadowRoot || this); // Start from the Shadow DOM if it exists\n    }\n\n    /**\n     * Sets the selected cards.\n     * @param isChecked {boolean}\n     * @param card {HTMLElement}\n     */\n    setSelectedCards(isChecked, card) {\n        if (isChecked) {\n            if (!this.selectedCards.includes(card)) {\n                this.selectedCards.push(card);\n            }\n        } else {\n            this.selectedCards = this.selectedCards.filter((selectedCard) => selectedCard !== card);\n        }\n    }\n\n    /**\n     * Sets the selected items.\n     */\n    setSelectedItems() {\n        const selectedIds = this.selectedCards.map((card) => card.getAttribute('data-id'));\n        this.selectedItems = this.response.filter((item) => selectedIds.includes(item.id));\n    }\n\n    /**\n     * Fetches the pages.\n     * @param page\n     * @returns {Promise<any>}\n     */\n    async getPages(page = 0) {\n        let hasParams = this.url.includes('?');\n        const response = await fetch(\n            `${this.url}${hasParams ? '&' : '?'}page=${page}&size=${this.size}${this?.queryParams}`\n        );\n        if (!response.ok) {\n            throw new Error(`An error occurred: ${response.status}`);\n        }\n        return await response.json();\n    }\n\n    /**\n     * Gets the pool.\n     * @param data {Array}\n     * @param poolName {string}\n     * @returns {*}\n     */\n    getPool = (data, poolName) => {\n        return data.reduce((acc, item) => {\n            const statusName = item.status.name;\n            if (!acc[statusName]) {\n                acc[statusName] = [];\n            }\n            acc[statusName].push(item);\n            return acc;\n        }, {});\n    };\n\n    /**\n     * Returns the HTML for the pool.\n     * @param title {string}\n     * @param countItems {number}\n     * @returns {Element}\n     */\n    htmlPool = (title, countItems) => {\n        let poolHtml = document.createElement('div');\n        poolHtml.classList.add('pool');\n\n        let header = document.createElement('div');\n        header.classList.add('pool-header');\n\n        let checkbox = document.createElement('wje-checkbox');\n        checkbox.setAttribute('type', 'checkbox');\n        checkbox.classList.add('select-all-cards');\n        checkbox.title = 'Select all cards';\n\n        let h4 = document.createElement('h4');\n        h4.textContent = title;\n\n        let badge = document.createElement('wje-badge');\n        badge.setAttribute('color', 'danger');\n        badge.classList.add('item-count');\n        badge.textContent = countItems;\n\n        let dropdown = document.createElement('wje-dropdown');\n        dropdown.setAttribute('placement', 'bottom-start');\n        dropdown.setAttribute('offset', '5');\n        dropdown.setAttribute('collapsible', '');\n        dropdown.innerHTML = `\n            <wje-button fill=\"link\" slot=\"trigger\" size=\"small\" round>\n                <wje-icon name=\"dots-vertical\"></wje-icon>\n            </wje-button>\n            <wje-menu active>\n                <wje-menu-item data-action=\"rename-pool\">\n                    <wj-label>Zmeniť názov</wj-label>\n                </wje-menu-item>\n                <wje-menu-item data-action=\"move-left\">\n                    <wj-label>Posunúť doľava</wj-label>\n                </wje-menu-item>\n                <wje-menu-item data-action=\"move-right\">\n                    <wj-label>Posunúť doprava</wj-label>\n                </wje-menu-item>\n            </wje-menu>\n        `;\n\n        header.appendChild(checkbox);\n        header.appendChild(h4);\n        header.appendChild(badge);\n        header.appendChild(dropdown);\n\n        let content = document.createElement('div');\n        content.classList.add('pool-content');\n\n        poolHtml.appendChild(header);\n        poolHtml.appendChild(content);\n\n        return poolHtml;\n    };\n\n    /**\n     * Returns the HTML for the card.\n     * @param item {Object}\n     * @returns {Element}\n     */\n    htmlCard = (item) => {\n        let card = document.createElement('div');\n        card.classList.add('card');\n        card.draggable = true;\n        card.setAttribute('data-id', item.id);\n        card.innerHTML = `\n            <wje-checkbox type=\"checkbox\" class=\"select-card\" title=\"Select card\"></wje-checkbox>\n            <div>${item.body}</div>\n        `;\n\n        return card;\n    };\n\n    dispatchEvent(event) {\n        return false;\n    }\n}\n","import Kanban from './kanban.element.js';\n\nexport default Kanban;\n\nKanban.define('wje-kanban', Kanban);\n"],"names":[],"mappings":"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"}

package/dist/wje-menu-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-menu-item.js","sources":["../packages/wje-menu-item/menu-item.element.js","../packages/wje-menu-item/menu-item.js"],"sourcesContent":["import { bindRouterLinks } from 'slick-router/middlewares/router-links.js';\n\nimport { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `MenuItem` is a custom web component that represents a menu item.\n * @summary This element represents a menu item.\n * @documentation https://elements.webjet.sk/components/menu-item\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the menu item.\n * @csspart submenu - The submenu part of the menu item.\n * @slot - The default slot for the menu item.\n * @slot start - The slot for the start of the menu item.\n * @slot end - The slot for the end of the menu item.\n * @slot submenu - The slot for the submenu of the menu item.\n * @cssproperty [--wje-menu-item-color=var(--wje-color)] - Sets the text color of a menu item. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background=transparent] - Defines the background color of a menu item. Default is `transparent`. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-hover=var(--wje-color-contrast-8)] - Specifies the text color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-hover=var(--wje-border-color)] - Sets the background color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-focus=var(--wje-color-contrast-8)] - Defines the text color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-focus=var(--wje-border-color)] - Specifies the background color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-active=var(--wje-color-contrast-8)] - Sets the text color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-active=var(--wje-border-color)] - Specifies the background color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-padding-top=.5rem] - Specifies the top padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-padding-bottom=.5rem] - Specifies the bottom padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-line-height=1.8rem] - Sets the line height for the text within a menu item. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-submenu-offset=0] - Determines the horizontal offset of a submenu relative to its parent. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-item-icon-visibility=hidden] - Controls the visibility of the icon in a menu item. Accepts `visible`, `hidden`, or `collapse`.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-x] - Specifies the x-coordinate of the cursor for the safe triangle area. Used for managing hover or focus transitions between menu items and submenus.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-y] - Specifies the y-coordinate of the cursor for the safe triangle area.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-x] - Defines the x-coordinate where the submenu's safe triangle starts. Helps prevent accidental submenu closing when navigating.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-y] - Defines the y-coordinate where the submenu's safe triangle starts.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-x] - Specifies the x-coordinate where the submenu's safe triangle ends.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-y] - Specifies the y-coordinate where the submenu's safe triangle ends.\n * @tag wje-menu-item\n */\nexport default class MenuItem extends WJElement {\n    /**\n     * Constructor for MenuItem class.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this._collapsible = false;\n    }\n\n    /**\n     * Getter for placement attribute.\n     * @returns {string} The placement attribute of the menu or \"right-start\" if it doesn't exist.\n     */\n    get placement() {\n        let menu = this.querySelector('wje-menu');\n\n        if (menu?.hasAttribute('placement')) {\n            return menu.getAttribute('placement');\n        }\n        return 'right-start';\n    }\n\n    /**\n     * Getter for offset attribute.\n     * @returns {string} The offset attribute of the menu or \"0\" if it doesn't exist.\n     */\n    get offset() {\n        let menu = this.querySelector('wje-menu');\n\n        if (menu?.hasAttribute('offset')) {\n            return menu.getAttribute('offset');\n        }\n        return '0';\n    }\n\n    /**\n     * Getter for variant attribute.\n     * @returns {string} The variant attribute of the menu or \"CONTEXT\" if it doesn't exist.\n     */\n    get variant() {\n        let menu = this.querySelector('wje-menu');\n\n        if (menu?.hasAttribute('variant') && !this.collapse) {\n            return menu.getAttribute('variant').toUpperCase();\n        }\n\n        return 'CONTEXT';\n    }\n\n    /**\n     * Getter for collapse attribute.\n     * @returns {boolean} True if the closest parent has the collapse attribute, false otherwise.\n     */\n    get collapse() {\n        if (this.closest('[collapse]')) return true;\n\n        return false;\n    }\n\n    /**\n     * Sets the value of the custom event attribute.\n     * @param {string} value The value to be assigned to the custom event attribute.\n     */\n    set customEvent(value) {\n        this.setAttribute('custom-event', value);\n    }\n\n    /**\n     * Retrieves the value of the 'custom-event' attribute from the element.\n     * @returns {string | null} The value of the 'custom-event' attribute, or null if the attribute is not set.\n     */\n    get customEvent() {\n        return this.getAttribute('custom-event');\n    }\n\n    /**\n     * Retrieves a mapped object containing custom event parameters extracted from the element's attributes.\n     * Attributes considered are those that begin with 'custom-event-'.\n     * The mapped object's keys are derived by removing the 'custom-event-' prefix from the attribute names,\n     * and the values are the corresponding attribute values.\n     * @returns {object} An object containing key-value pairs of custom event parameters.\n     */\n    get customEventParameters() {\n        const attributes = Array.from(this.attributes).filter((attr) => attr.name.startsWith('custom-event-'));\n\n        return attributes.reduce((acc, attr) => {\n            const key = attr.name.replace('custom-event-', '');\n            acc[key] = attr.value;\n\n            return acc;\n        }, {});\n    }\n\n    className = 'MenuItem';\n\n    /**\n     * Getter for cssStyleSheet.\n     * @returns {string} The styles imported from styles.css.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for observedAttributes.\n     * @returns {Array} An empty array as no attributes are being observed.\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the MenuItem element.\n     */\n    setupAttributes() {\n        super.setupAttributes();\n        this.isShadowRoot = 'open';\n        this.setAttribute('active-class', 'open');\n    }\n\n    /**\n     * Removes the active attribute from the menu before drawing the MenuItem.\n     */\n    beforeDraw() {\n        this.querySelector('wje-menu')?.removeAttribute('active');\n    }\n\n    /**\n     * Draws the MenuItem element and sets the variant and collapse attributes.\n     * @returns {DocumentFragment} The fragment to be appended to the MenuItem.\n     */\n    draw() {\n        this.hasSubmenu = WjElementUtils.hasSlot(this, 'submenu');\n\n        let fragment = document.createDocumentFragment();\n\n        this.setAttribute('tabindex', '0');\n\n        this.classList.forEach((className) => {\n            // Ak trieda začína na \"wje-menu-variant-\", odstráňte ju\n            if (className.startsWith('wje-menu-variant-')) {\n                this.classList.remove(className);\n            }\n        });\n\n        this.classList.remove('collapse');\n        this.classList.add('wje-menu-variant-' + this.variant.toLowerCase());\n\n        if (!this.collapse) {\n            this.querySelector('wje-menu')?.setAttribute('variant', this.variant.toLowerCase());\n        } else if (this.parentElement?.hasAttribute('collapse')) {\n            this.classList.add('collapse');\n        }\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.setAttribute('id', 'anchor');\n        native.classList.add('native-menu-item');\n\n        // CHECKED - Icon\n        let checkedIcon = document.createElement('span');\n        checkedIcon.setAttribute('part', 'check');\n        checkedIcon.classList.add('check-icon');\n        checkedIcon.innerHTML = `<wje-icon name=\"check\"></wje-icon>`;\n\n        if (this.hasAttribute('checked')) checkedIcon.classList.add('checked');\n        else checkedIcon.classList.remove('checked');\n\n        // SLOT - Start\n        let start = document.createElement('slot');\n        start.name = 'start';\n\n        // SLOT\n        let slot = document.createElement('slot');\n        slot.classList.add('label');\n\n        // SLOT - End\n        let end = document.createElement('slot');\n        end.setAttribute('part', 'end');\n        end.name = 'end';\n\n        // SLOT - Submenu\n        let submenu = document.createElement('slot');\n        submenu.setAttribute('part', 'submenu');\n        submenu.name = 'submenu';\n\n        // SUBMENU - Icon\n        let submenuIconClass = this.collapse ? 'collapse' : 'expand';\n        let submenuIcon = document.createElement('span');\n        submenuIcon.setAttribute('part', 'submenu-icon');\n        submenuIcon.classList.add('submenu-icon', submenuIconClass);\n        submenuIcon.innerHTML = this.collapse\n            ? `<wje-icon name=\"chevron-down\"></wje-icon>`\n            : `<wje-icon name=\"chevron-right\"></wje-icon>`;\n\n        if (this.hasSubmenu) native.classList.add('has-submenu');\n        else native.classList.remove('has-submenu');\n\n        native.appendChild(checkedIcon);\n        native.appendChild(start);\n        native.appendChild(slot);\n        native.appendChild(end);\n        native.appendChild(submenuIcon);\n\n        let isAppend = false;\n        // ak je variant typu CONTEXT zobrazime submenu ako popup\n        if (this.variant === 'CONTEXT' && this.hasSubmenu) {\n            native.setAttribute('slot', 'anchor'); // pridame slot anchor pre popup\n\n            let popup = document.createElement('wje-popup');\n            popup.setAttribute('anchor', 'anchor');\n            popup.setAttribute('placement', this.placement);\n            popup.setAttribute('offset', this.offset);\n\n            popup.appendChild(native);\n            popup.appendChild(submenu);\n\n            this.popup = popup;\n            fragment.appendChild(popup);\n            isAppend = true;\n        }\n\n        if (this.parentElement?.hasAttribute('collapse') && !this.hasSubmenu) {\n            fragment.appendChild(this.collapseItem(native));\n        } else if (!isAppend) {\n            fragment.appendChild(native);\n        }\n\n        if ((!this.collapse && this.variant === 'NAV') || (this.variant === 'MEGAMENU' && this.hasSubmenu)) {\n            fragment.appendChild(submenu);\n        }\n\n        this.native = native;\n        this.submenu = submenu;\n\n        return fragment;\n    }\n\n    /**\n     * Adds event listeners after drawing the MenuItem.\n     */\n    afterDraw() {\n        this.unbindRouterLinks = bindRouterLinks(this.parentElement, { selector: false });\n\n        this.addEventListener('mousemove', this.dispatchMove);\n        this.addEventListener('wje-popup:reposition', this.dispatchReposition);\n\n        // Event na zobrazenie submenu\n        event.addListener(this, 'mouseenter', null, this.mouseenterHandler);\n        // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n        event.addListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n        // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n        event.addListener(this, 'focusout', null, this.shouldHideSubmenu);\n        event.addListener(this, 'click', null, this.clickHandler);\n\n        if (this.hasAttribute('custom-event')) {\n            event.addListener(this, 'click', null, this.#populateCustomEvent);\n        }\n    }\n\n    mouseenterHandler = (e) => {\n        if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n            if (this.hasAttribute('manual') || (this.variant === 'NAV' && this.collapse)) return;\n\n            this.activateSubmenu(e);\n\n            e.stopPropagation();\n\n            this.showSubmenu();\n            // this.focus();\n        }\n    };\n\n    /**\n     * Handles the click event on the MenuItem.\n     * @param {object} e\n     */\n    clickHandler = (e) => {\n        switch (this.variant) {\n            case 'NAV':\n                if (!this.collapse && this.hasSubmenu) {\n                    this.submenuToggle(e);\n                    this.hideSubmenu();\n                    e.stopPropagation();\n                } else {\n                    event.dispatchCustomEvent(this, 'wje-menu-item:click');\n                    event.dispatchCustomEvent(this, this.dialog);\n                }\n                break;\n            case 'CONTEXT':\n                if (!this.collapse && this.hasSubmenu) {\n                    let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n                    if (submenuElements?.hasAttribute('active')) {\n                        this.shouldHideSubmenu(e);\n                    } else {\n                        this.activateSubmenu(e);\n                        this.showSubmenu(e);\n                    }\n                } else {\n                    event.dispatchCustomEvent(this, 'wje-menu-item:click');\n                    event.dispatchCustomEvent(this, this.dialog);\n                }\n\n                break;\n        }\n    };\n\n    /**\n     * Checks if the submenu should be hidden based on the event.\n     * @param {Event} e The event object.\n     */\n    shouldHideSubmenu = (e) => {\n        if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n            if ((e.relatedTarget && this.contains(e.relatedTarget)) || (this.variant === 'NAV' && !this.collapse)) {\n                return;\n            }\n\n            this.deactivateSubmenu();\n            this.hideSubmenu();\n        }\n    };\n\n    /**\n     * Creates a tooltip for the MenuItem when it is collapsed.\n     * @param {HTMLElement} native The native MenuItem element.\n     * @returns {HTMLElement} The tooltip element.\n     */\n    collapseItem(native) {\n        let tooltipStart = document.createElement('slot');\n        tooltipStart.setAttribute('slot', 'start');\n        tooltipStart.setAttribute('name', 'tooltip-start');\n\n        let tooltipEnd = document.createElement('slot');\n        tooltipEnd.setAttribute('slot', 'end');\n        tooltipEnd.setAttribute('name', 'tooltip-end');\n\n        let tooltip = document.createElement('wje-tooltip');\n        tooltip.setAttribute('content', this.getTextFromElement(this));\n        tooltip.setAttribute('placement', 'right');\n        tooltip.setAttribute('offset', this.offset || '0');\n\n        tooltip.appendChild(tooltipStart);\n        tooltip.appendChild(tooltipEnd);\n        tooltip.appendChild(native);\n\n        return tooltip;\n    }\n\n    /**\n     * Dispatches a mousemove event.\n     */\n    dispatchMove = (e) => {\n        this.style.setProperty('--wje-menu-item-safe-triangle-cursor-x', `${e.clientX}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-cursor-y', `${e.clientY}px`);\n    };\n\n    /**\n     * Dispatches a reposition event.\n     */\n    dispatchReposition = (e) => {\n        // ak nemame submenu tak to ukoncime\n        if (this.submenu.assignedNodes().length === 0) return;\n\n        let submenu = this.submenu.assignedNodes()[0];\n        const { left, top, width, height } = submenu.getBoundingClientRect();\n\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-x', `${left}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-y', `${top}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-x', `${left}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-y', `${top + height}px`);\n    };\n\n    /**\n     * Shows the submenu of the MenuItem.\n     */\n    showSubmenu() {\n        this.tabIndex = -1;\n        if (this.hasSubmenu) {\n            this.popup?.show();\n            this.classList.add('expanded-submenu');\n            this.native.classList.add('expanded-submenu');\n        }\n    }\n\n    /**\n     * Hides the submenu of the MenuItem.\n     */\n    hideSubmenu() {\n        this.tabIndex = 0;\n        if (this.hasSubmenu) {\n            this.popup?.hide();\n            this.classList.remove('expanded-submenu');\n            this.native.classList.remove('expanded-submenu');\n        }\n    }\n\n    /**\n     * Toggles the active state of the submenu element.\n     * If the submenu is not active, it sets the \"active\" attribute.\n     * If the submenu is already active, it removes the \"active\" attribute.\n     * @param {Event} e The event object.\n     */\n    submenuToggle(e) {\n        if (this.hasSubmenu) {\n            let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n            if (!submenuElements.hasAttribute('active')) {\n                submenuElements.setAttribute('active', '');\n            } else {\n                if (this === e.target) submenuElements.removeAttribute('active');\n            }\n        }\n    }\n\n    /**\n     * Deactivates the submenu by removing the \"active\" attribute.\n     */\n    deactivateSubmenu() {\n        if (this.hasSubmenu) {\n            let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n            if (submenuElements.hasAttribute('active')) {\n                submenuElements.removeAttribute('active');\n            }\n        }\n    }\n\n    /**\n     * Activates the submenu of the menu item.\n     */\n    activateSubmenu() {\n        if (this.hasSubmenu) {\n            let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n            if (!submenuElements.hasAttribute('active')) {\n                submenuElements.setAttribute('active', '');\n            }\n        }\n    }\n\n    /**\n     * Gets the text from the element and returns it.\n     */\n    beforeDisconnect() {\n        this.removeEventListener('mousemove', this.dispatchMove);\n        this.removeEventListener('wje-popup:reposition', this.dispatchReposition);\n\n        event.removeListener(this, 'mouseenter', null, this.mouseenterHandler);\n        event.removeListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n        event.removeListener(this, 'focusout', null, this.shouldHideSubmenu);\n        event.removeListener(this, 'click', null, this.clickHandler);\n\n        this.unbindRouterLinks?.();\n    }\n\n    /**\n     * Extracts and returns the concatenated text content from all text nodes within the specified element.\n     * @param {HTMLElement} element The HTML element from which to extract text content.\n     * @returns {string} The concatenated and trimmed text content from the element's text nodes.\n     */\n    getTextFromElement(element) {\n        let text = '';\n        for (let node of element.childNodes) {\n            if (node.nodeType === Node.TEXT_NODE) {\n                text += node.textContent;\n            }\n        }\n        return text.trim();\n    }\n\n    /**\n     * Dispatches a custom event with specified parameters.\n     * This method uses the `customEvent` and `customEventParameters` properties\n     * to create and dispatch a `CustomEvent`. The event is configured to be\n     * composed and bubbles up through the DOM.\n     * @returns {void} This method does not return a value.\n     */\n    #populateCustomEvent() {\n        this.dispatchEvent(\n          new CustomEvent(this.customEvent, { detail: this.customEventParameters, composed: true, bubbles: true })\n        );\n    }\n}\n","import MenuItem from './menu-item.element.js';\n\nexport default MenuItem;\n\nMenuItem.define('wje-menu-item', MenuItem);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-menu-item.js","sources":["../packages/wje-menu-item/menu-item.element.js","../packages/wje-menu-item/menu-item.js"],"sourcesContent":["import { bindRouterLinks } from 'slick-router/middlewares/router-links.js';\n\nimport { default as WJElement, event, WjElementUtils } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `MenuItem` is a custom web component that represents a menu item.\n * @summary This element represents a menu item.\n * @documentation https://elements.webjet.sk/components/menu-item\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the menu item.\n * @csspart submenu - The submenu part of the menu item.\n * @slot - The default slot for the menu item.\n * @slot start - The slot for the start of the menu item.\n * @slot end - The slot for the end of the menu item.\n * @slot submenu - The slot for the submenu of the menu item.\n * @cssproperty [--wje-menu-item-color=var(--wje-color)] - Sets the text color of a menu item. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background=transparent] - Defines the background color of a menu item. Default is `transparent`. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-hover=var(--wje-color-contrast-8)] - Specifies the text color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-hover=var(--wje-border-color)] - Sets the background color of a menu item when hovered. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-focus=var(--wje-color-contrast-8)] - Defines the text color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-focus=var(--wje-border-color)] - Specifies the background color of a menu item when focused. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-color-active=var(--wje-color-contrast-8)] - Sets the text color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-background-active=var(--wje-border-color)] - Specifies the background color of a menu item when active. Accepts any valid CSS color value.\n * @cssproperty [--wje-menu-item-padding-top=.5rem] - Specifies the top padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-padding-bottom=.5rem] - Specifies the bottom padding inside a menu item. Accepts any valid CSS length value (e.g., `px`, `rem`).\n * @cssproperty [--wje-menu-item-line-height=1.8rem] - Sets the line height for the text within a menu item. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-submenu-offset=0] - Determines the horizontal offset of a submenu relative to its parent. Accepts any valid CSS length value.\n * @cssproperty [--wje-menu-item-icon-visibility=hidden] - Controls the visibility of the icon in a menu item. Accepts `visible`, `hidden`, or `collapse`.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-x] - Specifies the x-coordinate of the cursor for the safe triangle area. Used for managing hover or focus transitions between menu items and submenus.\n * @cssproperty [--wje-menu-item-safe-triangle-cursor-y] - Specifies the y-coordinate of the cursor for the safe triangle area.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-x] - Defines the x-coordinate where the submenu's safe triangle starts. Helps prevent accidental submenu closing when navigating.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-start-y] - Defines the y-coordinate where the submenu's safe triangle starts.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-x] - Specifies the x-coordinate where the submenu's safe triangle ends.\n * @cssproperty [--wje-menu-item-safe-triangle-submenu-end-y] - Specifies the y-coordinate where the submenu's safe triangle ends.\n * @tag wje-menu-item\n */\nexport default class MenuItem extends WJElement {\n    /**\n     * Constructor for MenuItem class.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this._collapsible = false;\n    }\n\n    /**\n     * Getter for placement attribute.\n     * @returns {string} The placement attribute of the menu or \"right-start\" if it doesn't exist.\n     */\n    get placement() {\n        let menu = this.querySelector('wje-menu');\n\n        if (menu?.hasAttribute('placement')) {\n            return menu.getAttribute('placement');\n        }\n        return 'right-start';\n    }\n\n    /**\n     * Getter for offset attribute.\n     * @returns {string} The offset attribute of the menu or \"0\" if it doesn't exist.\n     */\n    get offset() {\n        let menu = this.querySelector('wje-menu');\n\n        if (menu?.hasAttribute('offset')) {\n            return menu.getAttribute('offset');\n        }\n        return '0';\n    }\n\n    /**\n     * Getter for variant attribute.\n     * @returns {string} The variant attribute of the menu or \"CONTEXT\" if it doesn't exist.\n     */\n    get variant() {\n        let menu = this.querySelector('wje-menu');\n\n        if (menu?.hasAttribute('variant') && !this.collapse) {\n            return menu.getAttribute('variant').toUpperCase();\n        }\n\n        return 'CONTEXT';\n    }\n\n    /**\n     * Getter for collapse attribute.\n     * @returns {boolean} True if the closest parent has the collapse attribute, false otherwise.\n     */\n    get collapse() {\n        if (this.closest('[collapse]')) return true;\n\n        return false;\n    }\n\n    /**\n     * Sets the value of the custom event attribute.\n     * @param {string} value The value to be assigned to the custom event attribute.\n     */\n    set customEvent(value) {\n        this.setAttribute('custom-event', value);\n    }\n\n    /**\n     * Retrieves the value of the 'custom-event' attribute from the element.\n     * @returns {string | null} The value of the 'custom-event' attribute, or null if the attribute is not set.\n     */\n    get customEvent() {\n        return this.getAttribute('custom-event');\n    }\n\n    /**\n     * Retrieves a mapped object containing custom event parameters extracted from the element's attributes.\n     * Attributes considered are those that begin with 'custom-event-'.\n     * The mapped object's keys are derived by removing the 'custom-event-' prefix from the attribute names,\n     * and the values are the corresponding attribute values.\n     * @returns {object} An object containing key-value pairs of custom event parameters.\n     */\n    get customEventParameters() {\n        const attributes = Array.from(this.attributes).filter((attr) => attr.name.startsWith('custom-event-'));\n\n        return attributes.reduce((acc, attr) => {\n            const key = attr.name.replace('custom-event-', '');\n            acc[key] = attr.value;\n\n            return acc;\n        }, {});\n    }\n\n    className = 'MenuItem';\n\n    /**\n     * Getter for cssStyleSheet.\n     * @returns {string} The styles imported from styles.css.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for observedAttributes.\n     * @returns {Array} An empty array as no attributes are being observed.\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the MenuItem element.\n     */\n    setupAttributes() {\n        super.setupAttributes();\n        this.isShadowRoot = 'open';\n        this.setAttribute('active-class', 'open');\n    }\n\n    /**\n     * Removes the active attribute from the menu before drawing the MenuItem.\n     */\n    beforeDraw() {\n        this.querySelector('wje-menu')?.removeAttribute('active');\n    }\n\n    /**\n     * Draws the MenuItem element and sets the variant and collapse attributes.\n     * @returns {DocumentFragment} The fragment to be appended to the MenuItem.\n     */\n    draw() {\n        this.hasSubmenu = WjElementUtils.hasSlot(this, 'submenu');\n\n        let fragment = document.createDocumentFragment();\n\n        this.setAttribute('tabindex', '0');\n\n        this.classList.forEach((className) => {\n            // Ak trieda začína na \"wje-menu-variant-\", odstráňte ju\n            if (className.startsWith('wje-menu-variant-')) {\n                this.classList.remove(className);\n            }\n        });\n\n        this.classList.remove('collapse');\n        this.classList.add('wje-menu-variant-' + this.variant.toLowerCase());\n\n        if (!this.collapse) {\n            this.querySelector('wje-menu')?.setAttribute('variant', this.variant.toLowerCase());\n        } else if (this.parentElement?.hasAttribute('collapse')) {\n            this.classList.add('collapse');\n        }\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.setAttribute('id', 'anchor');\n        native.classList.add('native-menu-item');\n\n        // CHECKED - Icon\n        let checkedIcon = document.createElement('span');\n        checkedIcon.setAttribute('part', 'check');\n        checkedIcon.classList.add('check-icon');\n        checkedIcon.innerHTML = `<wje-icon name=\"check\"></wje-icon>`;\n\n        if (this.hasAttribute('checked')) checkedIcon.classList.add('checked');\n        else checkedIcon.classList.remove('checked');\n\n        // SLOT - Start\n        let start = document.createElement('slot');\n        start.name = 'start';\n\n        // SLOT\n        let slot = document.createElement('slot');\n        slot.classList.add('label');\n\n        // SLOT - End\n        let end = document.createElement('slot');\n        end.setAttribute('part', 'end');\n        end.name = 'end';\n\n        // SLOT - Submenu\n        let submenu = document.createElement('slot');\n        submenu.setAttribute('part', 'submenu');\n        submenu.name = 'submenu';\n\n        // SUBMENU - Icon\n        let submenuIconClass = this.collapse ? 'collapse' : 'expand';\n        let submenuIcon = document.createElement('span');\n        submenuIcon.setAttribute('part', 'submenu-icon');\n        submenuIcon.classList.add('submenu-icon', submenuIconClass);\n        submenuIcon.innerHTML = this.collapse\n            ? `<wje-icon name=\"chevron-down\"></wje-icon>`\n            : `<wje-icon name=\"chevron-right\"></wje-icon>`;\n\n        if (this.hasSubmenu) native.classList.add('has-submenu');\n        else native.classList.remove('has-submenu');\n\n        native.appendChild(checkedIcon);\n        native.appendChild(start);\n        native.appendChild(slot);\n        native.appendChild(end);\n        native.appendChild(submenuIcon);\n\n        let isAppend = false;\n        // ak je variant typu CONTEXT zobrazime submenu ako popup\n        if (this.variant === 'CONTEXT' && this.hasSubmenu) {\n            native.setAttribute('slot', 'anchor'); // pridame slot anchor pre popup\n\n            let popup = document.createElement('wje-popup');\n            popup.setAttribute('anchor', 'anchor');\n            popup.setAttribute('placement', this.placement);\n            popup.setAttribute('offset', this.offset);\n\n            popup.appendChild(native);\n            popup.appendChild(submenu);\n\n            this.popup = popup;\n            fragment.appendChild(popup);\n            isAppend = true;\n        }\n\n        if (this.parentElement?.hasAttribute('collapse') && !this.hasSubmenu) {\n            fragment.appendChild(this.collapseItem(native));\n        } else if (!isAppend) {\n            fragment.appendChild(native);\n        }\n\n        if ((!this.collapse && this.variant === 'NAV') || (this.variant === 'MEGAMENU' && this.hasSubmenu)) {\n            fragment.appendChild(submenu);\n        }\n\n        this.native = native;\n        this.submenu = submenu;\n\n        return fragment;\n    }\n\n    /**\n     * Adds event listeners after drawing the MenuItem.\n     */\n    afterDraw() {\n        this.unbindRouterLinks = bindRouterLinks(this.parentElement, { selector: false });\n\n        this.addEventListener('mousemove', this.dispatchMove);\n        this.addEventListener('wje-popup:reposition', this.dispatchReposition);\n\n        // Event na zobrazenie submenu\n        event.addListener(this, 'mouseenter', null, this.mouseenterHandler);\n        // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n        event.addListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n        // Event na zrusenie zobrazenia submenu ked sa klikne mimo\n        event.addListener(this, 'focusout', null, this.shouldHideSubmenu);\n        event.addListener(this, 'click', null, this.clickHandler);\n\n        if (this.hasAttribute('custom-event')) {\n            event.addListener(this, 'click', null, this.#populateCustomEvent);\n        }\n    }\n\n    mouseenterHandler = (e) => {\n        if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n            if (this.hasAttribute('manual') || (this.variant === 'NAV' && this.collapse)) return;\n\n            this.activateSubmenu(e);\n\n            e.stopPropagation();\n\n            this.showSubmenu();\n            // this.focus();\n        }\n    };\n\n    /**\n     * Handles the click event on the MenuItem.\n     * @param {object} e\n     */\n    clickHandler = (e) => {\n        switch (this.variant) {\n            case 'NAV':\n                if (!this.collapse && this.hasSubmenu) {\n                    this.submenuToggle(e);\n                    this.hideSubmenu();\n                    e.stopPropagation();\n                } else {\n                    event.dispatchCustomEvent(this, 'wje-menu-item:click');\n                    event.dispatchCustomEvent(this, this.dialog);\n                }\n                break;\n            case 'CONTEXT':\n                if (!this.collapse && this.hasSubmenu) {\n                    let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n                    if (submenuElements?.hasAttribute('active')) {\n                        this.shouldHideSubmenu(e);\n                    } else {\n                        this.activateSubmenu(e);\n                        this.showSubmenu(e);\n                    }\n                } else {\n                    event.dispatchCustomEvent(this, 'wje-menu-item:click');\n                    event.dispatchCustomEvent(this, this.dialog);\n                }\n\n                break;\n        }\n    }\n\n    /**\n     * Checks if the submenu should be hidden based on the event.\n     * @param {Event} e The event object.\n     */\n    shouldHideSubmenu = (e) => {\n        if (this.collapse || (this.variant === 'CONTEXT' && this.hasSubmenu)) {\n            if ((e.relatedTarget && this.contains(e.relatedTarget)) || (this.variant === 'NAV' && !this.collapse)) {\n                return;\n            }\n\n            this.deactivateSubmenu();\n            this.hideSubmenu();\n        }\n    };\n\n    /**\n     * Creates a tooltip for the MenuItem when it is collapsed.\n     * @param {HTMLElement} native The native MenuItem element.\n     * @returns {HTMLElement} The tooltip element.\n     */\n    collapseItem(native) {\n        let tooltipStart = document.createElement('slot');\n        tooltipStart.setAttribute('slot', 'start');\n        tooltipStart.setAttribute('name', 'tooltip-start');\n\n        let tooltipEnd = document.createElement('slot');\n        tooltipEnd.setAttribute('slot', 'end');\n        tooltipEnd.setAttribute('name', 'tooltip-end');\n\n        let tooltip = document.createElement('wje-tooltip');\n        tooltip.setAttribute('content', this.getTextFromElement(this));\n        tooltip.setAttribute('placement', 'right');\n        tooltip.setAttribute('offset', this.offset || '0');\n\n        tooltip.appendChild(tooltipStart);\n        tooltip.appendChild(tooltipEnd);\n        tooltip.appendChild(native);\n\n        return tooltip;\n    }\n\n    /**\n     * Dispatches a mousemove event.\n     */\n    dispatchMove = (e) => {\n        this.style.setProperty('--wje-menu-item-safe-triangle-cursor-x', `${e.clientX}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-cursor-y', `${e.clientY}px`);\n    };\n\n    /**\n     * Dispatches a reposition event.\n     */\n    dispatchReposition = (e) => {\n        // ak nemame submenu tak to ukoncime\n        if (this.submenu.assignedNodes().length === 0) return;\n\n        let submenu = this.submenu.assignedNodes()[0];\n        const { left, top, width, height } = submenu.getBoundingClientRect();\n\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-x', `${left}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-start-y', `${top}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-x', `${left}px`);\n        this.style.setProperty('--wje-menu-item-safe-triangle-submenu-end-y', `${top + height}px`);\n    };\n\n    /**\n     * Shows the submenu of the MenuItem.\n     */\n    showSubmenu() {\n        this.tabIndex = -1;\n        if (this.hasSubmenu) {\n            this.popup?.show();\n            this.classList.add('expanded-submenu');\n            this.native.classList.add('expanded-submenu');\n        }\n    }\n\n    /**\n     * Hides the submenu of the MenuItem.\n     */\n    hideSubmenu() {\n        this.tabIndex = 0;\n        if (this.hasSubmenu) {\n            this.popup?.hide();\n            this.classList.remove('expanded-submenu');\n            this.native.classList.remove('expanded-submenu');\n        }\n    }\n\n    /**\n     * Toggles the active state of the submenu element.\n     * If the submenu is not active, it sets the \"active\" attribute.\n     * If the submenu is already active, it removes the \"active\" attribute.\n     * @param {Event} e The event object.\n     */\n    submenuToggle(e) {\n        if (this.hasSubmenu) {\n            let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n            if (!submenuElements.hasAttribute('active')) {\n                submenuElements.setAttribute('active', '');\n            } else {\n                if (this === e.target) submenuElements.removeAttribute('active');\n            }\n        }\n    }\n\n    /**\n     * Deactivates the submenu by removing the \"active\" attribute.\n     */\n    deactivateSubmenu() {\n        if (this.hasSubmenu) {\n            let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n            if (submenuElements.hasAttribute('active')) {\n                submenuElements.removeAttribute('active');\n            }\n        }\n    }\n\n    /**\n     * Activates the submenu of the menu item.\n     */\n    activateSubmenu() {\n        if (this.hasSubmenu) {\n            let submenuElements = this.submenu.assignedElements({ flatten: true })[0];\n            if (!submenuElements.hasAttribute('active')) {\n                submenuElements.setAttribute('active', '');\n            }\n        }\n    }\n\n    /**\n     * Gets the text from the element and returns it.\n     */\n    beforeDisconnect() {\n        this.removeEventListener('mousemove', this.dispatchMove);\n        this.removeEventListener('wje-popup:reposition', this.dispatchReposition);\n\n        event.removeListener(this, 'mouseenter', null, this.mouseenterHandler);\n        event.removeListener(this, 'mouseleave', null, this.shouldHideSubmenu);\n        event.removeListener(this, 'focusout', null, this.shouldHideSubmenu);\n        event.removeListener(this, 'click', null, this.clickHandler);\n\n        this.unbindRouterLinks?.();\n    }\n\n    /**\n     * Extracts and returns the concatenated text content from all text nodes within the specified element.\n     * @param {HTMLElement} element The HTML element from which to extract text content.\n     * @returns {string} The concatenated and trimmed text content from the element's text nodes.\n     */\n    getTextFromElement(element) {\n        let text = '';\n        for (let node of element.childNodes) {\n            if (node.nodeType === Node.TEXT_NODE) {\n                text += node.textContent;\n            }\n        }\n        return text.trim();\n    }\n\n    /**\n     * Dispatches a custom event with specified parameters.\n     * This method uses the `customEvent` and `customEventParameters` properties\n     * to create and dispatch a `CustomEvent`. The event is configured to be\n     * composed and bubbles up through the DOM.\n     * @returns {void} This method does not return a value.\n     */\n    #populateCustomEvent() {\n        this.dispatchEvent(\n          new CustomEvent(this.customEvent, { detail: this.customEventParameters, composed: true, bubbles: true })\n        );\n    }\n}\n","import MenuItem from './menu-item.element.js';\n\nexport default MenuItem;\n\nMenuItem.define('wje-menu-item', MenuItem);\n"],"names":[],"mappings":"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"}

package/dist/wje-select.js

@@ -11,7 +11,7 @@ import Input from "./wje-input.js";
 import Option from "./wje-option.js";
 import Options from "./wje-options.js";
 import { P as Popup } from "./popup.element-AaduHP2r.js";
-const styles = "/*\n[ WJ Select ]\n*/\n\n:host {\n    margin-bottom: var(--wje-select-margin-bottom);\n\n    width: 100%;\n    display: block;\n    [slot='arrow'] {\n        transform: rotate(0deg);\n        transition: all 0.2s ease-in;\n    }\n}\n\n.native-select {\n    &.default {\n        .wrapper {\n            display: block;\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        wje-label {\n            margin: 0;\n            display: block;\n            opacity: 1;\n            cursor: text;\n            transition: opacity 0.2s ease 0s;\n            line-height: var(--wje-select-line-height);\n            &.fade {\n                opacity: 0.5;\n                font-size: 12px;\n                letter-spacing: normal;\n            }\n        }\n    }\n    &.standard {\n        .wrapper {\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    }\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}\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) var(--wje-select-border-radius) 0 0;\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: 0 0 var(--wje-select-border-radius) var(--wje-select-border-radius);\n    margin-top: calc(0px - var(--wje-select-border-width));\n    background: var(--wje-select-background);\n    overflow: hidden;\n}\n\n.find {\n    --wje-input-border-radius: 0;\n    --wje-input-border-width: 0 0 1px 0;\n}\n\n.list {\n    overflow: auto;\n    height: 100%;\n}\n\n.options-wrapper:has(.find) .list {\n    height: calc(100% - 32px - 0.5rem);\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}\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";
+const styles = "/*\n[ WJ Select ]\n*/\n\n:host {\n    margin-bottom: var(--wje-select-margin-bottom);\n\n    width: 100%;\n    display: block;\n    [slot='arrow'] {\n        transform: rotate(0deg);\n        transition: all 0.2s ease-in;\n    }\n}\n\n.native-select {\n    &.default {\n        .wrapper {\n            display: block;\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        wje-label {\n            margin: 0;\n            display: block;\n            opacity: 1;\n            cursor: text;\n            transition: opacity 0.2s ease 0s;\n            line-height: var(--wje-select-line-height);\n            &.fade {\n                opacity: 0.5;\n                font-size: 12px;\n                letter-spacing: normal;\n            }\n        }\n    }\n    &.standard {\n        .wrapper {\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    }\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}\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) var(--wje-select-border-radius) 0 0;\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: 0 0 var(--wje-select-border-radius) var(--wje-select-border-radius);\n    margin-top: calc(0px - var(--wje-select-border-width));\n    background: var(--wje-select-background);\n    overflow: hidden;\n}\n\n.find {\n    --wje-input-border-radius: 0;\n    --wje-input-border-width: 0 0 1px 0;\n}\n\n.list {\n    overflow: auto;\n    height: 100%;\n}\n\n.options-wrapper:has(.find) .list {\n    height: calc(100% - 32px - 0.5rem);\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";
 class Select extends WJElement {
   /**
    * Constructor for the Select class.
@@ -25,6 +25,20 @@ class Select extends WJElement {
    */
   constructor() {
     super();
+    /**
+     * An object representing component dependencies with their respective classes.
+     * Each property in the object maps a custom component name (as a string key)
+     * to its corresponding class or constructor.
+     * @typedef {{[key: string]: Function}} Dependencies
+     * @property {Function} 'wje-button' Represents the Button component class.
+     * @property {Function} 'wje-popup' Represents the Popup component class.
+     * @property {Function} 'wje-icon' Represents the Icon component class.
+     * @property {Function} 'wje-label' Represents the Label component class.
+     * @property {Function} 'wje-chip' Represents the Chip component class.
+     * @property {Function} 'wje-input' Represents the Input component class.
+     * @property {Function} 'wje-option' Represents the Option component class.
+     * @property {Function} 'wje-options' Represents the Options component class.
+     */
     __publicField(this, "dependencies", {
       "wje-button": Button,
       "wje-popup": Popup,
@@ -59,6 +73,11 @@ class Select extends WJElement {
       }
       this.selections();
     });
+    /**
+     * Handles the selection and deselection of an option element.
+     * @param {HTMLElement} option The option element that was clicked.
+     * @param {boolean} [multiple] Indicates whether multiple selection is allowed.
+     */
     __publicField(this, "processClickedOption", (option, multiple = false) => {
       const isSelected = option.hasAttribute("selected");
       option.selected = !isSelected;
@@ -70,6 +89,15 @@ class Select extends WJElement {
         this.selectedOptions = multiple ? [...this.selectedOptions, option] : [option];
       }
     });
+    /**
+     * Filters out a specified option from the `selectedOptions` array.
+     * This function removes an option from the `selectedOptions` array if its value
+     * matches the value of the option provided as an argument. It allows for dynamically
+     * updating the selected options by excluding the specified option.
+     * @param {object} option The option to be removed from the `selectedOptions` array.
+     * Should be an object containing a `value` property that is compared to the
+     * `value` property of objects in the `selectedOptions` array.
+     */
     __publicField(this, "filterOutOption", (option) => {
       this.selectedOptions = this.selectedOptions.filter((sOption) => {
         return sOption.value !== option.value;
@@ -149,6 +177,27 @@ class Select extends WJElement {
     if (isInvalid) this.setAttribute("invalid", "");
     else this.removeAttribute("invalid");
   }
+  /**
+   * Sets the maximum number of options allowed.
+   * @param {string | number | null} value The value to set as the maximum number of options.
+   * If null, the 'max-options' attribute will be removed.
+   */
+  set maxOptions(value) {
+    if (value) {
+      this.setAttribute("max-options", value);
+    } else {
+      this.removeAttribute("max-options");
+    }
+  }
+  /**
+   * Retrieves the maximum number of options allowed.
+   * Parses the value of the 'max-options' attribute from the element and converts it to a number.
+   * If the attribute is not present or cannot be converted to a valid number, defaults to 0.
+   * @returns {number} The maximum number of options, or 0 if the attribute is not set or invalid.
+   */
+  get maxOptions() {
+    return +this.getAttribute("max-options") || 0;
+  }
   /**
    * Getter for the form attribute.
    * @returns {HTMLFormElement} The form the input is associated with.
@@ -461,8 +510,10 @@ class Select extends WJElement {
         this.chips.innerHTML = this.placeholder;
         this.input.value = "";
       } else {
-        if (option !== null) this.chips.appendChild(this.getChip(option));
-        if (this.counterEl instanceof HTMLElement || !this.maxOptions || length > +this.maxOptions) {
+        if (option !== null) {
+          this.chips.append(this.getChip(option));
+        }
+        if (this.counterEl instanceof HTMLElement || this.counterEl || length > this.maxOptions && this.chips.querySelectorAll("wje-chip").length >= this.maxOptions) {
           this.counter();
         }
       }
@@ -483,31 +534,23 @@ class Select extends WJElement {
     }
   }
   /**
-   * Updates the selected options and their corresponding chips.
-   * @param {boolean} [silence] Determines whether to suppress the "wje-select:change" event.
-   * @returns {void}
-   * @description
-   * This method fetches the currently selected options and updates the `selectedOptions` array.
-   * It clears and rebuilds the chips representing the selected items in the UI.
-   * If the number of selected options reaches the maximum allowed (`maxOptions`), it stops updating the counter.
-   * Optionally, it dispatches a custom event when the selection changes unless `silence` is set to `true`.
-   * //@fires wje-select:change - Dispatched when the selection changes, unless `silence` is `true`.
-   * @example
-   * // Call the method and allow event dispatch
-   * selections();
-   * @example
-   * // Call the method without dispatching the event
-   * selections(true);
+   * Handles the selection of options and updates the UI chips accordingly.
+   * Also manages the max selection logic and fires an event when selections change.
+   * @param {boolean} [silence] Indicates whether to suppress the event dispatch when a change occurs.
+   * @returns {void} Does not return anything.
    */
   selections(silence = false) {
-    if (this.selectedOptions.length >= +this.maxOptions) {
-      this.counterEl = null;
-    }
-    if (this.chips) {
-      this.chips.innerHTML = "";
-    }
+    let chips = Array.from(this.chips.querySelectorAll("wje-chip"));
     if (this.selectedOptions.length > 0) {
-      this.selectionChanged(this.selectedOptions.at(0), this.selectedOptions.length);
+      if (this.counterEl && this.selectedOptions.length >= this.maxOptions && this.areAllElementsInOptions(chips, this.selectedOptions)) {
+        this.counter();
+      } else {
+        this.counterEl = null;
+        this.chips.innerHTML = "";
+        for (let i = 0; i < this.maxOptions; i++) {
+          this.selectionChanged(this.selectedOptions.at(i), this.selectedOptions.length);
+        }
+      }
     } else {
       this.selectionChanged();
     }
@@ -539,7 +582,9 @@ class Select extends WJElement {
    */
   getChip(option) {
     let chip = document.createElement("wje-chip");
-    chip.setAttribute("removable", "");
+    chip.size = "small";
+    chip.removable = true;
+    chip.round = true;
     chip.addEventListener("wje:chip-remove", this.removeChip);
     chip.option = option;
     let label = document.createElement("wje-label");
@@ -686,6 +731,18 @@ class Select extends WJElement {
     (_a = this.native) == null ? void 0 : _a.classList.toggle("disabled", disabled);
     this.toggleAttribute("disabled", disabled);
   }
+  /**
+   * Checks if all elements in the `elements` array are present in the `options` array based on their `option` property.
+   * @param {Array} elements The array of elements to check. Each element should have an `option` property.
+   * @param {Array} options The array of options to verify against.
+   * @returns {boolean} Returns true if all elements in the `elements` array are found within the `options` array, otherwise returns false.
+   */
+  areAllElementsInOptions(elements, options) {
+    if (elements.length === 0) return false;
+    return elements.every(
+      (el) => options.some((opt) => JSON.stringify(opt) === JSON.stringify(el.option))
+    );
+  }
 }
 /**
  * Whether the input is associated with a form.

package/dist/wje-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-select.js","sources":["../packages/wje-select/select.element.js","../packages/wje-select/select.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Button from '../wje-button/button.js';\nimport Popup from '../wje-popup/popup.js';\nimport Icon from '../wje-icon/icon.js';\nimport Label from '../wje-label/label.js';\nimport Chip from '../wje-chip/chip.js';\nimport Input from '../wje-input/input.js';\nimport Option from '../wje-option/option.js';\nimport Options from '../wje-options/options.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Select` is a custom web component that represents a select input.\n * @summary This element represents a select input.\n * @documentation https://elements.webjet.sk/components/select\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the select.\n * @slot anchor - The slot for the anchor.\n * @slot arrow - The slot for the arrow.\n * @csspart native - The native select wrapper.\n * @csspart input - The input field.\n * @csspart clear - The clear button.\n * @property {Array} _selected - An array to store selected items.\n * @property {HTMLElement|null} counterEl - A reference to the counter element, initially null.\n * @property {ElementInternals} internals - The internal element API for managing state and attributes.\n * @property {boolean} _wasOppened - Tracks whether the select element was previously opened, initially false.\n * @cssproperty [--wje-select-border-width=1px] - Specifies the width of the border around the select component. Accepts any valid CSS length unit (e.g., `px`, `rem`, `em`).\n * @cssproperty [--wje-select-border-style=solid] - Defines the style of the border for the select component. Accepts standard CSS border styles, such as `solid`, `dashed`, or `dotted`.\n * @cssproperty [--wje-select-border-color=var(--wje-border-color)] - Sets the color of the border for the select component. Accepts any valid CSS color value, including color variables, named colors, and hex values.\n * @cssproperty [--wje-select-options-border-width=1px] - Specifies the width of the border for the select options dropdown. Accepts any valid CSS length unit.\n * @cssproperty [--wje-select-options-border-style=var(--wje-border-style)] - Defines the border style for the select options dropdown. Inherits from a defined CSS variable for consistency.\n * @cssproperty [--wje-select-options-border-color=var(--wje-border-color)] - Sets the border color for the select options dropdown. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-background=var(--wje-background)] - Specifies the background color of the select component. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-line-height=20px] - Defines the line height for the text within the select component. Accepts any valid CSS length value, ensuring consistent vertical alignment.\n * @cssproperty [--wje-select-color=var(--wje-color)] - Sets the text color for the select component. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-border-radius=var(--wje-border-radius-medium)] - Specifies the border radius for the select component.Determines the roundness of the corners and accepts any valid CSS length unit or variable.\n * @tag wje-select\n */\n\nexport default class Select extends WJElement {\n    /**\n     * Constructor for the Select class.\n     * @class\n     * @description Initializes the Select component.\n     * This constructor sets up the initial state of the component, including selected items, counter element, and internal element API.\n     * It also tracks whether the select element was previously opened.\n     * @class\n     * @augments {WJElement}\n     * @memberof Select\n     */\n    constructor() {\n        super();\n\n        /**\n         * @type {Array}\n         * @description An array to store selected items.\n         */\n        this._selected = [];\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the counter element, initially null.\n         * @private\n         */\n        this.counterEl = null;\n\n        /**\n         * @type {ElementInternals}\n         * @description The internal element API for managing state and attributes.\n         * @private\n         * @readonly\n         * @constant\n         * @default {ElementInternals} this.attachInternals()\n         * @description Attaches the internals to the element.\n         */\n        this.internals = this.attachInternals();\n\n        /**\n         * @type {boolean}\n         * @description Tracks whether the select element was previously opened, initially false.\n         * @private\n         * @default {boolean} false\n         */\n        this._wasOppened = false;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the native select element, initially null.\n         */\n        this.native = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the popup element, initially null.\n         */\n        this.popup = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the label element, initially null.\n         */\n        this.labelElement = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the slot start element, initially null.\n         */\n        this.slotStart = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the slot end element, initially null.\n         */\n        this.slotEnd = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the input element, initially null.\n         */\n        this.input = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the options wrapper element, initially null.\n         */\n        this.optionsWrapper = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the chips element, initially null.\n         */\n        this.chips = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the clear button element, initially null.\n         */\n        this.clear = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the list element, initially null.\n         */\n        this.list = null;\n\n        this.selectedOptions = []\n    }\n\n    dependencies = {\n        'wje-button': Button,\n        'wje-popup': Popup,\n        'wje-icon': Icon,\n        'wje-label': Label,\n        'wje-chip': Chip,\n        'wje-input': Input,\n        'wje-option': Option,\n        'wje-options': Options,\n    };\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        if (this.hasAttribute('multiple')) {\n            const formData = new FormData();\n            value.forEach(v => formData.append(this.name, v));\n            this.internals.setFormValue(formData);\n        } else {\n            this.internals.setFormValue(value);\n        }\n    }\n\n    /**\n     * Getter for the value attribute.\n     * @returns {string} The value of the attribute.\n     */\n    get value() {\n        return this.selected;\n    }\n\n    /**\n     * Getter for the customErrorDisplay attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get customErrorDisplay() {\n        return this.hasAttribute('custom-error-display');\n    }\n\n    /**\n     * Getter for the validateOnChange attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get validateOnChange() {\n        return this.hasAttribute('validate-on-change');\n    }\n\n    /**\n     * Getter for the invalid attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get invalid() {\n        return this.hasAttribute('invalid');\n    }\n\n    /**\n     * Setter for the invalid attribute.\n     * @param {boolean} isInvalid Whether the input is invalid.\n     */\n    set invalid(isInvalid) {\n        if (isInvalid) this.setAttribute('invalid', '');\n        else this.removeAttribute('invalid');\n    }\n\n    /**\n     * Getter for the form attribute.\n     * @returns {HTMLFormElement} The form the input is associated with.\n     */\n    get form() {\n        return this.internals.form;\n    }\n\n    /**\n     * Getter for the name attribute.\n     * @returns {string} The name of the input.\n     */\n    get name() {\n        return this.getAttribute('name');\n    }\n\n    /**\n     * Getter for the type attribute.\n     * @returns {string} The type of the input.\n     */\n    get type() {\n        return this.localName;\n    }\n\n    /**\n     * Getter for the validity attribute.\n     * @returns {ValidityState} The validity state of the input.\n     */\n    get validity() {\n        return this.internals.validity;\n    }\n\n    /**\n     * Getter for the validationMessage attribute.\n     * @returns {string} The validation message of the input.\n     */\n    get validationMessage() {\n        return this.internals.validationMessage;\n    }\n\n    /**\n     * Getter for the willValidate attribute.\n     * @returns {boolean} Whether the input will be validated.\n     */\n    get willValidate() {\n        return this.internals.willValidate;\n    }\n\n    /**\n     * @summary Getter for the defaultValue attribute.\n     * This method retrieves the 'value' attribute of the custom input element.\n     * The 'value' attribute represents the default value of the input element.\n     * If the 'value' attribute is not set, it returns an empty string.\n     * @returns {string} The default value of the input element.\n     */\n    get defaultValue() {\n        return this.getAttribute('value') ?? '';\n    }\n\n    /**\n     * @summary Setter for the defaultValue attribute.\n     * This method sets the 'value' attribute of the custom input element to the provided value.\n     * The 'value' attribute represents the default value of the input element.\n     * @param {string} value The value to set as the default value.\n     */\n    set defaultValue(value) {\n        this.setAttribute('value', value);\n    }\n\n    /**\n     * Sets the label value.\n     * @param {Array} value The selected value to set.\n     */\n    set selected(value) {\n        this._selected = value;\n    }\n\n    /**\n     * Returns the selected value.\n     * @returns {Array} The selected value.\n     */\n    get selected() {\n        return this.getSelected();\n    }\n\n    /**\n     * Sets the trigger value.\n     * @param {string} value The trigger value to set.\n     */\n    set trigger(value) {\n        this.setAttribute('trigger', value);\n    }\n\n    /**\n     * Returns the trigger value.\n     * @returns {string} The trigger value.\n     */\n    get trigger() {\n        return this.getAttribute('trigger') || 'click';\n    }\n\n    className = 'Select';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return ['active', 'value', 'disabled', 'multiple', 'label', 'placeholder', 'max-height', 'max-options', 'variant', 'placement'];\n    }\n\n    /**\n     * Whether the input is associated with a form.\n     * @type {boolean}\n     */\n    static formAssociated = true;\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the select.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        this.classList.add('wje-placement', this.placement ? 'wje-' + this.placement : 'wje-start');\n\n        // zakladny obalovac\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-select', this.variant || 'default');\n\n        // wrapper pre label a inputWrapper\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('wrapper');\n        wrapper.setAttribute('slot', 'anchor');\n\n        // label\n        let label = document.createElement('wje-label');\n        label.setAttribute('part', 'label');\n        label.innerText = this.label || '';\n\n        // obalovac pre input\n        let inputWrapper = document.createElement('div');\n        inputWrapper.setAttribute('part', 'input-wrapper');\n        inputWrapper.classList.add('input-wrapper');\n\n        let slotStart = document.createElement('div');\n        slotStart.classList.add('slot-start');\n\n        let input = document.createElement('input');\n        input.setAttribute('type', 'text');\n        input.setAttribute('part', 'input');\n        input.setAttribute('autocomplete', 'off');\n        input.setAttribute('readonly', '');\n        input.setAttribute('placeholder', this.placeholder || '');\n\n        let slotEnd = document.createElement('div');\n        slotEnd.classList.add('slot-end');\n\n        let arrow = document.createElement('wje-icon');\n        arrow.setAttribute('name', 'chevron-down');\n        arrow.setAttribute('slot', 'arrow');\n\n        let chips = document.createElement('div');\n        chips.classList.add('chips');\n        chips.innerText = this.placeholder || '';\n\n        // obalovac pre option a find\n        let optionsWrapper = document.createElement('div');\n        optionsWrapper.setAttribute('part', 'options-wrapper');\n        optionsWrapper.classList.add('options-wrapper');\n        optionsWrapper.style.setProperty('height', this.maxHeight || 'auto');\n\n        let list = document.createElement('div');\n        list.classList.add('list');\n\n        let slot = document.createElement('slot');\n\n        let clear = document.createElement('wje-button');\n        clear.setAttribute('fill', 'link');\n        clear.setAttribute('part', 'clear');\n        clear.setAttribute('stop-propagation', '');\n\n        let clearIcon = document.createElement('wje-icon');\n        clearIcon.setAttribute('name', 'x');\n\n        clear.appendChild(clearIcon);\n\n        // vytvorime popup\n        let popup = document.createElement('wje-popup');\n        popup.setAttribute('placement', 'bottom-start');\n        popup.setAttribute('manual', '');\n        popup.setAttribute('size', '');\n        popup.setAttribute('part', 'popup');\n\n        if (this.hasAttribute('disabled')) popup.setAttribute('disabled', '');\n\n        if (this.variant === 'standard') {\n            if (this.hasAttribute('label')) native.appendChild(label);\n        } else {\n            wrapper.appendChild(label);\n        }\n\n        inputWrapper.appendChild(slotStart);\n        inputWrapper.appendChild(input);\n        if (this.hasAttribute('multiple')) inputWrapper.appendChild(chips);\n\n        if (this.hasAttribute('clearable')) inputWrapper.appendChild(clear);\n\n        inputWrapper.appendChild(slotEnd);\n        inputWrapper.appendChild(arrow);\n\n        list.appendChild(slot);\n\n        if (this.hasAttribute('find')) {\n            let find = document.createElement('wje-input');\n            find.setAttribute('variant', 'standard');\n            find.setAttribute('placeholder', 'Hľadať');\n            find.setAttribute('part', 'find');\n            find.classList.add('find');\n\n            optionsWrapper.appendChild(find);\n\n            this.findEl = find;\n        }\n\n        if (this.hasAttribute('lazy')) {\n            event.addListener(popup, 'wje-popup:show', null, (e) => {\n                if (this._wasOppened) return;\n                this._wasOppened = true;\n\n                const optionsElement = this.querySelector('wje-options');\n                optionsElement.setAttribute('lazy', '');\n                optionsElement.setAttribute('attached', '');\n            });\n        } else {\n            const optionsElement = this.querySelector('wje-options');\n            optionsElement?.setAttribute('attached', '');\n        }\n\n        optionsWrapper.appendChild(list);\n\n        wrapper.appendChild(inputWrapper);\n        popup.appendChild(optionsWrapper);\n        popup.appendChild(wrapper);\n\n        if (this.trigger === 'click') popup.setAttribute('manual', '');\n\n        native.appendChild(popup);\n\n        this.native = native;\n        this.popup = popup;\n        this.labelElement = label;\n        this.slotStart = slotStart;\n        this.slotEnd = slotEnd;\n        this.input = input;\n        this.optionsWrapper = optionsWrapper;\n        this.chips = chips;\n        this.clear = clear;\n        this.list = list;\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Sets up the event listeners after the component is drawn.\n     */\n    afterDraw() {\n        this.input.addEventListener('focus', (e) => {\n            this.labelElement?.classList.add('fade');\n            this.native.classList.add('focused');\n        });\n\n        this.input.addEventListener('blur', (e) => {\n            this.native.classList.remove('focused');\n            if (!e.target.value) this.labelElement?.classList.remove('fade');\n        });\n\n        this.addEventListener('wje-option:change', this.optionChange);\n\n        this.clear?.addEventListener('wje-button:click', (e) => {\n            e.preventDefault();\n            e.stopPropagation();\n            this.selectedOptions = [];\n\n            this.getAllOptions().forEach((option) => {\n                option.selected = false;\n                option.removeAttribute('selected');\n            });\n            this.selections();\n\n            e.stopPropagation();\n        });\n\n        this.selectedOptions = this.getSelectedOptions();\n        this.selections(true);\n\n        this.list.addEventListener('wje-options:load', (e) => {\n            // todo select options from this.selectedOptions\n            this.selectedOptions.forEach((option) => {\n                this.getAllOptions().forEach((el) => {\n                    if (el.value === option.value) {\n                        el.selected = true;\n                        el.setAttribute('selected', '');\n                    }\n                });\n            })\n\n            this.list.scrollTo(0, 0);\n        });\n\n        // skontrolujeme ci ma select atribut find\n        if (this.hasAttribute('find') && this.findEl instanceof HTMLElement) {\n            event.addListener(this.findEl, 'keyup', '', (e) => {\n                // contains wj-options element with options\n                const optionsElement = this.querySelector('wje-options');\n                if (optionsElement && optionsElement.hasAttribute('lazy')) {\n                    // pass search value to wj-options element and infinite scroll will handle the rest\n                    optionsElement.setAttribute('search', e.target.value);\n                } else {\n                    let value = e.target.value.trim().toLowerCase();\n\n                    this.getAllOptions().forEach((option) => {\n                        if (option.textContent.trim().toLowerCase().includes(value)) option.style.display = 'block';\n                        else option.style.display = 'none';\n                    });\n                }\n            });\n        }\n    }\n\n    /**\n     * Handles the option change event.\n     * @param {Event} e The event.\n     */\n    optionChange = (e) => {\n        e.stopPropagation()\n        e.stopImmediatePropagation()\n\n        let allOptions = this.getAllOptions();\n\n        if (!this.hasAttribute('multiple')) {\n            allOptions.forEach((option) => {\n                if (option.value === e.target.value) {\n                    this.processClickedOption(option);\n\n                } else {\n                    option.selected = false;\n                    option.removeAttribute('selected');\n                }\n            });\n            this.popup.hide(false);\n        } else {\n            this.processClickedOption(e.target, true);\n        }\n\n        this.selections();\n    };\n\n    processClickedOption = (option, multiple = false) => {\n        const isSelected = option.hasAttribute(\"selected\")\n        option.selected = !isSelected;\n\n        if (isSelected) {\n            option.removeAttribute('selected');\n            this.filterOutOption(option);\n        } else {\n            option.setAttribute('selected', '');\n            this.selectedOptions = multiple ? [...this.selectedOptions, option] : [option];\n        }\n    }\n\n    filterOutOption = (option) => {\n        this.selectedOptions = this.selectedOptions.filter((sOption) => {\n            return sOption.value !== option.value;\n        });\n    }\n\n    /**\n     * Returns all the options as HTML.\n     * @returns {NodeList} The options as HTML.\n     */\n    getAllOptions() {\n        return this.querySelectorAll('wje-option');\n    }\n\n    /**\n     * Returns the selected options as HTML.\n     * @returns {NodeList} The selected options as HTML.\n     */\n    getSelectedOptions() {\n        return Array.from(this.querySelectorAll('wje-option[selected]'));\n    }\n\n    /**\n     * Returns the selected options.\n     * @returns {Array} The selected options.\n     */\n    getSelected() {\n        return this.selectedOptions.map((option) => {\n            return {\n                value: option.value,\n                text: option.textContent.trim(),\n            };\n        });\n    }\n\n    /**\n     * Handles the selection change.\n     * @param {Element} option The option that changed.\n     * @param {number} length The length of the selected options.\n     */\n    selectionChanged(option = null, length = 0) {\n        if (this.hasAttribute('multiple')) {\n            this.value = this.selectedOptions.map((el) => el.value).reverse();\n\n            if (this.placeholder && length === 0) {\n                this.chips.innerHTML = this.placeholder;\n                this.input.value = '';\n            } else {\n                if (option !== null) this.chips.appendChild(this.getChip(option));\n                if (this.counterEl instanceof HTMLElement || !this.maxOptions || length > +this.maxOptions) {\n                    this.counter();\n                }\n            }\n        } else {\n            let value = option?.textContent.trim() || '';\n            this.value = this.selectedOptions?.map((el) => el.value)?.at(0);\n            this.input.value = value;\n\n            if (option && option instanceof HTMLElement) {\n                this.slotStart.innerHTML = '';\n\n                if (option?.querySelector('[slot=start]')) {\n                    this.slotStart.appendChild(option?.querySelector('[slot=start]').cloneNode(true));\n                }\n\n                this.slotEnd.innerHTML = '';\n\n                if (option?.querySelector('[slot=end]')) {\n                    this.slotEnd.appendChild(option?.querySelector('[slot=end]').cloneNode(true));\n                }\n            }\n        }\n    }\n\n    /**\n     * Updates the selected options and their corresponding chips.\n     * @param {boolean} [silence] Determines whether to suppress the \"wje-select:change\" event.\n     * @returns {void}\n     * @description\n     * This method fetches the currently selected options and updates the `selectedOptions` array.\n     * It clears and rebuilds the chips representing the selected items in the UI.\n     * If the number of selected options reaches the maximum allowed (`maxOptions`), it stops updating the counter.\n     * Optionally, it dispatches a custom event when the selection changes unless `silence` is set to `true`.\n     * //@fires wje-select:change - Dispatched when the selection changes, unless `silence` is `true`.\n     * @example\n     * // Call the method and allow event dispatch\n     * selections();\n     * @example\n     * // Call the method without dispatching the event\n     * selections(true);\n     */\n    selections(silence = false) {\n        if (this.selectedOptions.length >= +this.maxOptions) {\n            this.counterEl = null;\n        }\n\n        if (this.chips) {\n            this.chips.innerHTML = '';\n        }\n\n        if (this.selectedOptions.length > 0) {\n            this.selectionChanged(this.selectedOptions.at(0), this.selectedOptions.length);\n\n        } else {\n            this.selectionChanged();\n        }\n\n        if (silence) return;\n        event.dispatchCustomEvent(this, 'wje-select:change');\n    }\n\n    /**\n     * Manages the display of a counter element to indicate the number of items exceeding the maximum allowed options.\n     * - If the number of selected items equals the maximum allowed, the counter element is removed.\n     * - If the counter element doesn't exist and the number of items exceeds the maximum, it is created and updated.\n     */\n    counter() {\n        // zmazanie counter (span)\n        if (this.counterEl && this.value.length === +this.maxOptions) {\n            this.counterEl.remove();\n            this.counterEl = null;\n            return;\n        }\n\n        // ak counter nie je, tak ho vytvorime\n        if (!this.counterEl) {\n            this.counterEl = document.createElement('span');\n            this.counterEl.classList.add('counter');\n\n            this.chips.appendChild(this.counterEl);\n        }\n\n        // nastavime hodnotu counter\n        this.counterEl.innerText = `+${this.value.length - +this.maxOptions}`;\n    }\n\n    /**\n     * Returns a chip element.\n     * @param {Element} option The option to get the chip for.\n     * @returns {Element} The chip element.\n     */\n    getChip(option) {\n        let chip = document.createElement('wje-chip');\n        chip.setAttribute('removable', '');\n        chip.addEventListener('wje:chip-remove', this.removeChip);\n        chip.option = option;\n\n        let label = document.createElement('wje-label');\n        label.innerText = option.textContent.trim();\n\n        chip.appendChild(label);\n\n        return chip;\n    }\n\n    /**\n     * Handles the chip remove event.\n     * @param {Event} e The event.\n     */\n    removeChip = (e) => {\n        e.target.parentNode.removeChild(e.target);\n        this.processClickedOption(e.target.option, true);\n        this.selections();\n    };\n\n    /**\n     * Generates an HTML option element based on the provided item and mapping.\n     * @param {object} item The item to generate the option for.\n     * @param {object} [map] The mapping object that specifies the properties of the item to use for the option's value and text.\n     * @param {string} [map.value] The property of the item to use for the option's value.\n     * @param {string} [map.text] The property of the item to use for the option's text.\n     * @returns {HTMLElement} The generated HTML option element.\n     */\n    htmlOption(item, map = { value: 'value', text: 'text' }) {\n        let option = document.createElement('wje-option');\n\n        if (item[map.value] === null) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${map.value}`);\n        }\n\n        if (item[map.text] === null) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${map.text}`);\n        }\n\n        option.setAttribute('value', item[map.value] ?? '');\n        option.innerText = item[map.text] ?? '';\n        return option;\n    }\n\n    /**\n     * Adds an option to the select element.\n     * @param {any} optionData The data for the option to be added.\n     * @param {boolean} [silent] Whether to suppress any events triggered by the addition of the option.\n     * @param {object} [map] The mapping object specifying the properties of the option data to be used for the value and text of the option.\n     */\n    addOption(optionData, silent = false, map = { value: 'value', text: 'text' }) {\n        if (!optionData) return;\n\n        const optionsElement = this.querySelector('wje-options');\n        if (optionsElement) {\n            optionsElement.addOption(optionData, silent, map);\n            return;\n        }\n\n        let option = this.htmlOption(optionData, map);\n        this.appendChild(option);\n    }\n\n    /**\n     * Adds options to the select element.\n     * @param {Array | object} optionsData The options data to be added. Can be an array of objects or a single object.\n     * @param {boolean} [silent] Indicates whether to trigger events when adding options. Default is false.\n     * @param {object} [map] The mapping object that specifies the properties of the options data object. Default is { value: \"value\", text: \"text\" }.\n     */\n    addOptions(optionsData, silent = false, map = { value: 'value', text: 'text' }) {\n        if (!Array.isArray(optionsData)) {\n            this.addOption(optionsData, silent, map);\n        } else {\n            const optionsElement = this.querySelector('wje-options');\n            if (optionsElement) {\n                optionsElement.addOptions(optionsData, silent, map);\n                return;\n            }\n\n            optionsData.forEach((item) => {\n                this.addOption(item, silent, map);\n            });\n        }\n    }\n\n    /**\n     * Selects an option with the specified value.\n     * @param {string} value The value of the option to be selected.\n     * @param {boolean} [silent] Whether to suppress firing events.\n     */\n    selectOption(value, silent = false) {\n        if (!value) return;\n\n        let option = this.querySelector(`wje-option[value=\"${value}\"]`);\n\n        if (option) {\n            this.processClickedOption(option, this.hasAttribute('multiple'));\n        }\n\n        if (this.drawingStatus > this.drawingStatuses.START) this.selections(silent);\n    }\n\n    /**\n     * Selects one or multiple options in the select element.\n     * @param {Array|any} values The value(s) of the option(s) to be selected.\n     * @param {boolean} [silent] Whether to trigger the change event or not.\n     */\n    selectOptions(values, silent = false) {\n        if (!Array.isArray(values)) {\n            this.selectOption(values, silent);\n        } else {\n            values.forEach((value) => {\n                this.selectOption(value, silent);\n            });\n        }\n    }\n\n    /**\n     * @summary Callback function that is called when the custom element is associated with a form.\n     * This function adds an event listener to the form's submit event, which validates the input and propagates the validation.\n     * @param {HTMLFormElement} form The form the custom element is associated with.\n     */\n    formAssociatedCallback(form) {\n        if (form) {\n            this.internals.setFormValue(this.value);\n        }\n    }\n\n    /**\n     * The formResetCallback method is a built-in lifecycle callback that gets called when a form gets reset.\n     * This method is responsible for resetting the value of the custom input element to its default value.\n     * It also resets the form value and validity state in the form internals.\n     * @function\n     */\n    formResetCallback() {\n        // Set the value of the custom input element to its default value\n        this.value = this.defaultValue;\n        // Reset the form value in the form internals to the default value\n        this.internals.setFormValue(this.defaultValue);\n        // Reset the validity state in the form internals\n        this.internals.setValidity({});\n    }\n\n    /**\n     * The formStateRestoreCallback method is a built-in lifecycle callback that gets called when the state of a form-associated custom element is restored.\n     * This method is responsible for restoring the value of the custom input element to its saved state.\n     * It also restores the form value and validity state in the form internals to their saved states.\n     * @param {object} state The saved state of the custom input element.\n     * @function\n     */\n    formStateRestoreCallback(state) {\n        // Set the value of the custom input element to its saved value\n        this.value = state.value;\n        // Restore the form value in the form internals to the saved value\n        this.internals.setFormValue(state.value);\n        // Restore the validity state in the form internals to the saved state\n        this.internals.setValidity({});\n    }\n\n    /**\n     * The formStateSaveCallback method is a built-in lifecycle callback that gets called when the state of a form-associated custom element is saved.\n     * This method is responsible for saving the value of the custom input element.\n     * @returns {object} The saved state of the custom input element.\n     * @function\n     */\n    formStateSaveCallback() {\n        return {\n            value: this.value,\n        };\n    }\n\n    /**\n     * The formDisabledCallback method is a built-in lifecycle callback that gets called when the disabled state of a form-associated custom element changes.\n     * This method is not implemented yet.\n     * @param {boolean} disabled The new disabled state of the custom input element.\n     * @function\n     */\n    formDisabledCallback(disabled) {\n        console.warn('formDisabledCallback not implemented yet');\n        this.native?.classList.toggle('disabled', disabled);\n        this.toggleAttribute('disabled', disabled);\n    }\n}\n","import Select from './select.element.js';\n\nexport default Select;\n\nSelect.define('wje-select', Select);\n"],"names":["_a"],"mappings":"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"}
+{"version":3,"file":"wje-select.js","sources":["../packages/wje-select/select.element.js","../packages/wje-select/select.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Button from '../wje-button/button.js';\nimport Popup from '../wje-popup/popup.js';\nimport Icon from '../wje-icon/icon.js';\nimport Label from '../wje-label/label.js';\nimport Chip from '../wje-chip/chip.js';\nimport Input from '../wje-input/input.js';\nimport Option from '../wje-option/option.js';\nimport Options from '../wje-options/options.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Select` is a custom web component that represents a select input.\n * @summary This element represents a select input.\n * @documentation https://elements.webjet.sk/components/select\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the select.\n * @slot anchor - The slot for the anchor.\n * @slot arrow - The slot for the arrow.\n * @csspart native - The native select wrapper.\n * @csspart input - The input field.\n * @csspart clear - The clear button.\n * @property {Array} _selected - An array to store selected items.\n * @property {HTMLElement|null} counterEl - A reference to the counter element, initially null.\n * @property {ElementInternals} internals - The internal element API for managing state and attributes.\n * @property {number} maxOptions - The maximum number of options allowed.\n * @property {boolean} _wasOppened - Tracks whether the select element was previously opened, initially false.\n * @cssproperty [--wje-select-border-width=1px] - Specifies the width of the border around the select component. Accepts any valid CSS length unit (e.g., `px`, `rem`, `em`).\n * @cssproperty [--wje-select-border-style=solid] - Defines the style of the border for the select component. Accepts standard CSS border styles, such as `solid`, `dashed`, or `dotted`.\n * @cssproperty [--wje-select-border-color=var(--wje-border-color)] - Sets the color of the border for the select component. Accepts any valid CSS color value, including color variables, named colors, and hex values.\n * @cssproperty [--wje-select-options-border-width=1px] - Specifies the width of the border for the select options dropdown. Accepts any valid CSS length unit.\n * @cssproperty [--wje-select-options-border-style=var(--wje-border-style)] - Defines the border style for the select options dropdown. Inherits from a defined CSS variable for consistency.\n * @cssproperty [--wje-select-options-border-color=var(--wje-border-color)] - Sets the border color for the select options dropdown. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-background=var(--wje-background)] - Specifies the background color of the select component. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-line-height=20px] - Defines the line height for the text within the select component. Accepts any valid CSS length value, ensuring consistent vertical alignment.\n * @cssproperty [--wje-select-color=var(--wje-color)] - Sets the text color for the select component. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-border-radius=var(--wje-border-radius-medium)] - Specifies the border radius for the select component.Determines the roundness of the corners and accepts any valid CSS length unit or variable.\n * @tag wje-select\n */\n\nexport default class Select extends WJElement {\n    /**\n     * Constructor for the Select class.\n     * @class\n     * @description Initializes the Select component.\n     * This constructor sets up the initial state of the component, including selected items, counter element, and internal element API.\n     * It also tracks whether the select element was previously opened.\n     * @class\n     * @augments {WJElement}\n     * @memberof Select\n     */\n    constructor() {\n        super();\n\n        /**\n         * @type {Array}\n         * @description An array to store selected items.\n         */\n        this._selected = [];\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the counter element, initially null.\n         * @private\n         */\n        this.counterEl = null;\n\n        /**\n         * @type {ElementInternals}\n         * @description The internal element API for managing state and attributes.\n         * @private\n         * @readonly\n         * @constant\n         * @default {ElementInternals} this.attachInternals()\n         * @description Attaches the internals to the element.\n         */\n        this.internals = this.attachInternals();\n\n        /**\n         * @type {boolean}\n         * @description Tracks whether the select element was previously opened, initially false.\n         * @private\n         * @default {boolean} false\n         */\n        this._wasOppened = false;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the native select element, initially null.\n         */\n        this.native = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the popup element, initially null.\n         */\n        this.popup = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the label element, initially null.\n         */\n        this.labelElement = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the slot start element, initially null.\n         */\n        this.slotStart = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the slot end element, initially null.\n         */\n        this.slotEnd = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the input element, initially null.\n         */\n        this.input = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the options wrapper element, initially null.\n         */\n        this.optionsWrapper = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the chips element, initially null.\n         */\n        this.chips = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the clear button element, initially null.\n         */\n        this.clear = null;\n\n        /**\n         * @type {HTMLElement|null}\n         * @description A reference to the list element, initially null.\n         */\n        this.list = null;\n\n        this.selectedOptions = []\n    }\n\n    /**\n     * An object representing component dependencies with their respective classes.\n     * Each property in the object maps a custom component name (as a string key)\n     * to its corresponding class or constructor.\n     * @typedef {{[key: string]: Function}} Dependencies\n     * @property {Function} 'wje-button' Represents the Button component class.\n     * @property {Function} 'wje-popup' Represents the Popup component class.\n     * @property {Function} 'wje-icon' Represents the Icon component class.\n     * @property {Function} 'wje-label' Represents the Label component class.\n     * @property {Function} 'wje-chip' Represents the Chip component class.\n     * @property {Function} 'wje-input' Represents the Input component class.\n     * @property {Function} 'wje-option' Represents the Option component class.\n     * @property {Function} 'wje-options' Represents the Options component class.\n     */\n    dependencies = {\n        'wje-button': Button,\n        'wje-popup': Popup,\n        'wje-icon': Icon,\n        'wje-label': Label,\n        'wje-chip': Chip,\n        'wje-input': Input,\n        'wje-option': Option,\n        'wje-options': Options,\n    };\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        if (this.hasAttribute('multiple')) {\n            const formData = new FormData();\n            value.forEach(v => formData.append(this.name, v));\n            this.internals.setFormValue(formData);\n        } else {\n            this.internals.setFormValue(value);\n        }\n    }\n\n    /**\n     * Getter for the value attribute.\n     * @returns {string} The value of the attribute.\n     */\n    get value() {\n        return this.selected;\n    }\n\n    /**\n     * Getter for the customErrorDisplay attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get customErrorDisplay() {\n        return this.hasAttribute('custom-error-display');\n    }\n\n    /**\n     * Getter for the validateOnChange attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get validateOnChange() {\n        return this.hasAttribute('validate-on-change');\n    }\n\n    /**\n     * Getter for the invalid attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get invalid() {\n        return this.hasAttribute('invalid');\n    }\n\n    /**\n     * Setter for the invalid attribute.\n     * @param {boolean} isInvalid Whether the input is invalid.\n     */\n    set invalid(isInvalid) {\n        if (isInvalid) this.setAttribute('invalid', '');\n        else this.removeAttribute('invalid');\n    }\n\n    /**\n     * Sets the maximum number of options allowed.\n     * @param {string | number | null} value The value to set as the maximum number of options.\n     * If null, the 'max-options' attribute will be removed.\n     */\n    set maxOptions(value) {\n        if (value) {\n            this.setAttribute('max-options', value);\n        } else {\n            this.removeAttribute('max-options');\n        }\n    }\n\n    /**\n     * Retrieves the maximum number of options allowed.\n     * Parses the value of the 'max-options' attribute from the element and converts it to a number.\n     * If the attribute is not present or cannot be converted to a valid number, defaults to 0.\n     * @returns {number} The maximum number of options, or 0 if the attribute is not set or invalid.\n     */\n    get maxOptions() {\n        return +this.getAttribute('max-options') || 0;\n    }\n\n    /**\n     * Getter for the form attribute.\n     * @returns {HTMLFormElement} The form the input is associated with.\n     */\n    get form() {\n        return this.internals.form;\n    }\n\n    /**\n     * Getter for the name attribute.\n     * @returns {string} The name of the input.\n     */\n    get name() {\n        return this.getAttribute('name');\n    }\n\n    /**\n     * Getter for the type attribute.\n     * @returns {string} The type of the input.\n     */\n    get type() {\n        return this.localName;\n    }\n\n    /**\n     * Getter for the validity attribute.\n     * @returns {ValidityState} The validity state of the input.\n     */\n    get validity() {\n        return this.internals.validity;\n    }\n\n    /**\n     * Getter for the validationMessage attribute.\n     * @returns {string} The validation message of the input.\n     */\n    get validationMessage() {\n        return this.internals.validationMessage;\n    }\n\n    /**\n     * Getter for the willValidate attribute.\n     * @returns {boolean} Whether the input will be validated.\n     */\n    get willValidate() {\n        return this.internals.willValidate;\n    }\n\n    /**\n     * @summary Getter for the defaultValue attribute.\n     * This method retrieves the 'value' attribute of the custom input element.\n     * The 'value' attribute represents the default value of the input element.\n     * If the 'value' attribute is not set, it returns an empty string.\n     * @returns {string} The default value of the input element.\n     */\n    get defaultValue() {\n        return this.getAttribute('value') ?? '';\n    }\n\n    /**\n     * @summary Setter for the defaultValue attribute.\n     * This method sets the 'value' attribute of the custom input element to the provided value.\n     * The 'value' attribute represents the default value of the input element.\n     * @param {string} value The value to set as the default value.\n     */\n    set defaultValue(value) {\n        this.setAttribute('value', value);\n    }\n\n    /**\n     * Sets the label value.\n     * @param {Array} value The selected value to set.\n     */\n    set selected(value) {\n        this._selected = value;\n    }\n\n    /**\n     * Returns the selected value.\n     * @returns {Array} The selected value.\n     */\n    get selected() {\n        return this.getSelected();\n    }\n\n    /**\n     * Sets the trigger value.\n     * @param {string} value The trigger value to set.\n     */\n    set trigger(value) {\n        this.setAttribute('trigger', value);\n    }\n\n    /**\n     * Returns the trigger value.\n     * @returns {string} The trigger value.\n     */\n    get trigger() {\n        return this.getAttribute('trigger') || 'click';\n    }\n\n    className = 'Select';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return ['active', 'value', 'disabled', 'multiple', 'label', 'placeholder', 'max-height', 'max-options', 'variant', 'placement'];\n    }\n\n    /**\n     * Whether the input is associated with a form.\n     * @type {boolean}\n     */\n    static formAssociated = true;\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the select.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        this.classList.add('wje-placement', this.placement ? 'wje-' + this.placement : 'wje-start');\n\n        // zakladny obalovac\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-select', this.variant || 'default');\n\n        // wrapper pre label a inputWrapper\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('wrapper');\n        wrapper.setAttribute('slot', 'anchor');\n\n        // label\n        let label = document.createElement('wje-label');\n        label.setAttribute('part', 'label');\n        label.innerText = this.label || '';\n\n        // obalovac pre input\n        let inputWrapper = document.createElement('div');\n        inputWrapper.setAttribute('part', 'input-wrapper');\n        inputWrapper.classList.add('input-wrapper');\n\n        let slotStart = document.createElement('div');\n        slotStart.classList.add('slot-start');\n\n        let input = document.createElement('input');\n        input.setAttribute('type', 'text');\n        input.setAttribute('part', 'input');\n        input.setAttribute('autocomplete', 'off');\n        input.setAttribute('readonly', '');\n        input.setAttribute('placeholder', this.placeholder || '');\n\n        let slotEnd = document.createElement('div');\n        slotEnd.classList.add('slot-end');\n\n        let arrow = document.createElement('wje-icon');\n        arrow.setAttribute('name', 'chevron-down');\n        arrow.setAttribute('slot', 'arrow');\n\n        let chips = document.createElement('div');\n        chips.classList.add('chips');\n        chips.innerText = this.placeholder || '';\n\n        // obalovac pre option a find\n        let optionsWrapper = document.createElement('div');\n        optionsWrapper.setAttribute('part', 'options-wrapper');\n        optionsWrapper.classList.add('options-wrapper');\n        optionsWrapper.style.setProperty('height', this.maxHeight || 'auto');\n\n        let list = document.createElement('div');\n        list.classList.add('list');\n\n        let slot = document.createElement('slot');\n\n        let clear = document.createElement('wje-button');\n        clear.setAttribute('fill', 'link');\n        clear.setAttribute('part', 'clear');\n        clear.setAttribute('stop-propagation', '');\n\n        let clearIcon = document.createElement('wje-icon');\n        clearIcon.setAttribute('name', 'x');\n\n        clear.appendChild(clearIcon);\n\n        // vytvorime popup\n        let popup = document.createElement('wje-popup');\n        popup.setAttribute('placement', 'bottom-start');\n        popup.setAttribute('manual', '');\n        popup.setAttribute('size', '');\n        popup.setAttribute('part', 'popup');\n\n        if (this.hasAttribute('disabled')) popup.setAttribute('disabled', '');\n\n        if (this.variant === 'standard') {\n            if (this.hasAttribute('label')) native.appendChild(label);\n        } else {\n            wrapper.appendChild(label);\n        }\n\n        inputWrapper.appendChild(slotStart);\n        inputWrapper.appendChild(input);\n        if (this.hasAttribute('multiple')) inputWrapper.appendChild(chips);\n\n        if (this.hasAttribute('clearable')) inputWrapper.appendChild(clear);\n\n        inputWrapper.appendChild(slotEnd);\n        inputWrapper.appendChild(arrow);\n\n        list.appendChild(slot);\n\n        if (this.hasAttribute('find')) {\n            let find = document.createElement('wje-input');\n            find.setAttribute('variant', 'standard');\n            find.setAttribute('placeholder', 'Hľadať');\n            find.setAttribute('part', 'find');\n            find.classList.add('find');\n\n            optionsWrapper.appendChild(find);\n\n            this.findEl = find;\n        }\n\n        if (this.hasAttribute('lazy')) {\n            event.addListener(popup, 'wje-popup:show', null, (e) => {\n                if (this._wasOppened) return;\n                this._wasOppened = true;\n\n                const optionsElement = this.querySelector('wje-options');\n                optionsElement.setAttribute('lazy', '');\n                optionsElement.setAttribute('attached', '');\n            });\n        } else {\n            const optionsElement = this.querySelector('wje-options');\n            optionsElement?.setAttribute('attached', '');\n        }\n\n        optionsWrapper.appendChild(list);\n\n        wrapper.appendChild(inputWrapper);\n        popup.appendChild(optionsWrapper);\n        popup.appendChild(wrapper);\n\n        if (this.trigger === 'click') popup.setAttribute('manual', '');\n\n        native.appendChild(popup);\n\n        this.native = native;\n        this.popup = popup;\n        this.labelElement = label;\n        this.slotStart = slotStart;\n        this.slotEnd = slotEnd;\n        this.input = input;\n        this.optionsWrapper = optionsWrapper;\n        this.chips = chips;\n        this.clear = clear;\n        this.list = list;\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Sets up the event listeners after the component is drawn.\n     */\n    afterDraw() {\n        this.input.addEventListener('focus', (e) => {\n            this.labelElement?.classList.add('fade');\n            this.native.classList.add('focused');\n        });\n\n        this.input.addEventListener('blur', (e) => {\n            this.native.classList.remove('focused');\n            if (!e.target.value) this.labelElement?.classList.remove('fade');\n        });\n\n        this.addEventListener('wje-option:change', this.optionChange);\n\n        this.clear?.addEventListener('wje-button:click', (e) => {\n            e.preventDefault();\n            e.stopPropagation();\n            this.selectedOptions = [];\n\n            this.getAllOptions().forEach((option) => {\n                option.selected = false;\n                option.removeAttribute('selected');\n            });\n            this.selections();\n\n            e.stopPropagation();\n        });\n\n        this.selectedOptions = this.getSelectedOptions();\n        this.selections(true);\n\n        this.list.addEventListener('wje-options:load', (e) => {\n            // todo select options from this.selectedOptions\n            this.selectedOptions.forEach((option) => {\n                this.getAllOptions().forEach((el) => {\n                    if (el.value === option.value) {\n                        el.selected = true;\n                        el.setAttribute('selected', '');\n                    }\n                });\n            })\n\n            this.list.scrollTo(0, 0);\n        });\n\n        // skontrolujeme ci ma select atribut find\n        if (this.hasAttribute('find') && this.findEl instanceof HTMLElement) {\n            event.addListener(this.findEl, 'keyup', '', (e) => {\n                // contains wj-options element with options\n                const optionsElement = this.querySelector('wje-options');\n                if (optionsElement && optionsElement.hasAttribute('lazy')) {\n                    // pass search value to wj-options element and infinite scroll will handle the rest\n                    optionsElement.setAttribute('search', e.target.value);\n                } else {\n                    let value = e.target.value.trim().toLowerCase();\n\n                    this.getAllOptions().forEach((option) => {\n                        if (option.textContent.trim().toLowerCase().includes(value)) option.style.display = 'block';\n                        else option.style.display = 'none';\n                    });\n                }\n            });\n        }\n    }\n\n    /**\n     * Handles the option change event.\n     * @param {Event} e The event.\n     */\n    optionChange = (e) => {\n        e.stopPropagation()\n        e.stopImmediatePropagation()\n\n        let allOptions = this.getAllOptions();\n\n        if (!this.hasAttribute('multiple')) {\n            allOptions.forEach((option) => {\n                if (option.value === e.target.value) {\n                    this.processClickedOption(option);\n                } else {\n                    option.selected = false;\n                    option.removeAttribute('selected');\n                }\n            });\n            this.popup.hide(false);\n        } else {\n            this.processClickedOption(e.target, true);\n        }\n\n        this.selections();\n    };\n\n    /**\n     * Handles the selection and deselection of an option element.\n     * @param {HTMLElement} option The option element that was clicked.\n     * @param {boolean} [multiple] Indicates whether multiple selection is allowed.\n     */\n    processClickedOption = (option, multiple = false) => {\n        const isSelected = option.hasAttribute(\"selected\")\n        option.selected = !isSelected;\n\n        if (isSelected) {\n            option.removeAttribute('selected');\n            this.filterOutOption(option);\n        } else {\n            option.setAttribute('selected', '');\n            this.selectedOptions = multiple ? [...this.selectedOptions, option] : [option];\n        }\n    }\n\n    /**\n     * Filters out a specified option from the `selectedOptions` array.\n     * This function removes an option from the `selectedOptions` array if its value\n     * matches the value of the option provided as an argument. It allows for dynamically\n     * updating the selected options by excluding the specified option.\n     * @param {object} option The option to be removed from the `selectedOptions` array.\n     * Should be an object containing a `value` property that is compared to the\n     * `value` property of objects in the `selectedOptions` array.\n     */\n    filterOutOption = (option) => {\n        this.selectedOptions = this.selectedOptions.filter((sOption) => {\n            return sOption.value !== option.value;\n        });\n    }\n\n    /**\n     * Returns all the options as HTML.\n     * @returns {NodeList} The options as HTML.\n     */\n    getAllOptions() {\n        return this.querySelectorAll('wje-option');\n    }\n\n    /**\n     * Returns the selected options as HTML.\n     * @returns {NodeList} The selected options as HTML.\n     */\n    getSelectedOptions() {\n        return Array.from(this.querySelectorAll('wje-option[selected]'));\n    }\n\n    /**\n     * Returns the selected options.\n     * @returns {Array} The selected options.\n     */\n    getSelected() {\n        return this.selectedOptions.map((option) => {\n            return {\n                value: option.value,\n                text: option.textContent.trim(),\n            };\n        });\n    }\n\n    /**\n     * Handles the selection change.\n     * @param {Element} option The option that changed.\n     * @param {number} length The length of the selected options.\n     */\n    selectionChanged(option = null, length = 0) {\n        if (this.hasAttribute('multiple')) {\n            this.value = this.selectedOptions.map((el) => el.value).reverse();\n\n            if (this.placeholder && length === 0) {\n                this.chips.innerHTML = this.placeholder;\n                this.input.value = '';\n            } else {\n                if (option !== null) {\n                    this.chips.append(this.getChip(option));\n                }\n                if (this.counterEl instanceof HTMLElement || this.counterEl || length > this.maxOptions && this.chips.querySelectorAll('wje-chip').length >= this.maxOptions) {\n                    this.counter();\n                }\n            }\n        } else {\n            let value = option?.textContent.trim() || '';\n            this.value = this.selectedOptions?.map((el) => el.value)?.at(0);\n            this.input.value = value;\n\n            if (option && option instanceof HTMLElement) {\n                this.slotStart.innerHTML = '';\n\n                if (option?.querySelector('[slot=start]')) {\n                    this.slotStart.appendChild(option?.querySelector('[slot=start]').cloneNode(true));\n                }\n\n                this.slotEnd.innerHTML = '';\n\n                if (option?.querySelector('[slot=end]')) {\n                    this.slotEnd.appendChild(option?.querySelector('[slot=end]').cloneNode(true));\n                }\n            }\n        }\n    }\n\n    /**\n     * Handles the selection of options and updates the UI chips accordingly.\n     * Also manages the max selection logic and fires an event when selections change.\n     * @param {boolean} [silence] Indicates whether to suppress the event dispatch when a change occurs.\n     * @returns {void} Does not return anything.\n     */\n    selections(silence = false) {\n        let chips = Array.from(this.chips.querySelectorAll('wje-chip'));\n\n        if (this.selectedOptions.length > 0) {\n            if(this.counterEl && this.selectedOptions.length >= this.maxOptions && this.areAllElementsInOptions(chips, this.selectedOptions)) {\n                this.counter();\n            } else {\n                this.counterEl = null;\n                this.chips.innerHTML = '';\n                for(let i = 0; i < this.maxOptions; i++) {\n                    this.selectionChanged(this.selectedOptions.at(i), this.selectedOptions.length);\n                }\n            }\n        } else {\n            this.selectionChanged();\n        }\n\n        if (silence) return;\n        event.dispatchCustomEvent(this, 'wje-select:change');\n    }\n\n    /**\n     * Manages the display of a counter element to indicate the number of items exceeding the maximum allowed options.\n     * - If the number of selected items equals the maximum allowed, the counter element is removed.\n     * - If the counter element doesn't exist and the number of items exceeds the maximum, it is created and updated.\n     */\n    counter() {\n        // zmazanie counter (span)\n        if (this.counterEl && this.value.length === +this.maxOptions) {\n            this.counterEl.remove();\n            this.counterEl = null;\n            return;\n        }\n\n        // ak counter nie je, tak ho vytvorime\n        if (!this.counterEl) {\n            this.counterEl = document.createElement('span');\n            this.counterEl.classList.add('counter');\n\n            this.chips.appendChild(this.counterEl);\n        }\n\n        // nastavime hodnotu counter\n        this.counterEl.innerText = `+${this.value.length - +this.maxOptions}`;\n    }\n\n    /**\n     * Returns a chip element.\n     * @param {Element} option The option to get the chip for.\n     * @returns {Element} The chip element.\n     */\n    getChip(option) {\n        let chip = document.createElement('wje-chip');\n        chip.size = 'small';\n        chip.removable = true;\n        chip.round = true;\n        chip.addEventListener('wje:chip-remove', this.removeChip);\n        chip.option = option;\n\n        let label = document.createElement('wje-label');\n        label.innerText = option.textContent.trim();\n\n        chip.appendChild(label);\n\n        return chip;\n    }\n\n    /**\n     * Handles the chip remove event.\n     * @param {Event} e The event.\n     */\n    removeChip = (e) => {\n        e.target.parentNode.removeChild(e.target);\n        this.processClickedOption(e.target.option, true);\n        this.selections();\n    };\n\n    /**\n     * Generates an HTML option element based on the provided item and mapping.\n     * @param {object} item The item to generate the option for.\n     * @param {object} [map] The mapping object that specifies the properties of the item to use for the option's value and text.\n     * @param {string} [map.value] The property of the item to use for the option's value.\n     * @param {string} [map.text] The property of the item to use for the option's text.\n     * @returns {HTMLElement} The generated HTML option element.\n     */\n    htmlOption(item, map = { value: 'value', text: 'text' }) {\n        let option = document.createElement('wje-option');\n\n        if (item[map.value] === null) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${map.value}`);\n        }\n\n        if (item[map.text] === null) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${map.text}`);\n        }\n\n        option.setAttribute('value', item[map.value] ?? '');\n        option.innerText = item[map.text] ?? '';\n        return option;\n    }\n\n    /**\n     * Adds an option to the select element.\n     * @param {any} optionData The data for the option to be added.\n     * @param {boolean} [silent] Whether to suppress any events triggered by the addition of the option.\n     * @param {object} [map] The mapping object specifying the properties of the option data to be used for the value and text of the option.\n     */\n    addOption(optionData, silent = false, map = { value: 'value', text: 'text' }) {\n        if (!optionData) return;\n\n        const optionsElement = this.querySelector('wje-options');\n        if (optionsElement) {\n            optionsElement.addOption(optionData, silent, map);\n            return;\n        }\n\n        let option = this.htmlOption(optionData, map);\n        this.appendChild(option);\n    }\n\n    /**\n     * Adds options to the select element.\n     * @param {Array | object} optionsData The options data to be added. Can be an array of objects or a single object.\n     * @param {boolean} [silent] Indicates whether to trigger events when adding options. Default is false.\n     * @param {object} [map] The mapping object that specifies the properties of the options data object. Default is { value: \"value\", text: \"text\" }.\n     */\n    addOptions(optionsData, silent = false, map = { value: 'value', text: 'text' }) {\n        if (!Array.isArray(optionsData)) {\n            this.addOption(optionsData, silent, map);\n        } else {\n            const optionsElement = this.querySelector('wje-options');\n            if (optionsElement) {\n                optionsElement.addOptions(optionsData, silent, map);\n                return;\n            }\n\n            optionsData.forEach((item) => {\n                this.addOption(item, silent, map);\n            });\n        }\n    }\n\n    /**\n     * Selects an option with the specified value.\n     * @param {string} value The value of the option to be selected.\n     * @param {boolean} [silent] Whether to suppress firing events.\n     */\n    selectOption(value, silent = false) {\n        if (!value) return;\n\n        let option = this.querySelector(`wje-option[value=\"${value}\"]`);\n\n        if (option) {\n            this.processClickedOption(option, this.hasAttribute('multiple'));\n        }\n\n        if (this.drawingStatus > this.drawingStatuses.START) this.selections(silent);\n    }\n\n    /**\n     * Selects one or multiple options in the select element.\n     * @param {Array|any} values The value(s) of the option(s) to be selected.\n     * @param {boolean} [silent] Whether to trigger the change event or not.\n     */\n    selectOptions(values, silent = false) {\n        if (!Array.isArray(values)) {\n            this.selectOption(values, silent);\n        } else {\n            values.forEach((value) => {\n                this.selectOption(value, silent);\n            });\n        }\n    }\n\n    /**\n     * @summary Callback function that is called when the custom element is associated with a form.\n     * This function adds an event listener to the form's submit event, which validates the input and propagates the validation.\n     * @param {HTMLFormElement} form The form the custom element is associated with.\n     */\n    formAssociatedCallback(form) {\n        if (form) {\n            this.internals.setFormValue(this.value);\n        }\n    }\n\n    /**\n     * The formResetCallback method is a built-in lifecycle callback that gets called when a form gets reset.\n     * This method is responsible for resetting the value of the custom input element to its default value.\n     * It also resets the form value and validity state in the form internals.\n     * @function\n     */\n    formResetCallback() {\n        // Set the value of the custom input element to its default value\n        this.value = this.defaultValue;\n        // Reset the form value in the form internals to the default value\n        this.internals.setFormValue(this.defaultValue);\n        // Reset the validity state in the form internals\n        this.internals.setValidity({});\n    }\n\n    /**\n     * The formStateRestoreCallback method is a built-in lifecycle callback that gets called when the state of a form-associated custom element is restored.\n     * This method is responsible for restoring the value of the custom input element to its saved state.\n     * It also restores the form value and validity state in the form internals to their saved states.\n     * @param {object} state The saved state of the custom input element.\n     * @function\n     */\n    formStateRestoreCallback(state) {\n        // Set the value of the custom input element to its saved value\n        this.value = state.value;\n        // Restore the form value in the form internals to the saved value\n        this.internals.setFormValue(state.value);\n        // Restore the validity state in the form internals to the saved state\n        this.internals.setValidity({});\n    }\n\n    /**\n     * The formStateSaveCallback method is a built-in lifecycle callback that gets called when the state of a form-associated custom element is saved.\n     * This method is responsible for saving the value of the custom input element.\n     * @returns {object} The saved state of the custom input element.\n     * @function\n     */\n    formStateSaveCallback() {\n        return {\n            value: this.value,\n        };\n    }\n\n    /**\n     * The formDisabledCallback method is a built-in lifecycle callback that gets called when the disabled state of a form-associated custom element changes.\n     * This method is not implemented yet.\n     * @param {boolean} disabled The new disabled state of the custom input element.\n     * @function\n     */\n    formDisabledCallback(disabled) {\n        console.warn('formDisabledCallback not implemented yet');\n        this.native?.classList.toggle('disabled', disabled);\n        this.toggleAttribute('disabled', disabled);\n    }\n\n    /**\n     * Checks if all elements in the `elements` array are present in the `options` array based on their `option` property.\n     * @param {Array} elements The array of elements to check. Each element should have an `option` property.\n     * @param {Array} options The array of options to verify against.\n     * @returns {boolean} Returns true if all elements in the `elements` array are found within the `options` array, otherwise returns false.\n     */\n    areAllElementsInOptions(elements, options) {\n        if (elements.length === 0) return false;\n\n        return elements.every(el =>\n          options.some(opt => JSON.stringify(opt) === JSON.stringify(el.option))\n        );\n    }\n}\n","import Select from './select.element.js';\n\nexport default Select;\n\nSelect.define('wje-select', Select);\n"],"names":["_a"],"mappings":";;;;;;;;;;;;;;AAyCe,MAAM,eAAe,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAW1C,cAAc;AACV,UAAO;AA+GX;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wCAAe;AAAA,MACX,cAAc;AAAA,MACd,aAAa;AAAA,MACb,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,cAAc;AAAA,MACd,eAAe;AAAA,IAClB;AAqLD,qCAAY;AA6PZ;AAAA;AAAA;AAAA;AAAA,wCAAe,CAAC,MAAM;AAClB,QAAE,gBAAe;AACjB,QAAE,yBAAwB;AAE1B,UAAI,aAAa,KAAK,cAAe;AAErC,UAAI,CAAC,KAAK,aAAa,UAAU,GAAG;AAChC,mBAAW,QAAQ,CAAC,WAAW;AAC3B,cAAI,OAAO,UAAU,EAAE,OAAO,OAAO;AACjC,iBAAK,qBAAqB,MAAM;AAAA,UACpD,OAAuB;AACH,mBAAO,WAAW;AAClB,mBAAO,gBAAgB,UAAU;AAAA,UACrD;AAAA,QACA,CAAa;AACD,aAAK,MAAM,KAAK,KAAK;AAAA,MACjC,OAAe;AACH,aAAK,qBAAqB,EAAE,QAAQ,IAAI;AAAA,MACpD;AAEQ,WAAK,WAAY;AAAA,IACpB;AAOD;AAAA;AAAA;AAAA;AAAA;AAAA,gDAAuB,CAAC,QAAQ,WAAW,UAAU;AACjD,YAAM,aAAa,OAAO,aAAa,UAAU;AACjD,aAAO,WAAW,CAAC;AAEnB,UAAI,YAAY;AACZ,eAAO,gBAAgB,UAAU;AACjC,aAAK,gBAAgB,MAAM;AAAA,MACvC,OAAe;AACH,eAAO,aAAa,YAAY,EAAE;AAClC,aAAK,kBAAkB,WAAW,CAAC,GAAG,KAAK,iBAAiB,MAAM,IAAI,CAAC,MAAM;AAAA,MACzF;AAAA,IACA;AAWI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2CAAkB,CAAC,WAAW;AAC1B,WAAK,kBAAkB,KAAK,gBAAgB,OAAO,CAAC,YAAY;AAC5D,eAAO,QAAQ,UAAU,OAAO;AAAA,MAC5C,CAAS;AAAA,IACT;AAqJI;AAAA;AAAA;AAAA;AAAA,sCAAa,CAAC,MAAM;AAChB,QAAE,OAAO,WAAW,YAAY,EAAE,MAAM;AACxC,WAAK,qBAAqB,EAAE,OAAO,QAAQ,IAAI;AAC/C,WAAK,WAAY;AAAA,IACpB;AAnvBG,SAAK,YAAY,CAAE;AAOnB,SAAK,YAAY;AAWjB,SAAK,YAAY,KAAK,gBAAiB;AAQvC,SAAK,cAAc;AAMnB,SAAK,SAAS;AAMd,SAAK,QAAQ;AAMb,SAAK,eAAe;AAMpB,SAAK,YAAY;AAMjB,SAAK,UAAU;AAMf,SAAK,QAAQ;AAMb,SAAK,iBAAiB;AAMtB,SAAK,QAAQ;AAMb,SAAK,QAAQ;AAMb,SAAK,OAAO;AAEZ,SAAK,kBAAkB,CAAA;AAAA,EAC/B;AAAA;AAAA;AAAA;AAAA;AAAA,EA+BI,IAAI,MAAM,OAAO;AACb,QAAI,KAAK,aAAa,UAAU,GAAG;AAC/B,YAAM,WAAW,IAAI,SAAU;AAC/B,YAAM,QAAQ,OAAK,SAAS,OAAO,KAAK,MAAM,CAAC,CAAC;AAChD,WAAK,UAAU,aAAa,QAAQ;AAAA,IAChD,OAAe;AACH,WAAK,UAAU,aAAa,KAAK;AAAA,IAC7C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ;AACR,WAAO,KAAK;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,qBAAqB;AACrB,WAAO,KAAK,aAAa,sBAAsB;AAAA,EACvD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,mBAAmB;AACnB,WAAO,KAAK,aAAa,oBAAoB;AAAA,EACrD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU;AACV,WAAO,KAAK,aAAa,SAAS;AAAA,EAC1C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ,WAAW;AACnB,QAAI,UAAW,MAAK,aAAa,WAAW,EAAE;AAAA,QACzC,MAAK,gBAAgB,SAAS;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,WAAW,OAAO;AAClB,QAAI,OAAO;AACP,WAAK,aAAa,eAAe,KAAK;AAAA,IAClD,OAAe;AACH,WAAK,gBAAgB,aAAa;AAAA,IAC9C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,IAAI,aAAa;AACb,WAAO,CAAC,KAAK,aAAa,aAAa,KAAK;AAAA,EACpD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,OAAO;AACP,WAAO,KAAK,UAAU;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,OAAO;AACP,WAAO,KAAK,aAAa,MAAM;AAAA,EACvC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,OAAO;AACP,WAAO,KAAK;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,WAAW;AACX,WAAO,KAAK,UAAU;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,oBAAoB;AACpB,WAAO,KAAK,UAAU;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,eAAe;AACf,WAAO,KAAK,UAAU;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,IAAI,eAAe;AACf,WAAO,KAAK,aAAa,OAAO,KAAK;AAAA,EAC7C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,IAAI,aAAa,OAAO;AACpB,SAAK,aAAa,SAAS,KAAK;AAAA,EACxC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,SAAS,OAAO;AAChB,SAAK,YAAY;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,WAAW;AACX,WAAO,KAAK,YAAa;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ,OAAO;AACf,SAAK,aAAa,WAAW,KAAK;AAAA,EAC1C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU;AACV,WAAO,KAAK,aAAa,SAAS,KAAK;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,WAAW,qBAAqB;AAC5B,WAAO,CAAC,UAAU,SAAS,YAAY,YAAY,SAAS,eAAe,cAAc,eAAe,WAAW,WAAW;AAAA,EACtI;AAAA;AAAA;AAAA;AAAA,EAWI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,SAAK,UAAU,IAAI,iBAAiB,KAAK,YAAY,SAAS,KAAK,YAAY,WAAW;AAG1F,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,UAAU,IAAI,iBAAiB,KAAK,WAAW,SAAS;AAG/D,QAAI,UAAU,SAAS,cAAc,KAAK;AAC1C,YAAQ,UAAU,IAAI,SAAS;AAC/B,YAAQ,aAAa,QAAQ,QAAQ;AAGrC,QAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,YAAY,KAAK,SAAS;AAGhC,QAAI,eAAe,SAAS,cAAc,KAAK;AAC/C,iBAAa,aAAa,QAAQ,eAAe;AACjD,iBAAa,UAAU,IAAI,eAAe;AAE1C,QAAI,YAAY,SAAS,cAAc,KAAK;AAC5C,cAAU,UAAU,IAAI,YAAY;AAEpC,QAAI,QAAQ,SAAS,cAAc,OAAO;AAC1C,UAAM,aAAa,QAAQ,MAAM;AACjC,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,aAAa,gBAAgB,KAAK;AACxC,UAAM,aAAa,YAAY,EAAE;AACjC,UAAM,aAAa,eAAe,KAAK,eAAe,EAAE;AAExD,QAAI,UAAU,SAAS,cAAc,KAAK;AAC1C,YAAQ,UAAU,IAAI,UAAU;AAEhC,QAAI,QAAQ,SAAS,cAAc,UAAU;AAC7C,UAAM,aAAa,QAAQ,cAAc;AACzC,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAI,QAAQ,SAAS,cAAc,KAAK;AACxC,UAAM,UAAU,IAAI,OAAO;AAC3B,UAAM,YAAY,KAAK,eAAe;AAGtC,QAAI,iBAAiB,SAAS,cAAc,KAAK;AACjD,mBAAe,aAAa,QAAQ,iBAAiB;AACrD,mBAAe,UAAU,IAAI,iBAAiB;AAC9C,mBAAe,MAAM,YAAY,UAAU,KAAK,aAAa,MAAM;AAEnE,QAAI,OAAO,SAAS,cAAc,KAAK;AACvC,SAAK,UAAU,IAAI,MAAM;AAEzB,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,QAAI,QAAQ,SAAS,cAAc,YAAY;AAC/C,UAAM,aAAa,QAAQ,MAAM;AACjC,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,aAAa,oBAAoB,EAAE;AAEzC,QAAI,YAAY,SAAS,cAAc,UAAU;AACjD,cAAU,aAAa,QAAQ,GAAG;AAElC,UAAM,YAAY,SAAS;AAG3B,QAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,UAAM,aAAa,aAAa,cAAc;AAC9C,UAAM,aAAa,UAAU,EAAE;AAC/B,UAAM,aAAa,QAAQ,EAAE;AAC7B,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAI,KAAK,aAAa,UAAU,EAAG,OAAM,aAAa,YAAY,EAAE;AAEpE,QAAI,KAAK,YAAY,YAAY;AAC7B,UAAI,KAAK,aAAa,OAAO,EAAG,QAAO,YAAY,KAAK;AAAA,IACpE,OAAe;AACH,cAAQ,YAAY,KAAK;AAAA,IACrC;AAEQ,iBAAa,YAAY,SAAS;AAClC,iBAAa,YAAY,KAAK;AAC9B,QAAI,KAAK,aAAa,UAAU,EAAG,cAAa,YAAY,KAAK;AAEjE,QAAI,KAAK,aAAa,WAAW,EAAG,cAAa,YAAY,KAAK;AAElE,iBAAa,YAAY,OAAO;AAChC,iBAAa,YAAY,KAAK;AAE9B,SAAK,YAAY,IAAI;AAErB,QAAI,KAAK,aAAa,MAAM,GAAG;AAC3B,UAAI,OAAO,SAAS,cAAc,WAAW;AAC7C,WAAK,aAAa,WAAW,UAAU;AACvC,WAAK,aAAa,eAAe,QAAQ;AACzC,WAAK,aAAa,QAAQ,MAAM;AAChC,WAAK,UAAU,IAAI,MAAM;AAEzB,qBAAe,YAAY,IAAI;AAE/B,WAAK,SAAS;AAAA,IAC1B;AAEQ,QAAI,KAAK,aAAa,MAAM,GAAG;AAC3B,YAAM,YAAY,OAAO,kBAAkB,MAAM,CAAC,MAAM;AACpD,YAAI,KAAK,YAAa;AACtB,aAAK,cAAc;AAEnB,cAAM,iBAAiB,KAAK,cAAc,aAAa;AACvD,uBAAe,aAAa,QAAQ,EAAE;AACtC,uBAAe,aAAa,YAAY,EAAE;AAAA,MAC1D,CAAa;AAAA,IACb,OAAe;AACH,YAAM,iBAAiB,KAAK,cAAc,aAAa;AACvD,uDAAgB,aAAa,YAAY;AAAA,IACrD;AAEQ,mBAAe,YAAY,IAAI;AAE/B,YAAQ,YAAY,YAAY;AAChC,UAAM,YAAY,cAAc;AAChC,UAAM,YAAY,OAAO;AAEzB,QAAI,KAAK,YAAY,QAAS,OAAM,aAAa,UAAU,EAAE;AAE7D,WAAO,YAAY,KAAK;AAExB,SAAK,SAAS;AACd,SAAK,QAAQ;AACb,SAAK,eAAe;AACpB,SAAK,YAAY;AACjB,SAAK,UAAU;AACf,SAAK,QAAQ;AACb,SAAK,iBAAiB;AACtB,SAAK,QAAQ;AACb,SAAK,QAAQ;AACb,SAAK,OAAO;AAEZ,aAAS,YAAY,MAAM;AAE3B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;;AACR,SAAK,MAAM,iBAAiB,SAAS,CAAC,MAAM;;AACxC,OAAAA,MAAA,KAAK,iBAAL,gBAAAA,IAAmB,UAAU,IAAI;AACjC,WAAK,OAAO,UAAU,IAAI,SAAS;AAAA,IAC/C,CAAS;AAED,SAAK,MAAM,iBAAiB,QAAQ,CAAC,MAAM;;AACvC,WAAK,OAAO,UAAU,OAAO,SAAS;AACtC,UAAI,CAAC,EAAE,OAAO,MAAO,EAAAA,MAAA,KAAK,iBAAL,gBAAAA,IAAmB,UAAU,OAAO;AAAA,IACrE,CAAS;AAED,SAAK,iBAAiB,qBAAqB,KAAK,YAAY;AAE5D,eAAK,UAAL,mBAAY,iBAAiB,oBAAoB,CAAC,MAAM;AACpD,QAAE,eAAgB;AAClB,QAAE,gBAAiB;AACnB,WAAK,kBAAkB,CAAE;AAEzB,WAAK,cAAa,EAAG,QAAQ,CAAC,WAAW;AACrC,eAAO,WAAW;AAClB,eAAO,gBAAgB,UAAU;AAAA,MACjD,CAAa;AACD,WAAK,WAAY;AAEjB,QAAE,gBAAiB;AAAA,IAC/B;AAEQ,SAAK,kBAAkB,KAAK,mBAAoB;AAChD,SAAK,WAAW,IAAI;AAEpB,SAAK,KAAK,iBAAiB,oBAAoB,CAAC,MAAM;AAElD,WAAK,gBAAgB,QAAQ,CAAC,WAAW;AACrC,aAAK,cAAa,EAAG,QAAQ,CAAC,OAAO;AACjC,cAAI,GAAG,UAAU,OAAO,OAAO;AAC3B,eAAG,WAAW;AACd,eAAG,aAAa,YAAY,EAAE;AAAA,UACtD;AAAA,QACA,CAAiB;AAAA,MACJ,CAAA;AAED,WAAK,KAAK,SAAS,GAAG,CAAC;AAAA,IACnC,CAAS;AAGD,QAAI,KAAK,aAAa,MAAM,KAAK,KAAK,kBAAkB,aAAa;AACjE,YAAM,YAAY,KAAK,QAAQ,SAAS,IAAI,CAAC,MAAM;AAE/C,cAAM,iBAAiB,KAAK,cAAc,aAAa;AACvD,YAAI,kBAAkB,eAAe,aAAa,MAAM,GAAG;AAEvD,yBAAe,aAAa,UAAU,EAAE,OAAO,KAAK;AAAA,QACxE,OAAuB;AACH,cAAI,QAAQ,EAAE,OAAO,MAAM,KAAM,EAAC,YAAa;AAE/C,eAAK,cAAa,EAAG,QAAQ,CAAC,WAAW;AACrC,gBAAI,OAAO,YAAY,KAAI,EAAG,YAAa,EAAC,SAAS,KAAK,EAAG,QAAO,MAAM,UAAU;AAAA,gBAC/E,QAAO,MAAM,UAAU;AAAA,UACpD,CAAqB;AAAA,QACrB;AAAA,MACA,CAAa;AAAA,IACb;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAkEI,gBAAgB;AACZ,WAAO,KAAK,iBAAiB,YAAY;AAAA,EACjD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,qBAAqB;AACjB,WAAO,MAAM,KAAK,KAAK,iBAAiB,sBAAsB,CAAC;AAAA,EACvE;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,cAAc;AACV,WAAO,KAAK,gBAAgB,IAAI,CAAC,WAAW;AACxC,aAAO;AAAA,QACH,OAAO,OAAO;AAAA,QACd,MAAM,OAAO,YAAY,KAAM;AAAA,MAClC;AAAA,IACb,CAAS;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,iBAAiB,SAAS,MAAM,SAAS,GAAG;;AACxC,QAAI,KAAK,aAAa,UAAU,GAAG;AAC/B,WAAK,QAAQ,KAAK,gBAAgB,IAAI,CAAC,OAAO,GAAG,KAAK,EAAE,QAAS;AAEjE,UAAI,KAAK,eAAe,WAAW,GAAG;AAClC,aAAK,MAAM,YAAY,KAAK;AAC5B,aAAK,MAAM,QAAQ;AAAA,MACnC,OAAmB;AACH,YAAI,WAAW,MAAM;AACjB,eAAK,MAAM,OAAO,KAAK,QAAQ,MAAM,CAAC;AAAA,QAC1D;AACgB,YAAI,KAAK,qBAAqB,eAAe,KAAK,aAAa,SAAS,KAAK,cAAc,KAAK,MAAM,iBAAiB,UAAU,EAAE,UAAU,KAAK,YAAY;AAC1J,eAAK,QAAS;AAAA,QAClC;AAAA,MACA;AAAA,IACA,OAAe;AACH,UAAI,SAAQ,iCAAQ,YAAY,WAAU;AAC1C,WAAK,SAAQ,gBAAK,oBAAL,mBAAsB,IAAI,CAAC,OAAO,GAAG,WAArC,mBAA6C,GAAG;AAC7D,WAAK,MAAM,QAAQ;AAEnB,UAAI,UAAU,kBAAkB,aAAa;AACzC,aAAK,UAAU,YAAY;AAE3B,YAAI,iCAAQ,cAAc,iBAAiB;AACvC,eAAK,UAAU,YAAY,iCAAQ,cAAc,gBAAgB,UAAU,KAAK;AAAA,QACpG;AAEgB,aAAK,QAAQ,YAAY;AAEzB,YAAI,iCAAQ,cAAc,eAAe;AACrC,eAAK,QAAQ,YAAY,iCAAQ,cAAc,cAAc,UAAU,KAAK;AAAA,QAChG;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,WAAW,UAAU,OAAO;AACxB,QAAI,QAAQ,MAAM,KAAK,KAAK,MAAM,iBAAiB,UAAU,CAAC;AAE9D,QAAI,KAAK,gBAAgB,SAAS,GAAG;AACjC,UAAG,KAAK,aAAa,KAAK,gBAAgB,UAAU,KAAK,cAAc,KAAK,wBAAwB,OAAO,KAAK,eAAe,GAAG;AAC9H,aAAK,QAAS;AAAA,MAC9B,OAAmB;AACH,aAAK,YAAY;AACjB,aAAK,MAAM,YAAY;AACvB,iBAAQ,IAAI,GAAG,IAAI,KAAK,YAAY,KAAK;AACrC,eAAK,iBAAiB,KAAK,gBAAgB,GAAG,CAAC,GAAG,KAAK,gBAAgB,MAAM;AAAA,QACjG;AAAA,MACA;AAAA,IACA,OAAe;AACH,WAAK,iBAAkB;AAAA,IACnC;AAEQ,QAAI,QAAS;AACb,UAAM,oBAAoB,MAAM,mBAAmB;AAAA,EAC3D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,UAAU;AAEN,QAAI,KAAK,aAAa,KAAK,MAAM,WAAW,CAAC,KAAK,YAAY;AAC1D,WAAK,UAAU,OAAQ;AACvB,WAAK,YAAY;AACjB;AAAA,IACZ;AAGQ,QAAI,CAAC,KAAK,WAAW;AACjB,WAAK,YAAY,SAAS,cAAc,MAAM;AAC9C,WAAK,UAAU,UAAU,IAAI,SAAS;AAEtC,WAAK,MAAM,YAAY,KAAK,SAAS;AAAA,IACjD;AAGQ,SAAK,UAAU,YAAY,IAAI,KAAK,MAAM,SAAS,CAAC,KAAK,UAAU;AAAA,EAC3E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,QAAQ,QAAQ;AACZ,QAAI,OAAO,SAAS,cAAc,UAAU;AAC5C,SAAK,OAAO;AACZ,SAAK,YAAY;AACjB,SAAK,QAAQ;AACb,SAAK,iBAAiB,mBAAmB,KAAK,UAAU;AACxD,SAAK,SAAS;AAEd,QAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,UAAM,YAAY,OAAO,YAAY,KAAM;AAE3C,SAAK,YAAY,KAAK;AAEtB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBI,WAAW,MAAM,MAAM,EAAE,OAAO,SAAS,MAAM,UAAU;AACrD,QAAI,SAAS,SAAS,cAAc,YAAY;AAEhD,QAAI,KAAK,IAAI,KAAK,MAAM,MAAM;AAC1B,cAAQ,KAAK,YAAY,KAAK,UAAU,IAAI,CAAC,+BAA+B,IAAI,KAAK,EAAE;AAAA,IACnG;AAEQ,QAAI,KAAK,IAAI,IAAI,MAAM,MAAM;AACzB,cAAQ,KAAK,YAAY,KAAK,UAAU,IAAI,CAAC,+BAA+B,IAAI,IAAI,EAAE;AAAA,IAClG;AAEQ,WAAO,aAAa,SAAS,KAAK,IAAI,KAAK,KAAK,EAAE;AAClD,WAAO,YAAY,KAAK,IAAI,IAAI,KAAK;AACrC,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,UAAU,YAAY,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,MAAM,UAAU;AAC1E,QAAI,CAAC,WAAY;AAEjB,UAAM,iBAAiB,KAAK,cAAc,aAAa;AACvD,QAAI,gBAAgB;AAChB,qBAAe,UAAU,YAAY,QAAQ,GAAG;AAChD;AAAA,IACZ;AAEQ,QAAI,SAAS,KAAK,WAAW,YAAY,GAAG;AAC5C,SAAK,YAAY,MAAM;AAAA,EAC/B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,WAAW,aAAa,SAAS,OAAO,MAAM,EAAE,OAAO,SAAS,MAAM,UAAU;AAC5E,QAAI,CAAC,MAAM,QAAQ,WAAW,GAAG;AAC7B,WAAK,UAAU,aAAa,QAAQ,GAAG;AAAA,IACnD,OAAe;AACH,YAAM,iBAAiB,KAAK,cAAc,aAAa;AACvD,UAAI,gBAAgB;AAChB,uBAAe,WAAW,aAAa,QAAQ,GAAG;AAClD;AAAA,MAChB;AAEY,kBAAY,QAAQ,CAAC,SAAS;AAC1B,aAAK,UAAU,MAAM,QAAQ,GAAG;AAAA,MAChD,CAAa;AAAA,IACb;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,aAAa,OAAO,SAAS,OAAO;AAChC,QAAI,CAAC,MAAO;AAEZ,QAAI,SAAS,KAAK,cAAc,qBAAqB,KAAK,IAAI;AAE9D,QAAI,QAAQ;AACR,WAAK,qBAAqB,QAAQ,KAAK,aAAa,UAAU,CAAC;AAAA,IAC3E;AAEQ,QAAI,KAAK,gBAAgB,KAAK,gBAAgB,MAAO,MAAK,WAAW,MAAM;AAAA,EACnF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,cAAc,QAAQ,SAAS,OAAO;AAClC,QAAI,CAAC,MAAM,QAAQ,MAAM,GAAG;AACxB,WAAK,aAAa,QAAQ,MAAM;AAAA,IAC5C,OAAe;AACH,aAAO,QAAQ,CAAC,UAAU;AACtB,aAAK,aAAa,OAAO,MAAM;AAAA,MAC/C,CAAa;AAAA,IACb;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,uBAAuB,MAAM;AACzB,QAAI,MAAM;AACN,WAAK,UAAU,aAAa,KAAK,KAAK;AAAA,IAClD;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,oBAAoB;AAEhB,SAAK,QAAQ,KAAK;AAElB,SAAK,UAAU,aAAa,KAAK,YAAY;AAE7C,SAAK,UAAU,YAAY,EAAE;AAAA,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,yBAAyB,OAAO;AAE5B,SAAK,QAAQ,MAAM;AAEnB,SAAK,UAAU,aAAa,MAAM,KAAK;AAEvC,SAAK,UAAU,YAAY,EAAE;AAAA,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,wBAAwB;AACpB,WAAO;AAAA,MACH,OAAO,KAAK;AAAA,IACf;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,qBAAqB,UAAU;;AAC3B,YAAQ,KAAK,0CAA0C;AACvD,eAAK,WAAL,mBAAa,UAAU,OAAO,YAAY;AAC1C,SAAK,gBAAgB,YAAY,QAAQ;AAAA,EACjD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,wBAAwB,UAAU,SAAS;AACvC,QAAI,SAAS,WAAW,EAAG,QAAO;AAElC,WAAO,SAAS;AAAA,MAAM,QACpB,QAAQ,KAAK,SAAO,KAAK,UAAU,GAAG,MAAM,KAAK,UAAU,GAAG,MAAM,CAAC;AAAA,IACtE;AAAA,EACT;AACA;AAAA;AAAA;AAAA;AAAA;AAtmBI,cAjViB,QAiVV,kBAAiB;ACtX5B,OAAO,OAAO,cAAc,MAAM;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wj-elements",
   "description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
-  "version": "0.1.172",
+  "version": "0.1.173",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",