wj-elements 0.1.175 → 0.1.177

package/dist/light.css

@@ -383,6 +383,11 @@
     --wje-input-margin-bottom: 0.5rem;
     --wje-input-line-height: 20px;
     --wje-input-slot-padding-inline: 0.5rem;
+    --wje-input-label-display: block;
+    --wje-input-label-margin: 0;
+    --wje-input-label-padding: 0;
+    --wje-input-label-line-height: var(--wje-line-height-normal);
+    --wje-input-label-font-size: var(--wje-font-size);
 
     /* Item */
     --wje-item-color: var(--wje-color);

package/dist/{list.element-Ce1vIm1O.js → list.element-D4-wlFN_.js}

@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import WJElement from "./wje-element.js";
-const styles = "/*\n[ WJ List ]\n*/\n:host {\n  margin: 0;\n  padding: 0;\n  display: block;\n  contain: content;\n  list-style-type: none;\n}\n\n:host(.wje-inset) {\n  background: var(--wje-list-background);\n  transform: translateZ(0);\n  overflow: hidden;\n  padding: var(--wje-list-inset-padding);\n  border-radius: var(--wje-list-border-radius);\n}\n\n:host(.wje-lines-none) ::slotted(wje-item) {\n  --wje-border-width: 0 !important;\n}";
+const styles = "/*\n[ WJ List ]\n*/\n:host {\n  margin: 0;\n  padding: 0;\n  display: block;\n  contain: content;\n  list-style-type: none;\n}\n\n:host(.wje-inset) {\n  background: var(--wje-list-background);\n  transform: translateZ(0);\n  overflow: hidden;\n  padding: var(--wje-list-inset-padding);\n  border-radius: var(--wje-list-border-radius);\n}\n\n:host(.wje-lines-none) ::slotted(wje-item) {\n  --wje-border-width: 0 !important;\n  --wje-item-border-width: 0!important;\n}";
 class List extends WJElement {
   /**
    * Creates an instance of List.
@@ -47,4 +47,4 @@ class List extends WJElement {
 export {
   List as L
 };
-//# sourceMappingURL=list.element-Ce1vIm1O.js.map
+//# sourceMappingURL=list.element-D4-wlFN_.js.map

package/dist/{list.element-Ce1vIm1O.js.map → list.element-D4-wlFN_.js.map}

@@ -1 +1 @@
-{"version":3,"file":"list.element-Ce1vIm1O.js","sources":["../packages/wje-list/list.element.js"],"sourcesContent":["import WJElement from '../wje-element/element.js';\nimport styles from './styles/styles.scss?inline';\n\n/**\n * `List` is a custom web component that represents a list.\n * It extends from `WJElement`.\n * @summary This element represents a list.\n * @documentation https://elements.webjet.sk/components/list\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the list.\n * @cssproperty [--wje-list-inset-padding=1rem] - The padding of the list when it is inset.\n * @cssproperty [--wje-list-border-radius=8px] - The border radius of the list. Accepts any valid CSS length.\n * @cssproperty [--wje-list-background=var(--wje-background)] - The background of the list. Accepts any valid CSS color value.\n * @tag wje-list\n */\nexport default class List extends WJElement {\n    /**\n     * Creates an instance of List.\n     * @class\n     */\n    constructor() {\n        super();\n    }\n\n    className = 'List';\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     * Returns the list of attributes to observe for changes.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let element = document.createElement('slot');\n        fragment.appendChild(element);\n\n        return fragment;\n    }\n\n    /**\n     * Called after the component has been drawn.\n     */\n    afterDraw() {\n        this.classList.toggle('wje-lines-' + this.lines, this.hasAttribute('lines'));\n        this.classList.toggle('wje-inset', this.hasAttribute('inset'));\n    }\n}\n"],"names":[],"mappings":";;;;;AAgBe,MAAM,aAAa,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAKxC,cAAc;AACV,UAAO;AAGX,qCAAY;AAAA,EAFhB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,UAAU,SAAS,cAAc,MAAM;AAC3C,aAAS,YAAY,OAAO;AAE5B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,SAAK,UAAU,OAAO,eAAe,KAAK,OAAO,KAAK,aAAa,OAAO,CAAC;AAC3E,SAAK,UAAU,OAAO,aAAa,KAAK,aAAa,OAAO,CAAC;AAAA,EACrE;AACA;"}
+{"version":3,"file":"list.element-D4-wlFN_.js","sources":["../packages/wje-list/list.element.js"],"sourcesContent":["import WJElement from '../wje-element/element.js';\nimport styles from './styles/styles.scss?inline';\n\n/**\n * `List` is a custom web component that represents a list.\n * It extends from `WJElement`.\n * @summary This element represents a list.\n * @documentation https://elements.webjet.sk/components/list\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the list.\n * @cssproperty [--wje-list-inset-padding=1rem] - The padding of the list when it is inset.\n * @cssproperty [--wje-list-border-radius=8px] - The border radius of the list. Accepts any valid CSS length.\n * @cssproperty [--wje-list-background=var(--wje-background)] - The background of the list. Accepts any valid CSS color value.\n * @tag wje-list\n */\nexport default class List extends WJElement {\n    /**\n     * Creates an instance of List.\n     * @class\n     */\n    constructor() {\n        super();\n    }\n\n    className = 'List';\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     * Returns the list of attributes to observe for changes.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let element = document.createElement('slot');\n        fragment.appendChild(element);\n\n        return fragment;\n    }\n\n    /**\n     * Called after the component has been drawn.\n     */\n    afterDraw() {\n        this.classList.toggle('wje-lines-' + this.lines, this.hasAttribute('lines'));\n        this.classList.toggle('wje-inset', this.hasAttribute('inset'));\n    }\n}\n"],"names":[],"mappings":";;;;;AAgBe,MAAM,aAAa,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAKxC,cAAc;AACV,UAAO;AAGX,qCAAY;AAAA,EAFhB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,UAAU,SAAS,cAAc,MAAM;AAC3C,aAAS,YAAY,OAAO;AAE5B,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;AACR,SAAK,UAAU,OAAO,eAAe,KAAK,OAAO,KAAK,aAAa,OAAO,CAAC;AAC3E,SAAK,UAAU,OAAO,aAAa,KAAK,aAAa,OAAO,CAAC;AAAA,EACrE;AACA;"}

package/dist/localize.js

@@ -18,27 +18,55 @@ class LocalizerDefault {
       console.error(`Language "${this.lang}" not loaded.`);
     }
   }
-  // Vyhľadávanie prekladu podľa kľúča
+  /**
+   * Translates a given translation key based on the currently selected language.
+   * @param {string} key The key representing the text to be translated.
+   * @returns {string} The translated text if available; otherwise, returns the original key.
+   */
   translate(key) {
     var _a;
     const langMap = (_a = this.languages) == null ? void 0 : _a.get(this.currentLang);
     if (!langMap) return key;
     return langMap ? langMap[key] || key : key;
   }
-  // Vyhľadávanie prekladu podľa kľúča a typu čísla
+  /**
+   * Translates a key into a localized string based on the provided count and pluralization type.
+   * @param {string} key The base translation key to be used for fetching the localized string.
+   * @param {number} [count=0] The count value used to determine the pluralization form.
+   * @param {string} [type='cardinal'] The type of pluralization to use, such as 'cardinal' or 'ordinal'.
+   * @returns {string} The translated string, adapted to the pluralization rules and count.
+   */
   translatePlural(key, count = 0, type = "cardinal") {
     const plural = new Intl.PluralRules(this.lang, { type });
     if (count !== void 0) key += "." + plural.select(count);
     return this.translate(key);
   }
-  // Formátovanie čísla podľa aktuálneho jazyka
+  /**
+   * Formats a number according to the specified locale and formatting options.
+   * @param {number} number The numeric value to format.
+   * @param {object} options An object containing formatting options for the number.
+   * @returns {string} The formatted number as a string.
+   */
   formatNumber(number, options) {
     return new Intl.NumberFormat(this.currentLang, options).format(number);
   }
-  // Formátovanie dátumu podľa aktuálneho jazyka
-  formatDate(date) {
-    return new Intl.DateTimeFormat(this.currentLang).format(new Date(date));
+  /**
+   * Formats a given date based on the specified options and the current language setting.
+   * @param {string|Date|number} date The date to format. Can be a Date object, a timestamp, or a date string.
+   * @param {object} options The formatting options to customize the output, as supported by Intl.DateTimeFormat.
+   * @returns {string} The formatted date string based on the specified options and current language.
+   */
+  formatDate(date, options) {
+    return new Intl.DateTimeFormat(this.currentLang, options).format(new Date(date));
   }
+  /**
+   * Formats a relative time string based on a given language, value, unit, and formatting options.
+   * @param {string} lang The language to use for formatting. Defaults to `this.currentLang` if not provided.
+   * @param {number} value The numerical value to format, representing the time difference.
+   * @param {string} [unit] The unit of time to use (e.g., "second", "minute", "hour", "day", "week", "month", "year").
+   * @param {object} [options] An object containing formatting options, such as the style for the numeric representation.
+   * @returns {string} The formatted relative time string in the specified language.
+   */
   relativeTime(lang, value = 0, unit = "day", options = { numeric: "auto" }) {
     lang = lang || this.currentLang;
     return new Intl.RelativeTimeFormat(lang, options).format(value, unit);

package/dist/localize.js.map

@@ -1 +1 @@
-{"version":3,"file":"localize.js","sources":["../packages/localize/localize.js","../packages/utils/localize.js"],"sourcesContent":["// export const translations = new Map();\n\nexport class LocalizerDefault {\n    constructor(element) {\n        this.element = element;\n\n        this.lang = this.element.lang || document.documentElement.lang || 'en-gb';\n        this.dir = this.element.dir || document.documentElement.dir || 'ltr';\n        this.currentLang = 'en-gb';\n\n        this.setLanguage();\n    }\n\n    get languages() {\n        return window.translations;\n    }\n\n    // Nastavenie aktuálneho jazyka\n    setLanguage() {\n        if (this.languages?.has(this.lang)) {\n            this.currentLang = this.lang;\n        } else {\n            console.error(`Language \"${this.lang}\" not loaded.`);\n        }\n    }\n\n    // Vyhľadávanie prekladu podľa kľúča\n    translate(key) {\n        const langMap = this.languages?.get(this.currentLang);\n        if (!langMap) return key;\n        return langMap ? langMap[key] || key : key;\n    }\n\n    // Vyhľadávanie prekladu podľa kľúča a typu čísla\n    translatePlural(key, count = 0, type = 'cardinal') {\n        const plural = new Intl.PluralRules(this.lang, { type: type });\n\n        if (count !== undefined) key += '.' + plural.select(count);\n\n        return this.translate(key);\n    }\n\n    // Formátovanie čísla podľa aktuálneho jazyka\n    formatNumber(number, options) {\n        return new Intl.NumberFormat(this.currentLang, options).format(number);\n    }\n\n    // Formátovanie dátumu podľa aktuálneho jazyka\n    formatDate(date) {\n        return new Intl.DateTimeFormat(this.currentLang).format(new Date(date));\n    }\n\n    relativeTime(lang, value = 0, unit = 'day', options = { numeric: 'auto' }) {\n        lang = lang || this.currentLang;\n        return new Intl.RelativeTimeFormat(lang, options).format(value, unit);\n    }\n}\n\nexport function registerTranslation(...translation) {\n    translation.forEach((t) => {\n        if (!t.code) {\n            console.error(\"Translation object is missing 'code' property:\", t);\n            return;\n        }\n\n        const code = t.code.toLowerCase();\n        if (window.translations.has(code)) {\n            window.translations.set(code, { ...window.translations.get(code), ...t });\n        } else {\n            window.translations.set(code, t);\n        }\n    });\n}\n","import { LocalizerDefault, registerTranslation } from '../localize/localize.js';\n\nexport class Localizer extends LocalizerDefault {\n    constructor(element) {\n        super(element);\n    }\n    static registerTranslation(...translation) {\n        registerTranslation(...translation);\n    }\n}\n"],"names":[],"mappings":"AAEO,MAAM,iBAAiB;AAAA,EAC1B,YAAY,SAAS;AACjB,SAAK,UAAU;AAEf,SAAK,OAAO,KAAK,QAAQ,QAAQ,SAAS,gBAAgB,QAAQ;AAClE,SAAK,MAAM,KAAK,QAAQ,OAAO,SAAS,gBAAgB,OAAO;AAC/D,SAAK,cAAc;AAEnB,SAAK,YAAa;AAAA,EAC1B;AAAA,EAEI,IAAI,YAAY;AACZ,WAAO,OAAO;AAAA,EACtB;AAAA;AAAA,EAGI,cAAc;AAlBlB;AAmBQ,SAAI,UAAK,cAAL,mBAAgB,IAAI,KAAK,OAAO;AAChC,WAAK,cAAc,KAAK;AAAA,IACpC,OAAe;AACH,cAAQ,MAAM,aAAa,KAAK,IAAI,eAAe;AAAA,IAC/D;AAAA,EACA;AAAA;AAAA,EAGI,UAAU,KAAK;AA3BnB;AA4BQ,UAAM,WAAU,UAAK,cAAL,mBAAgB,IAAI,KAAK;AACzC,QAAI,CAAC,QAAS,QAAO;AACrB,WAAO,UAAU,QAAQ,GAAG,KAAK,MAAM;AAAA,EAC/C;AAAA;AAAA,EAGI,gBAAgB,KAAK,QAAQ,GAAG,OAAO,YAAY;AAC/C,UAAM,SAAS,IAAI,KAAK,YAAY,KAAK,MAAM,EAAE,MAAY;AAE7D,QAAI,UAAU,OAAW,QAAO,MAAM,OAAO,OAAO,KAAK;AAEzD,WAAO,KAAK,UAAU,GAAG;AAAA,EACjC;AAAA;AAAA,EAGI,aAAa,QAAQ,SAAS;AAC1B,WAAO,IAAI,KAAK,aAAa,KAAK,aAAa,OAAO,EAAE,OAAO,MAAM;AAAA,EAC7E;AAAA;AAAA,EAGI,WAAW,MAAM;AACb,WAAO,IAAI,KAAK,eAAe,KAAK,WAAW,EAAE,OAAO,IAAI,KAAK,IAAI,CAAC;AAAA,EAC9E;AAAA,EAEI,aAAa,MAAM,QAAQ,GAAG,OAAO,OAAO,UAAU,EAAE,SAAS,UAAU;AACvE,WAAO,QAAQ,KAAK;AACpB,WAAO,IAAI,KAAK,mBAAmB,MAAM,OAAO,EAAE,OAAO,OAAO,IAAI;AAAA,EAC5E;AACA;AAEO,SAAS,uBAAuB,aAAa;AAChD,cAAY,QAAQ,CAAC,MAAM;AACvB,QAAI,CAAC,EAAE,MAAM;AACT,cAAQ,MAAM,kDAAkD,CAAC;AACjE;AAAA,IACZ;AAEQ,UAAM,OAAO,EAAE,KAAK,YAAa;AACjC,QAAI,OAAO,aAAa,IAAI,IAAI,GAAG;AAC/B,aAAO,aAAa,IAAI,MAAM,EAAE,GAAG,OAAO,aAAa,IAAI,IAAI,GAAG,GAAG,EAAC,CAAE;AAAA,IACpF,OAAe;AACH,aAAO,aAAa,IAAI,MAAM,CAAC;AAAA,IAC3C;AAAA,EACA,CAAK;AACL;ACtEO,MAAM,kBAAkB,iBAAiB;AAAA,EAC5C,YAAY,SAAS;AACjB,UAAM,OAAO;AAAA,EACrB;AAAA,EACI,OAAO,uBAAuB,aAAa;AACvC,wBAAoB,GAAG,WAAW;AAAA,EAC1C;AACA;"}
+{"version":3,"file":"localize.js","sources":["../packages/localize/localize.js","../packages/utils/localize.js"],"sourcesContent":["// export const translations = new Map();\n\nexport class LocalizerDefault {\n    constructor(element) {\n        this.element = element;\n\n        this.lang = this.element.lang || document.documentElement.lang || 'en-gb';\n        this.dir = this.element.dir || document.documentElement.dir || 'ltr';\n        this.currentLang = 'en-gb';\n\n        this.setLanguage();\n    }\n\n    get languages() {\n        return window.translations;\n    }\n\n    // Nastavenie aktuálneho jazyka\n    setLanguage() {\n        if (this.languages?.has(this.lang)) {\n            this.currentLang = this.lang;\n        } else {\n            console.error(`Language \"${this.lang}\" not loaded.`);\n        }\n    }\n\n    /**\n     * Translates a given translation key based on the currently selected language.\n     * @param {string} key The key representing the text to be translated.\n     * @returns {string} The translated text if available; otherwise, returns the original key.\n     */\n    translate(key) {\n        const langMap = this.languages?.get(this.currentLang);\n        if (!langMap) return key;\n        return langMap ? langMap[key] || key : key;\n    }\n\n    /**\n     * Translates a key into a localized string based on the provided count and pluralization type.\n     * @param {string} key The base translation key to be used for fetching the localized string.\n     * @param {number} [count=0] The count value used to determine the pluralization form.\n     * @param {string} [type='cardinal'] The type of pluralization to use, such as 'cardinal' or 'ordinal'.\n     * @returns {string} The translated string, adapted to the pluralization rules and count.\n     */\n    translatePlural(key, count = 0, type = 'cardinal') {\n        const plural = new Intl.PluralRules(this.lang, { type: type });\n\n        if (count !== undefined) key += '.' + plural.select(count);\n\n        return this.translate(key);\n    }\n\n    /**\n     * Formats a number according to the specified locale and formatting options.\n     * @param {number} number The numeric value to format.\n     * @param {object} options An object containing formatting options for the number.\n     * @returns {string} The formatted number as a string.\n     */\n    formatNumber(number, options) {\n        return new Intl.NumberFormat(this.currentLang, options).format(number);\n    }\n\n    /**\n     * Formats a given date based on the specified options and the current language setting.\n     * @param {string|Date|number} date The date to format. Can be a Date object, a timestamp, or a date string.\n     * @param {object} options The formatting options to customize the output, as supported by Intl.DateTimeFormat.\n     * @returns {string} The formatted date string based on the specified options and current language.\n     */\n    formatDate(date, options) {\n        return new Intl.DateTimeFormat(this.currentLang, options).format(new Date(date));\n    }\n\n    /**\n     * Formats a relative time string based on a given language, value, unit, and formatting options.\n     * @param {string} lang The language to use for formatting. Defaults to `this.currentLang` if not provided.\n     * @param {number} value The numerical value to format, representing the time difference.\n     * @param {string} [unit] The unit of time to use (e.g., \"second\", \"minute\", \"hour\", \"day\", \"week\", \"month\", \"year\").\n     * @param {object} [options] An object containing formatting options, such as the style for the numeric representation.\n     * @returns {string} The formatted relative time string in the specified language.\n     */\n    relativeTime(lang, value = 0, unit = 'day', options = { numeric: 'auto' }) {\n        lang = lang || this.currentLang;\n        return new Intl.RelativeTimeFormat(lang, options).format(value, unit);\n    }\n}\n\nexport function registerTranslation(...translation) {\n    translation.forEach((t) => {\n        if (!t.code) {\n            console.error(\"Translation object is missing 'code' property:\", t);\n            return;\n        }\n\n        const code = t.code.toLowerCase();\n        if (window.translations.has(code)) {\n            window.translations.set(code, { ...window.translations.get(code), ...t });\n        } else {\n            window.translations.set(code, t);\n        }\n    });\n}\n","import { LocalizerDefault, registerTranslation } from '../localize/localize.js';\n\nexport class Localizer extends LocalizerDefault {\n    constructor(element) {\n        super(element);\n    }\n    static registerTranslation(...translation) {\n        registerTranslation(...translation);\n    }\n}\n"],"names":[],"mappings":"AAEO,MAAM,iBAAiB;AAAA,EAC1B,YAAY,SAAS;AACjB,SAAK,UAAU;AAEf,SAAK,OAAO,KAAK,QAAQ,QAAQ,SAAS,gBAAgB,QAAQ;AAClE,SAAK,MAAM,KAAK,QAAQ,OAAO,SAAS,gBAAgB,OAAO;AAC/D,SAAK,cAAc;AAEnB,SAAK,YAAa;AAAA,EAC1B;AAAA,EAEI,IAAI,YAAY;AACZ,WAAO,OAAO;AAAA,EACtB;AAAA;AAAA,EAGI,cAAc;AAlBlB;AAmBQ,SAAI,UAAK,cAAL,mBAAgB,IAAI,KAAK,OAAO;AAChC,WAAK,cAAc,KAAK;AAAA,IACpC,OAAe;AACH,cAAQ,MAAM,aAAa,KAAK,IAAI,eAAe;AAAA,IAC/D;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,UAAU,KAAK;AA/BnB;AAgCQ,UAAM,WAAU,UAAK,cAAL,mBAAgB,IAAI,KAAK;AACzC,QAAI,CAAC,QAAS,QAAO;AACrB,WAAO,UAAU,QAAQ,GAAG,KAAK,MAAM;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASI,gBAAgB,KAAK,QAAQ,GAAG,OAAO,YAAY;AAC/C,UAAM,SAAS,IAAI,KAAK,YAAY,KAAK,MAAM,EAAE,MAAY;AAE7D,QAAI,UAAU,OAAW,QAAO,MAAM,OAAO,OAAO,KAAK;AAEzD,WAAO,KAAK,UAAU,GAAG;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,aAAa,QAAQ,SAAS;AAC1B,WAAO,IAAI,KAAK,aAAa,KAAK,aAAa,OAAO,EAAE,OAAO,MAAM;AAAA,EAC7E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,WAAW,MAAM,SAAS;AACtB,WAAO,IAAI,KAAK,eAAe,KAAK,aAAa,OAAO,EAAE,OAAO,IAAI,KAAK,IAAI,CAAC;AAAA,EACvF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUI,aAAa,MAAM,QAAQ,GAAG,OAAO,OAAO,UAAU,EAAE,SAAS,UAAU;AACvE,WAAO,QAAQ,KAAK;AACpB,WAAO,IAAI,KAAK,mBAAmB,MAAM,OAAO,EAAE,OAAO,OAAO,IAAI;AAAA,EAC5E;AACA;AAEO,SAAS,uBAAuB,aAAa;AAChD,cAAY,QAAQ,CAAC,MAAM;AACvB,QAAI,CAAC,EAAE,MAAM;AACT,cAAQ,MAAM,kDAAkD,CAAC;AACjE;AAAA,IACZ;AAEQ,UAAM,OAAO,EAAE,KAAK,YAAa;AACjC,QAAI,OAAO,aAAa,IAAI,IAAI,GAAG;AAC/B,aAAO,aAAa,IAAI,MAAM,EAAE,GAAG,OAAO,aAAa,IAAI,IAAI,GAAG,GAAG,EAAC,CAAE;AAAA,IACpF,OAAe;AACH,aAAO,aAAa,IAAI,MAAM,CAAC;AAAA,IAC3C;AAAA,EACA,CAAK;AACL;AClGO,MAAM,kBAAkB,iBAAiB;AAAA,EAC5C,YAAY,SAAS;AACjB,UAAM,OAAO;AAAA,EACrB;AAAA,EACI,OAAO,uBAAuB,aAAa;AACvC,wBAAoB,GAAG,WAAW;AAAA,EAC1C;AACA;"}

package/dist/packages/index.d.ts

@@ -101,4 +101,5 @@ export { default as Tooltip } from './wje-tooltip/tooltip.js';
 export { default as Tree } from './wje-tree/tree.js';
 export { default as TreeItem } from './wje-tree-item/tree-item.js';
 export { default as VisuallyHidden } from './wje-visually-hidden/visually-hidden.js';
+export { registerIconLibrary, unregisterIconLibrary } from './wje-icon/service/library.js';
 export { defaultStoreActions, store } from './wje-store/store.js';

package/dist/packages/localize/localize.d.ts

@@ -7,11 +7,41 @@ export class LocalizerDefault {
     currentLang: string;
     get languages(): any;
     setLanguage(): void;
-    translate(key: any): any;
-    translatePlural(key: any, count?: number, type?: string): any;
-    formatNumber(number: any, options: any): string;
-    formatDate(date: any): string;
-    relativeTime(lang: any, value?: number, unit?: string, options?: {
-        numeric: string;
-    }): string;
+    /**
+     * Translates a given translation key based on the currently selected language.
+     * @param {string} key The key representing the text to be translated.
+     * @returns {string} The translated text if available; otherwise, returns the original key.
+     */
+    translate(key: string): string;
+    /**
+     * Translates a key into a localized string based on the provided count and pluralization type.
+     * @param {string} key The base translation key to be used for fetching the localized string.
+     * @param {number} [count=0] The count value used to determine the pluralization form.
+     * @param {string} [type='cardinal'] The type of pluralization to use, such as 'cardinal' or 'ordinal'.
+     * @returns {string} The translated string, adapted to the pluralization rules and count.
+     */
+    translatePlural(key: string, count?: number, type?: string): string;
+    /**
+     * Formats a number according to the specified locale and formatting options.
+     * @param {number} number The numeric value to format.
+     * @param {object} options An object containing formatting options for the number.
+     * @returns {string} The formatted number as a string.
+     */
+    formatNumber(number: number, options: object): string;
+    /**
+     * Formats a given date based on the specified options and the current language setting.
+     * @param {string|Date|number} date The date to format. Can be a Date object, a timestamp, or a date string.
+     * @param {object} options The formatting options to customize the output, as supported by Intl.DateTimeFormat.
+     * @returns {string} The formatted date string based on the specified options and current language.
+     */
+    formatDate(date: string | Date | number, options: object): string;
+    /**
+     * Formats a relative time string based on a given language, value, unit, and formatting options.
+     * @param {string} lang The language to use for formatting. Defaults to `this.currentLang` if not provided.
+     * @param {number} value The numerical value to format, representing the time difference.
+     * @param {string} [unit] The unit of time to use (e.g., "second", "minute", "hour", "day", "week", "month", "year").
+     * @param {object} [options] An object containing formatting options, such as the style for the numeric representation.
+     * @returns {string} The formatted relative time string in the specified language.
+     */
+    relativeTime(lang: string, value?: number, unit?: string, options?: object): string;
 }

package/dist/packages/wje-color-picker/color-picker.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/packages/wje-element/element.d.ts

@@ -115,7 +115,7 @@ export default class WJElement extends HTMLElement {
      * Gets the rendering context, either the shadow root or the component itself.
      * @returns The rendering context.
      */
-    get context(): this | ShadowRoot;
+    get context(): any;
     /**
      * Gets the store instance.
      * @returns {object} The store instance.
@@ -248,11 +248,6 @@ export default class WJElement extends HTMLElement {
      * Lifecycle method invoked when the component is disconnected from the DOM.
      */
     disconnectedCallback(): void;
-    /**
-     * Enqueues an update for the component.
-     * This method processes the current render promise and then refreshes the component.
-     */
-    enqueueUpdate(): void;
     /**
      * Lifecycle method invoked when an observed attribute changes.
      * @param name The name of the attribute that changed.

package/dist/packages/wje-icon/service/library.d.ts

@@ -0,0 +1,3 @@
+export function getIconLibrary(name: any): any;
+export function registerIconLibrary(name: any, options: any): void;
+export function unregisterIconLibrary(name: any): void;

package/dist/packages/wje-masonry/masonry.element.d.ts

@@ -9,7 +9,7 @@ import { default as WJElement } from '../wje-element/element.js';
  * @csspart native - The native part of the masonry layout.
  * @csspart column - The individual columns in the masonry layout.
  * @slot - The default slot for the masonry layout.
- * @cssproperty [--wje-masonry-gap=1rem] - The gap between items in the masonry layout. Accepts any valid CSS length. Default is 1rem.
+ * @cssproperty [--wje-masonry-layout-gap=1rem] - The gap between items in the masonry layout. Accepts any valid CSS length. Default is 1rem.
  * @cssproperty [--wje-masonry-layout-col-count=1] - The count column in the masonry layout. Accepts any valid CSS length.
  * @tag wje-masonry
  */

package/dist/packages/wje-select/select.element.d.ts

@@ -255,6 +255,7 @@ export default class Select extends WJElement {
      * @returns {Array} The selected value.
      */
     get selected(): any[];
+    get options(): any[];
     /**
      * Sets the trigger value.
      * @param {string} value The trigger value to set.
@@ -313,10 +314,10 @@ export default class Select extends WJElement {
     getSelected(): any[];
     /**
      * Handles the selection change.
-     * @param {Element} option The option that changed.
+     * @param {Element[]} options The option that changed.
      * @param {number} length The length of the selected options.
      */
-    selectionChanged(option?: Element, length?: number): void;
+    selectionChanged(options?: Element[], length?: number): void;
     /**
      * Updates the selected options and their corresponding chips.
      * @param {boolean} [silence] Determines whether to suppress the "wje-select:change" event.
@@ -390,6 +391,7 @@ export default class Select extends WJElement {
      * @param {boolean} [silent] Whether to trigger the change event or not.
      */
     selectOptions(values: any[] | any, silent?: boolean): void;
+    htmlSelectedItem(item: any): any;
     /**
      * @summary Callback function that is called when the custom element is associated with a form.
      * This function adds an event listener to the form's submit event, which validates the input and propagates the validation.
@@ -432,4 +434,5 @@ export default class Select extends WJElement {
      * @returns {boolean} Returns true if all elements in the `elements` array are found within the `options` array, otherwise returns false.
      */
     areAllElementsInOptions(elements: any[], options: any[]): boolean;
+    #private;
 }

package/dist/packages/wje-split-view/split-view.element.d.ts

@@ -8,7 +8,6 @@ import { default as WJElement } from '../wje-element/element.js';
  * @slot start - Slot for the start view.
  * @slot end - Slot for the end view.
  * @slot divider - Slot for the divider.
- * @csspart native-split-view - The native split view wrapper.
  * @csspart wje-divider - The divider of the split view.
  * @cssproperty [--wje-split-view-divider-area=12px] - Defines the interactive area (hitbox) of the divider for resizing. Accepts any valid CSS length unit (e.g., `px`, `rem`, `%`).
  * @cssproperty [--wje-split-view-divider-width=4px] - Specifies the visual width of the divider. Controls how thick the divider appears.

package/dist/packages/wje-tooltip/tooltip.element.d.ts

@@ -25,6 +25,11 @@ export default class Tooltip extends WJElement {
      * @returns {Array} An array of observed attributes
      */
     static get observedAttributes(): any[];
+    /**
+     * Dependencies of the Button element.
+     * @type {object}
+     */
+    dependencies: object;
     /**
      * Set active attribute for the tooltip element.
      * @param value

package/dist/wje-element.js

@@ -9,7 +9,7 @@ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read fr
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _Event_instances, dispatch_fn, _drawingStatus, _isAttached, _isRendering, _originalVisibility, _pristine, _WJElement_instances, refresh_fn, resolveRender_fn;
+var _Event_instances, dispatch_fn, _drawingStatus, _isAttached, _isRendering, _originalVisibility, _pristine, _WJElement_instances, enqueueUpdate_fn, refresh_fn, resolveRender_fn;
 import { store, defaultStoreActions } from "./wje-store.js";
 class UniversalService {
   constructor(props = {}) {
@@ -699,7 +699,7 @@ const _WJElement = class _WJElement extends HTMLElement {
       this.setUpAccessors();
       __privateSet(this, _drawingStatus, this.drawingStatuses.ATTACHED);
       __privateSet(this, _pristine, false);
-      this.enqueueUpdate();
+      __privateMethod(this, _WJElement_instances, enqueueUpdate_fn).call(this);
     }
   }
   /**
@@ -756,15 +756,6 @@ const _WJElement = class _WJElement extends HTMLElement {
     __privateSet(this, _drawingStatus, this.drawingStatuses.DISCONNECTED);
     this.componentCleanup();
   }
-  /**
-   * Enqueues an update for the component.
-   * This method processes the current render promise and then refreshes the component.
-   */
-  enqueueUpdate() {
-    if (!__privateGet(this, _isRendering)) {
-      this.rafId = requestAnimationFrame(() => __privateMethod(this, _WJElement_instances, refresh_fn).call(this));
-    }
-  }
   /**
    * Lifecycle method invoked when an observed attribute changes.
    * @param name The name of the attribute that changed.
@@ -774,7 +765,7 @@ const _WJElement = class _WJElement extends HTMLElement {
   attributeChangedCallback(name, old, newName) {
     if (old !== newName) {
       __privateSet(this, _pristine, false);
-      this.enqueueUpdate();
+      __privateMethod(this, _WJElement_instances, enqueueUpdate_fn).call(this);
     }
   }
   refresh() {
@@ -783,7 +774,7 @@ const _WJElement = class _WJElement extends HTMLElement {
       this.rejectPromise = reject;
     });
     __privateSet(this, _pristine, false);
-    this.enqueueUpdate();
+    __privateMethod(this, _WJElement_instances, enqueueUpdate_fn).call(this);
   }
   stopRenderLoop() {
     if (this.rafId) {
@@ -915,6 +906,15 @@ _isRendering = new WeakMap();
 _originalVisibility = new WeakMap();
 _pristine = new WeakMap();
 _WJElement_instances = new WeakSet();
+/**
+ * Enqueues an update for the component.
+ * This method processes the current render promise and then refreshes the component.
+ */
+enqueueUpdate_fn = function() {
+  if (!__privateGet(this, _isRendering)) {
+    this.rafId = requestAnimationFrame(() => __privateMethod(this, _WJElement_instances, refresh_fn).call(this));
+  }
+};
 refresh_fn = async function() {
   var _a, _b, _c;
   if (__privateGet(this, _isRendering)) {
@@ -939,7 +939,7 @@ refresh_fn = async function() {
       __privateSet(this, _isRendering, false);
       if (!__privateGet(this, _pristine)) {
         __privateSet(this, _pristine, false);
-        this.enqueueUpdate();
+        __privateMethod(this, _WJElement_instances, enqueueUpdate_fn).call(this);
       } else {
         this.finisPromise();
         this.style.visibility = __privateGet(this, _originalVisibility);