wj-elements 0.1.183 → 0.1.185

package/dist/wje-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-input.js","sources":["../packages/wje-input/input.element.js","../packages/wje-input/input.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents a custom input element. It extends the WJElement class and provides additional functionality for handling input.\n * @documentation https://elements.webjet.sk/components/input\n * @status stable\n * @augments WJElement\n * @csspart native - The native part.\n * @csspart wrapper - The wrapper part.\n * @csspart input - The input part.\n * @csspart clear - The clear part.\n * @slot start - Slot for content at the start of the input.\n * @slot end - Slot for content at the end of the input.\n * @cssproperty [--wje-input-font-family=var(--wje-font-family)] - Defines the font family for the input text.\n * @cssproperty [--wje-input-background-color=var(--wje-background)] - Specifies the background color of the input field.\n * @cssproperty [--wje-input-color=var(--wje-color)] - Sets the text color within the input field.\n * @cssproperty [--wje-input-color-invalid=var(--wje-color-danger)] - Changes the text color when the input value is invalid.\n * @cssproperty [--wje-input-border-color=var(--wje-border-color)] - Defines the border color of the input field.\n * @cssproperty [--wje-input-border-color-focus=var(--wje-color-primary)] - Specifies the border color when the input is focused.\n * @cssproperty [--wje-input-border-width=1px] - Sets the width of the input border.\n * @cssproperty [--wje-input-border-style=solid] - Defines the border style of the input (e.g., solid, dashed).\n * @cssproperty [--wje-input-border-radius=4px] - Specifies the border radius, creating rounded corners.\n * @cssproperty [--wje-input-margin-bottom=.5rem] - Adds spacing below the input field.\n * @cssproperty [--wje-input-line-height=20px] - Sets the line height of the text within the input field.\n * @cssproperty [--wje-input-slot-padding-inline=.5rem] - Controls the padding on the left and right of the input slot content.\n * // @fires wje-input:input - Dispatched when the input value changes.\n * // @fires wje-input:clear - Dispatched when the input is cleared.\n */\nexport default class Input extends WJElement {\n    /**\n     * Creates an instance of Input.\n     */\n    constructor() {\n        super();\n\n        this.invalid = false;\n        this.pristine = true;\n        this.internals = this.attachInternals();\n\n        // Create a mutation observer instance to watch for changes in attributes\n        this.observer = new MutationObserver(this.observeFunction);\n    }\n\n    observeFunction = (mutations) => {\n        mutations.forEach((mutation) => {\n            if (mutation.type === 'attributes') {\n                const attributeName = mutation.attributeName;\n                const oldValue = mutation.oldValue;\n                const newValue = this.getAttribute(attributeName);\n\n                console.log(`Attribute ${attributeName} changed from ${oldValue} to ${newValue}`);\n            }\n        });\n    }\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        this.internals.setFormValue(value);\n\n        if (this.input) this.input.value = value;\n\n        this.pristine = false;\n        this._value = value;\n    }\n\n    /**\n     * Retrieves the value from the input element if available; otherwise,\n     * returns the internal _value property or an empty string as the default.\n     * @returns {string} The current value from the input element, the internal _value, or an empty string.\n     */\n    get value() {\n        return this.input?.value ?? this._value ?? '';\n    }\n\n    /**\n     * Sets the label attribute of the element.\n     * @param {string} value The value to set as the label attribute.\n     */\n    set label(value) {\n        this.setAttribute('label', value);\n    }\n\n    /**\n     * Retrieves the value of the 'label' attribute if it exists.\n     * If the 'label' attribute is not set, it returns false.\n     * @returns {string|boolean} The value of the 'label' attribute as a string, or false if the attribute is not set.\n     */\n    get label() {\n        return this.getAttribute('label') || false;\n    }\n\n    /**\n     * Sets the custom error display attribute for an element.\n     * @param {boolean} value If true, adds the 'custom-error-display' attribute to the element. If false, removes the attribute from the element.\n     */\n    set customErrorDisplay(value) {\n        if (value) {\n            this.setAttribute('custom-error-display', '');\n        } else {\n            this.removeAttribute('custom-error-display');\n        }\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     * Sets the `validateOnChange` property. If set to a truthy value, it adds the\n     * `validate-on-change` attribute to the element. If set to a falsy value, it\n     * removes the `validate-on-change` attribute from the element.\n     * @param {boolean} value Determines whether to add or remove the\n     * `validate-on-change` attribute. A truthy value adds the attribute, whereas a\n     * falsy value removes it.\n     */\n    set validateOnChange(value) {\n        if (value) {\n            this.setAttribute('validate-on-change', '');\n        } else {\n            this.removeAttribute('validate-on-change');\n        }\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     * Sets or removes the 'invalid' attribute on an element based on the provided value.\n     * @param {boolean} value If true, the 'invalid' attribute is set. If false, the 'invalid' attribute is removed.\n     */\n    set invalid(value) {\n        if (value) {\n            this.setAttribute('invalid', '');\n        } else {\n            this.removeAttribute('invalid');\n        }\n    }\n\n    /**\n     * Gets the value of the 'invalid' attribute.\n     * Determines whether the 'invalid' attribute is present on the element.\n     * @returns {boolean} True if the 'invalid' attribute is present, otherwise false.\n     */\n    get invalid() {\n        return this.hasAttribute('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 element.\n     */\n    get name() {\n        return this.getAttribute('name');\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 element.\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 or removes the 'clearable' attribute on the element.\n     * When set to a truthy value, the 'clearable' attribute is added; when falsy, the attribute is removed.\n     * @param {boolean} value Determines whether to set or remove the 'clearable' attribute. If true, the 'clearable' attribute is added. If false, it is removed.\n     */\n    set clearable(value) {\n        if (value) {\n            this.setAttribute('clearable', '');\n        } else {\n            this.removeAttribute('clearable');\n        }\n    }\n\n    /**\n     * Checks if the 'clearable' attribute is present on the element.\n     * @returns {boolean} True if the 'clearable' attribute is set, otherwise false.\n     */\n    get clearable() {\n        return this.hasAttribute('clearable');\n    }\n\n    /**\n     * Sets the placeholder value for an element. If the provided value is non-empty,\n     * it assigns the value to the \"placeholder\" attribute. Otherwise, it removes\n     * the \"placeholder\" attribute from the element.\n     * @param {string} value The placeholder text to set or null/undefined to remove the attribute.\n     */\n    set placeholder(value) {\n        if (value) {\n            this.setAttribute('placeholder', value);\n        } else {\n            this.removeAttribute('placeholder');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'placeholder' attribute from the element.\n     * If the attribute is not set, it returns an empty string.\n     * @returns {string} The value of the 'placeholder' attribute or an empty string if not set.\n     */\n    get placeholder() {\n        return this.getAttribute('placeholder') || '';\n    }\n\n    /**\n     * Sets the `variant` attribute on the element. If a value is provided, it will set the attribute to the given value.\n     * If no value is provided, it removes the `variant` attribute from the element.\n     * @param {string} value The value to set for the `variant` attribute. If falsy, the attribute is removed.\n     */\n    set variant(value) {\n        if (value) {\n            this.setAttribute('variant', value);\n        } else {\n            this.removeAttribute('variant');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'variant' attribute from the element.\n     * If the attribute is not set, it defaults to 'default'.\n     * @returns {string} The value of the 'variant' attribute or 'default' if not set.\n     */\n    get variant() {\n        return this.getAttribute('variant') || 'default';\n    }\n\n    /**\n     * The class name of the input element.\n     * @type {string}\n     */\n    className = 'Input';\n\n    /**\n     * Getter for the cssStyleSheet attribute.\n     * @returns {CSSStyleSheet} The CSS style sheet of the input element.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observedAttributes attribute of the input element.\n     * @returns {Array} The attributes to observe for changes.\n     */\n    static get observedAttributes() {\n        return ['value', 'name', 'disabled', 'placeholder', 'label', 'message', 'error-inline'];\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 input.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        // if some value was set via value setter then dont use default value\n        if (this.pristine) {\n            this.value = this.defaultValue;\n            this.pristine = false;\n        }\n    }\n\n    beforeDraw() {\n        this.observer.disconnect();\n    }\n\n    /**\n     * Draws the input element.\n     * @returns {DocumentFragment} The drawn input.\n     */\n    draw() {\n        let hasSlotStart = this.hasSlot(this, 'start');\n        let hasSlotEnd = this.hasSlot(this, 'end');\n        let hasSlotError = this.hasSlot(this, 'error');\n        let fragment = document.createDocumentFragment();\n\n        // Wrapper\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-input', this.variant);\n\n        if (this.hasAttribute('invalid')) native.classList.add('has-error');\n\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('wrapper');\n\n        let inputWrapper = document.createElement('div');\n        inputWrapper.setAttribute('part', 'wrapper');\n        inputWrapper.classList.add('input-wrapper');\n\n        // Label\n        let label = document.createElement('label');\n        label.setAttribute('part', 'label');\n        label.innerText = this.label;\n        if (this.value && !this.hasAttribute('error')) label.classList.add('fade');\n\n        // Input\n        let input = document.createElement('input');\n        input.setAttribute('type', 'text');\n        input.setAttribute('part', 'input');\n        input.setAttribute('value', this.value || '');\n        input.classList.add('form-control');\n\n        const attributes = Array.from(this.attributes).map((attr) => attr.name);\n\n        attributes.forEach((attr) => {\n            if (this.hasAttribute(attr)) {\n                input.setAttribute(attr, this[attr] || '');\n            }\n        });\n\n        // Error\n        let error = document.createElement('div');\n        error.setAttribute('slot', 'error');\n\n        let start = null;\n        if (hasSlotStart) {\n            start = document.createElement('slot');\n            start.setAttribute('name', 'start');\n            start.setAttribute('part', 'start');\n        }\n\n        let end = null;\n        if (hasSlotEnd) {\n            end = document.createElement('slot');\n            end.setAttribute('name', 'end');\n            end.setAttribute('part', 'end');\n        }\n\n        if (hasSlotStart) {\n            wrapper.appendChild(start); // zmenene\n            native.classList.add('has-start');\n        }\n\n        if (this.label) {\n            if (this.variant === 'standard') {\n                native.append(label);\n            } else {\n                inputWrapper.appendChild(label);\n            }\n        }\n\n        inputWrapper.appendChild(input);\n        wrapper.appendChild(inputWrapper);\n\n        native.appendChild(wrapper);\n\n        // if (hasSlotError) {\n        let errorSlot = document.createElement('slot');\n        errorSlot.setAttribute('name', 'error');\n\n        // if (this.hasAttribute('error-inline')) {\n            // inline version of error message\n            native.append(errorSlot);\n        // } else {\n        //     tooltip version of error message\n            // error.appendChild(errorSlot);\n            // wrapper.appendChild(error);\n        // }\n\n        // if (!hasSlotError) {\n            this.append(error);\n        // }\n\n        if (this.clearable) {\n            this.clear = document.createElement('wje-button');\n            this.clear.classList.add('clear');\n            this.clear.setAttribute('fill', 'link');\n            this.clear.setAttribute('part', 'clear');\n\n            let clearIcon = document.createElement('wje-icon');\n            clearIcon.setAttribute('name', 'x');\n            this.clear.appendChild(clearIcon);\n            inputWrapper.appendChild(this.clear);\n        }\n\n        if (hasSlotEnd) {\n            wrapper.appendChild(end);// zmenene\n            native.classList.add('has-end');\n        }\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.labelElement = label;\n        this.input = input;\n        this.errorMessage = error;\n\n        return fragment;\n    }\n\n    /**\n     * Runs after the input is drawn to the DOM.\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.input.addEventListener('input', (e) => {\n            this.validateInput();\n\n            if (this.validateOnChange) {\n                this.pristine = false;\n                this.propagateValidation();\n            }\n\n            this.input.classList.remove('pristine');\n            this.labelElement.classList.add('fade');\n\n            const clone = new e.constructor(e.type, e);\n            this.dispatchEvent(clone);\n\n            event.dispatchCustomEvent(this, 'wje-input:input', {\n                value: this.input.value,\n            });\n\n            this.value = this.input.value;\n        });\n\n        this.addEventListener('invalid', (e) => {\n            this.invalid = true;\n            this.pristine = false;\n\n            this.showInvalidMessage();\n\n            if (this.customErrorDisplay) {\n                e.preventDefault();\n            }\n        });\n\n        this.addEventListener('focus', () => this.input.focus());\n\n        if (this.clear) {\n            this.clear.addEventListener('wje-button:click', (e) => {\n                this.input.value = '';\n                event.dispatchCustomEvent(this.clear, 'wje-input:clear');\n            });\n        }\n\n        this.validateInput();\n\n        if (this.hasAttribute('invalid')) {\n            this.showInvalidMessage();\n        }\n\n        this.observer.observe(this, {\n            attributes: true, // Watch for attribute changes\n            attributeOldValue: true, // Keep track of the old value of attributes\n        });\n    }\n\n    componentCleanup() {\n        this.observer.disconnect();\n    }\n\n    /**\n     * @summary Displays the validation message for the input.\n     * If the input has a slot named 'error', it sets the text content of the element with attribute 'error-message' inside the slot to the validation message.\n     * If the input does not have an 'error' slot, it sets the text content of the errorMessage property to the validation message.\n     */\n    showInvalidMessage() {\n        let hasSlotError = this.hasSlot(this, 'error');\n\n        if (hasSlotError) {\n            const slot = this.querySelector(\"[slot='error']\");\n            let errorMessageEL = slot.querySelector('[error-message]');\n\n            if (!errorMessageEL) {\n                const error = document.createElement('div');\n                error.setAttribute('error-message', '');\n                slot.append(error);\n                errorMessageEL = error;\n            }\n\n            errorMessageEL.textContent = this.internals.validationMessage;\n        } else {\n            this.errorMessage.textContent = this.internals.validationMessage;\n        }\n    }\n\n    /**\n     * @summary Validates the input.\n     * This method checks the validity state of the input. If the input is not valid, it iterates over the validity state object.\n     * For each invalid state, it constructs an attribute name and checks if the input has this attribute.\n     * If the input has the attribute, it sets the validation error to the state and the error message to the attribute value.\n     * If the input does not have the attribute, it sets the error message to the default validation message of the input.\n     * It then sets the validity in the form internals to an object with the validation error as key and true as value, and the error message.\n     * If the input is valid, it sets the validity in the form internals to an empty object.\n     */\n    validateInput() {\n        const validState = this.input.validity;\n\n        if (!validState.valid) {\n            for (let state in validState) {\n                const attr = `message-${state.toString()}`;\n\n                if (validState[state]) {\n                    this.validationError = state.toString();\n                    let errorMessage = this.message;\n\n                    // TODO this take error messages based on lang from operating system of user  should we implement custom translations based on app language ?\n                    if (!this.hasAttribute('message'))\n                        errorMessage = this.hasAttribute(attr) ? this.getAttribute(attr) : this.input.validationMessage;\n\n                    this.internals.setValidity({ [this.validationError]: true }, errorMessage);\n                }\n            }\n        } else {\n            this.internals.setValidity({});\n        }\n    }\n\n    /**\n     * Checks and updates the validation state of the component based on its current properties.\n     * If the component is invalid and a custom error display is enabled, it dispatches an 'invalid' event.\n     * @returns {void} This method does not return a value.\n     */\n    propagateValidation() {\n        this.invalid = !this.pristine && !this.validity.valid;\n\n        // if (this.invalid && this.customErrorDisplay) {\n        if (this.invalid) {\n            event.dispatchCustomEvent(this, 'invalid');\n        }\n    }\n\n    /**\n     * Checks whether the input has a slot.\n     * @param {HTMLElement} el The element to check.\n     * @param {string} slotName The name of the slot to check for.\n     * @returns {boolean} Whether the input has the slot.\n     */\n    hasSlot(el, slotName = null) {\n        let selector = slotName ? `[slot=\"${slotName}\"]` : '[slot]';\n\n        return el.querySelectorAll(selector).length > 0 ? true : false;\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            form?.addEventListener('submit', () => {\n                this.validateInput();\n                this.propagateValidation();\n            });\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    }\n\n    // dispatchEvent(e) {\n    //     return false;\n    // }\n}\n","import Input from './input.element.js';\n\nexport default Input;\n\nInput.define('wje-input', Input);\n"],"names":[],"mappings":";;;;;;AA6Be,MAAM,cAAc,UAAU;AAAA;AAAA;AAAA;AAAA,EAIzC,cAAc;AACV,UAAO;AAUX,2CAAkB,CAAC,cAAc;AAC7B,gBAAU,QAAQ,CAAC,aAAa;AAC5B,YAAI,SAAS,SAAS,cAAc;AAChC,gBAAM,gBAAgB,SAAS;AAC/B,gBAAM,WAAW,SAAS;AAC1B,gBAAM,WAAW,KAAK,aAAa,aAAa;AAEhD,kBAAQ,IAAI,aAAa,aAAa,iBAAiB,QAAQ,OAAO,QAAQ,EAAE;AAAA,QAChG;AAAA,MACA,CAAS;AAAA,IACT;AA6OI;AAAA;AAAA;AAAA;AAAA,qCAAY;AA/PR,SAAK,UAAU;AACf,SAAK,WAAW;AAChB,SAAK,YAAY,KAAK,gBAAiB;AAGvC,SAAK,WAAW,IAAI,iBAAiB,KAAK,eAAe;AAAA,EACjE;AAAA;AAAA;AAAA;AAAA;AAAA,EAkBI,IAAI,MAAM,OAAO;AACb,SAAK,UAAU,aAAa,KAAK;AAEjC,QAAI,KAAK,MAAO,MAAK,MAAM,QAAQ;AAEnC,SAAK,WAAW;AAChB,SAAK,SAAS;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,QAAQ;;AACR,aAAO,UAAK,UAAL,mBAAY,UAAS,KAAK,UAAU;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,MAAM,OAAO;AACb,SAAK,aAAa,SAAS,KAAK;AAAA,EACxC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,QAAQ;AACR,WAAO,KAAK,aAAa,OAAO,KAAK;AAAA,EAC7C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,mBAAmB,OAAO;AAC1B,QAAI,OAAO;AACP,WAAK,aAAa,wBAAwB,EAAE;AAAA,IACxD,OAAe;AACH,WAAK,gBAAgB,sBAAsB;AAAA,IACvD;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,qBAAqB;AACrB,WAAO,KAAK,aAAa,sBAAsB;AAAA,EACvD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUI,IAAI,iBAAiB,OAAO;AACxB,QAAI,OAAO;AACP,WAAK,aAAa,sBAAsB,EAAE;AAAA,IACtD,OAAe;AACH,WAAK,gBAAgB,oBAAoB;AAAA,IACrD;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,mBAAmB;AACnB,WAAO,KAAK,aAAa,oBAAoB;AAAA,EACrD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ,OAAO;AACf,QAAI,OAAO;AACP,WAAK,aAAa,WAAW,EAAE;AAAA,IAC3C,OAAe;AACH,WAAK,gBAAgB,SAAS;AAAA,IAC1C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,UAAU;AACV,WAAO,KAAK,aAAa,SAAS;AAAA,EAC1C;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,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;AAAA,EAOI,IAAI,UAAU,OAAO;AACjB,QAAI,OAAO;AACP,WAAK,aAAa,aAAa,EAAE;AAAA,IAC7C,OAAe;AACH,WAAK,gBAAgB,WAAW;AAAA,IAC5C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY;AACZ,WAAO,KAAK,aAAa,WAAW;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,IAAI,YAAY,OAAO;AACnB,QAAI,OAAO;AACP,WAAK,aAAa,eAAe,KAAK;AAAA,IAClD,OAAe;AACH,WAAK,gBAAgB,aAAa;AAAA,IAC9C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,cAAc;AACd,WAAO,KAAK,aAAa,aAAa,KAAK;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,QAAQ,OAAO;AACf,QAAI,OAAO;AACP,WAAK,aAAa,WAAW,KAAK;AAAA,IAC9C,OAAe;AACH,WAAK,gBAAgB,SAAS;AAAA,IAC1C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,UAAU;AACV,WAAO,KAAK,aAAa,SAAS,KAAK;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA,EAYI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,WAAW,qBAAqB;AAC5B,WAAO,CAAC,SAAS,QAAQ,YAAY,eAAe,SAAS,WAAW,cAAc;AAAA,EAC9F;AAAA;AAAA;AAAA;AAAA,EAWI,kBAAkB;AACd,SAAK,eAAe;AAEpB,QAAI,KAAK,UAAU;AACf,WAAK,QAAQ,KAAK;AAClB,WAAK,WAAW;AAAA,IAC5B;AAAA,EACA;AAAA,EAEI,aAAa;AACT,SAAK,SAAS,WAAY;AAAA,EAClC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,eAAe,KAAK,QAAQ,MAAM,OAAO;AAC7C,QAAI,aAAa,KAAK,QAAQ,MAAM,KAAK;AACtB,SAAK,QAAQ,MAAM,OAAO;AAC7C,QAAI,WAAW,SAAS,uBAAwB;AAGhD,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,UAAU,IAAI,gBAAgB,KAAK,OAAO;AAEjD,QAAI,KAAK,aAAa,SAAS,EAAG,QAAO,UAAU,IAAI,WAAW;AAElE,QAAI,UAAU,SAAS,cAAc,KAAK;AAC1C,YAAQ,UAAU,IAAI,SAAS;AAE/B,QAAI,eAAe,SAAS,cAAc,KAAK;AAC/C,iBAAa,aAAa,QAAQ,SAAS;AAC3C,iBAAa,UAAU,IAAI,eAAe;AAG1C,QAAI,QAAQ,SAAS,cAAc,OAAO;AAC1C,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,YAAY,KAAK;AACvB,QAAI,KAAK,SAAS,CAAC,KAAK,aAAa,OAAO,EAAG,OAAM,UAAU,IAAI,MAAM;AAGzE,QAAI,QAAQ,SAAS,cAAc,OAAO;AAC1C,UAAM,aAAa,QAAQ,MAAM;AACjC,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,aAAa,SAAS,KAAK,SAAS,EAAE;AAC5C,UAAM,UAAU,IAAI,cAAc;AAElC,UAAM,aAAa,MAAM,KAAK,KAAK,UAAU,EAAE,IAAI,CAAC,SAAS,KAAK,IAAI;AAEtE,eAAW,QAAQ,CAAC,SAAS;AACzB,UAAI,KAAK,aAAa,IAAI,GAAG;AACzB,cAAM,aAAa,MAAM,KAAK,IAAI,KAAK,EAAE;AAAA,MACzD;AAAA,IACA,CAAS;AAGD,QAAI,QAAQ,SAAS,cAAc,KAAK;AACxC,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAI,QAAQ;AACZ,QAAI,cAAc;AACd,cAAQ,SAAS,cAAc,MAAM;AACrC,YAAM,aAAa,QAAQ,OAAO;AAClC,YAAM,aAAa,QAAQ,OAAO;AAAA,IAC9C;AAEQ,QAAI,MAAM;AACV,QAAI,YAAY;AACZ,YAAM,SAAS,cAAc,MAAM;AACnC,UAAI,aAAa,QAAQ,KAAK;AAC9B,UAAI,aAAa,QAAQ,KAAK;AAAA,IAC1C;AAEQ,QAAI,cAAc;AACd,cAAQ,YAAY,KAAK;AACzB,aAAO,UAAU,IAAI,WAAW;AAAA,IAC5C;AAEQ,QAAI,KAAK,OAAO;AACZ,UAAI,KAAK,YAAY,YAAY;AAC7B,eAAO,OAAO,KAAK;AAAA,MACnC,OAAmB;AACH,qBAAa,YAAY,KAAK;AAAA,MAC9C;AAAA,IACA;AAEQ,iBAAa,YAAY,KAAK;AAC9B,YAAQ,YAAY,YAAY;AAEhC,WAAO,YAAY,OAAO;AAG1B,QAAI,YAAY,SAAS,cAAc,MAAM;AAC7C,cAAU,aAAa,QAAQ,OAAO;AAIlC,WAAO,OAAO,SAAS;AAQvB,SAAK,OAAO,KAAK;AAGrB,QAAI,KAAK,WAAW;AAChB,WAAK,QAAQ,SAAS,cAAc,YAAY;AAChD,WAAK,MAAM,UAAU,IAAI,OAAO;AAChC,WAAK,MAAM,aAAa,QAAQ,MAAM;AACtC,WAAK,MAAM,aAAa,QAAQ,OAAO;AAEvC,UAAI,YAAY,SAAS,cAAc,UAAU;AACjD,gBAAU,aAAa,QAAQ,GAAG;AAClC,WAAK,MAAM,YAAY,SAAS;AAChC,mBAAa,YAAY,KAAK,KAAK;AAAA,IAC/C;AAEQ,QAAI,YAAY;AACZ,cAAQ,YAAY,GAAG;AACvB,aAAO,UAAU,IAAI,SAAS;AAAA,IAC1C;AAEQ,aAAS,YAAY,MAAM;AAE3B,SAAK,SAAS;AACd,SAAK,eAAe;AACpB,SAAK,QAAQ;AACb,SAAK,eAAe;AAEpB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,SAAK,MAAM,iBAAiB,SAAS,CAAC,MAAM;AACxC,WAAK,aAAa,UAAU,IAAI,MAAM;AACtC,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,MAAK,aAAa,UAAU,OAAO,MAAM;AAAA,IAC1E,CAAS;AAED,SAAK,MAAM,iBAAiB,SAAS,CAAC,MAAM;AACxC,WAAK,cAAe;AAEpB,UAAI,KAAK,kBAAkB;AACvB,aAAK,WAAW;AAChB,aAAK,oBAAqB;AAAA,MAC1C;AAEY,WAAK,MAAM,UAAU,OAAO,UAAU;AACtC,WAAK,aAAa,UAAU,IAAI,MAAM;AAEtC,YAAM,QAAQ,IAAI,EAAE,YAAY,EAAE,MAAM,CAAC;AACzC,WAAK,cAAc,KAAK;AAExB,YAAM,oBAAoB,MAAM,mBAAmB;AAAA,QAC/C,OAAO,KAAK,MAAM;AAAA,MAClC,CAAa;AAED,WAAK,QAAQ,KAAK,MAAM;AAAA,IACpC,CAAS;AAED,SAAK,iBAAiB,WAAW,CAAC,MAAM;AACpC,WAAK,UAAU;AACf,WAAK,WAAW;AAEhB,WAAK,mBAAoB;AAEzB,UAAI,KAAK,oBAAoB;AACzB,UAAE,eAAgB;AAAA,MAClC;AAAA,IACA,CAAS;AAED,SAAK,iBAAiB,SAAS,MAAM,KAAK,MAAM,OAAO;AAEvD,QAAI,KAAK,OAAO;AACZ,WAAK,MAAM,iBAAiB,oBAAoB,CAAC,MAAM;AACnD,aAAK,MAAM,QAAQ;AACnB,cAAM,oBAAoB,KAAK,OAAO,iBAAiB;AAAA,MACvE,CAAa;AAAA,IACb;AAEQ,SAAK,cAAe;AAEpB,QAAI,KAAK,aAAa,SAAS,GAAG;AAC9B,WAAK,mBAAoB;AAAA,IACrC;AAEQ,SAAK,SAAS,QAAQ,MAAM;AAAA,MACxB,YAAY;AAAA;AAAA,MACZ,mBAAmB;AAAA;AAAA,IAC/B,CAAS;AAAA,EACT;AAAA,EAEI,mBAAmB;AACf,SAAK,SAAS,WAAY;AAAA,EAClC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,qBAAqB;AACjB,QAAI,eAAe,KAAK,QAAQ,MAAM,OAAO;AAE7C,QAAI,cAAc;AACd,YAAM,OAAO,KAAK,cAAc,gBAAgB;AAChD,UAAI,iBAAiB,KAAK,cAAc,iBAAiB;AAEzD,UAAI,CAAC,gBAAgB;AACjB,cAAM,QAAQ,SAAS,cAAc,KAAK;AAC1C,cAAM,aAAa,iBAAiB,EAAE;AACtC,aAAK,OAAO,KAAK;AACjB,yBAAiB;AAAA,MACjC;AAEY,qBAAe,cAAc,KAAK,UAAU;AAAA,IACxD,OAAe;AACH,WAAK,aAAa,cAAc,KAAK,UAAU;AAAA,IAC3D;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWI,gBAAgB;AACZ,UAAM,aAAa,KAAK,MAAM;AAE9B,QAAI,CAAC,WAAW,OAAO;AACnB,eAAS,SAAS,YAAY;AAC1B,cAAM,OAAO,WAAW,MAAM,SAAU,CAAA;AAExC,YAAI,WAAW,KAAK,GAAG;AACnB,eAAK,kBAAkB,MAAM,SAAU;AACvC,cAAI,eAAe,KAAK;AAGxB,cAAI,CAAC,KAAK,aAAa,SAAS;AAC5B,2BAAe,KAAK,aAAa,IAAI,IAAI,KAAK,aAAa,IAAI,IAAI,KAAK,MAAM;AAElF,eAAK,UAAU,YAAY,EAAE,CAAC,KAAK,eAAe,GAAG,KAAM,GAAE,YAAY;AAAA,QAC7F;AAAA,MACA;AAAA,IACA,OAAe;AACH,WAAK,UAAU,YAAY,EAAE;AAAA,IACzC;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,sBAAsB;AAClB,SAAK,UAAU,CAAC,KAAK,YAAY,CAAC,KAAK,SAAS;AAGhD,QAAI,KAAK,SAAS;AACd,YAAM,oBAAoB,MAAM,SAAS;AAAA,IACrD;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,QAAQ,IAAI,WAAW,MAAM;AACzB,QAAI,WAAW,WAAW,UAAU,QAAQ,OAAO;AAEnD,WAAO,GAAG,iBAAiB,QAAQ,EAAE,SAAS,IAAI,OAAO;AAAA,EACjE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,uBAAuB,MAAM;AACzB,QAAI,MAAM;AACN,WAAK,UAAU,aAAa,KAAK,KAAK;AACtC,mCAAM,iBAAiB,UAAU,MAAM;AACnC,aAAK,cAAe;AACpB,aAAK,oBAAqB;AAAA,MAC1C;AAAA,IACA;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;AAAA,EAC/D;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAhXI,cA5RiB,OA4RV,kBAAiB;ACrT5B,MAAM,OAAO,aAAa,KAAK;"}
+{"version":3,"file":"wje-input.js","sources":["../packages/wje-input/input.element.js","../packages/wje-input/input.js"],"sourcesContent":["import { FormAssociatedElement } from '../internals/form-associated-element.js';\nimport { event } from '../utils/event.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents a custom input element. It extends the WJElement class and provides additional functionality for handling input.\n * @documentation https://elements.webjet.sk/components/input\n * @status stable\n * @augments {FormAssociatedElement}\n * @csspart native - The native part.\n * @csspart wrapper - The wrapper part.\n * @csspart input - The input part.\n * @csspart clear - The clear part.\n * @slot start - Slot for content at the start of the input.\n * @slot end - Slot for content at the end of the input.\n * @cssproperty [--wje-input-font-family=var(--wje-font-family)] - Defines the font family for the input text.\n * @cssproperty [--wje-input-background-color=var(--wje-background)] - Specifies the background color of the input field.\n * @cssproperty [--wje-input-color=var(--wje-color)] - Sets the text color within the input field.\n * @cssproperty [--wje-input-color-invalid=var(--wje-color-danger)] - Changes the text color when the input value is invalid.\n * @cssproperty [--wje-input-border-color=var(--wje-border-color)] - Defines the border color of the input field.\n * @cssproperty [--wje-input-border-color-focus=var(--wje-color-primary)] - Specifies the border color when the input is focused.\n * @cssproperty [--wje-input-border-width=1px] - Sets the width of the input border.\n * @cssproperty [--wje-input-border-style=solid] - Defines the border style of the input (e.g., solid, dashed).\n * @cssproperty [--wje-input-border-radius=4px] - Specifies the border radius, creating rounded corners.\n * @cssproperty [--wje-input-margin-bottom=.5rem] - Adds spacing below the input field.\n * @cssproperty [--wje-input-line-height=20px] - Sets the line height of the text within the input field.\n * @cssproperty [--wje-input-slot-padding-inline=.5rem] - Controls the padding on the left and right of the input slot content.\n * // @fires wje-input:input - Dispatched when the input value changes.\n * // @fires wje-input:clear - Dispatched when the input is cleared.\n */\nexport default class Input extends FormAssociatedElement {\n    /**\n     * Creates an instance of Input.\n     */\n    constructor() {\n        super();\n\n        this.invalid = false;\n        this.pristine = true;\n    }\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        this.internals.setFormValue(value);\n\n        if (this.input) this.input.value = value;\n\n        this.pristine = false;\n        this._value = value;\n    }\n\n    /**\n     * Retrieves the value from the input element if available; otherwise,\n     * returns the internal _value property or an empty string as the default.\n     * @returns {string} The current value from the input element, the internal _value, or an empty string.\n     */\n    get value() {\n        return this.input?.value ?? this._value ?? '';\n    }\n\n    /**\n     * Sets the label attribute of the element.\n     * @param {string} value The value to set as the label attribute.\n     */\n    set label(value) {\n        this.setAttribute('label', value);\n    }\n\n    /**\n     * Retrieves the value of the 'label' attribute if it exists.\n     * If the 'label' attribute is not set, it returns false.\n     * @returns {string|boolean} The value of the 'label' attribute as a string, or false if the attribute is not set.\n     */\n    get label() {\n        return this.getAttribute('label') || false;\n    }\n\n    /**\n     * Sets the custom error display attribute for an element.\n     * @param {boolean} value If true, adds the 'custom-error-display' attribute to the element. If false, removes the attribute from the element.\n     */\n    set customErrorDisplay(value) {\n        if (value) {\n            this.setAttribute('custom-error-display', '');\n        } else {\n            this.removeAttribute('custom-error-display');\n        }\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     * Sets the `validateOnChange` property. If set to a truthy value, it adds the\n     * `validate-on-change` attribute to the element. If set to a falsy value, it\n     * removes the `validate-on-change` attribute from the element.\n     * @param {boolean} value Determines whether to add or remove the\n     * `validate-on-change` attribute. A truthy value adds the attribute, whereas a\n     * falsy value removes it.\n     */\n    set validateOnChange(value) {\n        if (value) {\n            this.setAttribute('validate-on-change', '');\n        } else {\n            this.removeAttribute('validate-on-change');\n        }\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     * @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 or removes the 'clearable' attribute on the element.\n     * When set to a truthy value, the 'clearable' attribute is added; when falsy, the attribute is removed.\n     * @param {boolean} value Determines whether to set or remove the 'clearable' attribute. If true, the 'clearable' attribute is added. If false, it is removed.\n     */\n    set clearable(value) {\n        if (value) {\n            this.setAttribute('clearable', '');\n        } else {\n            this.removeAttribute('clearable');\n        }\n    }\n\n    /**\n     * Checks if the 'clearable' attribute is present on the element.\n     * @returns {boolean} True if the 'clearable' attribute is set, otherwise false.\n     */\n    get clearable() {\n        return this.hasAttribute('clearable');\n    }\n\n    /**\n     * Sets the placeholder value for an element. If the provided value is non-empty,\n     * it assigns the value to the \"placeholder\" attribute. Otherwise, it removes\n     * the \"placeholder\" attribute from the element.\n     * @param {string} value The placeholder text to set or null/undefined to remove the attribute.\n     */\n    set placeholder(value) {\n        if (value) {\n            this.setAttribute('placeholder', value);\n        } else {\n            this.removeAttribute('placeholder');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'placeholder' attribute from the element.\n     * If the attribute is not set, it returns an empty string.\n     * @returns {string} The value of the 'placeholder' attribute or an empty string if not set.\n     */\n    get placeholder() {\n        return this.getAttribute('placeholder') || '';\n    }\n\n    /**\n     * Sets the `variant` attribute on the element. If a value is provided, it will set the attribute to the given value.\n     * If no value is provided, it removes the `variant` attribute from the element.\n     * @param {string} value The value to set for the `variant` attribute. If falsy, the attribute is removed.\n     */\n    set variant(value) {\n        if (value) {\n            this.setAttribute('variant', value);\n        } else {\n            this.removeAttribute('variant');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'variant' attribute from the element.\n     * If the attribute is not set, it defaults to 'default'.\n     * @returns {string} The value of the 'variant' attribute or 'default' if not set.\n     */\n    get variant() {\n        return this.getAttribute('variant') || 'default';\n    }\n\n    /**\n     * The class name of the input element.\n     * @type {string}\n     */\n    className = 'Input';\n\n    /**\n     * Getter for the cssStyleSheet attribute.\n     * @returns {CSSStyleSheet} The CSS style sheet of the input element.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observedAttributes attribute of the input element.\n     * @returns {Array} The attributes to observe for changes.\n     */\n    static get observedAttributes() {\n        return ['value', 'name', 'disabled', 'placeholder', 'label', 'message', 'error-inline'];\n    }\n\n    /**\n     * Sets up the attributes for the input.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        // if some value was set via value setter then dont use default value\n        if (this.pristine) {\n            this.value = this.defaultValue;\n            this.pristine = false;\n        }\n    }\n\n    /**\n     * Draws the input element.\n     * @returns {DocumentFragment} The drawn input.\n     */\n    draw() {\n        let hasSlotStart = this.hasSlot(this, 'start');\n        let hasSlotEnd = this.hasSlot(this, 'end');\n        let hasSlotError = this.hasSlot(this, 'error');\n        let fragment = document.createDocumentFragment();\n\n        // Wrapper\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-input', this.variant);\n\n        if (this.invalid) native.classList.add('has-error');\n\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('wrapper');\n\n        let inputWrapper = document.createElement('div');\n        inputWrapper.setAttribute('part', 'wrapper');\n        inputWrapper.classList.add('input-wrapper');\n\n        // Label\n        let label = document.createElement('label');\n        label.setAttribute('part', 'label');\n        label.innerText = this.label;\n        if (this.value && !this.hasAttribute('error')) label.classList.add('fade');\n\n        // Input\n        let input = document.createElement('input');\n        input.setAttribute('type', 'tralala');\n        input.setAttribute('part', 'input');\n        input.setAttribute('value', this.value || '');\n        input.classList.add('form-control');\n\n        const attributes = Array.from(this.attributes).map((attr) => attr.name);\n\n        attributes.forEach((attr) => {\n            if (this.hasAttribute(attr)) {\n                input.setAttribute(attr, this[attr] || '');\n            }\n        });\n\n        // Error\n        let errorSlot = document.createElement('slot');\n        errorSlot.setAttribute('name', 'error');\n\n        let error = document.createElement('div');\n        error.setAttribute('slot', 'error');\n\n        let start = null;\n        if (hasSlotStart) {\n            start = document.createElement('slot');\n            start.setAttribute('name', 'start');\n            start.setAttribute('part', 'start');\n        }\n\n        let end = null;\n        if (hasSlotEnd) {\n            end = document.createElement('slot');\n            end.setAttribute('name', 'end');\n            end.setAttribute('part', 'end');\n        }\n\n        if (hasSlotStart) {\n            wrapper.appendChild(start); // zmenene\n            native.classList.add('has-start');\n        }\n\n        if (this.label) {\n            if (this.variant === 'standard') {\n                native.append(label);\n            } else {\n                inputWrapper.appendChild(label);\n            }\n        }\n\n        inputWrapper.appendChild(input);\n        wrapper.appendChild(inputWrapper);\n\n        native.appendChild(wrapper);\n        native.append(errorSlot);\n\n        this.append(error);\n\n        if (this.clearable) {\n            this.clear = document.createElement('wje-button');\n            this.clear.classList.add('clear');\n            this.clear.setAttribute('fill', 'link');\n            this.clear.setAttribute('part', 'clear');\n\n            let clearIcon = document.createElement('wje-icon');\n            clearIcon.setAttribute('name', 'x');\n            this.clear.appendChild(clearIcon);\n            inputWrapper.appendChild(this.clear);\n        }\n\n        if (hasSlotEnd) {\n            wrapper.appendChild(end);// zmenene\n            native.classList.add('has-end');\n        }\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.labelElement = label;\n        this.input = input;\n        this.errorMessage = error;\n\n        return fragment;\n    }\n\n    /**\n     * Runs after the input is drawn to the DOM.\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.input.addEventListener('input', (e) => {\n            this.validate();\n\n            if (this.validateOnChange) {\n                this.pristine = false;\n                this.propagateValidation();\n            }\n\n            this.input.classList.remove('pristine');\n            this.labelElement.classList.add('fade');\n\n            // const clone = new e.constructor(e.type, e);\n            // this.dispatchEvent(clone);\n\n            event.dispatchCustomEvent(this, 'wje-input:input', {\n                value: this.input.value,\n            });\n\n            this.value = this.input.value;\n        });\n\n        this.addEventListener('wje-input:invalid', (e) => {\n            this.invalid = true;\n            this.pristine = false;\n\n            this.showInvalidMessage();\n\n            if (this.customErrorDisplay) {\n                e.preventDefault();\n            }\n        });\n\n        this.addEventListener('focus', () => this.input.focus());\n\n        if (this.clear) {\n            this.clear.addEventListener('wje-button:click', (e) => {\n                this.input.value = '';\n                event.dispatchCustomEvent(this.clear, 'wje-input:clear');\n            });\n        }\n\n        this.validate();\n\n        if (this.invalid) {\n            this.showInvalidMessage();\n        }\n\n    }\n\n    /**\n     * Checks whether the input has a slot.\n     * @param {HTMLElement} el The element to check.\n     * @param {string} slotName The name of the slot to check for.\n     * @returns {boolean} Whether the input has the slot.\n     */\n    hasSlot(el, slotName = null) {\n        let selector = slotName ? `[slot=\"${slotName}\"]` : '[slot]';\n\n        return el.querySelectorAll(selector).length > 0 ? true : false;\n    }\n}\n","import Input from './input.element.js';\n\nexport default Input;\n\nInput.define('wje-input', Input);\n"],"names":[],"mappings":"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"}

package/dist/wje-master.js

@@ -105,7 +105,7 @@ import { default as default89 } from "./wje-tree.js";
 import { default as default90 } from "./wje-tree-item.js";
 import { default as default91 } from "./wje-visually-hidden.js";
 import { default as default92 } from "./wje-sliding-container.js";
-import { P } from "./popup.element-Di4nHYij.js";
+import { P } from "./popup.element-CVbbnTWI.js";
 const skSk = {
   code: "sk-sk",
   name: "Slovak",

package/dist/wje-option.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-option.js","sources":["../packages/wje-option/option.element.js","../packages/wje-option/option.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Icon from '../wje-icon/icon.js';\nimport Checkbox from '../wje-checkbox/checkbox.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Option` is a custom web component that represents an option.\n * @summary This element represents an option.\n * @documentation https://elements.webjet.sk/components/option\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the option.\n * @slot start - The slot for the start of the option.\n * @slot - The default slot for the option.\n * @slot end - The slot for the end of the option.\n * // @fires wje-option:change - Event fired when the option is clicked.\n * @tag wje-option\n */\nexport default class Option extends WJElement {\n\t/**\n\t * Creates an instance of Option.\n\t * @class\n\t */\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\t/**\n\t * Dependencies of the Option component.\n\t */\n\tdependencies = {\n\t\t'wje-icon': Icon,\n\t\t'wje-checkbox': Checkbox,\n\t};\n\n\t/**\n\t * Sets the selected attribute of the option.\n\t * @param {boolean} value The value to set.\n\t */\n\tset selected(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('selected', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('selected');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the 'selected' attribute status of the element.\n\t * @returns {boolean} Returns true if the 'selected' attribute is set on the element; otherwise, false.\n\t */\n\tget selected() {\n\t\treturn this.hasAttribute('selected');\n\t}\n\n\t/**\n\t * Retrieves the value indicating whether the closest 'wje-select' element has a 'checkbox' attribute.\n\t * @returns {boolean} True if the closest 'wje-select' element has a 'checkbox' attribute; otherwise, false.\n\t */\n\tget checkbox() {\n\t\treturn this.closest('wje-select').hasAttribute('checkbox');\n\t}\n\n\t/**\n\t * Determines whether the closest 'wje-select' element has the 'multiple' attribute.\n\t * @returns {boolean} Returns true if the 'wje-select' element has the 'multiple' attribute, otherwise false.\n\t */\n\tget multiple() {\n\t\treturn this.closest('wje-select').hasAttribute('multiple');\n\t}\n\n\t/**\n\t * Sets the value attribute of the option.\n\t * @param {string} value The value to set.\n\t */\n\tset value(value) {\n\t\tthis.setAttribute('value', value);\n\t}\n\n\tget value() {\n\t\treturn this.getAttribute('value');\n\t}\n\n\t/**\n\t * Sets the text content of the option.\n\t * @param {string} value The text to set.\n\t */\n\tset text(value) {\n\t\tthis.innerText = value;\n\t}\n\n\tclassName = 'Option';\n\n\t/**\n\t * Returns the CSS styles for the component.\n\t * @static\n\t * @returns {CSSStyleSheet}\n\t */\n\tstatic get cssStyleSheet() {\n\t\treturn styles;\n\t}\n\n\t/**\n\t * Returns the list of attributes to observe for changes.\n\t * @static\n\t * @returns {Array<string>}\n\t */\n\tstatic get observedAttributes() {\n\t\treturn ['selected'];\n\t}\n\n\t/**\n\t * This method is called whenever an observed attribute is added, removed, or changed.\n\t * @param {string} name The name of the attribute that was changed.\n\t * @param {*} old The previous value of the attribute before the change.\n\t * @param {*} newName The new value of the attribute after the change.\n\t * @returns {void} This method does not return a value.\n\t */\n\tattributeChangedCallback(name, old, newName) {\n\t\tif (this.checkbox) {\n\t\t\tif (name === 'selected' && newName !== null) {\n\t\t\t\tthis.#setCheckbox(true);\n\t\t\t} else {\n\t\t\t\tthis.#setCheckbox(false);\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Sets up the attributes for the component.\n\t */\n\tsetupAttributes() {\n\t\tthis.isShadowRoot = 'open';\n\t}\n\n\t/**\n\t * Draws the component for the option.\n\t * @returns {DocumentFragment}\n\t */\n\tdraw() {\n\t\tlet fragment = document.createDocumentFragment();\n\n\t\tlet native = document.createElement('div');\n\t\tnative.classList.add('native-option');\n\t\tnative.setAttribute('part', 'native');\n\n\t\tlet icon = document.createElement('wje-icon');\n\t\ticon.setAttribute('name', 'check');\n\t\ticon.setAttribute('slot', 'check');\n\n\t\tlet checkboxEl = document.createElement('wje-checkbox');\n\t\tcheckboxEl.setAttribute('slot', 'check');\n\n\t\tlet check = document.createElement('slot');\n\t\tcheck.setAttribute('name', 'check');\n\t\tcheck.setAttribute('part', 'check');\n\n\t\tlet start = document.createElement('slot');\n\t\tstart.setAttribute('name', 'start');\n\n\t\tlet slot = document.createElement('slot');\n\n\t\tlet end = document.createElement('slot');\n\t\tend.setAttribute('name', 'end');\n\n\t\tconst hasCheckSlot = this.querySelector('[slot=\"check\"]') !== null;\n\n\t\tif (!hasCheckSlot) {\n\t\t\tif (this.checkbox && this.multiple) {\n\t\t\t\tthis.append(checkboxEl);\n\t\t\t} else {\n\t\t\t\tthis.append(icon);\n\t\t\t}\n\t\t}\n\n\t\tnative.append(check);\n\t\tnative.append(start);\n\t\tnative.append(slot);\n\t\tnative.append(end);\n\n\t\tfragment.append(native);\n\n\t\tthis.check = check;\n\n\t\treturn fragment;\n\t}\n\n\t/**\n\t * Method executed after the drawing process is completed.\n\t * Sets up an event listener for 'click' events, linking them to the specified callback function.\n\t * @returns {void} Does not return a value.\n\t */\n\tafterDraw() {\n\t\tevent.addListener(this, 'click', null, this.optionClickCallback);\n\t}\n\n\t/**\n\t * Handles operations or cleanup tasks that need to occur before disconnecting.\n\t * Removes an event listener associated with the 'click' event and a specified callback function.\n\t * @returns {void} This method does not return a value.\n\t */\n\tbeforeDisconnect() {\n\t\tevent.removeListener(this, 'click', null, this.optionClickCallback);\n\t}\n\n\t/**\n\t * Handles the click event on an option element and dispatches a custom event when triggered.\n\t * @param {Event} e The click event object that triggered the callback.\n\t * @returns {void} No return value.\n\t */\n\toptionClickCallback(e) {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\te.stopImmediatePropagation();\n\n\t\tif (this.hasAttribute('disabled')) return;\n\n\t\tevent.dispatchCustomEvent(this, 'wje-option:change', {\n\t\t\tvalue: this.value,\n\t\t\ttext: this.textContent,\n\t\t\toption: this,\n\t\t});\n\t}\n\n\t/**\n\t * Checks if the given DOM node represents a checkbox element.\n\t * @param {Node} node The DOM node to be checked.\n\t * @returns {boolean} Returns true if the node is an element with a class name of 'Checkbox', otherwise false.\n\t */\n\t#isCheckbox(node) {\n\t\treturn node instanceof Element && node.className === 'Checkbox';\n\t}\n\n\t/**\n\t * Updates the checked status of the first checkbox element found within the assigned elements of the specified container.\n\t * @param {boolean} checked The desired checked state to be applied to the checkbox.\n\t * @returns {void}\n\t */\n\t#setCheckbox(checked) {\n\t\tlet arr = [...this.check?.assignedElements({ flatten: true })]?.filter(item=> this.#isCheckbox(item));\n\t\tif(arr.length > 0)\n\t\t\tarr[0].checked = checked;\n\t}\n}\n","import Option from './option.element.js';\n\nexport default Option;\n\nOption.define('wje-option', Option);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-option.js","sources":["../packages/wje-option/option.element.js","../packages/wje-option/option.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Icon from '../wje-icon/icon.js';\nimport Checkbox from '../wje-checkbox/checkbox.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Option` is a custom web component that represents an option.\n * @summary This element represents an option.\n * @documentation https://elements.webjet.sk/components/option\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the option.\n * @slot start - The slot for the start of the option.\n * @slot - The default slot for the option.\n * @slot end - The slot for the end of the option.\n * // @fires wje-option:change - Event fired when the option is clicked.\n * @tag wje-option\n */\nexport default class Option extends WJElement {\n\t/**\n\t * Creates an instance of Option.\n\t * @class\n\t */\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\t/**\n\t * Dependencies of the Option component.\n\t */\n\tdependencies = {\n\t\t'wje-icon': Icon,\n\t\t'wje-checkbox': Checkbox,\n\t};\n\n\t/**\n\t * Sets the selected attribute of the option.\n\t * @param {boolean} value The value to set.\n\t */\n\tset selected(value) {\n\t\tif (value) {\n\t\t\tthis.setAttribute('selected', '');\n\t\t} else {\n\t\t\tthis.removeAttribute('selected');\n\t\t}\n\t}\n\n\t/**\n\t * Retrieves the 'selected' attribute status of the element.\n\t * @returns {boolean} Returns true if the 'selected' attribute is set on the element; otherwise, false.\n\t */\n\tget selected() {\n\t\treturn this.hasAttribute('selected');\n\t}\n\n\t/**\n\t * Retrieves the value indicating whether the closest 'wje-select' element has a 'checkbox' attribute.\n\t * @returns {boolean} True if the closest 'wje-select' element has a 'checkbox' attribute; otherwise, false.\n\t */\n\tget checkbox() {\n\t\treturn this.closest('wje-select').hasAttribute('checkbox');\n\t}\n\n\t/**\n\t * Determines whether the closest 'wje-select' element has the 'multiple' attribute.\n\t * @returns {boolean} Returns true if the 'wje-select' element has the 'multiple' attribute, otherwise false.\n\t */\n\tget multiple() {\n\t\treturn this.closest('wje-select').hasAttribute('multiple');\n\t}\n\n\t/**\n\t * Sets the value attribute of the option.\n\t * @param {string} value The value to set.\n\t */\n\tset value(value) {\n\t\tthis.setAttribute('value', value);\n\t}\n\n\tget value() {\n\t\treturn this.getAttribute('value');\n\t}\n\n\t/**\n\t * Sets the text content of the option.\n\t * @param {string} value The text to set.\n\t */\n\tset text(value) {\n\t\tthis.innerText = value;\n\t}\n\n\tclassName = 'Option';\n\n\t/**\n\t * Returns the CSS styles for the component.\n\t * @static\n\t * @returns {CSSStyleSheet}\n\t */\n\tstatic get cssStyleSheet() {\n\t\treturn styles;\n\t}\n\n\t/**\n\t * Returns the list of attributes to observe for changes.\n\t * @static\n\t * @returns {Array<string>}\n\t */\n\tstatic get observedAttributes() {\n\t\treturn ['selected'];\n\t}\n\n\t/**\n\t * This method is called whenever an observed attribute is added, removed, or changed.\n\t * @param {string} name The name of the attribute that was changed.\n\t * @param {*} old The previous value of the attribute before the change.\n\t * @param {*} newName The new value of the attribute after the change.\n\t * @returns {void} This method does not return a value.\n\t */\n\tattributeChangedCallback(name, old, newName) {\n\t\tif (this.checkbox) {\n\t\t\tif (name === 'selected' && newName !== null) {\n\t\t\t\tthis.#setCheckbox(true);\n\t\t\t} else {\n\t\t\t\tthis.#setCheckbox(false);\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Sets up the attributes for the component.\n\t */\n\tsetupAttributes() {\n\t\tthis.isShadowRoot = 'open';\n\t}\n\n\t/**\n\t * Draws the component for the option.\n\t * @returns {DocumentFragment}\n\t */\n\tdraw() {\n\t\tlet fragment = document.createDocumentFragment();\n\n\t\tlet native = document.createElement('div');\n\t\tnative.classList.add('native-option');\n\t\tnative.setAttribute('part', 'native');\n\n\t\tlet icon = document.createElement('wje-icon');\n\t\ticon.setAttribute('name', 'check');\n\t\ticon.setAttribute('slot', 'check');\n\n\t\tlet checkboxEl = document.createElement('wje-checkbox');\n\t\tcheckboxEl.setAttribute('slot', 'check');\n\n\t\tlet check = document.createElement('slot');\n\t\tcheck.setAttribute('name', 'check');\n\t\tcheck.setAttribute('part', 'check');\n\n\t\tlet start = document.createElement('slot');\n\t\tstart.setAttribute('name', 'start');\n\n\t\tlet slot = document.createElement('slot');\n\n\t\tlet end = document.createElement('slot');\n\t\tend.setAttribute('name', 'end');\n\n\t\tconst hasCheckSlot = this.querySelector('[slot=\"check\"]') !== null;\n\n\t\tif (!hasCheckSlot) {\n\t\t\tif (this.checkbox && this.multiple) {\n\t\t\t\tthis.append(checkboxEl);\n\t\t\t} else {\n\t\t\t\tthis.append(icon);\n\t\t\t}\n\t\t}\n\n\t\tnative.append(check);\n\t\tnative.append(start);\n\t\tnative.append(slot);\n\t\tnative.append(end);\n\n\t\tfragment.append(native);\n\n\t\tthis.check = check;\n\n\t\treturn fragment;\n\t}\n\n\t/**\n\t * Method executed after the drawing process is completed.\n\t * Sets up an event listener for 'click' events, linking them to the specified callback function.\n\t * @returns {void} Does not return a value.\n\t */\n\tafterDraw() {\n\t\tevent.addListener(this, 'click', null, this.optionClickCallback);\n\t}\n\n\t/**\n\t * Handles operations or cleanup tasks that need to occur before disconnecting.\n\t * Removes an event listener associated with the 'click' event and a specified callback function.\n\t * @returns {void} This method does not return a value.\n\t */\n\tbeforeDisconnect() {\n\t\tevent.removeListener(this, 'click', null, this.optionClickCallback);\n\t}\n\n\t/**\n\t * Handles the click event on an option element and dispatches a custom event when triggered.\n\t * @param {Event} e The click event object that triggered the callback.\n\t * @returns {void} No return value.\n\t */\n\toptionClickCallback(e) {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\te.stopImmediatePropagation();\n\n\t\tif (this.hasAttribute('disabled')) return;\n\n\t\tevent.dispatchCustomEvent(this, 'wje-option:change', {\n\t\t\tvalue: this.value,\n\t\t\ttext: this.textContent,\n\t\t\toption: this,\n\t\t});\n\t}\n\n\t/**\n\t * Checks if the given DOM node represents a checkbox element.\n\t * @param {Node} node The DOM node to be checked.\n\t * @returns {boolean} Returns true if the node is an element with a class name of 'Checkbox', otherwise false.\n\t */\n\t#isCheckbox(node) {\n\t\treturn node instanceof Element && node.className === 'Checkbox';\n\t}\n\n\t/**\n\t * Updates the checked status of the first checkbox element found within the assigned elements of the specified container.\n\t * @param {boolean} checked The desired checked state to be applied to the checkbox.\n\t * @returns {void}\n\t */\n\t#setCheckbox(checked) {\n\t\tlet arr = [...this.check?.assignedElements({ flatten: true })]?.filter(item=> this.#isCheckbox(item));\n\t\tif(arr.length > 0)\n\t\t\tarr[0].checked = checked;\n\t}\n}","import Option from './option.element.js';\n\nexport default Option;\n\nOption.define('wje-option', Option);\n"],"names":[],"mappings":"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"}

package/dist/wje-options.js

@@ -14,18 +14,10 @@ import InfiniteScroll from "./wje-infinite-scroll.js";
 import List from "./wje-list.js";
 import Option from "./wje-option.js";
 import { event } from "./event.js";
+const styles = "/*\n[ WJ OPTIONS ]\n*/\n";
 class Options extends WJElement {
-  /**
-   * Creates an instance of Options.
-   * @class
-   */
   constructor() {
     super();
-    /**
-     * Stores the loaded options.
-     * @type {Array}
-     * @private
-     */
     __privateAdd(this, _loadedOptions, []);
     __privateAdd(this, _drawPreloadedElements, []);
     __publicField(this, "dependencies", {
@@ -34,6 +26,13 @@ class Options extends WJElement {
       "wje-list": List
     });
     __publicField(this, "className", "Options");
+    __publicField(this, "dispatchOptionsLoadEvent", (e) => {
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          event.dispatchCustomEvent(this, "wje-options:load", {});
+        });
+      });
+    });
     /**
      * Recursively updates the object based on the provided path to the property.
      * @param {object | Array | null} object
@@ -84,14 +83,6 @@ class Options extends WJElement {
       return option;
     });
   }
-  /**
-   * Returns the list of attributes to observe for changes.
-   * @static
-   * @returns {Array<string>}
-   */
-  static get observedAttributes() {
-    return ["search", "attached"];
-  }
   /**
    * Sets the option array path attribute.
    * @param {string} value The value to set for the option array path.
@@ -241,13 +232,6 @@ class Options extends WJElement {
   get queryParams() {
     return this.getAttribute("query-params");
   }
-  /**
-   * Checks if the lazy attribute is present.
-   * @returns {boolean} True if the lazy attribute is present, false otherwise.
-   */
-  get lazy() {
-    return this.hasAttribute("lazy");
-  }
   /**
    * Sets the lazy attribute.
    * @param {boolean} value The value to set for the lazy attribute.
@@ -255,6 +239,13 @@ class Options extends WJElement {
   set lazy(value) {
     this.setAttribute("lazy", value);
   }
+  /**
+   * Checks if the lazy attribute is present.
+   * @returns {boolean} True if the lazy attribute is present, false otherwise.
+   */
+  get lazy() {
+    return this.hasAttribute("lazy");
+  }
   /**
    * Gets the loaded options.
    * @returns {Array} The loaded options.
@@ -285,20 +276,34 @@ class Options extends WJElement {
   get drawPreloadedElements() {
     return __privateGet(this, _drawPreloadedElements);
   }
+  /**
+   * Sets the elements that are preloaded and ready to be drawn.
+   * @param {Array|object} elements The elements to be set for preloading. This can be an array or a specific object containing drawable elements.
+   */
   set drawPreloadedElements(elements) {
     __privateSet(this, _drawPreloadedElements, elements);
   }
   /**
-   * Sets up the attributes for the component.
+   * Returns the CSS styles for the component.
+   * @static
+   * @returns {CSSStyleSheet} The CSS styles for the component.
    */
-  setupAttributes() {
-    this.isShadowRoot = "open";
+  static get cssStyleSheet() {
+    return styles;
   }
   /**
-   * Prepares the component before drawing.
-   * Fetches the pages and creates the options elements.
+   * Retrieves an array of attributes that should be observed for changes.
+   * The method returns a list of attribute names that the browser will monitor for changes.
+   * @returns {Array<string>} An array of attribute names to observe.
    */
-  afterDraw() {
+  static get observedAttributes() {
+    return ["search", "attached"];
+  }
+  /**
+   * Sets up the attributes for the component.
+   */
+  setupAttributes() {
+    this.isShadowRoot = "open";
   }
   /**
    * Draws the component.
@@ -308,7 +313,7 @@ class Options extends WJElement {
     let fragment = document.createDocumentFragment();
     const slot = document.createElement("slot");
     fragment.appendChild(slot);
-    if (this.hasAttribute("lazy")) {
+    if (this.lazy) {
       if (this.contains(this.infiniteScroll)) {
         this.drawPreloadedElements.forEach((el) => {
           el.remove();
@@ -317,14 +322,14 @@ class Options extends WJElement {
         this.infiniteScroll.placementObj.innerHTML = "";
         this.infiniteScroll.totalPages = 0;
         this.infiniteScroll.refresh();
-        return fragment;
       }
+      let loader = document.createElement("div");
+      loader.setAttribute("slot", "loader");
+      loader.append("Loading...");
       const infiniteScroll = document.createElement("wje-infinite-scroll");
       infiniteScroll.setAttribute("placement", "wje-list");
       infiniteScroll.setAttribute("height", this.dropdownHeight);
       infiniteScroll.setAttribute("object-name", this.optionArrayPath);
-      const list = document.createElement("wje-list");
-      infiniteScroll.append(list);
       infiniteScroll.dataToHtml = this.htmlItem;
       infiniteScroll.setCustomData = async (page, signal) => {
         let processedUrl = `${this.url}${this.search ? `/${this.search}` : ""}?page=${page}&size=${this.lazyLoadSize}${this.queryParams ? `&${this.queryParams}` : ""}`;
@@ -336,16 +341,16 @@ class Options extends WJElement {
         this.loadedOptions.push(...this.processData(filteredOptions));
         return filteredOptions;
       };
-      event.addListener(infiniteScroll, "wje-infinite-scroll:load", null, (e) => {
-        event.dispatchCustomEvent(this, "wje-options:load", {});
-      });
-      if (this.hasAttribute("attached")) {
+      const list = document.createElement("wje-list");
+      infiniteScroll.append(list);
+      infiniteScroll.append(loader);
+      if (this.hasAttribute("attached") && !this.hasSearch) {
         this.appendChild(infiniteScroll);
         this.drawPreloadedElements.forEach((el) => {
           list.appendChild(el);
         });
+        this.infiniteScroll = infiniteScroll;
       }
-      this.infiniteScroll = infiniteScroll;
     } else {
       this.response = await this.getPages();
       let optionsData = this.filterOutDrawnOptions(this.response);
@@ -356,10 +361,13 @@ class Options extends WJElement {
     }
     return fragment;
   }
+  afterDraw() {
+    event.addListener(this.infiniteScroll, "wje-infinite-scroll:load", null, this.dispatchOptionsLoadEvent);
+  }
   /**
-   * Processes the given data and returns the options based on the option array path.
-   * @param {any} data The data to be processed.
-   * @returns {any} - The options based on the option array path.
+   * Processes the provided data based on the optional array path set in the instance.
+   * @param {object} data The input data to be processed.
+   * @returns {Array} The resolved options array from the data or an empty array if no match is found.
    */
   processData(data) {
     var _a;
@@ -371,9 +379,9 @@ class Options extends WJElement {
     return options ?? [];
   }
   /**
-   * Filters out drawn options from the response.
-   * @param {object | null} response The response to filter.
-   * @returns {object} The filtered response.
+   * Filters out options from the response object that have already been drawn, based on the specified option array path.
+   * @param {object} response The response object containing data to process.
+   * @returns {object} The filtered response object with drawn options removed.
    */
   filterOutDrawnOptions(response) {
     var _a;
@@ -425,6 +433,9 @@ class Options extends WJElement {
     if (Array.isArray(optionsData)) optionsData == null ? void 0 : optionsData.forEach((od) => this.addOption(od, silent));
     else this.addOption(optionsData, silent);
   }
+  beforeDisconnect() {
+    event.removeListener(this.infiniteScroll, "wje-infinite-scroll:load", null, this.dispatchOptionsLoadEvent);
+  }
 }
 _loadedOptions = new WeakMap();
 _drawPreloadedElements = new WeakMap();

package/dist/wje-options.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-options.js","sources":["../packages/wje-options/options.element.js","../packages/wje-options/options.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport InfiniteScroll from '../wje-infinite-scroll/infinite-scroll.js';\nimport List from '../wje-list/list.js';\nimport Option from '../wje-option/option.js';\n\n/**\n * `Options` is a custom web component that represents a set of options.\n * It extends from `WJElement`.\n * @summary This element represents a set of options.\n * @documentation https://elements.webjet.sk/components/options\n * @status stable\n * @augments {WJElement}\n * // @fires wje-options:load - Event fired when the options are loaded.\n * @tag wje-options\n */\nexport default class Options extends WJElement {\n\t/**\n\t * Stores the loaded options.\n\t * @type {Array}\n\t * @private\n\t */\n\t#loadedOptions = [];\n\n\t#drawPreloadedElements = []\n\n\t/**\n\t * Creates an instance of Options.\n\t * @class\n\t */\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\tdependencies = {\n\t\t'wje-option': Option,\n\t\t'wje-infinite-scroll': InfiniteScroll,\n\t\t'wje-list': List,\n\t};\n\n\tclassName = 'Options';\n\n\t/**\n\t * Returns the list of attributes to observe for changes.\n\t * @static\n\t * @returns {Array<string>}\n\t */\n\tstatic get observedAttributes() {\n\t\treturn ['search', 'attached'];\n\t}\n\n\t/**\n\t * Sets the option array path attribute.\n\t * @param {string} value The value to set for the option array path.\n\t */\n\tset optionArrayPath(value) {\n\t\tthis.setAttribute('option-array-path', value);\n\t}\n\n\t/**\n\t * Gets the option array path attribute.\n\t * @returns {string} The value of the option array path attribute or \"data\" if not set.\n\t */\n\tget optionArrayPath() {\n\t\treturn this.getAttribute('option-array-path');\n\t}\n\n\t/**\n\t * Checks if the option array path attribute is present.\n\t * @returns {boolean} True if the option array path attribute is present, false otherwise.\n\t */\n\tget hasOptionArrayPath() {\n\t\treturn this.hasAttribute('option-array-path');\n\t}\n\n\t/**\n\t * Gets the dropdown height attribute.\n\t * @returns {string} The value of the dropdown height attribute or \"100%\" if not set.\n\t */\n\tget dropdownHeight() {\n\t\treturn this.getAttribute('dropdown-height') || '100%';\n\t}\n\n\t/**\n\t * Sets the dropdown height attribute.\n\t * @param {string} value The value to set for the dropdown height.\n\t */\n\tset dropdownHeight(value) {\n\t\tthis.setAttribute('dropdown-height', value);\n\t}\n\n\t/**\n\t * Sets the item value attribute.\n\t * @param {string} value The value to set for the item value.\n\t */\n\tset itemValue(value) {\n\t\tthis.setAttribute('item-value', value);\n\t}\n\n\t/**\n\t * Gets the item value attribute.\n\t * @returns {string} The value of the item value attribute or \"value\" if not set.\n\t */\n\tget itemValue() {\n\t\treturn this.getAttribute('item-value') || 'value';\n\t}\n\n\t/**\n\t * Sets the item text attribute.\n\t * @param {string} value The value to set for the item text.\n\t */\n\tset itemText(value) {\n\t\tthis.setAttribute('item-text', value);\n\t}\n\n\t/**\n\t * Gets the item text attribute.\n\t * @returns {string} The value of the item text attribute or \"text\" if not set.\n\t */\n\tget itemText() {\n\t\treturn this.getAttribute('item-text') || 'text';\n\t}\n\n\t/**\n\t * Gets the lazy load size attribute.\n\t * @returns {number} The value of the lazy load size attribute or 10 if not set.\n\t */\n\tget lazyLoadSize() {\n\t\treturn this.getAttribute('lazy-load-size') || 10;\n\t}\n\n\t/**\n\t * Sets the lazy load size attribute.\n\t * @param {number} value The value to set for the lazy load size.\n\t */\n\tset lazyLoadSize(value) {\n\t\tthis.setAttribute('lazy-load-size', value);\n\t}\n\n\t/**\n\t * Sets the search attribute.\n\t * @param {string} value The value to set for the search.\n\t */\n\tset search(value) {\n\t\tthis.setAttribute('search', value);\n\t}\n\n\t/**\n\t * Gets the search attribute.\n\t * @returns {string} The value of the search attribute.\n\t */\n\tget search() {\n\t\treturn this.getAttribute('search');\n\t}\n\n\t/**\n\t * Checks if the search attribute is present.\n\t * @returns {boolean} True if the search attribute is present, false otherwise.\n\t */\n\tget hasSearch() {\n\t\treturn this.hasAttribute('search');\n\t}\n\n\t/**\n\t * Retrieves the value of the 'search-to-query-params' attribute from the current instance.\n\t * @returns {string | null} The value of the 'search-to-query-params' attribute, or null if the attribute is not set.\n\t */\n\tget searchToQueryParams() {\n\t\treturn this.getAttribute('search-to-query-params');\n\t}\n\n\t/**\n\t * Sets the value to define search-to-query params behavior.\n\t * @param {string} value The value to be set for the search-to-query-params attribute.\n\t */\n\tset searchToQueryParams(value) {\n\t\tthis.setAttribute('search-to-query-params', value);\n\t}\n\n\t/**\n\t * Determines whether the 'search-to-query-params' attribute is present on the element.\n\t * @returns {boolean} True if the 'search-to-query-params' attribute exists, otherwise false.\n\t */\n\tget hasSearchToQueryParams() {\n\t\treturn this.hasAttribute('search-to-query-params');\n\t}\n\n\t/**\n\t * Sets the value of the search parameter name attribute.\n\t * @param {string} value The string value to set as the search parameter name.\n\t */\n\tset searchParamName(value) {\n\t\tthis.setAttribute('search-param-name', value);\n\t}\n\n\t/**\n\t * Gets the search parameter name used in queries.\n\t * Retrieves the value of the 'search-param-name' attribute.\n\t * If the attribute is not set, it defaults to 'search'.\n\t * @returns {string} The search parameter name used for queries.\n\t */\n\tget searchParamName() {\n\t\treturn this.getAttribute('search-param-name') || 'search';\n\t}\n\n\t/**\n\t * Sets the queryParams attribute on the element.\n\t * @param {string} value The query parameters to set, represented as a string.\n\t */\n\tset queryParams(value) {\n\t\tthis.setAttribute('query-params', value);\n\t}\n\n\t/**\n\t * Retrieves the value of the 'query-params' attribute.\n\t * @returns {string | null} The value of the 'query-params' attribute, or null if the attribute is not set.\n\t */\n\tget queryParams() {\n\t\treturn this.getAttribute('query-params');\n\t}\n\n\t/**\n\t * Checks if the lazy attribute is present.\n\t * @returns {boolean} True if the lazy attribute is present, false otherwise.\n\t */\n\tget lazy() {\n\t\treturn this.hasAttribute('lazy');\n\t}\n\n\t/**\n\t * Sets the lazy attribute.\n\t * @param {boolean} value The value to set for the lazy attribute.\n\t */\n\tset lazy(value) {\n\t\tthis.setAttribute('lazy', value);\n\t}\n\n\t/**\n\t * Gets the loaded options.\n\t * @returns {Array} The loaded options.\n\t */\n\tget options() {\n\t\treturn this.loadedOptions?.flat();\n\t}\n\n\t/**\n\t * Gets the loaded options.\n\t * @type {Array}\n\t */\n\tget loadedOptions() {\n\t\treturn this.#loadedOptions;\n\t}\n\n\t/**\n\t * Sets the loaded options.\n\t * @type {Array}\n\t */\n\tset loadedOptions(loadedOptions) {\n\t\tthis.#loadedOptions = loadedOptions;\n\t}\n\n\t/**\n\t * Array of preloaded elements.\n\t * @type {Array}\n\t * @private\n\t */\n\tget drawPreloadedElements() {\n\t\treturn this.#drawPreloadedElements;\n\t}\n\n\tset drawPreloadedElements(elements) {\n\t\tthis.#drawPreloadedElements = elements;\n\t}\n\n\t/**\n\t * Sets up the attributes for the component.\n\t */\n\tsetupAttributes() {\n\t\tthis.isShadowRoot = 'open';\n\t}\n\n\t/**\n\t * Prepares the component before drawing.\n\t * Fetches the pages and creates the options elements.\n\t */\n\tafterDraw() {\n\t\t// event.dispatchCustomEvent(this, 'wje-options:load', {}); // nepomohlo to, v ff stale je scroll hore\n\t}\n\n\t/**\n\t * Draws the component.\n\t * @returns {DocumentFragment}\n\t */\n\tasync draw() {\n\t\tlet fragment = document.createDocumentFragment();\n\n\t\tconst slot = document.createElement('slot');\n\t\tfragment.appendChild(slot);\n\n\t\tif (this.hasAttribute('lazy')) {\n\n\t\t\tif (this.contains(this.infiniteScroll)) {\n\t\t\t\tthis.drawPreloadedElements.forEach((el) => { el.remove() });\n\t\t\t\tthis.loadedOptions = [];\n\t\t\t\tthis.infiniteScroll.placementObj.innerHTML = '';\n\t\t\t\tthis.infiniteScroll.totalPages = 0;\n\t\t\t\tthis.infiniteScroll.refresh();\n\n\t\t\t\treturn fragment;\n\t\t\t}\n\n\t\t\tconst infiniteScroll = document.createElement('wje-infinite-scroll');\n\t\t\tinfiniteScroll.setAttribute('placement', 'wje-list');\n\t\t\tinfiniteScroll.setAttribute('height', this.dropdownHeight);\n\t\t\tinfiniteScroll.setAttribute('object-name', this.optionArrayPath);\n\n\t\t\tconst list = document.createElement('wje-list');\n\t\t\tinfiniteScroll.append(list);\n\n\t\t\tinfiniteScroll.dataToHtml = this.htmlItem;\n\n\t\t\tinfiniteScroll.setCustomData = async (page, signal) => {\n\t\t\t\tlet processedUrl = `${this.url}${this.search ? `/${this.search}` : ''}?page=${page}&size=${this.lazyLoadSize}${this.queryParams ? `&${this.queryParams}` : ''}`;\n\n\t\t\t\tif (this.hasSearchToQueryParams) {\n\t\t\t\t\tprocessedUrl = `${this.url}?page=${page}&size=${this.lazyLoadSize}${this.queryParams ? `&${this.queryParams}` : ''}${this.search ? `&${this.searchParamName}=${this.search}` : ''}`;\n\t\t\t\t}\n\n\t\t\t\tlet res = await this.service.get(processedUrl, null, false, signal);\n\t\t\t\tconst filteredOptions = this.filterOutDrawnOptions(res);\n\t\t\t\tthis.loadedOptions.push(...this.processData(filteredOptions));\n\n\t\t\t\treturn filteredOptions;\n\t\t\t};\n\n\t\t\tevent.addListener(infiniteScroll, 'wje-infinite-scroll:load', null, (e) => {\n\t\t\t\tevent.dispatchCustomEvent(this, 'wje-options:load', {});\n\t\t\t});\n\n\t\t\tif (this.hasAttribute('attached')) {\n\t\t\t\tthis.appendChild(infiniteScroll);\n\t\t\t\tthis.drawPreloadedElements.forEach((el) => {\n\t\t\t\t\tlist.appendChild(el);\n\t\t\t\t})\n\t\t\t}\n\n\t\t\tthis.infiniteScroll = infiniteScroll;\n\n\t\t} else {\n\t\t\tthis.response = await this.getPages();\n\t\t\tlet optionsData = this.filterOutDrawnOptions(this.response);\n\t\t\toptionsData = this.processData(optionsData);\n\n\t\t\tthis.loadedOptions.push(...optionsData);\n\n\t\t\tthis.append(...optionsData.map(this.htmlItem));\n\n\t\t\tevent.dispatchCustomEvent(this, 'wje-options:load', {});\n\t\t}\n\n\t\treturn fragment;\n\t}\n\n\t/**\n\t * Processes the given data and returns the options based on the option array path.\n\t * @param {any} data The data to be processed.\n\t * @returns {any} - The options based on the option array path.\n\t */\n\tprocessData(data) {\n\t\tconst splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : null;\n\t\tlet options = data;\n\n\t\tsplittedOptionArrayPath?.forEach((path) => {\n\t\t\toptions = options[path];\n\t\t});\n\n\t\treturn options ?? [];\n\t}\n\n\t/**\n\t * Filters out drawn options from the response.\n\t * @param {object | null} response The response to filter.\n\t * @returns {object} The filtered response.\n\t */\n\tfilterOutDrawnOptions(response) {\n\t\tconst splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : [];\n\t\tlet filteredResponse = structuredClone(response);\n\n\t\tfilteredResponse = this.recursiveUpdate(filteredResponse, splittedOptionArrayPath);\n\t\treturn filteredResponse;\n\t}\n\n\t/**\n\t * Recursively updates the object based on the provided path to the property.\n\t * @param {object | Array | null} object\n\t * @param {Array<string> | null} pathToProperty\n\t * @returns {object | Array | null}\n\t */\n\trecursiveUpdate = (object, pathToProperty) => {\n\t\tif (pathToProperty.length === 0) {\n\t\t\tif (Array.isArray(object)) {\n\t\t\t\treturn object.filter(\n\t\t\t\t\t(option) =>\n\t\t\t\t\t\t!this.loadedOptions.some(\n\t\t\t\t\t\t\t(loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n\t\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tconsole.error('Expected an array but got:', object, pathToProperty);\n\t\t\t\treturn [];\n\t\t\t}\n\t\t}\n\n\t\tconst [currentPath, ...remainingPath] = pathToProperty;\n\t\tif (remainingPath.length > 0) {\n\t\t\tobject[currentPath] = this.recursiveUpdate(object[currentPath], remainingPath);\n\t\t} else {\n\t\t\tobject[currentPath] =\n\t\t\t\tobject[currentPath]?.filter(\n\t\t\t\t\t(option) =>\n\t\t\t\t\t\t!this.loadedOptions.some(\n\t\t\t\t\t\t\t(loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n\t\t\t\t\t\t)\n\t\t\t\t) ?? [];\n\t\t}\n\t\treturn object;\n\t};\n\n\t/**\n\t * Generates an HTML option element based on the provided item.\n\t * @param {object} item The item to generate the option element for.\n\t * @returns {HTMLElement} The generated option element.\n\t */\n\thtmlItem = (item) => {\n\t\tlet option = document.createElement('wje-option');\n\n\t\tif (item[this.itemValue] === null || item[this.itemValue] === undefined) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemValue}`);\n\t\t}\n\n\t\tif (item[this.itemText] === null || item[this.itemText] === undefined) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemText}`);\n\t\t}\n\n\t\toption.setAttribute('value', item[this.itemValue] ?? '');\n\t\toption.innerText = item[this.itemText] ?? '';\n\n\t\treturn option;\n\t};\n\n\t/**\n\t * Fetches the pages from the provided URL.\n\t * @param {number} page The page number to fetch.\n\t * @returns {Promise<object>} The fetched data.\n\t * @throws Will throw an error if the response is not ok.\n\t */\n\tasync getPages(page) {\n\t\tconst response = await fetch(this.url);\n\t\tif (!response.ok) {\n\t\t\tthrow new Error(`An error occurred: ${response.status}`);\n\t\t}\n\t\treturn await response.json();\n\t}\n\n\t/**\n\t * Finds the selected option data based on the given selected option values.\n\t * @param {Array} selectedOptionValues The array of selected option values.\n\t * @returns {Array} - The array of option data that matches the selected option values.\n\t */\n\tfindSelectedOptionData(selectedOptionValues = []) {\n\t\treturn this.options.filter((option) => selectedOptionValues.includes(option[this.itemValue]));\n\t}\n\n\t/**\n\t * Adds an option to the element.\n\t * @param {object} optionData The data of the option to be added.\n\t */\n\taddOption(optionData) {\n\t\tif (this.loadedOptions.some((option) => option[this.itemValue] === optionData[this.itemValue])) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst item = this.htmlItem(optionData);\n\t\tthis.#drawPreloadedElements.push(item);\n\t\tthis.prepend(item);\n\t\tthis.loadedOptions.push(optionData);\n\t}\n\n\t/**\n\t * Adds options to the element.\n\t * @param {Array} optionsData The array of option data to be added.\n\t * @param {boolean} [silent] Whether to suppress events triggered by adding options.\n\t */\n\taddOptions(optionsData = [], silent = false) {\n\t\tif (Array.isArray(optionsData)) optionsData?.forEach((od) => this.addOption(od, silent));\n\t\telse this.addOption(optionsData, silent);\n\t}\n}\n","import Options from './options.element.js';\n\nexport default Options;\n\nOptions.define('wje-options', Options);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-options.js","sources":["../packages/wje-options/options.element.js","../packages/wje-options/options.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport InfiniteScroll from '../wje-infinite-scroll/infinite-scroll.js';\nimport List from '../wje-list/list.js';\nimport Option from '../wje-option/option.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Options` is a custom web component that represents a set of options. It extends from `WJElement`.\n * @summary This element represents a set of options.\n * @documentation https://elements.webjet.sk/components/options\n * @status stable\n * @tag wje-options\n */\n\nexport default class Options extends WJElement {\n\n\t#loadedOptions = [];\n\n\t#drawPreloadedElements = [];\n\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\tdependencies = {\n\t\t'wje-option': Option,\n\t\t'wje-infinite-scroll': InfiniteScroll,\n\t\t'wje-list': List,\n\t}\n\n\t/**\n\t * Sets the option array path attribute.\n\t * @param {string} value The value to set for the option array path.\n\t */\n\tset optionArrayPath(value) {\n\t\tthis.setAttribute('option-array-path', value);\n\t}\n\n\t/**\n\t * Gets the option array path attribute.\n\t * @returns {string} The value of the option array path attribute or \"data\" if not set.\n\t */\n\tget optionArrayPath() {\n\t\treturn this.getAttribute('option-array-path');\n\t}\n\n\t/**\n\t * Checks if the option array path attribute is present.\n\t * @returns {boolean} True if the option array path attribute is present, false otherwise.\n\t */\n\tget hasOptionArrayPath() {\n\t\treturn this.hasAttribute('option-array-path');\n\t}\n\n\t/**\n\t * Gets the dropdown height attribute.\n\t * @returns {string} The value of the dropdown height attribute or \"100%\" if not set.\n\t */\n\tget dropdownHeight() {\n\t\treturn this.getAttribute('dropdown-height') || '100%';\n\t}\n\n\t/**\n\t * Sets the dropdown height attribute.\n\t * @param {string} value The value to set for the dropdown height.\n\t */\n\tset dropdownHeight(value) {\n\t\tthis.setAttribute('dropdown-height', value);\n\t}\n\n\t/**\n\t * Sets the item value attribute.\n\t * @param {string} value The value to set for the item value.\n\t */\n\tset itemValue(value) {\n\t\tthis.setAttribute('item-value', value);\n\t}\n\n\t/**\n\t * Gets the item value attribute.\n\t * @returns {string} The value of the item value attribute or \"value\" if not set.\n\t */\n\tget itemValue() {\n\t\treturn this.getAttribute('item-value') || 'value';\n\t}\n\n\t/**\n\t * Sets the item text attribute.\n\t * @param {string} value The value to set for the item text.\n\t */\n\tset itemText(value) {\n\t\tthis.setAttribute('item-text', value);\n\t}\n\n\t/**\n\t * Gets the item text attribute.\n\t * @returns {string} The value of the item text attribute or \"text\" if not set.\n\t */\n\tget itemText() {\n\t\treturn this.getAttribute('item-text') || 'text';\n\t}\n\n\t/**\n\t * Gets the lazy load size attribute.\n\t * @returns {number} The value of the lazy load size attribute or 10 if not set.\n\t */\n\tget lazyLoadSize() {\n\t\treturn this.getAttribute('lazy-load-size') || 10;\n\t}\n\n\t/**\n\t * Sets the lazy load size attribute.\n\t * @param {number} value The value to set for the lazy load size.\n\t */\n\tset lazyLoadSize(value) {\n\t\tthis.setAttribute('lazy-load-size', value);\n\t}\n\n\t/**\n\t * Sets the search attribute.\n\t * @param {string} value The value to set for the search.\n\t */\n\tset search(value) {\n\t\tthis.setAttribute('search', value);\n\t}\n\n\t/**\n\t * Gets the search attribute.\n\t * @returns {string} The value of the search attribute.\n\t */\n\tget search() {\n\t\treturn this.getAttribute('search');\n\t}\n\n\t/**\n\t * Checks if the search attribute is present.\n\t * @returns {boolean} True if the search attribute is present, false otherwise.\n\t */\n\tget hasSearch() {\n\t\treturn this.hasAttribute('search');\n\t}\n\n\t/**\n\t * Retrieves the value of the 'search-to-query-params' attribute from the current instance.\n\t * @returns {string | null} The value of the 'search-to-query-params' attribute, or null if the attribute is not set.\n\t */\n\tget searchToQueryParams() {\n\t\treturn this.getAttribute('search-to-query-params');\n\t}\n\n\t/**\n\t * Sets the value to define search-to-query params behavior.\n\t * @param {string} value The value to be set for the search-to-query-params attribute.\n\t */\n\tset searchToQueryParams(value) {\n\t\tthis.setAttribute('search-to-query-params', value);\n\t}\n\n\t/**\n\t * Determines whether the 'search-to-query-params' attribute is present on the element.\n\t * @returns {boolean} True if the 'search-to-query-params' attribute exists, otherwise false.\n\t */\n\tget hasSearchToQueryParams() {\n\t\treturn this.hasAttribute('search-to-query-params');\n\t}\n\n\t/**\n\t * Sets the value of the search parameter name attribute.\n\t * @param {string} value The string value to set as the search parameter name.\n\t */\n\tset searchParamName(value) {\n\t\tthis.setAttribute('search-param-name', value);\n\t}\n\n\t/**\n\t * Gets the search parameter name used in queries.\n\t * Retrieves the value of the 'search-param-name' attribute.\n\t * If the attribute is not set, it defaults to 'search'.\n\t * @returns {string} The search parameter name used for queries.\n\t */\n\tget searchParamName() {\n\t\treturn this.getAttribute('search-param-name') || 'search';\n\t}\n\n\t/**\n\t * Sets the queryParams attribute on the element.\n\t * @param {string} value The query parameters to set, represented as a string.\n\t */\n\tset queryParams(value) {\n\t\tthis.setAttribute('query-params', value);\n\t}\n\n\t/**\n\t * Retrieves the value of the 'query-params' attribute.\n\t * @returns {string | null} The value of the 'query-params' attribute, or null if the attribute is not set.\n\t */\n\tget queryParams() {\n\t\treturn this.getAttribute('query-params');\n\t}\n\n\t/**\n\t * Sets the lazy attribute.\n\t * @param {boolean} value The value to set for the lazy attribute.\n\t */\n\tset lazy(value) {\n\t\tthis.setAttribute('lazy', value);\n\t}\n\n\t/**\n\t * Checks if the lazy attribute is present.\n\t * @returns {boolean} True if the lazy attribute is present, false otherwise.\n\t */\n\tget lazy() {\n\t\treturn this.hasAttribute('lazy');\n\t}\n\n\t/**\n\t * Gets the loaded options.\n\t * @returns {Array} The loaded options.\n\t */\n\tget options() {\n\t\treturn this.loadedOptions?.flat();\n\t}\n\n\t/**\n\t * Gets the loaded options.\n\t * @type {Array}\n\t */\n\tget loadedOptions() {\n\t\treturn this.#loadedOptions;\n\t}\n\n\t/**\n\t * Sets the loaded options.\n\t * @type {Array}\n\t */\n\tset loadedOptions(loadedOptions) {\n\t\tthis.#loadedOptions = loadedOptions;\n\t}\n\n\t/**\n\t * Array of preloaded elements.\n\t * @type {Array}\n\t * @private\n\t */\n\tget drawPreloadedElements() {\n\t\treturn this.#drawPreloadedElements;\n\t}\n\n\t/**\n\t * Sets the elements that are preloaded and ready to be drawn.\n\t * @param {Array|object} elements The elements to be set for preloading. This can be an array or a specific object containing drawable elements.\n\t */\n\tset drawPreloadedElements(elements) {\n\t\tthis.#drawPreloadedElements = elements;\n\t}\n\n\tclassName = 'Options';\n\n\t/**\n\t * Returns the CSS styles for the component.\n\t * @static\n\t * @returns {CSSStyleSheet} The CSS styles for the component.\n\t */\n\tstatic get cssStyleSheet() {\n\t\treturn styles;\n\t}\n\n\t/**\n\t * Retrieves an array of attributes that should be observed for changes.\n\t * The method returns a list of attribute names that the browser will monitor for changes.\n\t * @returns {Array<string>} An array of attribute names to observe.\n\t */\n\tstatic get observedAttributes() {\n\t\treturn ['search', 'attached'];\n\t}\n\n\t/**\n\t * Sets up the attributes for the component.\n\t */\n\tsetupAttributes() {\n\t\tthis.isShadowRoot = 'open';\n\t}\n\n\t/**\n\t * Draws the component.\n\t * @returns {DocumentFragment}\n\t */\n\tasync draw() {\n\t\tlet fragment = document.createDocumentFragment();\n\n\t\tconst slot = document.createElement('slot');\n\t\tfragment.appendChild(slot);\n\n\t\tif (this.lazy) {\n\t\t\tif (this.contains(this.infiniteScroll)) {\n\t\t\t\tthis.drawPreloadedElements.forEach((el) => { el.remove() });\n\t\t\t\tthis.loadedOptions = [];\n\t\t\t\tthis.infiniteScroll.placementObj.innerHTML = '';\n\t\t\t\tthis.infiniteScroll.totalPages = 0;\n\t\t\t\tthis.infiniteScroll.refresh();\n\t\t\t}\n\n\t\t\tlet loader = document.createElement('div');\n\t\t\tloader.setAttribute('slot', 'loader');\n\t\t\tloader.append('Loading...');\n\n\t\t\tconst infiniteScroll = document.createElement('wje-infinite-scroll');\n\t\t\tinfiniteScroll.setAttribute('placement', 'wje-list');\n\t\t\tinfiniteScroll.setAttribute('height', this.dropdownHeight);\n\t\t\tinfiniteScroll.setAttribute('object-name', this.optionArrayPath);\n\t\t\tinfiniteScroll.dataToHtml = this.htmlItem;\n\t\t\tinfiniteScroll.setCustomData = async (page, signal) => {\n\t\t\t\tlet processedUrl = `${this.url}${this.search ? `/${this.search}` : ''}?page=${page}&size=${this.lazyLoadSize}${this.queryParams ? `&${this.queryParams}` : ''}`;\n\n\t\t\t\tif (this.hasSearchToQueryParams) {\n\t\t\t\t\tprocessedUrl = `${this.url}?page=${page}&size=${this.lazyLoadSize}${this.queryParams ? `&${this.queryParams}` : ''}${this.search ? `&${this.searchParamName}=${this.search}` : ''}`;\n\t\t\t\t}\n\n\t\t\t\tlet res = await this.service.get(processedUrl, null, false, signal);\n\t\t\t\tconst filteredOptions = this.filterOutDrawnOptions(res);\n\t\t\t\tthis.loadedOptions.push(...this.processData(filteredOptions));\n\n\t\t\t\treturn filteredOptions;\n\t\t\t};\n\n\t\t\tconst list = document.createElement('wje-list');\n\n\t\t\tinfiniteScroll.append(list);\n\t\t\tinfiniteScroll.append(loader);\n\n\t\t\tif (this.hasAttribute('attached') && !this.hasSearch) {\n\t\t\t\tthis.appendChild(infiniteScroll);\n\t\t\t\tthis.drawPreloadedElements.forEach((el) => {\n\t\t\t\t\tlist.appendChild(el);\n\t\t\t\t});\n\t\t\t\tthis.infiniteScroll = infiniteScroll;\n\t\t\t}\n\t\t} else {\n\t\t\tthis.response = await this.getPages();\n\n\t\t\tlet optionsData = this.filterOutDrawnOptions(this.response);\n\t\t\toptionsData = this.processData(optionsData);\n\n\t\t\tthis.loadedOptions.push(...optionsData);\n\n\t\t\tthis.append(...optionsData.map(this.htmlItem));\n\n\t\t\tevent.dispatchCustomEvent(this, 'wje-options:load', {});\n\t\t}\n\n\t\treturn fragment;\n\t}\n\n\tafterDraw() {\n\t\tevent.addListener(this.infiniteScroll, 'wje-infinite-scroll:load', null, this.dispatchOptionsLoadEvent);\n\t}\n\n\tdispatchOptionsLoadEvent = (e) => {\n\t\t// Wait for next paint cycle to ensure options are in DOM\n\t\trequestAnimationFrame(() => {\n\t\t\trequestAnimationFrame(() => {\n\t\t\t\tevent.dispatchCustomEvent(this, 'wje-options:load', {});\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Processes the provided data based on the optional array path set in the instance.\n\t * @param {object} data The input data to be processed.\n\t * @returns {Array} The resolved options array from the data or an empty array if no match is found.\n\t */\n\tprocessData(data) {\n\t\tconst splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : null;\n\t\tlet options = data;\n\n\t\tsplittedOptionArrayPath?.forEach((path) => {\n\t\t\toptions = options[path];\n\t\t});\n\n\t\treturn options ?? [];\n\t}\n\n\t/**\n\t * Filters out options from the response object that have already been drawn, based on the specified option array path.\n\t * @param {object} response The response object containing data to process.\n\t * @returns {object} The filtered response object with drawn options removed.\n\t */\n\tfilterOutDrawnOptions(response) {\n\t\tconst splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : [];\n\t\tlet filteredResponse = structuredClone(response);\n\n\t\tfilteredResponse = this.recursiveUpdate(filteredResponse, splittedOptionArrayPath);\n\t\treturn filteredResponse;\n\t}\n\n\t/**\n\t * Recursively updates the object based on the provided path to the property.\n\t * @param {object | Array | null} object\n\t * @param {Array<string> | null} pathToProperty\n\t * @returns {object | Array | null}\n\t */\n\trecursiveUpdate = (object, pathToProperty) => {\n\t\tif (pathToProperty.length === 0) {\n\t\t\tif (Array.isArray(object)) {\n\t\t\t\treturn object.filter(\n\t\t\t\t\t(option) =>\n\t\t\t\t\t\t!this.loadedOptions.some(\n\t\t\t\t\t\t\t(loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n\t\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tconsole.error('Expected an array but got:', object, pathToProperty);\n\t\t\t\treturn [];\n\t\t\t}\n\t\t}\n\n\t\tconst [currentPath, ...remainingPath] = pathToProperty;\n\t\tif (remainingPath.length > 0) {\n\t\t\tobject[currentPath] = this.recursiveUpdate(object[currentPath], remainingPath);\n\t\t} else {\n\t\t\tobject[currentPath] =\n\t\t\t\tobject[currentPath]?.filter(\n\t\t\t\t\t(option) =>\n\t\t\t\t\t\t!this.loadedOptions.some(\n\t\t\t\t\t\t\t(loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n\t\t\t\t\t\t)\n\t\t\t\t) ?? [];\n\t\t}\n\t\treturn object;\n\t};\n\n\t/**\n\t * Generates an HTML option element based on the provided item.\n\t * @param {object} item The item to generate the option element for.\n\t * @returns {HTMLElement} The generated option element.\n\t */\n\thtmlItem = (item) => {\n\t\tlet option = document.createElement('wje-option');\n\n\t\tif (item[this.itemValue] === null || item[this.itemValue] === undefined) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemValue}`);\n\t\t}\n\n\t\tif (item[this.itemText] === null || item[this.itemText] === undefined) {\n\t\t\tconsole.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemText}`);\n\t\t}\n\n\t\toption.setAttribute('value', item[this.itemValue] ?? '');\n\t\toption.innerText = item[this.itemText] ?? '';\n\n\t\treturn option;\n\t};\n\n\t/**\n\t * Fetches the pages from the provided URL.\n\t * @param {number} page The page number to fetch.\n\t * @returns {Promise<object>} The fetched data.\n\t * @throws Will throw an error if the response is not ok.\n\t */\n\tasync getPages(page) {\n\t\tconst response = await fetch(this.url);\n\t\tif (!response.ok) {\n\t\t\tthrow new Error(`An error occurred: ${response.status}`);\n\t\t}\n\t\treturn await response.json();\n\t}\n\n\t/**\n\t * Finds the selected option data based on the given selected option values.\n\t * @param {Array} selectedOptionValues The array of selected option values.\n\t * @returns {Array} - The array of option data that matches the selected option values.\n\t */\n\tfindSelectedOptionData(selectedOptionValues = []) {\n\t\treturn this.options.filter((option) => selectedOptionValues.includes(option[this.itemValue]));\n\t}\n\n\t/**\n\t * Adds an option to the element.\n\t * @param {object} optionData The data of the option to be added.\n\t */\n\taddOption(optionData) {\n\t\tif (this.loadedOptions.some((option) => option[this.itemValue] === optionData[this.itemValue])) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst item = this.htmlItem(optionData);\n\t\tthis.#drawPreloadedElements.push(item);\n\t\tthis.prepend(item);\n\t\tthis.loadedOptions.push(optionData);\n\t}\n\n\t/**\n\t * Adds options to the element.\n\t * @param {Array} optionsData The array of option data to be added.\n\t * @param {boolean} [silent] Whether to suppress events triggered by adding options.\n\t */\n\taddOptions(optionsData = [], silent = false) {\n\t\tif (Array.isArray(optionsData)) optionsData?.forEach((od) => this.addOption(od, silent));\n\t\telse this.addOption(optionsData, silent);\n\t}\n\n\tbeforeDisconnect() {\n\t\tevent.removeListener(this.infiniteScroll, 'wje-infinite-scroll:load', null, this.dispatchOptionsLoadEvent);\n\t}\n}\n","import Options from './options.element.js';\n\nexport default Options;\n\nOptions.define('wje-options', Options);\n"],"names":[],"mappings":"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"}

package/dist/wje-popup.js

@@ -1,4 +1,4 @@
-import { P as Popup } from "./popup.element-Di4nHYij.js";
+import { P as Popup } from "./popup.element-CVbbnTWI.js";
 Popup.define("wje-popup", Popup);
 export {
   Popup as default