npm - wj-elements - Versions diffs - 0.1.237 → 0.1.239 - Mend

wj-elements 0.1.237 → 0.1.239

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 (11) hide show

package/dist/light.css +11 -0
package/dist/packages/wje-dialog/dialog.element.d.ts +4 -0
package/dist/packages/wje-dropdown/dropdown.element.d.ts +5 -1
package/dist/packages/wje-tab-group/tab-group.element.d.ts +11 -0
package/dist/wje-dialog.js +36 -30
package/dist/wje-dialog.js.map +1 -1
package/dist/wje-dropdown.js +6 -2
package/dist/wje-dropdown.js.map +1 -1
package/dist/wje-tab-group.js +23 -4
package/dist/wje-tab-group.js.map +1 -1
package/package.json +1 -1

package/dist/light.css CHANGED Viewed

@@ -347,10 +347,21 @@
     --wje-dialog-margin-start: auto;
     --wje-dialog-margin-end: auto;
     --wje-dialog-margin-bottom: auto;
     --wje-dialog-padding: var(--wje-spacing-medium);
     --wje-dialog-padding-inline: var(--wje-spacing-medium);
     --wje-dialog-padding-top: var(--wje-spacing-medium);
     --wje-dialog-padding-bottom: var(--wje-spacing-medium);
+    --wje-dialog-header-padding-inline: var(--wje-dialog-padding);
+    --wje-dialog-header-padding-block: var(--wje-dialog-padding);
+    --wje-dialog-content-padding-inline: var(--wje-dialog-padding);
+    --wje-dialog-content-padding-block: var(--wje-dialog-padding);
+    --wje-dialog-footer-padding-inline: var(--wje-dialog-padding);
+    --wje-dialog-footer-padding-block: var(--wje-dialog-padding);
     --wje-dialog-headline-font-size: 0.656rem;
     --wje-dialog-headline-letter-spacing: 0.06em;
     --wje-dialog-headline-font-weight: 500;

package/dist/packages/wje-dialog/dialog.element.d.ts CHANGED Viewed

@@ -72,6 +72,10 @@ export default class Dialog extends WJElement {
      * @returns {boolean}
      */
     get closeHidden(): boolean;
+    set hiddenHeader(value: boolean);
+    get hiddenHeader(): boolean;
+    set hiddenFooter(value: boolean);
+    get hiddenFooter(): boolean;
     /**
      * Draws the component.
      * @param {object} context The context for drawing.

package/dist/packages/wje-dropdown/dropdown.element.d.ts CHANGED Viewed

@@ -39,7 +39,11 @@ export default class Dropdown extends WJElement {
      * @returns {boolean} Returns `true` if the `portaled` attribute exists, otherwise `false`.
      */
     get portaled(): boolean;
-    isPortaled(): boolean;
+    /**
+     * Checks whether the element has the 'portaled' attribute.
+     * @returns {boolean} True if the element has the 'portaled' attribute, otherwise false.
+     */
+    get isPortaled(): boolean;
     /**
      * Sets the placement of the dropdown.
      * @param value

package/dist/packages/wje-tab-group/tab-group.element.d.ts CHANGED Viewed

@@ -18,6 +18,17 @@ export default class TabGroup extends WJElement {
      * @returns {CSSStyleSheet}
      */
     static get cssStyleSheet(): CSSStyleSheet;
+    /**
+     * Sets the value for the 'variant' attribute of the element.
+     * @param {string} value The value to set for the 'variant' attribute.
+     */
+    set variant(value: string);
+    /**
+     * Gets the value of the 'variant' attribute.
+     * If the attribute is not set, it defaults to 'top'.
+     * @returns {string} The value of the 'variant' attribute or the default value 'top' if not set.
+     */
+    get variant(): string;
     /**
      * Sets the 'type' attribute of the element to the specified value.
      * @param {string} value The value to set for the 'type' attribute.

package/dist/wje-dialog.js CHANGED Viewed

@@ -29,14 +29,11 @@ const styles = `/*
     .dialog-header {
         position: relative;
         border-bottom: 0;
-        padding-inline: var(--wje-dialog-padding);
-        padding-top: var(--wje-dialog-padding);
-        padding-bottom: var(--wje-dialog-padding);
-        /*display: flex;*/
-        /*align-items: center;*/
+        padding-inline: var(--wje-dialog-header-padding-inline);
+        padding-block: var(--wje-dialog-header-padding-block);
         display: grid;
-        grid-template-columns: 1fr auto; /* headline vľavo, button vpravo */
-        grid-template-rows: auto auto;  /* horný riadok, potom header-actions */
+        grid-template-columns: 1fr auto auto; /* headline vľavo, button vpravo */
+        grid-template-rows: auto;  /* horný riadok, potom header-actions */
         align-items: center;
         gap: 0.5rem;
         > span[part="headline"] {
@@ -54,25 +51,24 @@ const styles = `/*
             filter: alpha(opacity=40);
             grid-column: 1;
-            grid-row: 1;
         }
          > wje-button[part="close"] {
-            grid-column: 2;
+            grid-column: 3;
             grid-row: 1;
             justify-self: end;
         }
          > .header-actions {
-            grid-column: 1 / span 2;
-            grid-row: 2;
-            width: 100%;
+            grid-column: 2;
+            grid-row: 1;
         }
     }
     .dialog-content {
         box-shadow: none;
-        padding-inline: var(--wje-dialog-padding);
+        padding-inline: var(--wje-dialog-content-padding-inline);
+        padding-block: var(--wje-dialog-content-padding-block);
         white-space: normal;
         z-index: 1;
     }
@@ -83,13 +79,11 @@ const styles = `/*
         border-top: none;
         box-shadow: none;
         margin-top: 0;
-        padding-inline: var(--wje-dialog-padding-inline);
-        padding-top: var(--wje-dialog-padding-top);
-        padding-bottom: var(--wje-dialog-padding-bottom);
+        padding-inline: var(--wje-dialog-footer-padding-inline);
+        padding-block: var(--wje-dialog-footer-padding-block);
     }
 }
-/*Blocking element styles*/
 .blocking-element {
     position: absolute;
     top: 0;
@@ -374,6 +368,18 @@ class Dialog extends WJElement {
   get closeHidden() {
     return !!this.hasAttribute("close-hidden");
   }
+  set hiddenHeader(value) {
+    if (value) this.setAttribute("hidden-header", "");
+  }
+  get hiddenHeader() {
+    return !!this.hasAttribute("hidden-header");
+  }
+  set hiddenFooter(value) {
+    if (value) this.setAttribute("hidden-footer", "");
+  }
+  get hiddenFooter() {
+    return !!this.hasAttribute("hidden-footer");
+  }
   /**
    * Returns the CSS styles for the component.
    * @returns {*}
@@ -411,6 +417,17 @@ class Dialog extends WJElement {
     this.dialog = dialog;
     return fragment;
   }
+  /**
+   * Draws the component after it has been drawn.
+   * @param {object} context The context for drawing.
+   * @param {object} store The store for drawing.
+   * @param {object} params The parameters for drawing.
+   */
+  afterDraw(context, store, params) {
+    if (params.trigger) {
+      event.addListener(document, params.trigger, null, this.onOpen);
+    }
+  }
   /**
    * Creates the dialog body.
    * @param dialog
@@ -452,9 +469,9 @@ class Dialog extends WJElement {
     header.appendChild(headerActions);
     body.appendChild(contentSlot);
     footer.appendChild(slotFooter);
-    dialog.appendChild(header);
+    if (!this.hiddenHeader) dialog.appendChild(header);
     dialog.appendChild(body);
-    dialog.appendChild(footer);
+    if (!this.hiddenFooter) dialog.appendChild(footer);
   }
   /**
    * Closes the dialog.
@@ -463,17 +480,6 @@ class Dialog extends WJElement {
   close(e) {
     this.onClose(e);
   }
-  /**
-   * Draws the component after it has been drawn.
-   * @param {object} context The context for drawing.
-   * @param {object} store The store for drawing.
-   * @param {object} params The parameters for drawing.
-   */
-  afterDraw(context, store, params) {
-    if (params.trigger) {
-      event.addListener(document, params.trigger, null, this.onOpen);
-    }
-  }
   /**
    * Before the component is disconnected.
    */

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

	@@ -1 +1 @@
1	- {"version":3,"file":"wje-dialog.js","sources":["../packages/wje-dialog/dialog.element.js","../packages/wje-dialog/dialog.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport '../wje-button/button.element.js';\nimport '../wje-icon/icon.element.js';\nimport styles from './styles/styles.css?inline';\n\n/*\n `Dialog` is a custom web component that represents a dialog.\n * @summary This element represents a dialog.\n * @documentation https://elements.webjet.sk/components/dialog\n * @status stable\n * @augments {WJElement}\n * @slot header - Slot for the header content.\n * @slot body - Slot for the body content.\n * @slot footer - Slot for the footer content.\n * @csspart dialog - The dialog wrapper.\n * @csspart header - The header of the dialog.\n * @csspart body - The body of the dialog.\n * @csspart footer - The footer of the dialog.\n * @csspart close - The close button of the dialog.\n * @cssproperty [--wje-dialog-background=var(--wje-background-color)] - Specifies the background color of the dialog.\n * @cssproperty [--wje-dialog-color=var(--wje-text-color)] - Defines the text color within the dialog.\n * @cssproperty [--wje-dialog-padding=1rem] - Controls the padding inside the dialog.\n * @cssproperty [--wje-dialog-border-radius=0.5rem] - Sets the border radius for the dialog's corners.\n * @cssproperty [--wje-dialog-box-shadow=0 2px 10px rgba(0, 0, 0, 0.1)] - Applies a shadow effect to the dialog.\n * @tag wje-dialog\n /\n\nexport default class Dialog extends WJElement {\n /\n @class\n /\n constructor() {\n super();\n }\n\n /\n Sets the value of the 'headline' attribute.\n * @param {string} value The new value for the 'headline' attribute.\n /\n set headline(value) {\n this.setAttribute('headline', value);\n }\n\n /\n Retrieves the value of the \"headline\" attribute from the element.\n * If the \"headline\" attribute is not present, returns an empty string.\n * @returns {string} The headline attribute value or an empty string if not set.\n /\n get headline() {\n return this.getAttribute('headline') \|\| '';\n }\n\n /\n Sets the headline of the dialog.\n * @param value\n /\n set placement(value) {\n this.setAttribute('placement', value);\n }\n\n /\n Gets the headline of the dialog.\n * @returns {string\|string}\n /\n get placement() {\n return this.getAttribute('placement') \|\| 'slide-up';\n }\n\n /\n Sets the headline of the dialog.\n * @param value\n /\n set async(value) {\n this.setAttribute('async', '');\n }\n\n /\n Gets the headline of the dialog.\n * @returns {boolean}\n /\n get async() {\n return this.hasAttribute('async');\n }\n\n /\n Sets the headline of the dialog.\n * @param value\n /\n set closeHidden(value) {\n if (value) this.setAttribute('close-hidden', '');\n }\n\n /\n Gets the headline of the dialog.\n * @returns {boolean}\n /\n get closeHidden() {\n return !!this.hasAttribute('close-hidden');\n }\n\n /\n Sets the headline of the dialog.\n * @type {string}\n /\n className = 'Dialog';\n\n /\n Returns the CSS styles for the component.\n * @returns {}\n /\n static get cssStyleSheet() {\n return styles;\n }\n\n /*\n Returns the list of attributes to observe for changes.\n * @returns {[]}\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.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n * @returns {DocumentFragment}\n /\n draw(context, store, params) {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('fade', this.placement, params.size);\n\n let dialog = document.createElement('dialog');\n dialog.setAttribute('part', 'dialog');\n dialog.classList.add('modal-dialog');\n\n fragment.appendChild(dialog);\n\n this.dialog = dialog;\n\n return fragment;\n }\n\n /\n Creates the dialog body.\n * @param dialog\n /\n htmlDialogBody(dialog) {\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'x');\n icon.setAttribute('slot', 'icon-only');\n\n let close = document.createElement('wje-button');\n close.setAttribute('fill', 'link');\n close.setAttribute('size', 'small');\n close.setAttribute('part', 'close');\n close.addEventListener('click', (e) => {\n this.close(e);\n });\n\n let header = document.createElement('div');\n header.setAttribute('part', 'header');\n header.classList.add('dialog-header');\n if (this.hasAttribute('headline'))\n header.innerHTML = `<span part=\"headline\">${this.headline}</span>`;\n\n let slotHeader = document.createElement('slot');\n slotHeader.setAttribute('name', 'header');\n\n const headerActions = document.createElement('div');\n headerActions.classList.add('header-actions');\n headerActions.setAttribute('part', 'header-actions');\n headerActions.appendChild(slotHeader);\n\n let contentSlot = document.createElement('slot');\n\n let body = document.createElement('div');\n body.setAttribute('part', 'body');\n body.classList.add('dialog-content');\n\n let footer = document.createElement('div');\n footer.setAttribute('part', 'footer');\n footer.classList.add('dialog-footer');\n footer.innerHTML = '';\n\n let slotFooter = document.createElement('slot');\n slotFooter.setAttribute('name', 'footer');\n\n close.appendChild(icon);\n\n if (!this.closeHidden) header.appendChild(close);\n\n header.appendChild(headerActions);\n body.appendChild(contentSlot);\n footer.appendChild(slotFooter);\n\n dialog.appendChild(header);\n dialog.appendChild(body);\n dialog.appendChild(footer);\n }\n\n /\n Closes the dialog.\n * @param e\n /\n close(e) {\n this.onClose(e);\n }\n\n /\n Draws the component after it has been drawn.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n /\n afterDraw(context, store, params) {\n if (params.trigger) {\n event.addListener(document, params.trigger, null, this.onOpen);\n }\n\n //this.dialog.addEventListener('close', this.onClose);\n }\n\n /\n Before the component is disconnected.\n /\n beforeDisconnect() {\n if (this.params?.trigger) {\n event.removeListener(document, this.params?.trigger, null, this.onOpen);\n }\n\n //this.dialog.removeEventListener('close', this.onClose);\n }\n\n /\n Before the dialog opens.\n /\n beforeOpen(dialog, trigger) {\n // Hook for extending behavior before the dialog opens\n }\n\n /\n After the dialog opens.\n /\n afterOpen(dialog, trigger) {\n // Hook for extending behavior after the dialog opens\n }\n\n /\n Before the dialog closes.\n /\n beforeClose(dialog, trigger) {\n // Hook for extending behavior before the dialog closes\n }\n\n /\n After the dialog closes.\n /\n afterClose(dialog, trigger) {\n // Hook for extending behavior after the dialog closes\n }\n\n /\n Opens the dialog.\n * @param e\n /\n onOpen = (e) => {\n if (this.dialog) {\n this.dialog.innerHTML = '';\n }\n\n setTimeout(() => {\n Promise.resolve(this.beforeOpen(this, e)).then((res) => {\n this.htmlDialogBody(this.dialog);\n\n this.dialog.showModal(); // Now open the dialog\n\n if (this.dialog.open) {\n Promise.resolve(this.afterOpen(this, e));\n }\n });\n }, 0);\n }\n\n /\n Closes the dialog.\n * @param {object} e\n /\n onClose = (e) => {\n Promise.resolve(this.beforeClose(this, e)).then((res) => {\n this.dialog.close(); // Now close the dialog\n\n if (!this.dialog.open) {\n Promise.resolve(this.afterClose(this, e));\n }\n });\n };\n\n /\n Registers an event listener on the provided button that triggers a blocking UI element\n * and executes a given promise when the button is clicked.\n * @param {HTMLElement} button The button element to attach the event listener to.\n * @param {Function} promise A function that returns a promise to be executed when the button is clicked.\n */\n registerBlockingEvent(button, promise) {\n button.addEventListener('wje-button:click', async (e) => {\n let blockingElement = document.createElement('div');\n blockingElement.classList.add('blocking-element');\n\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'loader-2');\n icon.setAttribute('size', '2x-large');\n\n blockingElement.appendChild(icon);\n\n let scrollOffset = this.dialog.scrollTop;\n blockingElement.style.top = `${scrollOffset}px`;\n blockingElement.style.bottom = `-${scrollOffset}px`;\n\n this.dialog.appendChild(blockingElement);\n\n await promise()\n .then((res) => {\n this.close();\n blockingElement.remove();\n })\n .catch((err) => {\n console.error(err);\n blockingElement.remove();\n });\n });\n }\n}\n","import Dialog from './dialog.element.js';\n\nexport default Dialog;\n\nDialog.define('wje-dialog', Dialog);\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"wje-dialog.js","sources":["../packages/wje-dialog/dialog.element.js","../packages/wje-dialog/dialog.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport '../wje-button/button.element.js';\nimport '../wje-icon/icon.element.js';\nimport styles from './styles/styles.css?inline';\n\n/*\n `Dialog` is a custom web component that represents a dialog.\n * @summary This element represents a dialog.\n * @documentation https://elements.webjet.sk/components/dialog\n * @status stable\n * @augments {WJElement}\n * @slot header - Slot for the header content.\n * @slot body - Slot for the body content.\n * @slot footer - Slot for the footer content.\n * @csspart dialog - The dialog wrapper.\n * @csspart header - The header of the dialog.\n * @csspart body - The body of the dialog.\n * @csspart footer - The footer of the dialog.\n * @csspart close - The close button of the dialog.\n * @cssproperty [--wje-dialog-background=var(--wje-background-color)] - Specifies the background color of the dialog.\n * @cssproperty [--wje-dialog-color=var(--wje-text-color)] - Defines the text color within the dialog.\n * @cssproperty [--wje-dialog-padding=1rem] - Controls the padding inside the dialog.\n * @cssproperty [--wje-dialog-border-radius=0.5rem] - Sets the border radius for the dialog's corners.\n * @cssproperty [--wje-dialog-box-shadow=0 2px 10px rgba(0, 0, 0, 0.1)] - Applies a shadow effect to the dialog.\n * @tag wje-dialog\n /\n\nexport default class Dialog extends WJElement {\n /\n @class\n /\n constructor() {\n super();\n }\n\n /\n Sets the value of the 'headline' attribute.\n * @param {string} value The new value for the 'headline' attribute.\n /\n set headline(value) {\n this.setAttribute('headline', value);\n }\n\n /\n Retrieves the value of the \"headline\" attribute from the element.\n * If the \"headline\" attribute is not present, returns an empty string.\n * @returns {string} The headline attribute value or an empty string if not set.\n /\n get headline() {\n return this.getAttribute('headline') \|\| '';\n }\n\n /\n Sets the headline of the dialog.\n * @param value\n /\n set placement(value) {\n this.setAttribute('placement', value);\n }\n\n /\n Gets the headline of the dialog.\n * @returns {string\|string}\n /\n get placement() {\n return this.getAttribute('placement') \|\| 'slide-up';\n }\n\n /\n Sets the headline of the dialog.\n * @param value\n /\n set async(value) {\n this.setAttribute('async', '');\n }\n\n /\n Gets the headline of the dialog.\n * @returns {boolean}\n /\n get async() {\n return this.hasAttribute('async');\n }\n\n /\n Sets the headline of the dialog.\n * @param value\n /\n set closeHidden(value) {\n if (value) this.setAttribute('close-hidden', '');\n }\n\n /\n Gets the headline of the dialog.\n * @returns {boolean}\n /\n get closeHidden() {\n return !!this.hasAttribute('close-hidden');\n }\n\n set hiddenHeader(value) {\n if (value) this.setAttribute('hidden-header', '');\n }\n\n get hiddenHeader() {\n return !!this.hasAttribute('hidden-header');\n }\n\n set hiddenFooter(value) {\n if (value) this.setAttribute('hidden-footer', '');\n }\n\n get hiddenFooter() {\n return !!this.hasAttribute('hidden-footer');\n }\n\n /\n Sets the headline of the dialog.\n * @type {string}\n /\n className = 'Dialog';\n\n /\n Returns the CSS styles for the component.\n * @returns {}\n /\n static get cssStyleSheet() {\n return styles;\n }\n\n /*\n Returns the list of attributes to observe for changes.\n * @returns {[]}\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.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n * @returns {DocumentFragment}\n /\n draw(context, store, params) {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('fade', this.placement, params.size);\n\n let dialog = document.createElement('dialog');\n dialog.setAttribute('part', 'dialog');\n dialog.classList.add('modal-dialog');\n\n fragment.appendChild(dialog);\n\n this.dialog = dialog;\n\n return fragment;\n }\n\n /\n Draws the component after it has been drawn.\n * @param {object} context The context for drawing.\n * @param {object} store The store for drawing.\n * @param {object} params The parameters for drawing.\n /\n afterDraw(context, store, params) {\n if (params.trigger) {\n event.addListener(document, params.trigger, null, this.onOpen);\n }\n\n //this.dialog.addEventListener('close', this.onClose);\n }\n\n /\n Creates the dialog body.\n * @param dialog\n /\n htmlDialogBody(dialog) {\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'x');\n icon.setAttribute('slot', 'icon-only');\n\n let close = document.createElement('wje-button');\n close.setAttribute('fill', 'link');\n close.setAttribute('size', 'small');\n close.setAttribute('part', 'close');\n close.addEventListener('click', (e) => {\n this.close(e);\n });\n\n let header = document.createElement('div');\n header.setAttribute('part', 'header');\n header.classList.add('dialog-header');\n if (this.hasAttribute('headline'))\n header.innerHTML = `<span part=\"headline\">${this.headline}</span>`;\n\n let slotHeader = document.createElement('slot');\n slotHeader.setAttribute('name', 'header');\n\n const headerActions = document.createElement('div');\n headerActions.classList.add('header-actions');\n headerActions.setAttribute('part', 'header-actions');\n headerActions.appendChild(slotHeader);\n\n let contentSlot = document.createElement('slot');\n\n let body = document.createElement('div');\n body.setAttribute('part', 'body');\n body.classList.add('dialog-content');\n\n let footer = document.createElement('div');\n footer.setAttribute('part', 'footer');\n footer.classList.add('dialog-footer');\n footer.innerHTML = '';\n\n let slotFooter = document.createElement('slot');\n slotFooter.setAttribute('name', 'footer');\n\n close.appendChild(icon);\n\n if (!this.closeHidden) header.appendChild(close);\n\n header.appendChild(headerActions);\n body.appendChild(contentSlot);\n footer.appendChild(slotFooter);\n\n if (!this.hiddenHeader) dialog.appendChild(header);\n dialog.appendChild(body);\n if (!this.hiddenFooter) dialog.appendChild(footer);\n }\n\n /\n Closes the dialog.\n * @param e\n /\n close(e) {\n this.onClose(e);\n }\n\n /\n Before the component is disconnected.\n /\n beforeDisconnect() {\n if (this.params?.trigger) {\n event.removeListener(document, this.params?.trigger, null, this.onOpen);\n }\n\n //this.dialog.removeEventListener('close', this.onClose);\n }\n\n /\n Before the dialog opens.\n /\n beforeOpen(dialog, trigger) {\n // Hook for extending behavior before the dialog opens\n }\n\n /\n After the dialog opens.\n /\n afterOpen(dialog, trigger) {\n // Hook for extending behavior after the dialog opens\n }\n\n /\n Before the dialog closes.\n /\n beforeClose(dialog, trigger) {\n // Hook for extending behavior before the dialog closes\n }\n\n /\n After the dialog closes.\n /\n afterClose(dialog, trigger) {\n // Hook for extending behavior after the dialog closes\n }\n\n /\n Opens the dialog.\n * @param e\n /\n onOpen = (e) => {\n if (this.dialog) {\n this.dialog.innerHTML = '';\n }\n\n setTimeout(() => {\n Promise.resolve(this.beforeOpen(this, e)).then((res) => {\n this.htmlDialogBody(this.dialog);\n\n this.dialog.showModal(); // Now open the dialog\n\n if (this.dialog.open) {\n Promise.resolve(this.afterOpen(this, e));\n }\n });\n }, 0);\n }\n\n /\n Closes the dialog.\n * @param {object} e\n /\n onClose = (e) => {\n Promise.resolve(this.beforeClose(this, e)).then((res) => {\n this.dialog.close(); // Now close the dialog\n\n if (!this.dialog.open) {\n Promise.resolve(this.afterClose(this, e));\n }\n });\n };\n\n /\n Registers an event listener on the provided button that triggers a blocking UI element\n * and executes a given promise when the button is clicked.\n * @param {HTMLElement} button The button element to attach the event listener to.\n * @param {Function} promise A function that returns a promise to be executed when the button is clicked.\n */\n registerBlockingEvent(button, promise) {\n button.addEventListener('wje-button:click', async (e) => {\n let blockingElement = document.createElement('div');\n blockingElement.classList.add('blocking-element');\n\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'loader-2');\n icon.setAttribute('size', '2x-large');\n\n blockingElement.appendChild(icon);\n\n let scrollOffset = this.dialog.scrollTop;\n blockingElement.style.top = `${scrollOffset}px`;\n blockingElement.style.bottom = `-${scrollOffset}px`;\n\n this.dialog.appendChild(blockingElement);\n\n await promise()\n .then((res) => {\n this.close();\n blockingElement.remove();\n })\n .catch((err) => {\n console.error(err);\n blockingElement.remove();\n });\n });\n }\n}\n","import Dialog from './dialog.element.js';\n\nexport default Dialog;\n\nDialog.define('wje-dialog', Dialog);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2Be,MAAM,eAAe,UAAU;AAAA;AAAA;AAAA;AAAA,EAI1C,cAAc;AACV,UAAO;AAwFX;AAAA;AAAA;AAAA;AAAA,qCAAY;AA2KZ;AAAA;AAAA;AAAA;AAAA,kCAAS,CAAC,MAAM;AACZ,UAAI,KAAK,QAAQ;AACb,aAAK,OAAO,YAAY;AAAA,MACpC;AAEQ,iBAAW,MAAM;AACb,gBAAQ,QAAQ,KAAK,WAAW,MAAM,CAAC,CAAC,EAAE,KAAK,CAAC,QAAQ;AACpD,eAAK,eAAe,KAAK,MAAM;AAE/B,eAAK,OAAO;AAEZ,cAAI,KAAK,OAAO,MAAM;AAClB,oBAAQ,QAAQ,KAAK,UAAU,MAAM,CAAC,CAAC;AAAA,UAC3D;AAAA,QACA,CAAa;AAAA,MACJ,GAAE,CAAC;AAAA,IACZ;AAMI;AAAA;AAAA;AAAA;AAAA,mCAAU,CAAC,MAAM;AACb,cAAQ,QAAQ,KAAK,YAAY,MAAM,CAAC,CAAC,EAAE,KAAK,CAAC,QAAQ;AACrD,aAAK,OAAO;AAEZ,YAAI,CAAC,KAAK,OAAO,MAAM;AACnB,kBAAQ,QAAQ,KAAK,WAAW,MAAM,CAAC,CAAC;AAAA,QACxD;AAAA,MACA,CAAS;AAAA,IACJ;AAAA,EAhSL;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,SAAS,OAAO;AAChB,SAAK,aAAa,YAAY,KAAK;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,IAAI,WAAW;AACX,WAAO,KAAK,aAAa,UAAU,KAAK;AAAA,EAChD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU,OAAO;AACjB,SAAK,aAAa,aAAa,KAAK;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY;AACZ,WAAO,KAAK,aAAa,WAAW,KAAK;AAAA,EACjD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,MAAM,OAAO;AACb,SAAK,aAAa,SAAS,EAAE;AAAA,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ;AACR,WAAO,KAAK,aAAa,OAAO;AAAA,EACxC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY,OAAO;AACnB,QAAI,MAAO,MAAK,aAAa,gBAAgB,EAAE;AAAA,EACvD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,cAAc;AACd,WAAO,CAAC,CAAC,KAAK,aAAa,cAAc;AAAA,EACjD;AAAA,EAEI,IAAI,aAAa,OAAO;AACpB,QAAI,MAAO,MAAK,aAAa,iBAAiB,EAAE;AAAA,EACxD;AAAA,EAEI,IAAI,eAAe;AACf,WAAO,CAAC,CAAC,KAAK,aAAa,eAAe;AAAA,EAClD;AAAA,EAEI,IAAI,aAAa,OAAO;AACpB,QAAI,MAAO,MAAK,aAAa,iBAAiB,EAAE;AAAA,EACxD;AAAA,EAEI,IAAI,eAAe;AACf,WAAO,CAAC,CAAC,KAAK,aAAa,eAAe;AAAA,EAClD;AAAA;AAAA;AAAA;AAAA;AAAA,EAYI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,WAAW,qBAAqB;AAC5B,WAAO,CAAE;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,KAAK,SAAS,OAAO,QAAQ;AACzB,QAAI,WAAW,SAAS,uBAAwB;AAEhD,SAAK,UAAU,IAAI,QAAQ,KAAK,WAAW,OAAO,IAAI;AAEtD,QAAI,SAAS,SAAS,cAAc,QAAQ;AAC5C,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,UAAU,IAAI,cAAc;AAEnC,aAAS,YAAY,MAAM;AAE3B,SAAK,SAAS;AAEd,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,UAAU,SAAS,OAAO,QAAQ;AAC9B,QAAI,OAAO,SAAS;AAChB,YAAM,YAAY,UAAU,OAAO,SAAS,MAAM,KAAK,MAAM;AAAA,IACzE;AAAA,EAGA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,eAAe,QAAQ;AACnB,QAAI,OAAO,SAAS,cAAc,UAAU;AAC5C,SAAK,aAAa,QAAQ,GAAG;AAC7B,SAAK,aAAa,QAAQ,WAAW;AAErC,QAAI,QAAQ,SAAS,cAAc,YAAY;AAC/C,UAAM,aAAa,QAAQ,MAAM;AACjC,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,aAAa,QAAQ,OAAO;AAClC,UAAM,iBAAiB,SAAS,CAAC,MAAM;AACnC,WAAK,MAAM,CAAC;AAAA,IACxB,CAAS;AAED,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,UAAU,IAAI,eAAe;AACpC,QAAI,KAAK,aAAa,UAAU;AAC5B,aAAO,YAAY,yBAAyB,KAAK,QAAQ;AAE7D,QAAI,aAAa,SAAS,cAAc,MAAM;AAC9C,eAAW,aAAa,QAAQ,QAAQ;AAExC,UAAM,gBAAgB,SAAS,cAAc,KAAK;AAClD,kBAAc,UAAU,IAAI,gBAAgB;AAC5C,kBAAc,aAAa,QAAQ,gBAAgB;AACnD,kBAAc,YAAY,UAAU;AAEpC,QAAI,cAAc,SAAS,cAAc,MAAM;AAE/C,QAAI,OAAO,SAAS,cAAc,KAAK;AACvC,SAAK,aAAa,QAAQ,MAAM;AAChC,SAAK,UAAU,IAAI,gBAAgB;AAEnC,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,aAAa,QAAQ,QAAQ;AACpC,WAAO,UAAU,IAAI,eAAe;AACpC,WAAO,YAAY;AAEnB,QAAI,aAAa,SAAS,cAAc,MAAM;AAC9C,eAAW,aAAa,QAAQ,QAAQ;AAExC,UAAM,YAAY,IAAI;AAEtB,QAAI,CAAC,KAAK,YAAa,QAAO,YAAY,KAAK;AAE/C,WAAO,YAAY,aAAa;AAChC,SAAK,YAAY,WAAW;AAC5B,WAAO,YAAY,UAAU;AAE7B,QAAI,CAAC,KAAK,aAAc,QAAO,YAAY,MAAM;AACjD,WAAO,YAAY,IAAI;AACvB,QAAI,CAAC,KAAK,aAAc,QAAO,YAAY,MAAM;AAAA,EACzD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,MAAM,GAAG;AACL,SAAK,QAAQ,CAAC;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA,EAKI,mBAAmB;;AACf,SAAI,UAAK,WAAL,mBAAa,SAAS;AACtB,YAAM,eAAe,WAAU,UAAK,WAAL,mBAAa,SAAS,MAAM,KAAK,MAAM;AAAA,IAClF;AAAA,EAGA;AAAA;AAAA;AAAA;AAAA,EAKI,WAAW,QAAQ,SAAS;AAAA,EAEhC;AAAA;AAAA;AAAA;AAAA,EAKI,UAAU,QAAQ,SAAS;AAAA,EAE/B;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY,QAAQ,SAAS;AAAA,EAEjC;AAAA;AAAA;AAAA;AAAA,EAKI,WAAW,QAAQ,SAAS;AAAA,EAEhC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA4CI,sBAAsB,QAAQ,SAAS;AACnC,WAAO,iBAAiB,oBAAoB,OAAO,MAAM;AACrD,UAAI,kBAAkB,SAAS,cAAc,KAAK;AAClD,sBAAgB,UAAU,IAAI,kBAAkB;AAEhD,UAAI,OAAO,SAAS,cAAc,UAAU;AAC5C,WAAK,aAAa,QAAQ,UAAU;AACpC,WAAK,aAAa,QAAQ,UAAU;AAEpC,sBAAgB,YAAY,IAAI;AAEhC,UAAI,eAAe,KAAK,OAAO;AAC/B,sBAAgB,MAAM,MAAM,GAAG,YAAY;AAC3C,sBAAgB,MAAM,SAAS,IAAI,YAAY;AAE/C,WAAK,OAAO,YAAY,eAAe;AAEvC,YAAM,QAAO,EACR,KAAK,CAAC,QAAQ;AACX,aAAK,MAAO;AACZ,wBAAgB,OAAQ;AAAA,MAC3B,CAAA,EACA,MAAM,CAAC,QAAQ;AACZ,gBAAQ,MAAM,GAAG;AACjB,wBAAgB,OAAQ;AAAA,MAC5C,CAAiB;AAAA,IACjB,CAAS;AAAA,EACT;AACA;ACjWA,OAAO,OAAO,cAAc,MAAM;"}

package/dist/wje-dropdown.js CHANGED Viewed

@@ -146,9 +146,13 @@ class Dropdown extends WJElement {
    * @returns {boolean} Returns `true` if the `portaled` attribute exists, otherwise `false`.
    */
   get portaled() {
-    return this.getAttribute("portaled");
+    return this.getAttribute("portaled") || "";
   }
-  isPortaled() {
+  /**
+   * Checks whether the element has the 'portaled' attribute.
+   * @returns {boolean} True if the element has the 'portaled' attribute, otherwise false.
+   */
+  get isPortaled() {
     return this.hasAttribute("portaled");
   }
   /**

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 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')) {\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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"}

package/dist/wje-tab-group.js CHANGED Viewed

@@ -12,6 +12,21 @@ class TabGroup extends WJElement {
     super();
     __publicField(this, "className", "TabGroup");
   }
+  /**
+   * Sets the value for the 'variant' attribute of the element.
+   * @param {string} value The value to set for the 'variant' attribute.
+   */
+  set variant(value) {
+    this.setAttribute("variant", value);
+  }
+  /**
+   * Gets the value of the 'variant' attribute.
+   * If the attribute is not set, it defaults to 'top'.
+   * @returns {string} The value of the 'variant' attribute or the default value 'top' if not set.
+   */
+  get variant() {
+    return this.getAttribute("variant") || "top";
+  }
   /**
    * Sets the 'type' attribute of the element to the specified value.
    * @param {string} value The value to set for the 'type' attribute.
@@ -100,7 +115,9 @@ class TabGroup extends WJElement {
     moreDropdown.append(menu);
     header.append(nav);
     nav.append(slotNav);
-    nav.append(moreDropdown);
+    if (this.variant === "top" || this.variant === "bottom") {
+      nav.append(moreDropdown);
+    }
     section.append(slot);
     native.append(header);
     native.append(section);
@@ -122,9 +139,11 @@ class TabGroup extends WJElement {
       if (e.detail.context.hasAttribute("disabled")) return;
       this.setActiveTab(e.detail.context.panel);
     });
-    this.checkOverflow = this.checkOverflow.bind(this);
-    window.addEventListener("resize", this.checkOverflow);
-    requestAnimationFrame(() => this.checkOverflow());
+    if (this.variant === "top" || this.variant === "bottom") {
+      this.checkOverflow = this.checkOverflow.bind(this);
+      window.addEventListener("resize", this.checkOverflow);
+      requestAnimationFrame(() => this.checkOverflow());
+    }
   }
   /**
    * Removes the 'active' class from all panel and tab elements.

package/dist/wje-tab-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"wje-tab-group.js","sources":["../packages/wje-tab-group/tab-group.element.js","../packages/wje-tab-group/tab-group.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/*\n `TabGroup` is a custom web component that represents a group of tabs.\n * @summary This element represents a group of tabs.\n * @documentation https://elements.webjet.sk/components/tab-group\n * @status stable\n * @augments WJElement\n * @param {string} type The type of the tab group. Can be either 'panel' or 'route'.\n * @slot - The default slot for the tab group.\n * @slot nav - Slot for the navigation of the tab group.\n * @cssproperty [--wje-tab-group-padding=1rem] - Specifies the padding inside the tab group. This property defines the space between the content of the tab group and its outer boundary. Accepts any valid CSS length unit (e.g., `px`, `rem`, `em`, `%`).\n * @tag wje-tab-group\n /\n\nexport default class TabGroup extends WJElement {\n /\n Creates an instance of TabGroup.\n * @class\n /\n constructor() {\n super();\n }\n\n /\n Sets the 'type' attribute of the element to the specified value.\n * @param {string} value The value to set for the 'type' attribute.\n /\n set type(value) {\n this.setAttribute('type', value);\n }\n\n /\n Retrieves the `type` attribute of the element.\n * If the `type` attribute is not set, it defaults to `'panel'`.\n * @returns {string} The value of the `type` attribute or the default value `'panel'`.\n /\n get type() {\n return this.getAttribute('type') \|\| 'panel';\n }\n\n className = 'TabGroup';\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 Sets up the attributes for the component.\n /\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /\n Sets up the event listeners before the component is drawn.\n * This method is called before the component is drawn.\n * It is used to set up event listeners.\n /\n beforeDraw() {\n let activeTabName = location.hash.replace('#', '');\n\n // skontrolujeme ci sa nachadza v paneloch\n if (this.getPanelAllName().includes(activeTabName)) {\n window.addEventListener('load', (e) => {\n this.setActiveTab(activeTabName);\n });\n }\n }\n\n /\n Creates and returns a document fragment containing a structured layout for a tab group.\n * The tab group layout includes a `header` section with navigational elements,\n * a `section` element for tab panels, and slots for customization such as additional navigation items,\n * dropdowns, and more.\n * The structure comprises:\n * - A `div` container with relevant styling and part attributes.\n * - A `header` for tabs, including a slot for navigation (`nav`) and additional tabs in a dropdown (`moreDropdown`).\n * - A `section` for tab panels with a customizable `slot`.\n * This function also initializes the `nav` and `moreDropdown` properties for external use.\n * @returns {DocumentFragment} The completed document fragment containing the tab group layout.\n /\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-tab-group');\n\n let header = document.createElement('header');\n header.setAttribute('part', 'tabs');\n header.classList.add('scroll-snap-x');\n\n let nav = document.createElement('nav');\n nav.setAttribute('part', 'nav');\n\n let section = document.createElement('section');\n section.setAttribute('part', 'panels');\n\n let slot = document.createElement('slot');\n\n let slotNav = document.createElement('slot');\n slotNav.setAttribute('name', 'nav');\n\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'dots');\n\n let button = document.createElement('wje-button');\n button.setAttribute('slot', 'trigger');\n button.setAttribute('fill', 'link');\n\n let menu = document.createElement('wje-menu');\n menu.setAttribute('variant', 'context');\n\n let slotMore = document.createElement('slot');\n slotMore.setAttribute('name', 'more');\n\n let moreDropdown = document.createElement('wje-dropdown');\n moreDropdown.setAttribute('placement', 'bottom-end');\n moreDropdown.setAttribute('collapsible', '');\n moreDropdown.classList.add('more-tabs');\n\n button.append(icon);\n\n menu.append(slotMore);\n\n moreDropdown.append(button);\n moreDropdown.append(menu);\n\n header.append(nav);\n\n nav.append(slotNav);\n nav.append(moreDropdown);\n\n section.append(slot);\n\n native.append(header);\n native.append(section);\n\n fragment.append(native);\n\n this.nav = nav;\n this.moreDropdown = moreDropdown;\n\n return fragment;\n }\n\n /\n Executes necessary initializations and attaches event listeners after a drawing operation.\n * Handles active tab selection, 'wje-tab:change' event binding, and window resize event for overflow checking.\n * @returns {void} Does not return a value.\n /\n afterDraw() {\n let activeTab = this.getActiveTab();\n let activeTabName = activeTab ? activeTab[0][this.type] : this.getTabAll()[0][this.type];\n\n this.setActiveTab(activeTabName);\n\n this.addEventListener('wje-tab:change', (e) => {\n if (e.detail.context.hasAttribute('disabled')) return;\n this.setActiveTab(e.detail.context.panel);\n });\n\n this.checkOverflow = this.checkOverflow.bind(this);\n\n window.addEventListener('resize', this.checkOverflow);\n\n requestAnimationFrame(() => this.checkOverflow());\n }\n\n /\n Removes the 'active' class from all panel and tab elements.\n * @returns {void} This method does not return a value.\n /\n removeActiveTab() {\n this.getPanelAll().forEach((el) => {\n el.classList.remove('active');\n });\n\n this.getTabAll().forEach((el) => {\n el.classList.remove('active');\n });\n }\n\n /\n Sets the active tab and panel.\n * @param {string} tab The name of the tab to set as active.\n /\n setActiveTab(tab) {\n this.removeActiveTab();\n\n const el = this.querySelector(`[${this.type}=\"${tab}\"]`)\n el?.classList.add('active');\n\n if(this.type === 'panel')\n this.querySelector(`[name=\"${tab}\"]`)?.classList.add('active');\n\n if(el)\n this.dropdownActive(el);\n }\n\n /\n Returns the currently active tab.\n * @returns {Element\|null} The active tab, or null if no tab is active.\n /\n getActiveTab() {\n let activeTabs = Array.from(this.querySelectorAll('wje-tab.active'));\n return activeTabs.length > 0 ? activeTabs : null;\n }\n\n /\n Returns all tabs.\n * @returns {Array<Element>} An array of all tabs.\n /\n getTabAll() {\n return this.context.querySelector('[name=\"nav\"]').assignedElements();\n }\n\n /\n Returns all panels.\n * @returns {Array<Element>} An array of all panels.\n /\n getPanelAll() {\n return Array.from(this.querySelectorAll('wje-tab-panel'));\n }\n\n /\n Returns the names of all tabs.\n * @returns {Array<string>} An array of all tab names.\n /\n getPanelAllName() {\n return this.getPanelAll().map((el) => el.getAttribute('name'));\n }\n\n /\n Toggles the visibility of the \"more\" dropdown based on the presence of tabs in the \"more\" slot.\n * @returns {void} Does not return a value.\n /\n toggleMoreVisibility() {\n const hasTabsInMore = this.querySelector('wje-tab[slot=\"more\"]');\n this.moreDropdown.hidden = !hasTabsInMore;\n }\n\n /\n Checks if the tabs within a navigation bar overflow the available space.\n * Moves overflowing tabs into a dropdown menu and updates their state accordingly.\n * @returns {void} This method does not return a value.\n /\n checkOverflow() {\n const nav = this.nav;\n const moreBtn = this.moreDropdown;\n const moreWidth = moreBtn.offsetWidth \|\| 48; // fallback ak ešte nie je vykreslený\n\n const tabs = Array.from(this.querySelectorAll('wje-tab'));\n\n // Reset: presunieme všetky taby naspäť do nav slotu\n tabs.forEach(tab => tab.setAttribute('slot', 'nav'));\n\n // Vykreslíme nanovo, aby sa more button správne umiestnil\n requestAnimationFrame(() => {\n const navRight = nav.getBoundingClientRect().right;\n let overflowStarted = false;\n\n for (const tab of tabs) {\n const tabRect = tab.getBoundingClientRect();\n\n // Ak by pretekal vrátane rezervy na more, presunieme ho\n const fits = tabRect.right + moreWidth <= navRight;\n\n if (!fits \|\| overflowStarted) {\n tab.setAttribute('slot', 'more');\n this.dropdownActive(tab);\n overflowStarted = true;\n }\n }\n\n this.toggleMoreVisibility();\n });\n }\n\n /\n Toggles the \"dropdown-active\" class on the element based on its \"active\" status\n * and the value of its \"slot\" attribute.\n * @param {HTMLElement} el The HTML element to evaluate and apply the toggle logic.\n * @returns {void} This method does not return any value.\n */\n dropdownActive(el) {\n if(el.classList.contains('active')) {\n if(el.getAttribute('slot') === 'more')\n this.moreDropdown.classList.add('dropdown-active');\n else\n this.moreDropdown.classList.remove('dropdown-active');\n }\n }\n}\n","import TabGroup from './tab-group.element.js';\n\nexport default TabGroup;\n\nTabGroup.define('wje-tab-group', TabGroup);\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"wje-tab-group.js","sources":["../packages/wje-tab-group/tab-group.element.js","../packages/wje-tab-group/tab-group.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/*\n `TabGroup` is a custom web component that represents a group of tabs.\n * @summary This element represents a group of tabs.\n * @documentation https://elements.webjet.sk/components/tab-group\n * @status stable\n * @augments WJElement\n * @param {string} type The type of the tab group. Can be either 'panel' or 'route'.\n * @slot - The default slot for the tab group.\n * @slot nav - Slot for the navigation of the tab group.\n * @cssproperty [--wje-tab-group-padding=1rem] - Specifies the padding inside the tab group. This property defines the space between the content of the tab group and its outer boundary. Accepts any valid CSS length unit (e.g., `px`, `rem`, `em`, `%`).\n * @tag wje-tab-group\n /\n\nexport default class TabGroup extends WJElement {\n /\n Creates an instance of TabGroup.\n * @class\n /\n constructor() {\n super();\n }\n\n /\n Sets the value for the 'variant' attribute of the element.\n * @param {string} value The value to set for the 'variant' attribute.\n /\n set variant(value) {\n this.setAttribute('variant', value);\n }\n\n /\n Gets the value of the 'variant' attribute.\n * If the attribute is not set, it defaults to 'top'.\n * @returns {string} The value of the 'variant' attribute or the default value 'top' if not set.\n /\n get variant() {\n return this.getAttribute('variant') \|\| 'top';\n }\n\n /\n Sets the 'type' attribute of the element to the specified value.\n * @param {string} value The value to set for the 'type' attribute.\n /\n set type(value) {\n this.setAttribute('type', value);\n }\n\n /\n Retrieves the `type` attribute of the element.\n * If the `type` attribute is not set, it defaults to `'panel'`.\n * @returns {string} The value of the `type` attribute or the default value `'panel'`.\n /\n get type() {\n return this.getAttribute('type') \|\| 'panel';\n }\n\n className = 'TabGroup';\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 Sets up the attributes for the component.\n /\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /\n Sets up the event listeners before the component is drawn.\n * This method is called before the component is drawn.\n * It is used to set up event listeners.\n /\n beforeDraw() {\n let activeTabName = location.hash.replace('#', '');\n\n // skontrolujeme ci sa nachadza v paneloch\n if (this.getPanelAllName().includes(activeTabName)) {\n window.addEventListener('load', (e) => {\n this.setActiveTab(activeTabName);\n });\n }\n }\n\n /\n Creates and returns a document fragment containing a structured layout for a tab group.\n * The tab group layout includes a `header` section with navigational elements,\n * a `section` element for tab panels, and slots for customization such as additional navigation items,\n * dropdowns, and more.\n * The structure comprises:\n * - A `div` container with relevant styling and part attributes.\n * - A `header` for tabs, including a slot for navigation (`nav`) and additional tabs in a dropdown (`moreDropdown`).\n * - A `section` for tab panels with a customizable `slot`.\n * This function also initializes the `nav` and `moreDropdown` properties for external use.\n * @returns {DocumentFragment} The completed document fragment containing the tab group layout.\n /\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-tab-group');\n\n let header = document.createElement('header');\n header.setAttribute('part', 'tabs');\n header.classList.add('scroll-snap-x');\n\n let nav = document.createElement('nav');\n nav.setAttribute('part', 'nav');\n\n let section = document.createElement('section');\n section.setAttribute('part', 'panels');\n\n let slot = document.createElement('slot');\n\n let slotNav = document.createElement('slot');\n slotNav.setAttribute('name', 'nav');\n\n // More dropdown\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', 'dots');\n\n let button = document.createElement('wje-button');\n button.setAttribute('slot', 'trigger');\n button.setAttribute('fill', 'link');\n\n let menu = document.createElement('wje-menu');\n menu.setAttribute('variant', 'context');\n\n let slotMore = document.createElement('slot');\n slotMore.setAttribute('name', 'more');\n\n let moreDropdown = document.createElement('wje-dropdown');\n moreDropdown.setAttribute('placement', 'bottom-end');\n moreDropdown.setAttribute('collapsible', '');\n moreDropdown.classList.add('more-tabs');\n\n // APPEND\n button.append(icon);\n\n menu.append(slotMore);\n\n moreDropdown.append(button);\n moreDropdown.append(menu);\n\n header.append(nav);\n\n nav.append(slotNav);\n\n if(this.variant === 'top' \|\| this.variant === 'bottom') {\n nav.append(moreDropdown);\n }\n\n section.append(slot);\n\n native.append(header);\n native.append(section);\n\n fragment.append(native);\n\n this.nav = nav;\n this.moreDropdown = moreDropdown;\n\n return fragment;\n }\n\n /\n Executes necessary initializations and attaches event listeners after a drawing operation.\n * Handles active tab selection, 'wje-tab:change' event binding, and window resize event for overflow checking.\n * @returns {void} Does not return a value.\n /\n afterDraw() {\n let activeTab = this.getActiveTab();\n let activeTabName = activeTab ? activeTab[0][this.type] : this.getTabAll()[0][this.type];\n\n this.setActiveTab(activeTabName);\n\n this.addEventListener('wje-tab:change', (e) => {\n if (e.detail.context.hasAttribute('disabled')) return;\n this.setActiveTab(e.detail.context.panel);\n });\n\n if(this.variant === 'top' \|\| this.variant === 'bottom') {\n this.checkOverflow = this.checkOverflow.bind(this);\n\n window.addEventListener('resize', this.checkOverflow);\n\n requestAnimationFrame(() => this.checkOverflow());\n }\n }\n\n /\n Removes the 'active' class from all panel and tab elements.\n * @returns {void} This method does not return a value.\n /\n removeActiveTab() {\n this.getPanelAll().forEach((el) => {\n el.classList.remove('active');\n });\n\n this.getTabAll().forEach((el) => {\n el.classList.remove('active');\n });\n }\n\n /\n Sets the active tab and panel.\n * @param {string} tab The name of the tab to set as active.\n /\n setActiveTab(tab) {\n this.removeActiveTab();\n\n const el = this.querySelector(`[${this.type}=\"${tab}\"]`)\n el?.classList.add('active');\n\n if(this.type === 'panel')\n this.querySelector(`[name=\"${tab}\"]`)?.classList.add('active');\n\n if(el)\n this.dropdownActive(el);\n }\n\n /\n Returns the currently active tab.\n * @returns {Element\|null} The active tab, or null if no tab is active.\n /\n getActiveTab() {\n let activeTabs = Array.from(this.querySelectorAll('wje-tab.active'));\n return activeTabs.length > 0 ? activeTabs : null;\n }\n\n /\n Returns all tabs.\n * @returns {Array<Element>} An array of all tabs.\n /\n getTabAll() {\n return this.context.querySelector('[name=\"nav\"]').assignedElements();\n }\n\n /\n Returns all panels.\n * @returns {Array<Element>} An array of all panels.\n /\n getPanelAll() {\n return Array.from(this.querySelectorAll('wje-tab-panel'));\n }\n\n /\n Returns the names of all tabs.\n * @returns {Array<string>} An array of all tab names.\n /\n getPanelAllName() {\n return this.getPanelAll().map((el) => el.getAttribute('name'));\n }\n\n /\n Toggles the visibility of the \"more\" dropdown based on the presence of tabs in the \"more\" slot.\n * @returns {void} Does not return a value.\n /\n toggleMoreVisibility() {\n const hasTabsInMore = this.querySelector('wje-tab[slot=\"more\"]');\n this.moreDropdown.hidden = !hasTabsInMore;\n }\n\n /\n Checks if the tabs within a navigation bar overflow the available space.\n * Moves overflowing tabs into a dropdown menu and updates their state accordingly.\n * @returns {void} This method does not return a value.\n /\n checkOverflow() {\n const nav = this.nav;\n const moreBtn = this.moreDropdown;\n const moreWidth = moreBtn.offsetWidth \|\| 48; // fallback ak ešte nie je vykreslený\n\n const tabs = Array.from(this.querySelectorAll('wje-tab'));\n\n // Reset: presunieme všetky taby naspäť do nav slotu\n tabs.forEach(tab => tab.setAttribute('slot', 'nav'));\n\n // Vykreslíme nanovo, aby sa more button správne umiestnil\n requestAnimationFrame(() => {\n const navRight = nav.getBoundingClientRect().right;\n let overflowStarted = false;\n\n for (const tab of tabs) {\n const tabRect = tab.getBoundingClientRect();\n\n // Ak by pretekal vrátane rezervy na more, presunieme ho\n const fits = tabRect.right + moreWidth <= navRight;\n\n if (!fits \|\| overflowStarted) {\n tab.setAttribute('slot', 'more');\n this.dropdownActive(tab);\n overflowStarted = true;\n }\n }\n\n this.toggleMoreVisibility();\n });\n }\n\n /\n Toggles the \"dropdown-active\" class on the element based on its \"active\" status\n * and the value of its \"slot\" attribute.\n * @param {HTMLElement} el The HTML element to evaluate and apply the toggle logic.\n * @returns {void} This method does not return any value.\n */\n dropdownActive(el) {\n if(el.classList.contains('active')) {\n if(el.getAttribute('slot') === 'more')\n this.moreDropdown.classList.add('dropdown-active');\n else\n this.moreDropdown.classList.remove('dropdown-active');\n }\n }\n}\n","import TabGroup from './tab-group.element.js';\n\nexport default TabGroup;\n\nTabGroup.define('wje-tab-group', TabGroup);\n"],"names":[],"mappings":"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"}

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.237",
+  "version": "0.1.239",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",