wj-elements 0.1.165 → 0.1.166

package/dist/wje-option.js

@@ -90,19 +90,23 @@ class Option extends WJElement {
    * Adds event listeners after the component is drawn.
    */
   afterDraw() {
-    event.addListener(this, "click", null, (e, b, c) => {
-      if (this.hasAttribute("disabled")) return;
-      this.dispatchEvent(
-        new CustomEvent("wje-option:change", {
-          bubbles: true,
-          composed: true,
-          detail: {
-            value: this.value,
-            text: this.text
-          }
-        })
-      );
-    });
+    event.addListener(this, "click", null, this.optionClickCallback);
+  }
+  beforeDisconnect() {
+    event.removeListener(this, "click", null, this.optionClickCallback);
+  }
+  optionClickCallback(e, b, c) {
+    if (this.hasAttribute("disabled")) return;
+    this.dispatchEvent(
+      new CustomEvent("wje-option:change", {
+        bubbles: true,
+        composed: true,
+        detail: {
+          value: this.value,
+          text: this.text
+        }
+      })
+    );
   }
 }
 Option.define("wje-option", Option);

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 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    /**\n     * Creates an instance of Option.\n     * @class\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * Dependencies of the Option component.\n     */\n    dependencies = {\n        'wje-icon': Icon,\n    };\n\n    /**\n     * Sets the selected attribute of the option.\n     * @param {boolean} value The value to set.\n     */\n    set selected(value) {\n        if (value) this.setAttribute('selected', '');\n        else this.removeAttribute('selected');\n    }\n\n    /**\n     * Sets the value attribute of the option.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        this.setAttribute('value', value);\n    }\n\n    /**\n     * Sets the text content of the option.\n     * @param {string} value The text to set.\n     */\n    set text(value) {\n        this.innerText = value;\n    }\n\n    className = 'Option';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the option.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let element = document.createElement('div');\n        element.classList.add('native-option');\n        element.setAttribute('part', 'native');\n\n        let icon = document.createElement('wje-icon');\n        icon.setAttribute('name', 'check');\n\n        let start = document.createElement('slot');\n        start.setAttribute('name', 'start');\n\n        let slot = document.createElement('slot');\n\n        let end = document.createElement('slot');\n        end.setAttribute('name', 'end');\n\n        element.appendChild(icon);\n        element.appendChild(start);\n        element.appendChild(slot);\n        element.appendChild(end);\n\n        fragment.appendChild(element);\n\n        return fragment;\n    }\n\n    /**\n     * Adds event listeners after the component is drawn.\n     */\n    afterDraw() {\n        event.addListener(this, 'click', null, (e, b, c) => {\n            if (this.hasAttribute('disabled')) return;\n\n            this.dispatchEvent(\n                new CustomEvent('wje-option:change', {\n                    bubbles: true,\n                    composed: true,\n                    detail: {\n                        value: this.value,\n                        text: this.text,\n                    },\n                })\n            );\n        });\n    }\n}\n","import Option from './option.element.js';\n\nexport default Option;\n\nOption.define('wje-option', Option);\n"],"names":[],"mappings":";;;;;;AAiBe,MAAM,eAAe,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAK1C,cAAc;AACV,UAAO;AAMX;AAAA;AAAA;AAAA,wCAAe;AAAA,MACX,YAAY;AAAA,IACf;AA2BD,qCAAY;AAAA,EAlChB;AAAA;AAAA;AAAA;AAAA;AAAA,EAaI,IAAI,SAAS,OAAO;AAChB,QAAI,MAAO,MAAK,aAAa,YAAY,EAAE;AAAA,QACtC,MAAK,gBAAgB,UAAU;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,MAAM,OAAO;AACb,SAAK,aAAa,SAAS,KAAK;AAAA,EACxC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,KAAK,OAAO;AACZ,SAAK,YAAY;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,WAAW,qBAAqB;AAC5B,WAAO,CAAE;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,UAAU,SAAS,cAAc,KAAK;AAC1C,YAAQ,UAAU,IAAI,eAAe;AACrC,YAAQ,aAAa,QAAQ,QAAQ;AAErC,QAAI,OAAO,SAAS,cAAc,UAAU;AAC5C,SAAK,aAAa,QAAQ,OAAO;AAEjC,QAAI,QAAQ,SAAS,cAAc,MAAM;AACzC,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,QAAI,MAAM,SAAS,cAAc,MAAM;AACvC,QAAI,aAAa,QAAQ,KAAK;AAE9B,YAAQ,YAAY,IAAI;AACxB,YAAQ,YAAY,KAAK;AACzB,YAAQ,YAAY,IAAI;AACxB,YAAQ,YAAY,GAAG;AAEvB,aAAS,YAAY,OAAO;AAE5B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,UAAM,YAAY,MAAM,SAAS,MAAM,CAAC,GAAG,GAAG,MAAM;AAChD,UAAI,KAAK,aAAa,UAAU,EAAG;AAEnC,WAAK;AAAA,QACD,IAAI,YAAY,qBAAqB;AAAA,UACjC,SAAS;AAAA,UACT,UAAU;AAAA,UACV,QAAQ;AAAA,YACJ,OAAO,KAAK;AAAA,YACZ,MAAM,KAAK;AAAA,UACd;AAAA,QACJ,CAAA;AAAA,MACJ;AAAA,IACb,CAAS;AAAA,EACT;AACA;ACpIA,OAAO,OAAO,cAAc,MAAM;"}
+{"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 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    /**\n     * Creates an instance of Option.\n     * @class\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * Dependencies of the Option component.\n     */\n    dependencies = {\n        'wje-icon': Icon,\n    };\n\n    /**\n     * Sets the selected attribute of the option.\n     * @param {boolean} value The value to set.\n     */\n    set selected(value) {\n        if (value) this.setAttribute('selected', '');\n        else this.removeAttribute('selected');\n    }\n\n    /**\n     * Sets the value attribute of the option.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        this.setAttribute('value', value);\n    }\n\n    /**\n     * Sets the text content of the option.\n     * @param {string} value The text to set.\n     */\n    set text(value) {\n        this.innerText = value;\n    }\n\n    className = 'Option';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the option.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let element = document.createElement('div');\n        element.classList.add('native-option');\n        element.setAttribute('part', 'native');\n\n        let icon = document.createElement('wje-icon');\n        icon.setAttribute('name', 'check');\n\n        let start = document.createElement('slot');\n        start.setAttribute('name', 'start');\n\n        let slot = document.createElement('slot');\n\n        let end = document.createElement('slot');\n        end.setAttribute('name', 'end');\n\n        element.appendChild(icon);\n        element.appendChild(start);\n        element.appendChild(slot);\n        element.appendChild(end);\n\n        fragment.appendChild(element);\n\n        return fragment;\n    }\n\n    /**\n     * Adds event listeners after the component is drawn.\n     */\n    afterDraw() {\n        event.addListener(this, 'click', null, this.optionClickCallback);\n    }\n\n    beforeDisconnect() {\n        event.removeListener(this, 'click', null, this.optionClickCallback);\n    }\n\n    optionClickCallback(e, b, c) {\n        if (this.hasAttribute('disabled')) return;\n\n        this.dispatchEvent(\n            new CustomEvent('wje-option:change', {\n                bubbles: true,\n                composed: true,\n                detail: {\n                    value: this.value,\n                    text: this.text,\n                },\n            })\n        );\n    }\n}\n","import Option from './option.element.js';\n\nexport default Option;\n\nOption.define('wje-option', Option);\n"],"names":[],"mappings":";;;;;;AAiBe,MAAM,eAAe,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAK1C,cAAc;AACV,UAAO;AAMX;AAAA;AAAA;AAAA,wCAAe;AAAA,MACX,YAAY;AAAA,IACf;AA2BD,qCAAY;AAAA,EAlChB;AAAA;AAAA;AAAA;AAAA;AAAA,EAaI,IAAI,SAAS,OAAO;AAChB,QAAI,MAAO,MAAK,aAAa,YAAY,EAAE;AAAA,QACtC,MAAK,gBAAgB,UAAU;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,MAAM,OAAO;AACb,SAAK,aAAa,SAAS,KAAK;AAAA,EACxC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,KAAK,OAAO;AACZ,SAAK,YAAY;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,WAAW,qBAAqB;AAC5B,WAAO,CAAE;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,UAAU,SAAS,cAAc,KAAK;AAC1C,YAAQ,UAAU,IAAI,eAAe;AACrC,YAAQ,aAAa,QAAQ,QAAQ;AAErC,QAAI,OAAO,SAAS,cAAc,UAAU;AAC5C,SAAK,aAAa,QAAQ,OAAO;AAEjC,QAAI,QAAQ,SAAS,cAAc,MAAM;AACzC,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,QAAI,MAAM,SAAS,cAAc,MAAM;AACvC,QAAI,aAAa,QAAQ,KAAK;AAE9B,YAAQ,YAAY,IAAI;AACxB,YAAQ,YAAY,KAAK;AACzB,YAAQ,YAAY,IAAI;AACxB,YAAQ,YAAY,GAAG;AAEvB,aAAS,YAAY,OAAO;AAE5B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,UAAM,YAAY,MAAM,SAAS,MAAM,KAAK,mBAAmB;AAAA,EACvE;AAAA,EAEI,mBAAmB;AACf,UAAM,eAAe,MAAM,SAAS,MAAM,KAAK,mBAAmB;AAAA,EAC1E;AAAA,EAEI,oBAAoB,GAAG,GAAG,GAAG;AACzB,QAAI,KAAK,aAAa,UAAU,EAAG;AAEnC,SAAK;AAAA,MACD,IAAI,YAAY,qBAAqB;AAAA,QACjC,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ;AAAA,UACJ,OAAO,KAAK;AAAA,UACZ,MAAM,KAAK;AAAA,QACd;AAAA,MACJ,CAAA;AAAA,IACJ;AAAA,EACT;AACA;AC1IA,OAAO,OAAO,cAAc,MAAM;"}

package/dist/wje-options.js

@@ -1,6 +1,14 @@
 var __defProp = Object.defineProperty;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
 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);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var _loadedOptions, _drawPreloadedElements;
 import WJElement, { event } from "./wje-element.js";
 import { I as InfiniteScroll } from "./infinite-scroll.element-CasKXuGZ.js";
 import { L as List } from "./list.element-Ce1vIm1O.js";
@@ -12,6 +20,13 @@ class Options extends WJElement {
    */
   constructor() {
     super();
+    /**
+     * Stores the loaded options.
+     * @type {Array}
+     * @private
+     */
+    __privateAdd(this, _loadedOptions, []);
+    __privateAdd(this, _drawPreloadedElements, []);
     __publicField(this, "dependencies", {
       "wje-option": Option,
       "wje-infinite-scroll": InfiniteScroll,
@@ -67,7 +82,6 @@ class Options extends WJElement {
       option.innerText = item[this.itemText] ?? "";
       return option;
     });
-    this._loadedOptions = [];
   }
   /**
    * Returns the list of attributes to observe for changes.
@@ -239,14 +253,25 @@ class Options extends WJElement {
    * @type {Array}
    */
   get loadedOptions() {
-    return this._loadedOptions;
+    return __privateGet(this, _loadedOptions);
   }
   /**
    * Sets the loaded options.
    * @type {Array}
    */
   set loadedOptions(loadedOptions) {
-    this._loadedOptions = loadedOptions;
+    __privateSet(this, _loadedOptions, loadedOptions);
+  }
+  /**
+   * Array of preloaded elements.
+   * @type {Array}
+   * @private
+   */
+  get drawPreloadedElements() {
+    return __privateGet(this, _drawPreloadedElements);
+  }
+  set drawPreloadedElements(elements) {
+    __privateSet(this, _drawPreloadedElements, elements);
   }
   /**
    * Sets up the attributes for the component.
@@ -259,7 +284,6 @@ class Options extends WJElement {
    * Fetches the pages and creates the options elements.
    */
   afterDraw() {
-    event.dispatchCustomEvent(this, "wje-options:load", {});
   }
   /**
    * Draws the component.
@@ -270,8 +294,10 @@ class Options extends WJElement {
     const slot = document.createElement("slot");
     fragment.appendChild(slot);
     if (this.hasAttribute("lazy")) {
-      const list = document.createElement("wje-list");
       if (this.contains(this.infiniteScroll)) {
+        this.drawPreloadedElements.forEach((el) => {
+          el.remove();
+        });
         this.loadedOptions = [];
         this.infiniteScroll.placementObj.innerHTML = "";
         this.infiniteScroll.totalPages = 0;
@@ -282,6 +308,7 @@ class Options extends WJElement {
       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) => {
@@ -294,8 +321,14 @@ class Options extends WJElement {
         this.loadedOptions.push(...this.processData(filteredOptions));
         return filteredOptions;
       };
-      if (this.hasAttribute("attached") && !this.contains(this.infiniteScroll)) {
+      event.addListener(infiniteScroll, "wje-infinite-scroll:load", null, (e) => {
+        event.dispatchCustomEvent(this, "wje-options:load", {});
+      });
+      if (this.hasAttribute("attached")) {
         this.appendChild(infiniteScroll);
+        this.drawPreloadedElements.forEach((el) => {
+          list.appendChild(el);
+        });
       }
       this.infiniteScroll = infiniteScroll;
     } else {
@@ -362,7 +395,9 @@ class Options extends WJElement {
     if (this.loadedOptions.some((option) => option[this.itemValue] === optionData[this.itemValue])) {
       return;
     }
-    this.prepend(this.htmlItem(optionData));
+    const item = this.htmlItem(optionData);
+    __privateGet(this, _drawPreloadedElements).push(item);
+    this.prepend(item);
     this.loadedOptions.push(optionData);
   }
   /**
@@ -375,6 +410,8 @@ class Options extends WJElement {
     else this.addOption(optionsData, silent);
   }
 }
+_loadedOptions = new WeakMap();
+_drawPreloadedElements = new WeakMap();
 Options.define("wje-options", Options);
 export {
   Options as default

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.element.js';\nimport List from '../wje-list/list.element.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    /**\n     * Creates an instance of Options.\n     * @class\n     */\n    constructor() {\n        super();\n\n        /**\n         * Stores the loaded options.\n         * @type {Array}\n         * @private\n         */\n        this._loadedOptions = [];\n    }\n\n    dependencies = {\n        'wje-option': Option,\n        'wje-infinite-scroll': InfiniteScroll,\n        'wje-list': List,\n    };\n\n    className = 'Options';\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 ['search', 'attached'];\n    }\n\n    /**\n     * Sets the option array path attribute.\n     * @param {string} value The value to set for the option array path.\n     */\n    set optionArrayPath(value) {\n        this.setAttribute('option-array-path', value);\n    }\n\n    /**\n     * Gets the option array path attribute.\n     * @returns {string} The value of the option array path attribute or \"data\" if not set.\n     */\n    get optionArrayPath() {\n        return this.getAttribute('option-array-path');\n    }\n\n    /**\n     * Checks if the option array path attribute is present.\n     * @returns {boolean} True if the option array path attribute is present, false otherwise.\n     */\n    get hasOptionArrayPath() {\n        return this.hasAttribute('option-array-path');\n    }\n\n    /**\n     * Gets the dropdown height attribute.\n     * @returns {string} The value of the dropdown height attribute or \"100%\" if not set.\n     */\n    get dropdownHeight() {\n        return this.getAttribute('dropdown-height') || '100%';\n    }\n\n    /**\n     * Sets the dropdown height attribute.\n     * @param {string} value The value to set for the dropdown height.\n     */\n    set dropdownHeight(value) {\n        this.setAttribute('dropdown-height', value);\n    }\n\n    /**\n     * Sets the item value attribute.\n     * @param {string} value The value to set for the item value.\n     */\n    set itemValue(value) {\n        this.setAttribute('item-value', value);\n    }\n\n    /**\n     * Gets the item value attribute.\n     * @returns {string} The value of the item value attribute or \"value\" if not set.\n     */\n    get itemValue() {\n        return this.getAttribute('item-value') || 'value';\n    }\n\n    /**\n     * Sets the item text attribute.\n     * @param {string} value The value to set for the item text.\n     */\n    set itemText(value) {\n        this.setAttribute('item-text', value);\n    }\n\n    /**\n     * Gets the item text attribute.\n     * @returns {string} The value of the item text attribute or \"text\" if not set.\n     */\n    get itemText() {\n        return this.getAttribute('item-text') || 'text';\n    }\n\n    /**\n     * Gets the lazy load size attribute.\n     * @returns {number} The value of the lazy load size attribute or 10 if not set.\n     */\n    get lazyLoadSize() {\n        return this.getAttribute('lazy-load-size') || 10;\n    }\n\n    /**\n     * Sets the lazy load size attribute.\n     * @param {number} value The value to set for the lazy load size.\n     */\n    set lazyLoadSize(value) {\n        this.setAttribute('lazy-load-size', value);\n    }\n\n    /**\n     * Sets the search attribute.\n     * @param {string} value The value to set for the search.\n     */\n    set search(value) {\n        this.setAttribute('search', value);\n    }\n\n    /**\n     * Gets the search attribute.\n     * @returns {string} The value of the search attribute.\n     */\n    get search() {\n        return this.getAttribute('search');\n    }\n\n    /**\n     * Checks if the search attribute is present.\n     * @returns {boolean} True if the search attribute is present, false otherwise.\n     */\n    get hasSearch() {\n        return this.hasAttribute('search');\n    }\n\n    /**\n     * Retrieves the value of the 'search-to-query-params' attribute from the current instance.\n     * @returns {string | null} The value of the 'search-to-query-params' attribute, or null if the attribute is not set.\n     */\n    get searchToQueryParams() {\n        return this.getAttribute('search-to-query-params');\n    }\n\n    /**\n     * Sets the value to define search-to-query params behavior.\n     * @param {string} value The value to be set for the search-to-query-params attribute.\n     */\n    set searchToQueryParams(value) {\n        this.setAttribute('search-to-query-params', value);\n    }\n\n    /**\n     * Determines whether the 'search-to-query-params' attribute is present on the element.\n     * @returns {boolean} True if the 'search-to-query-params' attribute exists, otherwise false.\n     */\n    get hasSearchToQueryParams() {\n        return this.hasAttribute('search-to-query-params');\n    }\n\n    /**\n     * Sets the value of the search parameter name attribute.\n     * @param {string} value The string value to set as the search parameter name.\n     */\n    set searchParamName(value) {\n        this.setAttribute('search-param-name', value);\n    }\n\n    /**\n     * Gets the search parameter name used in queries.\n     * Retrieves the value of the 'search-param-name' attribute.\n     * If the attribute is not set, it defaults to 'search'.\n     * @returns {string} The search parameter name used for queries.\n     */\n    get searchParamName() {\n        return this.getAttribute('search-param-name') || 'search';\n    }\n    /**\n     * Checks if the lazy attribute is present.\n     * @returns {boolean} True if the lazy attribute is present, false otherwise.\n     */\n    get lazy() {\n        return this.hasAttribute('lazy');\n    }\n\n    /**\n     * Sets the lazy attribute.\n     * @param {boolean} value The value to set for the lazy attribute.\n     */\n    set lazy(value) {\n        this.setAttribute('lazy', value);\n    }\n\n    /**\n     * Gets the loaded options.\n     * @returns {Array} The loaded options.\n     */\n    get options() {\n        return this.loadedOptions?.flat();\n    }\n\n    /**\n     * Gets the loaded options.\n     * @type {Array}\n     */\n    get loadedOptions() {\n        return this._loadedOptions;\n    }\n\n    /**\n     * Sets the loaded options.\n     * @type {Array}\n     */\n    set loadedOptions(loadedOptions) {\n        this._loadedOptions = loadedOptions;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Prepares the component before drawing.\n     * Fetches the pages and creates the options elements.\n     */\n    afterDraw() {\n        event.dispatchCustomEvent(this, 'wje-options:load', {}); // nepomohlo to, v ff stale je scroll hore\n    }\n\n    /**\n     * Draws the component.\n     * @returns {DocumentFragment}\n     */\n    async draw() {\n        let fragment = document.createDocumentFragment();\n\n        const slot = document.createElement('slot');\n        fragment.appendChild(slot);\n\n        if (this.hasAttribute('lazy')) {\n            const list = document.createElement('wje-list');\n\n            if (this.contains(this.infiniteScroll)) {\n                this.loadedOptions = [];\n                this.infiniteScroll.placementObj.innerHTML = '';\n                this.infiniteScroll.totalPages = 0;\n                this.infiniteScroll.refresh();\n\n                return fragment;\n            }\n\n            const infiniteScroll = document.createElement('wje-infinite-scroll');\n            infiniteScroll.setAttribute('placement', 'wje-list');\n            infiniteScroll.setAttribute('height', this.dropdownHeight);\n            infiniteScroll.setAttribute('object-name', this.optionArrayPath);\n            infiniteScroll.append(list);\n\n            infiniteScroll.dataToHtml = this.htmlItem;\n\n            infiniteScroll.setCustomData = async (page, signal) => {\n                let processedUrl = `${this.url}${this.search ? `/${this.search}` : ''}?page=${page}&size=${this.lazyLoadSize}`;\n\n                if (this.hasSearchToQueryParams) {\n                    processedUrl = `${this.url}?page=${page}&size=${this.lazyLoadSize}${this.search ? `&${this.searchParamName}=${this.search}` : ''}`;\n                }\n\n                let res = await this.service.get(processedUrl, null, false, signal);\n                const filteredOptions = this.filterOutDrawnOptions(res);\n                this.loadedOptions.push(...this.processData(filteredOptions));\n\n                return filteredOptions;\n            };\n\n            if (this.hasAttribute('attached') && !this.contains(this.infiniteScroll)) {\n                this.appendChild(infiniteScroll);\n            }\n\n            this.infiniteScroll = infiniteScroll;\n        } else {\n            this.response = await this.getPages();\n            let optionsData = this.filterOutDrawnOptions(this.response);\n            optionsData = this.processData(optionsData);\n\n            this.loadedOptions.push(...optionsData);\n\n            this.append(...optionsData.map(this.htmlItem));\n        }\n\n        return fragment;\n    }\n\n    /**\n     * Processes the given data and returns the options based on the option array path.\n     * @param {any} data The data to be processed.\n     * @returns {any} - The options based on the option array path.\n     */\n    processData(data) {\n        const splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : null;\n        let options = data;\n\n        splittedOptionArrayPath?.forEach((path) => {\n            options = options[path];\n        });\n\n        return options ?? [];\n    }\n\n    /**\n     * Filters out drawn options from the response.\n     * @param {object | null} response The response to filter.\n     * @returns {object} The filtered response.\n     */\n    filterOutDrawnOptions(response) {\n        const splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : [];\n        let filteredResponse = structuredClone(response);\n\n        filteredResponse = this.recursiveUpdate(filteredResponse, splittedOptionArrayPath);\n        return filteredResponse;\n    }\n\n    /**\n     * Recursively updates the object based on the provided path to the property.\n     * @param {object | Array | null} object\n     * @param {Array<string> | null} pathToProperty\n     * @returns {object | Array | null}\n     */\n    recursiveUpdate = (object, pathToProperty) => {\n        if (pathToProperty.length === 0) {\n            if (Array.isArray(object)) {\n                return object.filter(\n                    (option) =>\n                        !this.loadedOptions.some(\n                            (loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n                        )\n                );\n            } else {\n                console.error('Expected an array but got:', object, pathToProperty);\n                return [];\n            }\n        }\n\n        const [currentPath, ...remainingPath] = pathToProperty;\n        if (remainingPath.length > 0) {\n            object[currentPath] = this.recursiveUpdate(object[currentPath], remainingPath);\n        } else {\n            object[currentPath] =\n                object[currentPath]?.filter(\n                    (option) =>\n                        !this.loadedOptions.some(\n                            (loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n                        )\n                ) ?? [];\n        }\n        return object;\n    };\n\n    /**\n     * Generates an HTML option element based on the provided item.\n     * @param {object} item The item to generate the option element for.\n     * @returns {HTMLElement} The generated option element.\n     */\n    htmlItem = (item) => {\n        let option = document.createElement('wje-option');\n\n        if (item[this.itemValue] === null || item[this.itemValue] === undefined) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemValue}`);\n        }\n\n        if (item[this.itemText] === null || item[this.itemText] === undefined) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemText}`);\n        }\n\n        option.setAttribute('value', item[this.itemValue] ?? '');\n        option.innerText = item[this.itemText] ?? '';\n\n        return option;\n    };\n\n    /**\n     * Fetches the pages from the provided URL.\n     * @param {number} page The page number to fetch.\n     * @returns {Promise<object>} The fetched data.\n     * @throws Will throw an error if the response is not ok.\n     */\n    async getPages(page) {\n        const response = await fetch(this.url);\n        if (!response.ok) {\n            throw new Error(`An error occurred: ${response.status}`);\n        }\n        return await response.json();\n    }\n\n    /**\n     * Finds the selected option data based on the given selected option values.\n     * @param {Array} selectedOptionValues The array of selected option values.\n     * @returns {Array} - The array of option data that matches the selected option values.\n     */\n    findSelectedOptionData(selectedOptionValues = []) {\n        return this.options.filter((option) => selectedOptionValues.includes(option[this.itemValue]));\n    }\n\n    /**\n     * Adds an option to the element.\n     * @param {object} optionData The data of the option to be added.\n     */\n    addOption(optionData) {\n        if (this.loadedOptions.some((option) => option[this.itemValue] === optionData[this.itemValue])) {\n            return;\n        }\n\n        this.prepend(this.htmlItem(optionData));\n        this.loadedOptions.push(optionData);\n    }\n\n    /**\n     * Adds options to the element.\n     * @param {Array} optionsData The array of option data to be added.\n     * @param {boolean} [silent] Whether to suppress events triggered by adding options.\n     */\n    addOptions(optionsData = [], silent = false) {\n        if (Array.isArray(optionsData)) optionsData?.forEach((od) => this.addOption(od, silent));\n        else this.addOption(optionsData, silent);\n    }\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.element.js';\nimport List from '../wje-list/list.element.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    /**\n     * Stores the loaded options.\n     * @type {Array}\n     * @private\n     */\n    #loadedOptions = [];\n\n    #drawPreloadedElements = []\n\n    /**\n     * Creates an instance of Options.\n     * @class\n     */\n    constructor() {\n        super();\n    }\n\n    dependencies = {\n        'wje-option': Option,\n        'wje-infinite-scroll': InfiniteScroll,\n        'wje-list': List,\n    };\n\n    className = 'Options';\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 ['search', 'attached'];\n    }\n\n    /**\n     * Sets the option array path attribute.\n     * @param {string} value The value to set for the option array path.\n     */\n    set optionArrayPath(value) {\n        this.setAttribute('option-array-path', value);\n    }\n\n    /**\n     * Gets the option array path attribute.\n     * @returns {string} The value of the option array path attribute or \"data\" if not set.\n     */\n    get optionArrayPath() {\n        return this.getAttribute('option-array-path');\n    }\n\n    /**\n     * Checks if the option array path attribute is present.\n     * @returns {boolean} True if the option array path attribute is present, false otherwise.\n     */\n    get hasOptionArrayPath() {\n        return this.hasAttribute('option-array-path');\n    }\n\n    /**\n     * Gets the dropdown height attribute.\n     * @returns {string} The value of the dropdown height attribute or \"100%\" if not set.\n     */\n    get dropdownHeight() {\n        return this.getAttribute('dropdown-height') || '100%';\n    }\n\n    /**\n     * Sets the dropdown height attribute.\n     * @param {string} value The value to set for the dropdown height.\n     */\n    set dropdownHeight(value) {\n        this.setAttribute('dropdown-height', value);\n    }\n\n    /**\n     * Sets the item value attribute.\n     * @param {string} value The value to set for the item value.\n     */\n    set itemValue(value) {\n        this.setAttribute('item-value', value);\n    }\n\n    /**\n     * Gets the item value attribute.\n     * @returns {string} The value of the item value attribute or \"value\" if not set.\n     */\n    get itemValue() {\n        return this.getAttribute('item-value') || 'value';\n    }\n\n    /**\n     * Sets the item text attribute.\n     * @param {string} value The value to set for the item text.\n     */\n    set itemText(value) {\n        this.setAttribute('item-text', value);\n    }\n\n    /**\n     * Gets the item text attribute.\n     * @returns {string} The value of the item text attribute or \"text\" if not set.\n     */\n    get itemText() {\n        return this.getAttribute('item-text') || 'text';\n    }\n\n    /**\n     * Gets the lazy load size attribute.\n     * @returns {number} The value of the lazy load size attribute or 10 if not set.\n     */\n    get lazyLoadSize() {\n        return this.getAttribute('lazy-load-size') || 10;\n    }\n\n    /**\n     * Sets the lazy load size attribute.\n     * @param {number} value The value to set for the lazy load size.\n     */\n    set lazyLoadSize(value) {\n        this.setAttribute('lazy-load-size', value);\n    }\n\n    /**\n     * Sets the search attribute.\n     * @param {string} value The value to set for the search.\n     */\n    set search(value) {\n        this.setAttribute('search', value);\n    }\n\n    /**\n     * Gets the search attribute.\n     * @returns {string} The value of the search attribute.\n     */\n    get search() {\n        return this.getAttribute('search');\n    }\n\n    /**\n     * Checks if the search attribute is present.\n     * @returns {boolean} True if the search attribute is present, false otherwise.\n     */\n    get hasSearch() {\n        return this.hasAttribute('search');\n    }\n\n    /**\n     * Retrieves the value of the 'search-to-query-params' attribute from the current instance.\n     * @returns {string | null} The value of the 'search-to-query-params' attribute, or null if the attribute is not set.\n     */\n    get searchToQueryParams() {\n        return this.getAttribute('search-to-query-params');\n    }\n\n    /**\n     * Sets the value to define search-to-query params behavior.\n     * @param {string} value The value to be set for the search-to-query-params attribute.\n     */\n    set searchToQueryParams(value) {\n        this.setAttribute('search-to-query-params', value);\n    }\n\n    /**\n     * Determines whether the 'search-to-query-params' attribute is present on the element.\n     * @returns {boolean} True if the 'search-to-query-params' attribute exists, otherwise false.\n     */\n    get hasSearchToQueryParams() {\n        return this.hasAttribute('search-to-query-params');\n    }\n\n    /**\n     * Sets the value of the search parameter name attribute.\n     * @param {string} value The string value to set as the search parameter name.\n     */\n    set searchParamName(value) {\n        this.setAttribute('search-param-name', value);\n    }\n\n    /**\n     * Gets the search parameter name used in queries.\n     * Retrieves the value of the 'search-param-name' attribute.\n     * If the attribute is not set, it defaults to 'search'.\n     * @returns {string} The search parameter name used for queries.\n     */\n    get searchParamName() {\n        return this.getAttribute('search-param-name') || 'search';\n    }\n    /**\n     * Checks if the lazy attribute is present.\n     * @returns {boolean} True if the lazy attribute is present, false otherwise.\n     */\n    get lazy() {\n        return this.hasAttribute('lazy');\n    }\n\n    /**\n     * Sets the lazy attribute.\n     * @param {boolean} value The value to set for the lazy attribute.\n     */\n    set lazy(value) {\n        this.setAttribute('lazy', value);\n    }\n\n    /**\n     * Gets the loaded options.\n     * @returns {Array} The loaded options.\n     */\n    get options() {\n        return this.loadedOptions?.flat();\n    }\n\n    /**\n     * Gets the loaded options.\n     * @type {Array}\n     */\n    get loadedOptions() {\n        return this.#loadedOptions;\n    }\n\n    /**\n     * Sets the loaded options.\n     * @type {Array}\n     */\n    set loadedOptions(loadedOptions) {\n        this.#loadedOptions = loadedOptions;\n    }\n\n    /**\n     * Array of preloaded elements.\n     * @type {Array}\n     * @private\n     */\n    get drawPreloadedElements() {\n        return this.#drawPreloadedElements;\n    }\n\n    set drawPreloadedElements(elements) {\n        this.#drawPreloadedElements = elements;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Prepares the component before drawing.\n     * Fetches the pages and creates the options elements.\n     */\n    afterDraw() {\n        // event.dispatchCustomEvent(this, 'wje-options:load', {}); // nepomohlo to, v ff stale je scroll hore\n    }\n\n    /**\n     * Draws the component.\n     * @returns {DocumentFragment}\n     */\n    async draw() {\n        let fragment = document.createDocumentFragment();\n\n        const slot = document.createElement('slot');\n        fragment.appendChild(slot);\n\n        if (this.hasAttribute('lazy')) {\n\n            if (this.contains(this.infiniteScroll)) {\n                this.drawPreloadedElements.forEach((el) => { el.remove() });\n                this.loadedOptions = [];\n                this.infiniteScroll.placementObj.innerHTML = '';\n                this.infiniteScroll.totalPages = 0;\n                this.infiniteScroll.refresh();\n\n                return fragment;\n            }\n\n            const infiniteScroll = document.createElement('wje-infinite-scroll');\n            infiniteScroll.setAttribute('placement', 'wje-list');\n            infiniteScroll.setAttribute('height', this.dropdownHeight);\n            infiniteScroll.setAttribute('object-name', this.optionArrayPath);\n\n            const list = document.createElement('wje-list');\n            infiniteScroll.append(list);\n\n            infiniteScroll.dataToHtml = this.htmlItem;\n\n            infiniteScroll.setCustomData = async (page, signal) => {\n                let processedUrl = `${this.url}${this.search ? `/${this.search}` : ''}?page=${page}&size=${this.lazyLoadSize}`;\n\n                if (this.hasSearchToQueryParams) {\n                    processedUrl = `${this.url}?page=${page}&size=${this.lazyLoadSize}${this.search ? `&${this.searchParamName}=${this.search}` : ''}`;\n                }\n\n                let res = await this.service.get(processedUrl, null, false, signal);\n                const filteredOptions = this.filterOutDrawnOptions(res);\n                this.loadedOptions.push(...this.processData(filteredOptions));\n\n                return filteredOptions;\n            };\n\n            event.addListener(infiniteScroll, 'wje-infinite-scroll:load', null, (e) => {\n                event.dispatchCustomEvent(this, 'wje-options:load', {});\n            });\n\n            if (this.hasAttribute('attached')) {\n                this.appendChild(infiniteScroll);\n                this.drawPreloadedElements.forEach((el) => {\n                    list.appendChild(el);\n                })\n            }\n\n            this.infiniteScroll = infiniteScroll;\n\n        } else {\n            this.response = await this.getPages();\n            let optionsData = this.filterOutDrawnOptions(this.response);\n            optionsData = this.processData(optionsData);\n\n            this.loadedOptions.push(...optionsData);\n\n            this.append(...optionsData.map(this.htmlItem));\n        }\n\n        return fragment;\n    }\n\n    /**\n     * Processes the given data and returns the options based on the option array path.\n     * @param {any} data The data to be processed.\n     * @returns {any} - The options based on the option array path.\n     */\n    processData(data) {\n        const splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : null;\n        let options = data;\n\n        splittedOptionArrayPath?.forEach((path) => {\n            options = options[path];\n        });\n\n        return options ?? [];\n    }\n\n    /**\n     * Filters out drawn options from the response.\n     * @param {object | null} response The response to filter.\n     * @returns {object} The filtered response.\n     */\n    filterOutDrawnOptions(response) {\n        const splittedOptionArrayPath = this.optionArrayPath ? this.optionArrayPath?.split('.') : [];\n        let filteredResponse = structuredClone(response);\n\n        filteredResponse = this.recursiveUpdate(filteredResponse, splittedOptionArrayPath);\n        return filteredResponse;\n    }\n\n    /**\n     * Recursively updates the object based on the provided path to the property.\n     * @param {object | Array | null} object\n     * @param {Array<string> | null} pathToProperty\n     * @returns {object | Array | null}\n     */\n    recursiveUpdate = (object, pathToProperty) => {\n        if (pathToProperty.length === 0) {\n            if (Array.isArray(object)) {\n                return object.filter(\n                    (option) =>\n                        !this.loadedOptions.some(\n                            (loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n                        )\n                );\n            } else {\n                console.error('Expected an array but got:', object, pathToProperty);\n                return [];\n            }\n        }\n\n        const [currentPath, ...remainingPath] = pathToProperty;\n        if (remainingPath.length > 0) {\n            object[currentPath] = this.recursiveUpdate(object[currentPath], remainingPath);\n        } else {\n            object[currentPath] =\n                object[currentPath]?.filter(\n                    (option) =>\n                        !this.loadedOptions.some(\n                            (loadedOption) => loadedOption[this.itemValue] === option[this.itemValue]\n                        )\n                ) ?? [];\n        }\n        return object;\n    };\n\n    /**\n     * Generates an HTML option element based on the provided item.\n     * @param {object} item The item to generate the option element for.\n     * @returns {HTMLElement} The generated option element.\n     */\n    htmlItem = (item) => {\n        let option = document.createElement('wje-option');\n\n        if (item[this.itemValue] === null || item[this.itemValue] === undefined) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemValue}`);\n        }\n\n        if (item[this.itemText] === null || item[this.itemText] === undefined) {\n            console.warn(`The item ${JSON.stringify(item)} does not have the property ${this.itemText}`);\n        }\n\n        option.setAttribute('value', item[this.itemValue] ?? '');\n        option.innerText = item[this.itemText] ?? '';\n\n        return option;\n    };\n\n    /**\n     * Fetches the pages from the provided URL.\n     * @param {number} page The page number to fetch.\n     * @returns {Promise<object>} The fetched data.\n     * @throws Will throw an error if the response is not ok.\n     */\n    async getPages(page) {\n        const response = await fetch(this.url);\n        if (!response.ok) {\n            throw new Error(`An error occurred: ${response.status}`);\n        }\n        return await response.json();\n    }\n\n    /**\n     * Finds the selected option data based on the given selected option values.\n     * @param {Array} selectedOptionValues The array of selected option values.\n     * @returns {Array} - The array of option data that matches the selected option values.\n     */\n    findSelectedOptionData(selectedOptionValues = []) {\n        return this.options.filter((option) => selectedOptionValues.includes(option[this.itemValue]));\n    }\n\n    /**\n     * Adds an option to the element.\n     * @param {object} optionData The data of the option to be added.\n     */\n    addOption(optionData) {\n        if (this.loadedOptions.some((option) => option[this.itemValue] === optionData[this.itemValue])) {\n            return;\n        }\n\n        const item = this.htmlItem(optionData);\n        this.#drawPreloadedElements.push(item);\n        this.prepend(item);\n        this.loadedOptions.push(optionData);\n    }\n\n    /**\n     * Adds options to the element.\n     * @param {Array} optionsData The array of option data to be added.\n     * @param {boolean} [silent] Whether to suppress events triggered by adding options.\n     */\n    addOptions(optionsData = [], silent = false) {\n        if (Array.isArray(optionsData)) optionsData?.forEach((od) => this.addOption(od, silent));\n        else this.addOption(optionsData, silent);\n    }\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-radio-group.js

@@ -129,11 +129,9 @@ class RadioGroup extends WJElement {
    * Adds event listeners after the component is drawn. Handles the selection of radio buttons.
    */
   afterDraw() {
-    this.checkRadio(this.value);
+    console.log("BINDING GROUP");
     this.addEventListener("wje-radio:input", (e) => {
-      if (this.checkRadio(e.detail.context.value)) {
-        this.value = e.detail.context.value;
-      }
+      this.value = e.detail.context.value;
     });
   }
   /**
@@ -156,14 +154,16 @@ class RadioGroup extends WJElement {
    * Sets the given radio button to checked.
    */
   checkRadio(value) {
-    this.removeCheck();
-    const radio = this.getRadioByValue(value);
-    if (radio) {
-      radio.checked = true;
-      return true;
-    }
-    console.error(`Radio with value ${value} not found`);
-    return false;
+    let foundRadio = false;
+    this.getAllElements().forEach((el) => {
+      if (el instanceof Radio) {
+        el.checked = el.value === value;
+        if (el.checked) {
+          foundRadio = true;
+        }
+      }
+    });
+    return foundRadio;
   }
   /**
    * Retrieves all direct child elements of the current element.
@@ -172,6 +172,16 @@ class RadioGroup extends WJElement {
   getAllElements() {
     return Array.from(this.children);
   }
+  /**
+   * @summary Callback function that is called when the custom element is associated with a form.
+   * This function adds an event listener to the form's submit event, which validates the input and propagates the validation.
+   * @param {HTMLFormElement} form The form the custom element is associated with.
+   */
+  formAssociatedCallback(form) {
+    if (form) {
+      this.internals.setFormValue(this.value);
+    }
+  }
   /**
    * The formResetCallback method is a built-in lifecycle callback that gets called when a form gets reset.
    * This method is responsible for resetting the value of the custom input element to its default value.

package/dist/wje-radio-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-radio-group.js","sources":["../packages/wje-radio-group/radio-group.element.js","../packages/wje-radio-group/radio-group.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport Radio from '../wje-radio/radio.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `RadioGroup` is a custom web component that represents a group of radio buttons.\n * @summary This element represents a group of radio buttons.\n * @documentation https://elements.webjet.sk/components/radio-group\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the radio group.\n * @tag wje-radio-group\n */\n\nexport default class RadioGroup extends WJElement {\n    /**\n     * Creates an instance of RadioGroup.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this.internals = this.attachInternals();\n    }\n\n    className = 'RadioGroup';\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     * Whether the input is associated with a form.\n     * @type {boolean}\n     */\n    static formAssociated = true;\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        if (this.checkRadio(value)) {\n            this.setAttribute('value', value);\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.getAttribute('value');\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 up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the radio group.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-radio-group', this.hasAttribute('inline') ? 'wje-inline' : 'ddd');\n\n        let slot = document.createElement('slot');\n\n        let label = document.createElement('label');\n        label.innerText = this.label;\n        if (this.value && !this.hasAttribute('error')) label.classList.add('fade');\n\n        if (this.label) {\n            native.appendChild(label);\n        }\n\n        native.appendChild(slot);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Adds event listeners after the component is drawn. Handles the selection of radio buttons.\n     */\n    afterDraw() {\n        this.checkRadio(this.value);\n\n        this.addEventListener('wje-radio:input', (e) => {\n            if (this.checkRadio(e.detail.context.value)) {\n                this.value = e.detail.context.value;\n            }\n        });\n    }\n\n    /**\n     * Returns the radio button with the given value.\n     * @param {string} value The value of the radio button.\n     * @returns {Radio} The radio button.\n     */\n    getRadioByValue(value) {\n        return this.getAllElements().find((el) => el instanceof Radio && el.value === value);\n    }\n\n    /**\n     * Removes the check from all radio buttons.\n     */\n    removeCheck() {\n        this.getAllElements().forEach((el) => {\n            if (el instanceof Radio) el.checked = false;\n        });\n    }\n\n    /**\n     * Sets the given radio button to checked.\n     */\n    checkRadio(value) {\n        this.removeCheck();\n\n        const radio = this.getRadioByValue(value);\n        if (radio) {\n            radio.checked = true;\n            return true;\n        }\n\n        console.error(`Radio with value ${value} not found`);\n        return false;\n    }\n\n    /**\n     * Retrieves all direct child elements of the current element.\n     * @returns {HTMLElement[]} An array of child elements.\n     */\n    getAllElements() {\n        return Array.from(this.children);\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 RadioGroup from './radio-group.element.js';\n\nexport default RadioGroup;\n\nRadioGroup.define('wje-radio-group', RadioGroup);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-radio-group.js","sources":["../packages/wje-radio-group/radio-group.element.js","../packages/wje-radio-group/radio-group.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport Radio from '../wje-radio/radio.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `RadioGroup` is a custom web component that represents a group of radio buttons.\n * @summary This element represents a group of radio buttons.\n * @documentation https://elements.webjet.sk/components/radio-group\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the radio group.\n * @tag wje-radio-group\n */\n\nexport default class RadioGroup extends WJElement {\n    /**\n     * Creates an instance of RadioGroup.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this.internals = this.attachInternals();\n    }\n\n    className = 'RadioGroup';\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     * Whether the input is associated with a form.\n     * @type {boolean}\n     */\n    static formAssociated = true;\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        if (this.checkRadio(value)) {\n            this.setAttribute('value', value);\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.getAttribute('value');\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 up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the radio group.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-radio-group', this.hasAttribute('inline') ? 'wje-inline' : 'ddd');\n\n        let slot = document.createElement('slot');\n\n        let label = document.createElement('label');\n        label.innerText = this.label;\n        if (this.value && !this.hasAttribute('error')) label.classList.add('fade');\n\n        if (this.label) {\n            native.appendChild(label);\n        }\n\n        native.appendChild(slot);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Adds event listeners after the component is drawn. Handles the selection of radio buttons.\n     */\n    afterDraw() {\n        console.log(\"BINDING GROUP\")\n        this.addEventListener('wje-radio:input', (e) => {\n            this.value = e.detail.context.value;\n        });\n    }\n\n    /**\n     * Returns the radio button with the given value.\n     * @param {string} value The value of the radio button.\n     * @returns {Radio} The radio button.\n     */\n    getRadioByValue(value) {\n        return this.getAllElements().find((el) => el instanceof Radio && el.value === value);\n    }\n\n    /**\n     * Removes the check from all radio buttons.\n     */\n    removeCheck() {\n        this.getAllElements().forEach((el) => {\n            if (el instanceof Radio) el.checked = false;\n        });\n    }\n\n    /**\n     * Sets the given radio button to checked.\n     */\n    checkRadio(value) {\n        let foundRadio = false\n        this.getAllElements().forEach((el) => {\n            if (el instanceof Radio) {\n                el.checked = el.value === value;\n                if (el.checked) {\n                    foundRadio = true\n                }\n            }\n        });\n\n        return foundRadio\n    }\n\n    /**\n     * Retrieves all direct child elements of the current element.\n     * @returns {HTMLElement[]} An array of child elements.\n     */\n    getAllElements() {\n        return Array.from(this.children);\n    }\n\n    /**\n     * @summary Callback function that is called when the custom element is associated with a form.\n     * This function adds an event listener to the form's submit event, which validates the input and propagates the validation.\n     * @param {HTMLFormElement} form The form the custom element is associated with.\n     */\n    formAssociatedCallback(form) {\n        if (form) {\n            this.internals.setFormValue(this.value);\n        }\n    }\n\n    /**\n     * The formResetCallback method is a built-in lifecycle callback that gets called when a form gets reset.\n     * This method is responsible for resetting the value of the custom input element to its default value.\n     * It also resets the form value and validity state in the form internals.\n     * @function\n     */\n    formResetCallback() {\n        // Set the value of the custom input element to its default value\n        this.value = this.defaultValue;\n        // Reset the form value in the form internals to the default value\n        this.internals.setFormValue(this.defaultValue);\n        // Reset the validity state in the form internals\n        this.internals.setValidity({});\n    }\n\n    /**\n     * The formStateRestoreCallback method is a built-in lifecycle callback that gets called when the state of a form-associated custom element is restored.\n     * This method is responsible for restoring the value of the custom input element to its saved state.\n     * It also restores the form value and validity state in the form internals to their saved states.\n     * @param {object} state The saved state of the custom input element.\n     * @function\n     */\n    formStateRestoreCallback(state) {\n        // Set the value of the custom input element to its saved value\n        this.value = state.value;\n        // Restore the form value in the form internals to the saved value\n        this.internals.setFormValue(state.value);\n        // Restore the validity state in the form internals to the saved state\n        this.internals.setValidity({});\n    }\n\n    /**\n     * The formStateSaveCallback method is a built-in lifecycle callback that gets called when the state of a form-associated custom element is saved.\n     * This method is responsible for saving the value of the custom input element.\n     * @returns {object} The saved state of the custom input element.\n     * @function\n     */\n    formStateSaveCallback() {\n        return {\n            value: this.value,\n        };\n    }\n\n    /**\n     * The formDisabledCallback method is a built-in lifecycle callback that gets called when the disabled state of a form-associated custom element changes.\n     * This method is not implemented yet.\n     * @param {boolean} disabled The new disabled state of the custom input element.\n     * @function\n     */\n    formDisabledCallback(disabled) {\n        console.warn('formDisabledCallback not implemented yet');\n    }\n}\n","import RadioGroup from './radio-group.element.js';\n\nexport default RadioGroup;\n\nRadioGroup.define('wje-radio-group', RadioGroup);\n"],"names":[],"mappings":"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"}

package/dist/wje-radio.js

@@ -29,8 +29,7 @@ class Radio extends WJElement {
    */
   set checked(value) {
     this._checked = value;
-    if (value) this.setAttribute("checked", "");
-    else this.removeAttribute("checked");
+    this.toggleAttribute("checked", value);
   }
   /**
    * Gets the checked property of the radio button.
@@ -71,12 +70,12 @@ class Radio extends WJElement {
     if (this.color) native.classList.add(this.color);
     this.input = document.createElement("input");
     this.input.type = "radio";
-    this.input.id = "radio";
-    this.input.name = this.name + "-radio";
+    this.input.id = this.value + "-radio";
+    this.input.name = this.value + "-radio";
     this.input.checked = this.hasAttribute("checked");
     this.input.disabled = this.hasAttribute("disabled");
     let label = document.createElement("label");
-    label.htmlFor = "radio";
+    label.htmlFor = this.value + "-radio";
     label.innerHTML = "<slot></slot>";
     native.appendChild(this.input);
     native.appendChild(label);
@@ -88,8 +87,8 @@ class Radio extends WJElement {
    */
   afterDraw() {
     if (!this.hasAttribute("disabled")) {
-      event.addListener(this, "click", "wje-radio:change");
-      event.addListener(this, "click", "wje-radio:input");
+      event.addListener(this, "change", "wje-radio:change");
+      event.addListener(this, "input", "wje-radio:input");
     }
   }
   /**

package/dist/wje-radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-radio.js","sources":["../packages/wje-radio/radio.element.js","../packages/wje-radio/radio.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 Radio button element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/radio\n * @status stable\n * @augments WJElement\n * @slot - Default slot for the radio button label content.\n * @csspart native-radio - The native wrapper for the radio button.\n * @cssproperty [--wje-radio-margin-inline=0] - Specifies the horizontal (left and right) margin for the radio button. Accepts any valid CSS length unit (e.g., `px`, `rem`, `%`) to control spacing on both sides of the component.\n * @cssproperty [--wje-radio-margin-top=0] - Defines the top margin for the radio button. Accepts any valid CSS length value to adjust vertical spacing above the component.\n * @cssproperty [--wje-radio-margin-bottom=0] - Sets the bottom margin for the radio button. Accepts any valid CSS length value to adjust vertical spacing below the component.\n * // @fires wje-radio:change - Dispatched when the radio button's state changes.\n * // @fires wje-radio:input - Dispatched when the radio button is interacted with.\n */\n\nexport default class Radio extends WJElement {\n    /**\n     * Creates an instance of Radio.\n     */\n    constructor() {\n        super();\n\n        this._checked = false;\n    }\n\n    /**\n     * Sets the name of the radio button.\n     * @param value\n     */\n    set checked(value) {\n        this._checked = value;\n\n        if (value) this.setAttribute('checked', '');\n        else this.removeAttribute('checked');\n    }\n\n    /**\n     * Gets the checked property of the radio button.\n     * @returns {boolean}\n     */\n    get checked() {\n        return this._checked;\n    }\n\n    /**\n     * Sets the color of the radio button.\n     * @type {string}\n     */\n    className = 'Radio';\n\n    /**\n     * Returns the CSS styles for the component.\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 ['checked'];\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the radio button.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-radio');\n\n        if (this.color) native.classList.add(this.color);\n\n        this.input = document.createElement('input');\n        this.input.type = 'radio';\n        this.input.id = 'radio';\n        this.input.name = this.name + '-radio';\n        this.input.checked = this.hasAttribute('checked');\n        this.input.disabled = this.hasAttribute('disabled');\n\n        let label = document.createElement('label');\n        label.htmlFor = 'radio';\n        label.innerHTML = '<slot></slot>';\n\n        native.appendChild(this.input);\n        native.appendChild(label);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Sets up the event listeners for the component.\n     */\n    afterDraw() {\n        if (!this.hasAttribute('disabled')) {\n            event.addListener(this, 'click', 'wje-radio:change');\n            event.addListener(this, 'click', 'wje-radio:input');\n        }\n    }\n\n    /**\n     * Called when an attribute changes.\n     * @param {object} e\n     */\n    inputEvent = (e) => {\n        this.checked = e.target.checked;\n    };\n\n    /**\n     * Toggles the radio button.\n     */\n    beforeDisconnect() {\n        event.removeElement(this);\n    }\n}\n","import Radio from './radio.element.js';\n\nexport default Radio;\n\nRadio.define('wje-radio', Radio);\n"],"names":[],"mappings":";;;;;AAiBe,MAAM,cAAc,UAAU;AAAA;AAAA;AAAA;AAAA,EAIzC,cAAc;AACV,UAAO;AA4BX;AAAA;AAAA;AAAA;AAAA,qCAAY;AAuEZ;AAAA;AAAA;AAAA;AAAA,sCAAa,CAAC,MAAM;AAChB,WAAK,UAAU,EAAE,OAAO;AAAA,IAC3B;AAnGG,SAAK,WAAW;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ,OAAO;AACf,SAAK,WAAW;AAEhB,QAAI,MAAO,MAAK,aAAa,WAAW,EAAE;AAAA,QACrC,MAAK,gBAAgB,SAAS;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU;AACV,WAAO,KAAK;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA,EAYI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,WAAW,qBAAqB;AAC5B,WAAO,CAAC,SAAS;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,UAAU,IAAI,cAAc;AAEnC,QAAI,KAAK,MAAO,QAAO,UAAU,IAAI,KAAK,KAAK;AAE/C,SAAK,QAAQ,SAAS,cAAc,OAAO;AAC3C,SAAK,MAAM,OAAO;AAClB,SAAK,MAAM,KAAK;AAChB,SAAK,MAAM,OAAO,KAAK,OAAO;AAC9B,SAAK,MAAM,UAAU,KAAK,aAAa,SAAS;AAChD,SAAK,MAAM,WAAW,KAAK,aAAa,UAAU;AAElD,QAAI,QAAQ,SAAS,cAAc,OAAO;AAC1C,UAAM,UAAU;AAChB,UAAM,YAAY;AAElB,WAAO,YAAY,KAAK,KAAK;AAC7B,WAAO,YAAY,KAAK;AAExB,aAAS,YAAY,MAAM;AAE3B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,QAAI,CAAC,KAAK,aAAa,UAAU,GAAG;AAChC,YAAM,YAAY,MAAM,SAAS,kBAAkB;AACnD,YAAM,YAAY,MAAM,SAAS,iBAAiB;AAAA,IAC9D;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAaI,mBAAmB;AACf,UAAM,cAAc,IAAI;AAAA,EAChC;AACA;AC/HA,MAAM,OAAO,aAAa,KAAK;"}
+{"version":3,"file":"wje-radio.js","sources":["../packages/wje-radio/radio.element.js","../packages/wje-radio/radio.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 Radio button element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/radio\n * @status stable\n * @augments WJElement\n * @slot - Default slot for the radio button label content.\n * @csspart native-radio - The native wrapper for the radio button.\n * @cssproperty [--wje-radio-margin-inline=0] - Specifies the horizontal (left and right) margin for the radio button. Accepts any valid CSS length unit (e.g., `px`, `rem`, `%`) to control spacing on both sides of the component.\n * @cssproperty [--wje-radio-margin-top=0] - Defines the top margin for the radio button. Accepts any valid CSS length value to adjust vertical spacing above the component.\n * @cssproperty [--wje-radio-margin-bottom=0] - Sets the bottom margin for the radio button. Accepts any valid CSS length value to adjust vertical spacing below the component.\n * // @fires wje-radio:change - Dispatched when the radio button's state changes.\n * // @fires wje-radio:input - Dispatched when the radio button is interacted with.\n */\n\nexport default class Radio extends WJElement {\n    /**\n     * Creates an instance of Radio.\n     */\n    constructor() {\n        super();\n\n        this._checked = false;\n    }\n\n    /**\n     * Sets the name of the radio button.\n     * @param value\n     */\n    set checked(value) {\n        this._checked = value;\n        this.toggleAttribute('checked', value);\n    }\n\n    /**\n     * Gets the checked property of the radio button.\n     * @returns {boolean}\n     */\n    get checked() {\n        return this._checked;\n    }\n\n    /**\n     * Sets the color of the radio button.\n     * @type {string}\n     */\n    className = 'Radio';\n\n    /**\n     * Returns the CSS styles for the component.\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 ['checked'];\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the radio button.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-radio');\n\n        if (this.color) native.classList.add(this.color);\n\n        this.input = document.createElement('input');\n        this.input.type = 'radio';\n        this.input.id = this.value + '-radio';\n        this.input.name = this.value + '-radio';\n        this.input.checked = this.hasAttribute('checked');\n        this.input.disabled = this.hasAttribute('disabled');\n\n        let label = document.createElement('label');\n        label.htmlFor = this.value + '-radio';\n        label.innerHTML = '<slot></slot>';\n\n        native.appendChild(this.input);\n        native.appendChild(label);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Sets up the event listeners for the component.\n     */\n    afterDraw() {\n        if (!this.hasAttribute('disabled')) {\n            event.addListener(this, 'change', 'wje-radio:change');\n            event.addListener(this, 'input', 'wje-radio:input');\n        }\n    }\n\n    /**\n     * Called when an attribute changes.\n     * @param {object} e\n     */\n    inputEvent = (e) => {\n        this.checked = e.target.checked;\n    };\n\n    /**\n     * Toggles the radio button.\n     */\n    beforeDisconnect() {\n        event.removeElement(this);\n    }\n}\n","import Radio from './radio.element.js';\n\nexport default Radio;\n\nRadio.define('wje-radio', Radio);\n"],"names":[],"mappings":";;;;;AAiBe,MAAM,cAAc,UAAU;AAAA;AAAA;AAAA;AAAA,EAIzC,cAAc;AACV,UAAO;AA0BX;AAAA;AAAA;AAAA;AAAA,qCAAY;AAuEZ;AAAA;AAAA;AAAA;AAAA,sCAAa,CAAC,MAAM;AAChB,WAAK,UAAU,EAAE,OAAO;AAAA,IAC3B;AAjGG,SAAK,WAAW;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ,OAAO;AACf,SAAK,WAAW;AAChB,SAAK,gBAAgB,WAAW,KAAK;AAAA,EAC7C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU;AACV,WAAO,KAAK;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA,EAYI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,WAAW,qBAAqB;AAC5B,WAAO,CAAC,SAAS;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,UAAU,IAAI,cAAc;AAEnC,QAAI,KAAK,MAAO,QAAO,UAAU,IAAI,KAAK,KAAK;AAE/C,SAAK,QAAQ,SAAS,cAAc,OAAO;AAC3C,SAAK,MAAM,OAAO;AAClB,SAAK,MAAM,KAAK,KAAK,QAAQ;AAC7B,SAAK,MAAM,OAAO,KAAK,QAAQ;AAC/B,SAAK,MAAM,UAAU,KAAK,aAAa,SAAS;AAChD,SAAK,MAAM,WAAW,KAAK,aAAa,UAAU;AAElD,QAAI,QAAQ,SAAS,cAAc,OAAO;AAC1C,UAAM,UAAU,KAAK,QAAQ;AAC7B,UAAM,YAAY;AAElB,WAAO,YAAY,KAAK,KAAK;AAC7B,WAAO,YAAY,KAAK;AAExB,aAAS,YAAY,MAAM;AAE3B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,QAAI,CAAC,KAAK,aAAa,UAAU,GAAG;AAChC,YAAM,YAAY,MAAM,UAAU,kBAAkB;AACpD,YAAM,YAAY,MAAM,SAAS,iBAAiB;AAAA,IAC9D;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAaI,mBAAmB;AACf,UAAM,cAAc,IAAI;AAAA,EAChC;AACA;AC7HA,MAAM,OAAO,aAAa,KAAK;"}