wj-elements 0.1.136 → 0.1.138

package/dist/wje-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wje-select.js","sources":["../packages/wje-select/select.element.js","../packages/wje-select/select.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Button from '../wje-button/button.js';\nimport Popup from '../wje-popup/popup.js';\nimport Icon from '../wje-icon/icon.js';\nimport Label from '../wje-label/label.js';\nimport Chip from '../wje-chip/chip.js';\nimport Input from '../wje-input/input.js';\nimport Option from '../wje-option/option.js';\nimport Options from '../wje-options/options.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Select` is a custom web component that represents a select input.\n * @summary This element represents a select input.\n * @documentation https://elements.webjet.sk/components/select\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the select.\n * @slot anchor - The slot for the anchor.\n * @slot arrow - The slot for the arrow.\n * @csspart native - The native select wrapper.\n * @csspart input - The input field.\n * @csspart clear - The clear button.\n * @cssproperty [--wje-select-border-width=1px] - Specifies the width of the border around the select component. Accepts any valid CSS length unit (e.g., `px`, `rem`, `em`).\n * @cssproperty [--wje-select-border-style=solid] - Defines the style of the border for the select component. Accepts standard CSS border styles, such as `solid`, `dashed`, or `dotted`.\n * @cssproperty [--wje-select-border-color=var(--wje-border-color)] - Sets the color of the border for the select component. Accepts any valid CSS color value, including color variables, named colors, and hex values.\n * @cssproperty [--wje-select-options-border-width=1px] - Specifies the width of the border for the select options dropdown. Accepts any valid CSS length unit.\n * @cssproperty [--wje-select-options-border-style=var(--wje-border-style)] - Defines the border style for the select options dropdown. Inherits from a defined CSS variable for consistency.\n * @cssproperty [--wje-select-options-border-color=var(--wje-border-color)] - Sets the border color for the select options dropdown. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-background=var(--wje-background)] - Specifies the background color of the select component. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-line-height=20px] - Defines the line height for the text within the select component. Accepts any valid CSS length value, ensuring consistent vertical alignment.\n * @cssproperty [--wje-select-color=var(--wje-color)] - Sets the text color for the select component. Accepts any valid CSS color value.\n * @cssproperty [--wje-select-border-radius=var(--wje-border-radius-medium)] - Specifies the border radius for the select component.Determines the roundness of the corners and accepts any valid CSS length unit or variable.\n * @tag wje-select\n */\n\nexport default class Select extends WJElement {\n    /**\n     * Creates an instance of Select.\n     */\n    constructor() {\n        super();\n\n        this._selected = [];\n        this.counterEl = null;\n        this.internals = this.attachInternals();\n    }\n\n    dependencies = {\n        'wje-button': Button,\n        'wje-popup': Popup,\n        'wje-icon': Icon,\n        'wje-label': Label,\n        'wje-chip': Chip,\n        'wje-input': Input,\n        'wje-option': Option,\n        'wje-options': Options,\n    };\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        if (Array.isArray(value)) {\n            this.internals.setFormValue(JSON.stringify(value));\n        } else {\n            this.internals.setFormValue(value);\n        }\n    }\n\n    /**\n     * Getter for the value attribute.\n     * @returns {string} The value of the attribute.\n     */\n    get value() {\n        return this.selected;\n    }\n\n    /**\n     * Getter for the customErrorDisplay attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get customErrorDisplay() {\n        return this.hasAttribute('custom-error-display');\n    }\n\n    /**\n     * Getter for the validateOnChange attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get validateOnChange() {\n        return this.hasAttribute('validate-on-change');\n    }\n\n    /**\n     * Getter for the invalid attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get invalid() {\n        return this.hasAttribute('invalid');\n    }\n\n    /**\n     * Setter for the invalid attribute.\n     * @param {boolean} isInvalid Whether the input is invalid.\n     */\n    set invalid(isInvalid) {\n        if (isInvalid) this.setAttribute('invalid', '');\n        else this.removeAttribute('invalid');\n    }\n\n    /**\n     * Getter for the form attribute.\n     * @returns {HTMLFormElement} The form the input is associated with.\n     */\n    get form() {\n        return this.internals.form;\n    }\n\n    /**\n     * Getter for the name attribute.\n     * @returns {string} The name of the input.\n     */\n    get name() {\n        return this.getAttribute('name');\n    }\n\n    /**\n     * Getter for the type attribute.\n     * @returns {string} The type of the input.\n     */\n    get type() {\n        return this.localName;\n    }\n\n    /**\n     * Getter for the validity attribute.\n     * @returns {ValidityState} The validity state of the input.\n     */\n    get validity() {\n        return this.internals.validity;\n    }\n\n    /**\n     * Getter for the validationMessage attribute.\n     * @returns {string} The validation message of the input.\n     */\n    get validationMessage() {\n        return this.internals.validationMessage;\n    }\n\n    /**\n     * Getter for the willValidate attribute.\n     * @returns {boolean} Whether the input will be validated.\n     */\n    get willValidate() {\n        return this.internals.willValidate;\n    }\n\n    /**\n     * @summary Getter for the defaultValue attribute.\n     * This method retrieves the 'value' attribute of the custom input element.\n     * The 'value' attribute represents the default value of the input element.\n     * If the 'value' attribute is not set, it returns an empty string.\n     * @returns {string} The default value of the input element.\n     */\n    get defaultValue() {\n        return this.getAttribute('value') ?? '';\n    }\n\n    /**\n     * @summary Setter for the defaultValue attribute.\n     * This method sets the 'value' attribute of the custom input element to the provided value.\n     * The 'value' attribute represents the default value of the input element.\n     * @param {string} value The value to set as the default value.\n     */\n    set defaultValue(value) {\n        this.setAttribute('value', value);\n    }\n\n    /**\n     * Sets the label value.\n     * @param {Array} value The selected value to set.\n     */\n    set selected(value) {\n        this._selected = value;\n    }\n\n    /**\n     * Returns the selected value.\n     * @returns {Array} The selected value.\n     */\n    get selected() {\n        return this.getSelected();\n    }\n\n    /**\n     * Sets the trigger value.\n     * @param {string} value The trigger value to set.\n     */\n    set trigger(value) {\n        this.setAttribute('trigger', value);\n    }\n\n    /**\n     * Returns the trigger value.\n     * @returns {string} The trigger value.\n     */\n    get trigger() {\n        return this.getAttribute('trigger') || 'click';\n    }\n\n    className = 'Select';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return ['active', 'value'];\n    }\n\n    /**\n     * Whether the input is associated with a form.\n     * @type {boolean}\n     */\n    static formAssociated = true;\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the select.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        this.classList.add('wje-placement', this.placement ? 'wje-' + this.placement : 'wje-start');\n\n        // zakladny obalovac\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-select', this.variant || 'default');\n\n        // wrapper pre label a inputWrapper\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('wrapper');\n        wrapper.setAttribute('slot', 'anchor');\n\n        // label\n        let label = document.createElement('wje-label');\n        label.innerText = this.label || '';\n\n        // obalovac pre input\n        let inputWrapper = document.createElement('div');\n        inputWrapper.setAttribute('part', 'input-wrapper');\n        inputWrapper.classList.add('input-wrapper');\n\n        let slotStart = document.createElement('div');\n        slotStart.classList.add('slot-start');\n\n        let input = document.createElement('input');\n        input.setAttribute('type', 'text');\n        input.setAttribute('part', 'input');\n        input.setAttribute('autocomplete', 'off');\n        input.setAttribute('readonly', '');\n        input.setAttribute('placeholder', this.placeholder || '');\n\n        let slotEnd = document.createElement('div');\n        slotEnd.classList.add('slot-end');\n\n        let arrow = document.createElement('wje-icon');\n        arrow.setAttribute('name', 'chevron-down');\n        arrow.setAttribute('slot', 'arrow');\n\n        let chips = document.createElement('div');\n        chips.classList.add('chips');\n        chips.innerText = this.placeholder || '';\n\n        // obalovac pre option a find\n        let optionsWrapper = document.createElement('div');\n        optionsWrapper.setAttribute('part', 'options-wrapper');\n        optionsWrapper.classList.add('options-wrapper');\n        optionsWrapper.style.setProperty('height', this.maxHeight || 'auto');\n\n        let list = document.createElement('div');\n        list.classList.add('list');\n\n        let slot = document.createElement('slot');\n\n        let clear = document.createElement('wje-button');\n        clear.setAttribute('fill', 'link');\n        clear.setAttribute('part', 'clear');\n\n        let clearIcon = document.createElement('wje-icon');\n        clearIcon.setAttribute('name', 'x');\n\n        clear.appendChild(clearIcon);\n\n        // vytvorime popup\n        let popup = document.createElement('wje-popup');\n        popup.setAttribute('placement', 'bottom-start');\n        popup.setAttribute('manual', '');\n        popup.setAttribute('size', '');\n\n        if (this.hasAttribute('disabled')) popup.setAttribute('disabled', '');\n\n        if (this.variant === 'standard') {\n            if (this.hasAttribute('label')) native.appendChild(label);\n        } else {\n            wrapper.appendChild(label);\n        }\n\n        inputWrapper.appendChild(slotStart);\n        inputWrapper.appendChild(input);\n        if (this.hasAttribute('multiple')) inputWrapper.appendChild(chips);\n\n        if (this.hasAttribute('clearable')) inputWrapper.appendChild(clear);\n\n        inputWrapper.appendChild(slotEnd);\n        inputWrapper.appendChild(arrow);\n\n        list.appendChild(slot);\n\n        if (this.hasAttribute('find')) {\n            let find = document.createElement('wje-input');\n            find.setAttribute('variant', 'standard');\n            find.setAttribute('placeholder', 'Hľadať');\n            find.classList.add('find');\n\n            optionsWrapper.appendChild(find);\n\n            this.findEl = find;\n        }\n\n        optionsWrapper.appendChild(list);\n\n        wrapper.appendChild(inputWrapper);\n\n        popup.appendChild(wrapper);\n        popup.appendChild(optionsWrapper);\n\n        if (this.trigger === 'click') popup.setAttribute('manual', '');\n\n        native.appendChild(popup);\n\n        this.native = native;\n        this.popup = popup;\n        this.labelElement = label;\n        this.slotStart = slotStart;\n        this.slotEnd = slotEnd;\n        this.input = input;\n        this.optionsWrapper = optionsWrapper;\n        this.chips = chips;\n        this.clear = clear;\n        this.list = list;\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Sets up the event listeners after the component is drawn.\n     */\n    afterDraw() {\n        this.input.addEventListener('focus', (e) => {\n            this.labelElement.classList.add('fade');\n            this.native.classList.add('focused');\n        });\n\n        this.input.addEventListener('blur', (e) => {\n            this.native.classList.remove('focused');\n            if (!e.target.value) this.labelElement.classList.remove('fade');\n        });\n\n        this.addEventListener('wje-option:change', this.optionChange);\n\n        this.clear.addEventListener('wje-button:click', (e) => {\n            this.getAllOptions().forEach((option) => {\n                option.selected = false;\n                option.removeAttribute('selected');\n            });\n            this.selections();\n\n            e.stopPropagation();\n        });\n\n        this.selections(true);\n\n        this.list.addEventListener('wje-options:load', (e) => {\n            this.list.scrollTo(0, 0);\n        });\n\n        // skontrolujeme ci ma select atribut find\n        if (this.hasAttribute('find') && this.findEl instanceof HTMLElement) {\n            event.addListener(this.findEl, 'keyup', '', (e) => {\n                // contains wj-options element with options\n                const optionsElement = this.querySelector('wje-options');\n                if (optionsElement && optionsElement.hasAttribute('lazy')) {\n                    // pass search value to wj-options element and infinite scroll will handle the rest\n                    optionsElement.setAttribute('search', e.target.value);\n                } else {\n                    let value = e.target.value.trim().toLowerCase();\n\n                    this.getAllOptions().forEach((option) => {\n                        if (option.textContent.trim().toLowerCase().includes(value)) option.style.display = 'block';\n                        else option.style.display = 'none';\n                    });\n                }\n            });\n        }\n    }\n\n    /**\n     * Handles the option change event.\n     * @param {Event} e The event.\n     */\n    optionChange = (e) => {\n        let allOptions = this.getAllOptions();\n\n        if (!this.hasAttribute('multiple')) {\n            allOptions.forEach((option) => {\n                option.selected = false;\n                option.removeAttribute('selected');\n            });\n            this.popup.removeAttribute('active');\n        }\n\n        e.target.selected = !e.target.hasAttribute('selected');\n\n        this.selections();\n    };\n\n    /**\n     * Returns all the options as HTML.\n     * @returns {NodeList} The options as HTML.\n     */\n    getAllOptions() {\n        return this.querySelectorAll('wje-option');\n    }\n\n    /**\n     * Returns the selected options as HTML.\n     * @returns {NodeList} The selected options as HTML.\n     */\n    getSelectedOptions() {\n        return this.querySelectorAll('wje-option[selected]');\n    }\n\n    /**\n     * Returns the selected options.\n     * @returns {Array} The selected options.\n     */\n    getSelected() {\n        let selectedOptions = this.getSelectedOptions();\n\n        selectedOptions = Array.isArray(selectedOptions) ? selectedOptions : Array.from(selectedOptions);\n\n        selectedOptions = selectedOptions.map((option) => {\n            return {\n                value: option.value,\n                text: option.textContent.trim(),\n            };\n        });\n\n        return selectedOptions;\n    }\n\n    /**\n     * Handles the selection change.\n     * @param {Element} option The option that changed.\n     * @param {number} length The length of the selected options.\n     */\n    selectionChanged(option = null, length = 0) {\n        if (this.hasAttribute('multiple')) {\n            this.value = this.selectedOptions.map((el) => el.value).reverse();\n\n            if (this.placeholder && length === 0) {\n                this.chips.innerHTML = this.placeholder;\n                this.input.value = '';\n            } else {\n                if (this.counterEl instanceof HTMLElement || length > +this.maxOptions) {\n                    this.counter();\n                } else {\n                    if (option !== null) this.chips.appendChild(this.getChip(option));\n                }\n            }\n        } else {\n            let value = option?.textContent.trim() || '';\n            this.value = this.selectedOptions?.map((el) => el.value)?.at(0);\n            this.input.value = value;\n\n            if (option && option instanceof HTMLElement) {\n                this.slotStart.innerHTML = '';\n\n                if (option?.querySelector('[slot=start]')) {\n                    this.slotStart.appendChild(option?.querySelector('[slot=start]').cloneNode(true));\n                }\n\n                this.slotEnd.innerHTML = '';\n\n                if (option?.querySelector('[slot=end]')) {\n                    this.slotEnd.appendChild(option?.querySelector('[slot=end]').cloneNode(true));\n                }\n            }\n        }\n    }\n\n    /**\n     * Updates the selected options and their corresponding chips.\n     * @param {boolean} [silence] Determines whether to suppress the \"wje-select:change\" event.\n     * @returns {void}\n     * @description\n     * This method fetches the currently selected options and updates the `selectedOptions` array.\n     * It clears and rebuilds the chips representing the selected items in the UI.\n     * If the number of selected options reaches the maximum allowed (`maxOptions`), it stops updating the counter.\n     * Optionally, it dispatches a custom event when the selection changes unless `silence` is set to `true`.\n     * //@fires wje-select:change - Dispatched when the selection changes, unless `silence` is `true`.\n     * @example\n     * // Call the method and allow event dispatch\n     * selections();\n     * @example\n     * // Call the method without dispatching the event\n     * selections(true);\n     */\n    selections(silence = false) {\n        let options = this.getSelectedOptions();\n\n        this.selectedOptions = Array.isArray(options) ? options : Array.from(options);\n\n        if (this.selectedOptions.length >= +this.maxOptions) {\n            this.counterEl = null;\n        }\n\n        if (this.chips) {\n            this.chips.innerHTML = '';\n        }\n\n        if (this.selectedOptions.length > 0) {\n            this.selectedOptions.forEach((option, index) => {\n                this.selectionChanged(option, ++index);\n            });\n        } else {\n            this.selectionChanged();\n        }\n\n        if (silence) return;\n        event.dispatchCustomEvent(this, 'wje-select:change');\n    }\n\n    /**\n     * Manages the display of a counter element to indicate the number of items exceeding the maximum allowed options.\n     * - If the number of selected items equals the maximum allowed, the counter element is removed.\n     * - If the counter element doesn't exist and the number of items exceeds the maximum, it is created and updated.\n     */\n    counter() {\n        // zmazanie counter (span)\n        if (this.counterEl && this.value.length === +this.maxOptions) {\n            this.counterEl.remove();\n            this.counterEl = null;\n            return;\n        }\n\n        // ak counter nie je, tak ho vytvorime\n        if (!this.counterEl) {\n            this.counterEl = document.createElement('span');\n            this.counterEl.classList.add('counter');\n\n            this.chips.appendChild(this.counterEl);\n        }\n\n        // nastavime hodnotu counter\n        this.counterEl.innerText = `+${this.value.length - +this.maxOptions}`;\n    }\n\n    /**\n     * Returns a chip element.\n     * @param {Element} option The option to get the chip for.\n     * @returns {Element} The chip element.\n     */\n    getChip(option) {\n        let chip = document.createElement('wje-chip');\n        chip.setAttribute('removable', '');\n        chip.addEventListener('wje:chip-remove', this.removeChip);\n        chip.option = option;\n\n        let label = document.createElement('wje-label');\n        label.innerText = option.textContent.trim();\n\n        chip.appendChild(label);\n\n        return chip;\n    }\n\n    /**\n     * Handles the chip remove event.\n     * @param {Event} e The event.\n     */\n    removeChip = (e) => {\n        let option = e.target.option;\n        option.selected = false;\n        option.removeAttribute('selected');\n        e.target.parentNode.removeChild(e.target);\n\n        this.selections();\n    };\n\n    /**\n     * Generates an HTML option element based on the provided item and mapping.\n     * @param {object} item The item to generate the option for.\n     * @param {object} [map] The mapping object that specifies the properties of the item to use for the option's value and text.\n     * @param {string} [map.value] The property of the item to use for the option's value.\n     * @param {string} [map.text] The property of the item to use for the option's text.\n     * @returns {HTMLElement} The generated HTML option element.\n     */\n    htmlOption(item, map = { value: 'value', text: 'text' }) {\n        let option = document.createElement('wje-option');\n\n        if (item[map.value] === null) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${map.value}`);\n        }\n\n        if (item[map.text] === null) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${map.text}`);\n        }\n\n        option.setAttribute('value', item[map.value] ?? '');\n        option.innerText = item[map.text] ?? '';\n        return option;\n    }\n\n    /**\n     * Adds an option to the select element.\n     * @param {any} optionData The data for the option to be added.\n     * @param {boolean} [silent] Whether to suppress any events triggered by the addition of the option.\n     * @param {object} [map] The mapping object specifying the properties of the option data to be used for the value and text of the option.\n     */\n    addOption(optionData, silent = false, map = { value: 'value', text: 'text' }) {\n        if (!optionData) return;\n\n        const optionsElement = this.querySelector('wje-options');\n        if (optionsElement) {\n            optionsElement.addOption(optionData, silent, map);\n            return;\n        }\n\n        let option = this.htmlOption(optionData, map);\n        this.appendChild(option);\n    }\n\n    /**\n     * Adds options to the select element.\n     * @param {Array | object} optionsData The options data to be added. Can be an array of objects or a single object.\n     * @param {boolean} [silent] Indicates whether to trigger events when adding options. Default is false.\n     * @param {object} [map] The mapping object that specifies the properties of the options data object. Default is { value: \"value\", text: \"text\" }.\n     */\n    addOptions(optionsData, silent = false, map = { value: 'value', text: 'text' }) {\n        if (!Array.isArray(optionsData)) {\n            this.addOption(optionsData, silent, map);\n        } else {\n            const optionsElement = this.querySelector('wje-options');\n            if (optionsElement) {\n                optionsElement.addOptions(optionsData, silent, map);\n                return;\n            }\n\n            optionsData.forEach((item) => {\n                this.addOption(item, silent, map);\n            });\n        }\n    }\n\n    /**\n     * Selects an option with the specified value.\n     * @param {string} value The value of the option to be selected.\n     * @param {boolean} [silent] Whether to suppress firing events.\n     */\n    selectOption(value, silent = false) {\n        if (!value) return;\n\n        let option = this.querySelector(`wje-option[value=\"${value}\"]`);\n\n        if (option) {\n            option.selected = true;\n        }\n\n        if (this.drawingStatus > this.drawingStatuses.START) this.selections(silent);\n    }\n\n    /**\n     * Selects one or multiple options in the select element.\n     * @param {Array|any} values The value(s) of the option(s) to be selected.\n     * @param {boolean} [silent] Whether to trigger the change event or not.\n     */\n    selectOptions(values, silent = false) {\n        if (!Array.isArray(values)) {\n            this.selectOption(values, silent);\n        } else {\n            values.forEach((value) => {\n                this.selectOption(value, silent);\n            });\n        }\n    }\n\n    /**\n     * @summary Callback function that is called when the custom element is associated with a form.\n     * This function adds an event listener to the form's submit event, which validates the input and propagates the validation.\n     * @param {HTMLFormElement} form The form the custom element is associated with.\n     */\n    formAssociatedCallback(form) {\n        form?.addEventListener('submit', () => {\n            // this.validateInput();\n            // this.propagateValidation();\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","import Select from './select.element.js';\n\nexport default Select;\n\nSelect.define('wje-select', Select);\n"],"names":[],"mappings":"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"}

package/dist/wje-slider.js

@@ -0,0 +1,221 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import WJElement, { event } from "./wje-element.js";
+const styles = ":host {\n    --wje-slider-track-height: 0.25rem;\n    --wje-slider-color: var(--wje-color-primary-9); /* Predvolená farba */\n    --wje-slider-thumb-color: var(--wje-color-primary-9); /* Farba tiahla */\n    --wje-slider-thumb-border: none; /* Predvolene žiadny border */\n    --wje-slider-thumb-shadow: none; /* Tieň vo výchozom stave */\n    --wje-slider-thumb-shadow-active: color-mix(in hsl, var(--wje-color-contrast-4) 60%, white) 0 0 0 7px;\n    --wje-slider-track-color: var(--wje-color-contrast-4); /* Farba tracku */\n\n    position: relative;\n    display: flex;\n    align-items: center;\n    max-width: 100%;\n}\n\n.native-slider {\n    display: flex;\n    position: relative;\n    flex-grow: 1;\n    align-items: center;\n    height: inherit;\n}\n\n.slider {\n    display: flex;\n    align-items: center;\n    position: relative;\n    flex: 1 1 0%;\n    width: 100%;\n    height: var(--height);\n    contain: size layout style;\n    cursor: grab;\n    touch-action: pan-y;\n}\n\ninput[type='range'] {\n    -webkit-appearance: none;\n    width: 100%;\n    height: var(--wje-slider-track-height);\n    margin: 0;\n    border-radius: 5px;\n    background-size: 70% 100%;\n    background-repeat: no-repeat;\n    background-color: var(--wje-slider-track-color);\n    background-image: linear-gradient(var(--wje-slider-color), var(--wje-slider-color));\n}\n\ninput[type='range']::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    height: 18px;\n    width: 18px;\n    border-radius: 50%;\n    border: var(--wje-slider-thumb-border); /* Nastaviteľný border (predvolený: none) */\n    background: var(--wje-slider-thumb-color); /* Farba tiahla */\n    box-shadow: var(--wje-slider-thumb-shadow); /* Tieň vo výchozom stave */\n    cursor: ew-resize;\n    transition: background 0.3s ease-in-out, border 0.3s ease-in-out;\n}\n\ninput[type='range']::-moz-range-thumb {\n    height: 18px;\n    width: 18px;\n    border-radius: 50%;\n    border: var(--wje-slider-thumb-border); /* Nastaviteľný border (predvolený: none) */\n    background: var(--wje-slider-thumb-color); /* Farba tiahla */\n    box-shadow: var(--wje-slider-thumb-shadow); /* Tieň vo výchozom stave */\n    cursor: pointer;\n    transition: background 0.3s ease-in-out, border 0.3s ease-in-out;\n}\n\ninput[type='range']::-ms-thumb {\n    height: 18px;\n    width: 18px;\n    border-radius: 50%;\n    border: var(--wje-slider-thumb-border); /* Nastaviteľný border (predvolený: none) */\n    background: var(--wje-slider-thumb-color); /* Farba tiahla */\n    box-shadow: var(--wje-slider-thumb-shadow); /* Tieň vo výchozom stave */\n    cursor: ew-resize;\n    transition: background 0.3s ease-in-out, border 0.3s ease-in-out;\n}\n\ninput[type='range']::-webkit-slider-thumb:active,\ninput[type='range']::-moz-range-thumb:active,\ninput[type='range']::-ms-thumb:active {\n    box-shadow: var(--wje-slider-thumb-shadow-active); /* Tieň pri aktívnom stave */\n}\n\ninput[type='range']::-webkit-slider-runnable-track {\n    -webkit-appearance: none;\n    box-shadow: none;\n    border: none;\n    background: transparent;\n}\n\ninput[type='range']::-moz-range-track {\n    -webkit-appearance: none;\n    box-shadow: none;\n    border: none;\n    background: transparent;\n}\n\ninput[type='range']::-ms-track {\n    -webkit-appearance: none;\n    box-shadow: none;\n    border: none;\n    background: transparent;\n}\n\ninput[type='range'][color='primary'] {\n    --wje-slider-color: var(--wje-color-primary-9);\n    --wje-slider-thumb-color: var(--wje-color-primary-9);\n}\n\ninput[type='range'][color='success'] {\n    --wje-slider-color: var(--wje-color-success-9);\n    --wje-slider-thumb-color: var(--wje-color-success-9);\n}\n\ninput[type='range'][color='complete'] {\n    --wje-slider-color: var(--wje-color-complete-9);\n    --wje-slider-thumb-color: var(--wje-color-complete-9);\n}\n\ninput[type='range'][color='danger'] {\n    --wje-slider-color: var(--wje-color-danger-9);\n    --wje-slider-thumb-color: var(--wje-color-danger-9);\n}\n\ninput[type='range'][color='warning'] {\n    --wje-slider-color: var(--wje-color-warning-9);\n    --wje-slider-thumb-color: var(--wje-color-warning-9);\n}\n\ninput[type='range'][color='dark'] {\n    --wje-slider-color: var(--wje-color-contrast-11);\n    --wje-slider-thumb-color: var(--wje-color-contrast-11);\n}\n\ndatalist {\n    display: flex;\n    justify-content: space-between;\n    height: auto;\n    overflow: hidden;\n    margin-top: 16px;\n\n    option::before {\n        content: '';\n        display: block;\n        width: 0;\n        height: auto;\n        padding-left: 3px;\n        text-indent: 0;\n    }\n}\n\noutput {\n    position: absolute;\n    background: var(--wje-color-contrast-11);\n    color: var(--wje-color-contrast-0);\n    top: -46px;\n    padding: 4px 8px;\n    border-radius: 4px;\n}\n\n::slotted([slot='label']) {\n    margin-inline: 0 0.5rem;\n    font-size: var(--wje-font-size);\n}\n\n::slotted([slot='start']) {\n    margin-inline: 0rem 0.75rem;\n}\n\n::slotted([slot='end']) {\n    margin-inline: 0.75rem 0rem;\n}";
+class Slider extends WJElement {
+  /**
+   * Creates an instance of Slider.
+   * @class
+   */
+  constructor() {
+    super();
+    __publicField(this, "className", "Slider");
+    /**
+     * Sets the handle position of the slider.
+     */
+    __publicField(this, "setHandlePosition", () => {
+      this.input.style.backgroundSize = this.getPercentage(this.input.min, this.input.max, this.input.value) + "% 100%";
+    });
+    /**
+     * Updates the position and content of a bubble element based on the input value.
+     *
+     * This function calculates the position of the bubble using the percentage representation
+     * of the input's current value relative to its minimum and maximum bounds. It then adjusts
+     * the bubble's left position dynamically for aesthetic purposes and updates its displayed
+     * content to reflect the current input value.
+     *
+     * The function relies on the following elements:
+     * - `this.input`: Represents the input element with properties `min`, `max`, and `value`.
+     * - `this.output`: Represents the bubble element to be positioned and updated.
+     *
+     * The left positioning of the bubble ensures precise alignment with the input value indicator.
+     */
+    __publicField(this, "setBubble", () => {
+      let newValue = this.getPercentage(this.input.min, this.input.max, this.input.value);
+      this.output.style.left = `calc(${newValue}% + (${8 - newValue * 0.15}px) - ${this.output.offsetWidth / 2}px)`;
+      this.output.innerHTML = this.input.value;
+    });
+  }
+  /**
+   * Sets the value of the slider.
+   * @param {number} value The value to set.
+   */
+  set value(value) {
+    this.setAttribute("value", value);
+    if (this.input) {
+      this.input.value = value;
+      this.setHandlePosition();
+    }
+  }
+  /**
+   * Returns the value of the slider.
+   * @returns {number} The value of the slider input.
+   */
+  get value() {
+    return this.getAttribute("value") || 0;
+  }
+  /**
+   * Sets the minimum value of the slider.
+   * @param {number} value The minimum value to set.
+   */
+  set min(value) {
+    this.setAttribute("min", value);
+  }
+  /**
+   * Returns the minimum value of the slider.
+   * @returns {number} The minimum value of the slider.
+   */
+  get min() {
+    return this.getAttribute("min") || 0;
+  }
+  /**
+   * Sets the maximum value of the slider.
+   * @param {number} value The maximum value to set.
+   */
+  set max(value) {
+    this.setAttribute("max", value);
+  }
+  /**
+   * Returns the maximum value of the slider.
+   * @returns {number} The maximum value of the slider.
+   */
+  get max() {
+    return this.getAttribute("max") || 100;
+  }
+  /**
+   * Sets the step value of the slider.
+   * @param {number} value The step value to set.
+   */
+  set step(value) {
+    this.setAttribute("step", value);
+  }
+  /**
+   * Returns the step value of the slider.
+   * @returns {number} The step value of the slider.
+   */
+  get step() {
+    return this.getAttribute("step") || 1;
+  }
+  /**
+   * Returns the CSS styles for the component.
+   * @static
+   * @returns {CSSStyleSheet}
+   */
+  static get cssStyleSheet() {
+    return styles;
+  }
+  /**
+   * Returns the list of attributes to observe for changes.
+   * @static
+   * @returns {Array<string>}
+   */
+  static get observedAttributes() {
+    return ["max"];
+  }
+  /**
+   * Sets up the attributes for the component.
+   */
+  setupAttributes() {
+    this.isShadowRoot = "open";
+  }
+  /**
+   * Draws the component for the slider.
+   * @returns {DocumentFragment}
+   */
+  draw() {
+    let fragment = document.createDocumentFragment();
+    let element = document.createElement("div");
+    element.className = "native-slider";
+    element.setAttribute("part", "native");
+    let slider = document.createElement("div");
+    slider.className = "slider";
+    let label = document.createElement("slot");
+    label.name = "label";
+    let start = document.createElement("slot");
+    start.name = "start";
+    let end = document.createElement("slot");
+    end.name = "end";
+    let output = document.createElement("output");
+    output.setAttribute("for", "slider");
+    output.id = "output";
+    output.setAttribute("hidden", "");
+    let input = document.createElement("input");
+    input.type = "range";
+    input.min = this.min;
+    input.max = this.max;
+    input.step = this.step;
+    input.value = this.value;
+    input.id = "slider";
+    input.name = "slider";
+    input.part = "slider";
+    input.setAttribute("autocomplete", "off");
+    input.setAttribute("color", this.color || "");
+    input.addEventListener("input", null, (e) => {
+      this.setHandlePosition(e.target);
+    });
+    slider.appendChild(input);
+    if (this.hasAttribute("bubble")) {
+      slider.appendChild(output);
+    }
+    element.appendChild(label);
+    element.appendChild(start);
+    element.appendChild(slider);
+    element.appendChild(end);
+    fragment.appendChild(element);
+    this.input = input;
+    this.output = output;
+    return fragment;
+  }
+  /**
+   * Handles the post-rendering logic for a custom slider component. This method performs the following tasks:
+   * - Sets the position of the handle.
+   * - Displays a bubble indicator with the current value, if the slider has a "bubble" attribute.
+   * - Dispatches initialization, movement, and change custom events for the slider input element.
+   * - Updates the bubble position and value dynamically on input changes.
+   * @returns {void} This method does not return a value.
+   */
+  afterDraw() {
+    this.setHandlePosition();
+    if (this.hasAttribute("bubble")) {
+      this.output.innerHTML = this.input.value;
+      this.output.removeAttribute("hidden");
+      setTimeout(this.setBubble, 50);
+    }
+    event.dispatchCustomEvent(this.input, "wje-slider:init", {
+      value: this.input.value,
+      output: this.output
+    });
+    event.addListener(this.input, "input", null, (e) => {
+      this.value = e.target.value;
+      event.dispatchCustomEvent(this.input, "wje-slider:move", {
+        value: e.target.value,
+        output: this.output
+      });
+      if (this.hasAttribute("bubble")) {
+        this.setBubble();
+      }
+    });
+    event.addListener(this.input, "change", null, (e) => {
+      event.dispatchCustomEvent(this.input, "wje-slider:change", {
+        value: e.target.value,
+        output: this.output
+      });
+    });
+  }
+  /**
+   * Calculates the percentage of a value within a given range.
+   * @param {number} min The minimum value of the range.
+   * @param {number} max The maximum value of the range.
+   * @param {number} [value] The current value within the range. Defaults to 0 if not provided.
+   * @returns {number} The calculated percentage as a number between 0 and 100. Returns 0 if the range is invalid.
+   */
+  getPercentage(min, max, value = 0) {
+    return Number((value - min) * 100 / (max - min)) || 0;
+  }
+}
+Slider.define("wje-slider", Slider);
+export {
+  Slider as default
+};
+//# sourceMappingURL=wje-slider.js.map

package/dist/wje-slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wje-slider.js","sources":["../packages/wje-slider/slider.element.js","../packages/wje-slider/slider.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * Represents a slider component that extends the WJElement class.\n * This slider supports features such as min, max, step values, bubble display, and event handling.\n * It offers both getter and setter methods for its attributes and dynamically handles rendering and updates.\n */\n\nexport default class Slider extends WJElement {\n    /**\n     * Creates an instance of Slider.\n     * @class\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * Sets the value of the slider.\n     * @param {number} value The value to set.\n     */\n    set value(value) {\n        this.setAttribute('value', value);\n\n        if (this.input) {\n            this.input.value = value;\n            this.setHandlePosition();\n        }\n    }\n\n    /**\n     * Returns the value of the slider.\n     * @returns {number} The value of the slider input.\n     */\n    get value() {\n        return this.getAttribute('value') || 0;\n    }\n\n    /**\n     * Sets the minimum value of the slider.\n     * @param {number} value The minimum value to set.\n     */\n    set min(value) {\n        this.setAttribute('min', value);\n    }\n\n    /**\n     * Returns the minimum value of the slider.\n     * @returns {number} The minimum value of the slider.\n     */\n    get min() {\n        return this.getAttribute('min') || 0;\n    }\n\n    /**\n     * Sets the maximum value of the slider.\n     * @param {number} value The maximum value to set.\n     */\n    set max(value) {\n        this.setAttribute('max', value);\n    }\n\n    /**\n     * Returns the maximum value of the slider.\n     * @returns {number} The maximum value of the slider.\n     */\n    get max() {\n        return this.getAttribute('max') || 100;\n    }\n\n    /**\n     * Sets the step value of the slider.\n     * @param {number} value The step value to set.\n     */\n    set step(value) {\n        this.setAttribute('step', value);\n    }\n\n    /**\n     * Returns the step value of the slider.\n     * @returns {number} The step value of the slider.\n     */\n    get step() {\n        return this.getAttribute('step') || 1;\n    }\n\n    className = 'Slider';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return ['max'];\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the slider.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let element = document.createElement('div');\n        element.className = 'native-slider';\n        element.setAttribute('part', 'native');\n\n        let slider = document.createElement('div');\n        slider.className = 'slider';\n\n        let label = document.createElement('slot');\n        label.name = 'label';\n\n        let start = document.createElement('slot');\n        start.name = 'start';\n\n        let end = document.createElement('slot');\n        end.name = 'end';\n\n        let output = document.createElement('output');\n        output.setAttribute('for', 'slider');\n        output.id = 'output';\n        output.setAttribute('hidden', '');\n\n        let input = document.createElement('input');\n        input.type = 'range';\n        input.min = this.min;\n        input.max = this.max;\n        input.step = this.step;\n        input.value = this.value;\n        input.id = 'slider';\n        input.name = 'slider';\n        input.part = 'slider';\n        input.setAttribute('autocomplete', 'off');\n        input.setAttribute('color', this.color || '');\n\n        input.addEventListener('input', null, (e) => {\n            this.setHandlePosition(e.target);\n        });\n\n        slider.appendChild(input);\n        if (this.hasAttribute('bubble')) {\n            slider.appendChild(output);\n        }\n        element.appendChild(label);\n        element.appendChild(start);\n        element.appendChild(slider);\n        element.appendChild(end);\n\n        fragment.appendChild(element);\n\n        this.input = input;\n        this.output = output;\n\n        return fragment;\n    }\n\n\n    /**\n     * Handles the post-rendering logic for a custom slider component. This method performs the following tasks:\n     * - Sets the position of the handle.\n     * - Displays a bubble indicator with the current value, if the slider has a \"bubble\" attribute.\n     * - Dispatches initialization, movement, and change custom events for the slider input element.\n     * - Updates the bubble position and value dynamically on input changes.\n     * @returns {void} This method does not return a value.\n     */\n    afterDraw() {\n        this.setHandlePosition();\n\n        if (this.hasAttribute('bubble')) {\n            this.output.innerHTML = this.input.value;\n            this.output.removeAttribute('hidden');\n\n            setTimeout(this.setBubble, 50);\n        }\n\n        event.dispatchCustomEvent(this.input, 'wje-slider:init', {\n            value: this.input.value,\n            output: this.output,\n        });\n\n        event.addListener(this.input, 'input', null, (e) => {\n            this.value = e.target.value;\n\n            event.dispatchCustomEvent(this.input, 'wje-slider:move', {\n                value: e.target.value,\n                output: this.output,\n            });\n\n            if (this.hasAttribute('bubble')) {\n                this.setBubble();\n            }\n        });\n\n        event.addListener(this.input, 'change', null, (e) => {\n            event.dispatchCustomEvent(this.input, 'wje-slider:change', {\n                value: e.target.value,\n                output: this.output,\n            });\n        });\n    }\n\n    /**\n     * Sets the handle position of the slider.\n     */\n    setHandlePosition = () => {\n        this.input.style.backgroundSize =\n            this.getPercentage(this.input.min, this.input.max, this.input.value) + '% 100%';\n    };\n\n\n    /**\n     * Updates the position and content of a bubble element based on the input value.\n     *\n     * This function calculates the position of the bubble using the percentage representation\n     * of the input's current value relative to its minimum and maximum bounds. It then adjusts\n     * the bubble's left position dynamically for aesthetic purposes and updates its displayed\n     * content to reflect the current input value.\n     *\n     * The function relies on the following elements:\n     * - `this.input`: Represents the input element with properties `min`, `max`, and `value`.\n     * - `this.output`: Represents the bubble element to be positioned and updated.\n     *\n     * The left positioning of the bubble ensures precise alignment with the input value indicator.\n     */\n    setBubble = () => {\n        let newValue = this.getPercentage(this.input.min, this.input.max, this.input.value);\n        this.output.style.left = `calc(${newValue}% + (${8 - newValue * 0.15}px) - ${this.output.offsetWidth / 2}px)`;\n        this.output.innerHTML = this.input.value;\n    };\n\n    /**\n     * Calculates the percentage of a value within a given range.\n     * @param {number} min The minimum value of the range.\n     * @param {number} max The maximum value of the range.\n     * @param {number} [value] The current value within the range. Defaults to 0 if not provided.\n     * @returns {number} The calculated percentage as a number between 0 and 100. Returns 0 if the range is invalid.\n     */\n    getPercentage(min, max, value = 0) {\n        return Number(((value - min) * 100) / (max - min)) || 0;\n    }\n}\n","import Slider from './slider.element.js';\n\nexport default Slider;\n\nSlider.define('wje-slider', Slider);\n"],"names":[],"mappings":"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"}