npm - wj-elements - Versions diffs - 0.1.240 → 0.1.241 - Mend

wj-elements 0.1.240 → 0.1.241

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/dist/wje-dropdown.js CHANGED Viewed

@@ -41,7 +41,7 @@ class Dropdown extends WJElement {
       }
     });
     __publicField(this, "popupHideCallback", (e) => {
-      if (this.classList.contains("active")) {
+      if (this.classList.contains("active") && e.target.tagName === "WJE-DROPDOWN") {
         this.toggleCallback(e);
       }
     });

package/dist/wje-dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"wje-dropdown.js","sources":["../packages/wje-dropdown/dropdown.element.js","../packages/wje-dropdown/dropdown.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Popup from '../wje-popup/popup.element.js';\n\n/*\n `Dropdown` is a custom element that displays a dropdown menu.\n * @summary This element represents a dropdown menu.\n * @documentation https://elements.webjet.sk/components/dropdown\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the dropdown.\n * @slot trigger - The slot for the trigger of the dropdown.\n * @slot - The default slot for the dropdown.\n * // @fires wje-dropdown:open - Event fired when the dropdown is opened.\n * // @fires wje-dropdown:close - Event fired when the dropdown is closed.\n * @tag wje-dropdown\n /\nexport default class Dropdown extends WJElement {\n /\n Creates an instance of Dropdown.\n * @class\n /\n constructor() {\n super();\n }\n\n /\n The placement of the dropdown.\n * @type {{\"wje-popup\": Popup}}\n /\n dependencies = {\n 'wje-popup': Popup,\n };\n\n /\n Sets or removes the 'portaled' attribute on the element.\n * When the value is truthy, the attribute 'portaled' is added to the element.\n * When the value is falsy, the attribute 'portaled' is removed from the element.\n * @param {boolean} value Determines whether to add or remove the 'portaled' attribute.\n /\n set portaled(value) {\n if (value) {\n this.setAttribute('portaled', value);\n } else {\n this.removeAttribute('portaled');\n }\n }\n\n /\n Getter method for the `portaled` property.\n * Checks if the `portaled` attribute is present on the element.\n * @returns {boolean} Returns `true` if the `portaled` attribute exists, otherwise `false`.\n /\n get portaled() {\n return this.getAttribute('portaled') \|\| '';\n }\n\n /\n Checks whether the element has the 'portaled' attribute.\n * @returns {boolean} True if the element has the 'portaled' attribute, otherwise false.\n /\n get isPortaled() {\n return this.hasAttribute('portaled');\n }\n\n /\n Sets the placement of the dropdown.\n * @param value\n /\n set trigger(value) {\n this.setAttribute('trigger', value);\n }\n\n /\n Gets the placement of the dropdown.\n * @returns {string\|string}\n /\n get trigger() {\n return this.getAttribute('trigger') \|\| 'click';\n }\n\n /\n Sets the placement of the dropdown.\n * @type {string}\n /\n className = 'Dropdown';\n\n /\n Getter for the CSS stylesheet.\n * @returns {string[]}\n /\n static get observedAttributes() {\n return ['active'];\n }\n\n /\n Callback function to handle other dropdowns being opened. Close the dropdown if it is not the target and collapse is enabled.\n * @param {Event} e The event object.\n /\n otherDropdownOpennedCallback = (e) => {\n if (e.detail.detail.target !== this) {\n this.classList.remove('active');\n this.popup.hide();\n }\n };\n\n /\n Sets up the attributes for the dropdown.\n /\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /\n Removes the popup element.\n /\n beforeDraw() {\n this.popup?.remove();\n this.popup = null;\n }\n\n /\n Draws the dropdown element and returns the created document fragment.\n * @returns {DocumentFragment}\n /\n draw() {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('wje-placement', 'wje-' + this.placement \|\| 'wje-start');\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-dropdown');\n\n let tooltip = document.createElement('wje-tooltip');\n tooltip.setAttribute('content', this.tooltip);\n\n let anchorSlot = document.createElement('slot');\n anchorSlot.setAttribute('name', 'trigger');\n anchorSlot.setAttribute('slot', 'anchor');\n\n let slot = document.createElement('slot');\n\n let popup = document.createElement('wje-popup');\n popup.setAttribute('placement', this.placement);\n popup.setAttribute('offset', this.offset);\n popup.setAttribute('part', 'popup');\n\n if(this.isPortaled)\n popup.setAttribute('portal', this.portaled);\n\n popup.append(anchorSlot, slot);\n\n // if(this.trigger === \"click\")\n popup.setAttribute('manual', '');\n\n native.appendChild(popup);\n\n fragment.appendChild(native);\n\n this.popup = popup;\n this.anchorSlot = anchorSlot;\n\n return fragment;\n }\n\n /\n Adds event listeners for the mouseenter and mouseleave events.\n /\n afterDraw() {\n event.addListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n\n // Close when any actionable wje-menu-item inside the popup is clicked (works across Shadow DOM via composed path)\n event.addListener(this.popup, 'click', null, this.onMenuItemClick, { capture: true });\n\n if (this.trigger !== 'click') {\n event.addListener(this, 'mouseenter', null, this.onOpen);\n event.addListener(this, 'mouseleave', null, this.onClose);\n } else {\n event.addListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n }\n\n if (this.hasAttribute('collapsible')) {\n event.addListener(\n Array.from(this.querySelectorAll('wje-menu-item')),\n 'click',\n 'wje-menu-item:click',\n this.onClose\n );\n }\n }\n\n /\n Adds event listeners for the mouseenter and mouseleave events.\n /\n afterDisconnect() {\n event.removeListener(this, 'mouseenter', null, this.onOpen);\n event.removeListener(this, 'mouseleave', null, this.onClose);\n event.removeListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n event.removeListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n event.removeListener(this.popup, 'click', null, this.onMenuItemClick, { capture: true });\n event.removeListener(document, 'wje-menu-item:click', null, this.#onMenuItemCustom, false);\n }\n\n popupHideCallback = (e) => {\n if (this.classList.contains('active')) {\n this.toggleCallback(e);\n }\n };\n\n /\n Handles delegated clicks from inside the popup and closes the dropdown when a leaf menu item is selected.\n * This works even when the menu is portaled, because we rely on the composed path.\n /\n onMenuItemClick = (e) => {\n // Find nearest wje-menu-item in the composed path\n const path = typeof e.composedPath === 'function' ? e.composedPath() : [];\n const item = path.find((n) => n && n.tagName === 'WJE-MENU-ITEM');\n if (!item) return;\n\n // Ignore disabled items\n if (item.hasAttribute('disabled') \|\| item.getAttribute('aria-disabled') === 'true') return;\n\n // If this item contains a nested submenu (wje-menu), it's not a leaf -> don't close yet\n if (typeof item.querySelector === 'function' && item.querySelector('wje-menu')) return;\n\n // Leaf item selected -> close dropdown (which calls popup.hide(true) inside onClose)\n this.onClose();\n }\n\n /\n @summary Toggles the dropdown element between active and inactive states.\n * Calls the `onOpen` method if the element is currently inactive,\n * and calls the `onClose` method if the element is currently active.\n * @param {Event} e The event object.\n /\n toggleCallback = (e) => {\n if (this.classList.contains('active')) {\n e.stopPropagation();\n this.onClose();\n } else {\n e.stopPropagation();\n this.onOpen(e);\n }\n };\n\n /\n @summary Returns the content to be displayed before showing the dropdown.\n * @returns {any} The content to be displayed.\n /\n beforeShow() {\n return this.content;\n }\n\n /\n This method is called after the dropdown is shown.\n /\n afterShow() {\n // Do nothing\n }\n\n /\n Open the popup element.\n * @param {object} e\n */\n onOpen = (e) => {\n this.classList.add('active');\n Promise.resolve(this.beforeShow(this))\n .then((res) => {\n if (!this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.show(true); // Show tooltip\n\n event.addListener(document, 'wje-menu-item:click', null, this.#onMenuItemCustom, false);\n\n event.dispatchCustomEvent(this, 'wje-dropdown:open', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterShow(this));\n })\n .catch((error) => {\n // ak je nejaka chyba tak to len zatvorime\n this.classList.remove('active');\n this.popup.hide(true);\n });\n };\n\n beforeClose = () => {\n // Do nothing\n };\n\n afterClose = () => {\n // Do nothing\n };\n\n onClose = () => {\n this.classList.remove('active');\n Promise.resolve(this.beforeClose(this))\n .then((res) => {\n if (this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.hide(true); // Show tooltip\n\n event.removeListener(document, 'wje-menu-item:click', null, this.#onMenuItemCustom, false);\n\n event.dispatchCustomEvent(this, 'wje-dropdown:close', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterClose(this));\n })\n .catch((error) => {\n this.classList.add('active');\n this.popup.show(true);\n });\n }\n\n #onMenuItemCustom = (e) => {\n const path = typeof e.composedPath === 'function' ? e.composedPath() : [];\n if (!this.popup \|\| !this.popup.floatingEl \|\| !path.includes(this.popup.floatingEl)) return;\n\n const item = path.find(n => n && n.tagName === 'WJE-MENU-ITEM');\n if (!item) return;\n if (item.hasAttribute('disabled') \|\| item.getAttribute('aria-disabled') === 'true') return;\n if (item.hasAttribute('has-submenu')) return; // parent; nezatváraj\n\n // Zavri len tento dropdown. NEvolaj stopPropagation na custom evente,\n // aby fungovali aj tvoje app-level listenery (riadok 480).\n this.classList.remove('active');\n this.popup.hide(true);\n }\n}\n","import Dropdown from './dropdown.element.js';\n\nexport default Dropdown;\n\nDropdown.define('wje-dropdown', Dropdown);\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"wje-dropdown.js","sources":["../packages/wje-dropdown/dropdown.element.js","../packages/wje-dropdown/dropdown.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Popup from '../wje-popup/popup.element.js';\n\n/*\n `Dropdown` is a custom element that displays a dropdown menu.\n * @summary This element represents a dropdown menu.\n * @documentation https://elements.webjet.sk/components/dropdown\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the dropdown.\n * @slot trigger - The slot for the trigger of the dropdown.\n * @slot - The default slot for the dropdown.\n * // @fires wje-dropdown:open - Event fired when the dropdown is opened.\n * // @fires wje-dropdown:close - Event fired when the dropdown is closed.\n * @tag wje-dropdown\n /\nexport default class Dropdown extends WJElement {\n /\n Creates an instance of Dropdown.\n * @class\n /\n constructor() {\n super();\n }\n\n /\n The placement of the dropdown.\n * @type {{\"wje-popup\": Popup}}\n /\n dependencies = {\n 'wje-popup': Popup,\n };\n\n /\n Sets or removes the 'portaled' attribute on the element.\n * When the value is truthy, the attribute 'portaled' is added to the element.\n * When the value is falsy, the attribute 'portaled' is removed from the element.\n * @param {boolean} value Determines whether to add or remove the 'portaled' attribute.\n /\n set portaled(value) {\n if (value) {\n this.setAttribute('portaled', value);\n } else {\n this.removeAttribute('portaled');\n }\n }\n\n /\n Getter method for the `portaled` property.\n * Checks if the `portaled` attribute is present on the element.\n * @returns {boolean} Returns `true` if the `portaled` attribute exists, otherwise `false`.\n /\n get portaled() {\n return this.getAttribute('portaled') \|\| '';\n }\n\n /\n Checks whether the element has the 'portaled' attribute.\n * @returns {boolean} True if the element has the 'portaled' attribute, otherwise false.\n /\n get isPortaled() {\n return this.hasAttribute('portaled');\n }\n\n /\n Sets the placement of the dropdown.\n * @param value\n /\n set trigger(value) {\n this.setAttribute('trigger', value);\n }\n\n /\n Gets the placement of the dropdown.\n * @returns {string\|string}\n /\n get trigger() {\n return this.getAttribute('trigger') \|\| 'click';\n }\n\n /\n Sets the placement of the dropdown.\n * @type {string}\n /\n className = 'Dropdown';\n\n /\n Getter for the CSS stylesheet.\n * @returns {string[]}\n /\n static get observedAttributes() {\n return ['active'];\n }\n\n /\n Callback function to handle other dropdowns being opened. Close the dropdown if it is not the target and collapse is enabled.\n * @param {Event} e The event object.\n /\n otherDropdownOpennedCallback = (e) => {\n if (e.detail.detail.target !== this) {\n this.classList.remove('active');\n this.popup.hide();\n }\n };\n\n /\n Sets up the attributes for the dropdown.\n /\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /\n Removes the popup element.\n /\n beforeDraw() {\n this.popup?.remove();\n this.popup = null;\n }\n\n /\n Draws the dropdown element and returns the created document fragment.\n * @returns {DocumentFragment}\n /\n draw() {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('wje-placement', 'wje-' + this.placement \|\| 'wje-start');\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-dropdown');\n\n let tooltip = document.createElement('wje-tooltip');\n tooltip.setAttribute('content', this.tooltip);\n\n let anchorSlot = document.createElement('slot');\n anchorSlot.setAttribute('name', 'trigger');\n anchorSlot.setAttribute('slot', 'anchor');\n\n let slot = document.createElement('slot');\n\n let popup = document.createElement('wje-popup');\n popup.setAttribute('placement', this.placement);\n popup.setAttribute('offset', this.offset);\n popup.setAttribute('part', 'popup');\n\n if(this.isPortaled)\n popup.setAttribute('portal', this.portaled);\n\n popup.append(anchorSlot, slot);\n\n // if(this.trigger === \"click\")\n popup.setAttribute('manual', '');\n\n native.appendChild(popup);\n\n fragment.appendChild(native);\n\n this.popup = popup;\n this.anchorSlot = anchorSlot;\n\n return fragment;\n }\n\n /\n Adds event listeners for the mouseenter and mouseleave events.\n /\n afterDraw() {\n event.addListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n\n // Close when any actionable wje-menu-item inside the popup is clicked (works across Shadow DOM via composed path)\n event.addListener(this.popup, 'click', null, this.onMenuItemClick, { capture: true });\n\n if (this.trigger !== 'click') {\n event.addListener(this, 'mouseenter', null, this.onOpen);\n event.addListener(this, 'mouseleave', null, this.onClose);\n } else {\n event.addListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n }\n\n if (this.hasAttribute('collapsible')) {\n event.addListener(\n Array.from(this.querySelectorAll('wje-menu-item')),\n 'click',\n 'wje-menu-item:click',\n this.onClose\n );\n }\n }\n\n /\n Adds event listeners for the mouseenter and mouseleave events.\n /\n afterDisconnect() {\n event.removeListener(this, 'mouseenter', null, this.onOpen);\n event.removeListener(this, 'mouseleave', null, this.onClose);\n event.removeListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n event.removeListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n event.removeListener(this.popup, 'click', null, this.onMenuItemClick, { capture: true });\n event.removeListener(document, 'wje-menu-item:click', null, this.#onMenuItemCustom, false);\n }\n\n popupHideCallback = (e) => {\n if (this.classList.contains('active') && e.target.tagName === \"WJE-DROPDOWN\") {\n this.toggleCallback(e);\n }\n };\n\n /\n Handles delegated clicks from inside the popup and closes the dropdown when a leaf menu item is selected.\n * This works even when the menu is portaled, because we rely on the composed path.\n /\n onMenuItemClick = (e) => {\n // Find nearest wje-menu-item in the composed path\n const path = typeof e.composedPath === 'function' ? e.composedPath() : [];\n const item = path.find((n) => n && n.tagName === 'WJE-MENU-ITEM');\n if (!item) return;\n\n // Ignore disabled items\n if (item.hasAttribute('disabled') \|\| item.getAttribute('aria-disabled') === 'true') return;\n\n // If this item contains a nested submenu (wje-menu), it's not a leaf -> don't close yet\n if (typeof item.querySelector === 'function' && item.querySelector('wje-menu')) return;\n\n // Leaf item selected -> close dropdown (which calls popup.hide(true) inside onClose)\n this.onClose();\n }\n\n /\n @summary Toggles the dropdown element between active and inactive states.\n * Calls the `onOpen` method if the element is currently inactive,\n * and calls the `onClose` method if the element is currently active.\n * @param {Event} e The event object.\n /\n toggleCallback = (e) => {\n if (this.classList.contains('active')) {\n e.stopPropagation();\n this.onClose();\n } else {\n e.stopPropagation();\n this.onOpen(e);\n }\n };\n\n /\n @summary Returns the content to be displayed before showing the dropdown.\n * @returns {any} The content to be displayed.\n /\n beforeShow() {\n return this.content;\n }\n\n /\n This method is called after the dropdown is shown.\n /\n afterShow() {\n // Do nothing\n }\n\n /\n Open the popup element.\n * @param {object} e\n */\n onOpen = (e) => {\n this.classList.add('active');\n Promise.resolve(this.beforeShow(this))\n .then((res) => {\n if (!this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.show(true); // Show tooltip\n\n event.addListener(document, 'wje-menu-item:click', null, this.#onMenuItemCustom, false);\n\n event.dispatchCustomEvent(this, 'wje-dropdown:open', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterShow(this));\n })\n .catch((error) => {\n // ak je nejaka chyba tak to len zatvorime\n this.classList.remove('active');\n this.popup.hide(true);\n });\n };\n\n beforeClose = () => {\n // Do nothing\n };\n\n afterClose = () => {\n // Do nothing\n };\n\n onClose = () => {\n this.classList.remove('active');\n Promise.resolve(this.beforeClose(this))\n .then((res) => {\n if (this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.hide(true); // Show tooltip\n\n event.removeListener(document, 'wje-menu-item:click', null, this.#onMenuItemCustom, false);\n\n event.dispatchCustomEvent(this, 'wje-dropdown:close', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterClose(this));\n })\n .catch((error) => {\n this.classList.add('active');\n this.popup.show(true);\n });\n }\n\n #onMenuItemCustom = (e) => {\n const path = typeof e.composedPath === 'function' ? e.composedPath() : [];\n if (!this.popup \|\| !this.popup.floatingEl \|\| !path.includes(this.popup.floatingEl)) return;\n\n const item = path.find(n => n && n.tagName === 'WJE-MENU-ITEM');\n if (!item) return;\n if (item.hasAttribute('disabled') \|\| item.getAttribute('aria-disabled') === 'true') return;\n if (item.hasAttribute('has-submenu')) return; // parent; nezatváraj\n\n // Zavri len tento dropdown. NEvolaj stopPropagation na custom evente,\n // aby fungovali aj tvoje app-level listenery (riadok 480).\n this.classList.remove('active');\n this.popup.hide(true);\n }\n}\n","import Dropdown from './dropdown.element.js';\n\nexport default Dropdown;\n\nDropdown.define('wje-dropdown', Dropdown);\n"],"names":[],"mappings":";;;;;;;;;;;;;AAgBe,MAAM,iBAAiB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAK5C,cAAc;AACV,UAAO;AAOX;AAAA;AAAA;AAAA;AAAA,wCAAe;AAAA,MACX,aAAa;AAAA,IAChB;AAqDD;AAAA;AAAA;AAAA;AAAA,qCAAY;AAcZ;AAAA;AAAA;AAAA;AAAA,wDAA+B,CAAC,MAAM;AAClC,UAAI,EAAE,OAAO,OAAO,WAAW,MAAM;AACjC,aAAK,UAAU,OAAO,QAAQ;AAC9B,aAAK,MAAM,KAAM;AAAA,MAC7B;AAAA,IACK;AAoGD,6CAAoB,CAAC,MAAM;AACvB,UAAI,KAAK,UAAU,SAAS,QAAQ,KAAK,EAAE,OAAO,YAAY,gBAAgB;AAC1E,aAAK,eAAe,CAAC;AAAA,MACjC;AAAA,IACK;AAMD;AAAA;AAAA;AAAA;AAAA,2CAAkB,CAAC,MAAM;AAErB,YAAM,OAAO,OAAO,EAAE,iBAAiB,aAAa,EAAE,aAAY,IAAK,CAAE;AACzE,YAAM,OAAO,KAAK,KAAK,CAAC,MAAM,KAAK,EAAE,YAAY,eAAe;AAChE,UAAI,CAAC,KAAM;AAGX,UAAI,KAAK,aAAa,UAAU,KAAK,KAAK,aAAa,eAAe,MAAM,OAAQ;AAGpF,UAAI,OAAO,KAAK,kBAAkB,cAAc,KAAK,cAAc,UAAU,EAAG;AAGhF,WAAK,QAAS;AAAA,IACtB;AAQI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0CAAiB,CAAC,MAAM;AACpB,UAAI,KAAK,UAAU,SAAS,QAAQ,GAAG;AACnC,UAAE,gBAAiB;AACnB,aAAK,QAAS;AAAA,MAC1B,OAAe;AACH,UAAE,gBAAiB;AACnB,aAAK,OAAO,CAAC;AAAA,MACzB;AAAA,IACK;AAqBD;AAAA;AAAA;AAAA;AAAA,kCAAS,CAAC,MAAM;AACZ,WAAK,UAAU,IAAI,QAAQ;AAC3B,cAAQ,QAAQ,KAAK,WAAW,IAAI,CAAC,EAChC,KAAK,CAAC,QAAQ;AACX,YAAI,CAAC,KAAK,UAAU,SAAS,QAAQ,GAAG;AACpC,gBAAM,IAAI,MAAM,gDAAgD;AAAA,QACpF;AAEgB,aAAK,MAAM,KAAK,IAAI;AAEpB,cAAM,YAAY,UAAU,uBAAuB,MAAM,mBAAK,oBAAmB,KAAK;AAEtF,cAAM,oBAAoB,MAAM,qBAAqB;AAAA,UACjD,SAAS;AAAA,UACT,QAAQ,EAAE,QAAQ,KAAM;AAAA,QAC5C,CAAiB;AAED,gBAAQ,QAAQ,KAAK,UAAU,IAAI,CAAC;AAAA,MACvC,CAAA,EACA,MAAM,CAAC,UAAU;AAEd,aAAK,UAAU,OAAO,QAAQ;AAC9B,aAAK,MAAM,KAAK,IAAI;AAAA,MACpC,CAAa;AAAA,IACR;AAED,uCAAc,MAAM;AAAA,IAEnB;AAED,sCAAa,MAAM;AAAA,IAElB;AAED,mCAAU,MAAM;AACZ,WAAK,UAAU,OAAO,QAAQ;AAC9B,cAAQ,QAAQ,KAAK,YAAY,IAAI,CAAC,EACjC,KAAK,CAAC,QAAQ;AACX,YAAI,KAAK,UAAU,SAAS,QAAQ,GAAG;AACnC,gBAAM,IAAI,MAAM,gDAAgD;AAAA,QACpF;AAEgB,aAAK,MAAM,KAAK,IAAI;AAEpB,cAAM,eAAe,UAAU,uBAAuB,MAAM,mBAAK,oBAAmB,KAAK;AAEzF,cAAM,oBAAoB,MAAM,sBAAsB;AAAA,UAClD,SAAS;AAAA,UACT,QAAQ,EAAE,QAAQ,KAAM;AAAA,QAC5C,CAAiB;AAED,gBAAQ,QAAQ,KAAK,WAAW,IAAI,CAAC;AAAA,MACxC,CAAA,EACA,MAAM,CAAC,UAAU;AACd,aAAK,UAAU,IAAI,QAAQ;AAC3B,aAAK,MAAM,KAAK,IAAI;AAAA,MACpC,CAAa;AAAA,IACb;AAEI,0CAAoB,CAAC,MAAM;AACvB,YAAM,OAAO,OAAO,EAAE,iBAAiB,aAAa,EAAE,aAAY,IAAK,CAAE;AACzE,UAAI,CAAC,KAAK,SAAS,CAAC,KAAK,MAAM,cAAc,CAAC,KAAK,SAAS,KAAK,MAAM,UAAU,EAAG;AAEpF,YAAM,OAAO,KAAK,KAAK,OAAK,KAAK,EAAE,YAAY,eAAe;AAC9D,UAAI,CAAC,KAAM;AACX,UAAI,KAAK,aAAa,UAAU,KAAK,KAAK,aAAa,eAAe,MAAM,OAAQ;AACpF,UAAI,KAAK,aAAa,aAAa,EAAG;AAItC,WAAK,UAAU,OAAO,QAAQ;AAC9B,WAAK,MAAM,KAAK,IAAI;AAAA,IAC5B;AAAA,EAzTA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgBI,IAAI,SAAS,OAAO;AAChB,QAAI,OAAO;AACP,WAAK,aAAa,YAAY,KAAK;AAAA,IAC/C,OAAe;AACH,WAAK,gBAAgB,UAAU;AAAA,IAC3C;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,WAAW;AACX,WAAO,KAAK,aAAa,UAAU,KAAK;AAAA,EAChD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,aAAa;AACb,WAAO,KAAK,aAAa,UAAU;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ,OAAO;AACf,SAAK,aAAa,WAAW,KAAK;AAAA,EAC1C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU;AACV,WAAO,KAAK,aAAa,SAAS,KAAK;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA,EAYI,WAAW,qBAAqB;AAC5B,WAAO,CAAC,QAAQ;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA,EAgBI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA,EAKI,aAAa;;AACT,eAAK,UAAL,mBAAY;AACZ,SAAK,QAAQ;AAAA,EACrB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,SAAK,UAAU,IAAI,iBAAiB,SAAS,KAAK,aAAa,WAAW;AAE1E,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,UAAU,IAAI,iBAAiB;AAEtC,QAAI,UAAU,SAAS,cAAc,aAAa;AAClD,YAAQ,aAAa,WAAW,KAAK,OAAO;AAE5C,QAAI,aAAa,SAAS,cAAc,MAAM;AAC9C,eAAW,aAAa,QAAQ,SAAS;AACzC,eAAW,aAAa,QAAQ,QAAQ;AAExC,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,QAAI,QAAQ,SAAS,cAAc,WAAW;AAC9C,UAAM,aAAa,aAAa,KAAK,SAAS;AAC9C,UAAM,aAAa,UAAU,KAAK,MAAM;AACxC,UAAM,aAAa,QAAQ,OAAO;AAElC,QAAG,KAAK;AACJ,YAAM,aAAa,UAAU,KAAK,QAAQ;AAE9C,UAAM,OAAO,YAAY,IAAI;AAG7B,UAAM,aAAa,UAAU,EAAE;AAE/B,WAAO,YAAY,KAAK;AAExB,aAAS,YAAY,MAAM;AAE3B,SAAK,QAAQ;AACb,SAAK,aAAa;AAElB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,UAAM,YAAY,MAAM,kBAAkB,MAAM,KAAK,iBAAiB;AAGtE,UAAM,YAAY,KAAK,OAAO,SAAS,MAAM,KAAK,iBAAiB,EAAE,SAAS,KAAI,CAAE;AAEpF,QAAI,KAAK,YAAY,SAAS;AAC1B,YAAM,YAAY,MAAM,cAAc,MAAM,KAAK,MAAM;AACvD,YAAM,YAAY,MAAM,cAAc,MAAM,KAAK,OAAO;AAAA,IACpE,OAAe;AACH,YAAM,YAAY,KAAK,YAAY,SAAS,MAAM,KAAK,gBAAgB,EAAE,SAAS,KAAI,CAAE;AAAA,IACpG;AAEQ,QAAI,KAAK,aAAa,aAAa,GAAG;AAClC,YAAM;AAAA,QACJ,MAAM,KAAK,KAAK,iBAAiB,eAAe,CAAC;AAAA,QACjD;AAAA,QACA;AAAA,QACA,KAAK;AAAA,MACN;AAAA,IACb;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,UAAM,eAAe,MAAM,cAAc,MAAM,KAAK,MAAM;AAC1D,UAAM,eAAe,MAAM,cAAc,MAAM,KAAK,OAAO;AAC3D,UAAM,eAAe,KAAK,YAAY,SAAS,MAAM,KAAK,gBAAgB,EAAE,SAAS,KAAI,CAAE;AAC3F,UAAM,eAAe,MAAM,kBAAkB,MAAM,KAAK,iBAAiB;AACzE,UAAM,eAAe,KAAK,OAAO,SAAS,MAAM,KAAK,iBAAiB,EAAE,SAAS,KAAI,CAAE;AACvF,UAAM,eAAe,UAAU,uBAAuB,MAAM,mBAAK,oBAAmB,KAAK;AAAA,EACjG;AAAA;AAAA;AAAA;AAAA;AAAA,EAgDI,aAAa;AACT,WAAO,KAAK;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AAAA,EAEhB;AA+EA;AAdI;AC/TJ,SAAS,OAAO,gBAAgB,QAAQ;"}

package/package.json CHANGED Viewed

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