@maggioli-design-system/mds-input-range 1.2.0 → 1.2.2

package/dist/collection/common/locale.js

@@ -1,20 +1,19 @@
 import Handlebars from "handlebars";
 export class Locale {
     constructor(configData) {
-        this.defaultLanguage = 'en';
+        this.rollbackLanguage = 'en';
         this.lang = (element) => {
-            const closestElement = element.closest('[lang]');
-            if (closestElement) {
-                if (closestElement.lang) {
-                    this.language = closestElement.lang;
+            this.closestElement = element.closest('[lang]');
+            if (this.closestElement) {
+                if (this.closestElement.lang) {
+                    this.language = this.closestElement.lang;
                     return;
                 }
             }
-            this.language = this.defaultLanguage;
+            this.language = this.rollbackLanguage;
         };
         this.pluralize = (tag, context) => {
-            var _a;
-            const languagePhrase = (_a = this.config[this.language][tag]) !== null && _a !== void 0 ? _a : this.config[this.defaultLanguage][tag];
+            const languagePhrase = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
             const phrases = [];
             if (Array.isArray(languagePhrase)) {
                 phrases.push(languagePhrase[0]);
@@ -39,11 +38,10 @@ export class Locale {
             return template(context);
         };
         this.get = (tag, context) => {
-            var _a;
             if (context) {
                 return this.pluralize(tag, context);
             }
-            return (_a = this.config[this.language][tag]) !== null && _a !== void 0 ? _a : this.config[this.defaultLanguage][tag];
+            return this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
         };
         this.config = configData;
     }

package/dist/collection/type/language.js

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

package/dist/documentation.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-09-05T13:46:08",
+  "timestamp": "2024-09-17T05:58:24",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.21.0",

package/dist/stats.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-09-05T13:46:08",
+  "timestamp": "2024-09-17T05:58:24",
   "compiler": {
     "name": "node",
     "version": "20.10.0"
@@ -9,11 +9,11 @@
     "fsNamespace": "mds-input-range",
     "components": 1,
     "entries": 1,
-    "bundles": 89,
+    "bundles": 90,
     "outputs": [
       {
         "name": "dist-collection",
-        "files": 41,
+        "files": 42,
         "generatedFiles": [
           "./dist/collection/common/aria.js",
           "./dist/collection/common/file.js",
@@ -50,6 +50,7 @@
           "./dist/collection/type/floating-ui.js",
           "./dist/collection/type/form-rel.js",
           "./dist/collection/type/input.js",
+          "./dist/collection/type/language.js",
           "./dist/collection/type/loading.js",
           "./dist/collection/type/preference.js",
           "./dist/collection/type/text.js",
@@ -683,6 +684,7 @@
     "./src/type/floating-ui.ts": [],
     "./src/type/form-rel.ts": [],
     "./src/type/input.ts": [],
+    "./src/type/language.ts": [],
     "./src/type/loading.ts": [],
     "./src/type/preference.ts": [],
     "./src/type/text.ts": [],

package/dist/types/common/locale.d.ts

@@ -1,12 +1,14 @@
 type LocaleConfig = {
+    el?: Record<string, string | string[]>;
+    en: Record<string, string | string[]>;
+    es?: Record<string, string | string[]>;
     it?: Record<string, string | string[]>;
-    en?: Record<string, string | string[]>;
-    gr?: Record<string, string | string[]>;
 };
 export declare class Locale {
-    defaultLanguage: string;
+    rollbackLanguage: string;
     language: string;
     config: LocaleConfig;
+    closestElement: HTMLElement;
     constructor(configData: LocaleConfig);
     lang: (element: HTMLElement) => void;
     private pluralize;

package/dist/types/type/language.d.ts

@@ -0,0 +1 @@
+export type LanguageType = 'auto' | `${Lowercase<string>}${Lowercase<string>}` | `${Lowercase<string>}${Lowercase<string>}${Lowercase<string>}`;

package/dist/types/type/preference.d.ts

@@ -1,2 +1,2 @@
-export type UIPreferenceType = 'animation' | 'consumption' | 'contrast' | 'theme';
+export type UIPreferenceType = 'animation' | 'consumption' | 'contrast' | 'theme' | 'language';
 export type ConsumptionModeType = 'high' | 'medium' | 'low';

package/documentation.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-09-05T13:13:09",
+  "timestamp": "2024-09-17T03:14:28",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.21.0",
@@ -293,7 +293,7 @@
       "path": "src/components/mds-chip/meta/interface.ts"
     },
     "src/components/mds-dropdown/meta/types.ts::DropdownInteractionType": {
-      "declaration": "export type DropdownInteractionType =\n  | 'click'\n  | 'mouseover'",
+      "declaration": "export type DropdownInteractionType =\n  | 'click'\n  | 'none'\n  | 'mouseover'",
       "docstring": "",
       "path": "src/components/mds-dropdown/meta/types.ts"
     },
@@ -507,6 +507,11 @@
       "docstring": "",
       "path": "src/components/mds-pref-animation/meta/types.ts"
     },
+    "src/event-detail/preference.ts::MdsPrefChangeEventDetail": {
+      "declaration": "export interface MdsPrefChangeEventDetail {\n  preference: UIPreferenceType\n}",
+      "docstring": "",
+      "path": "src/event-detail/preference.ts"
+    },
     "src/type/preference.ts::ConsumptionModeType": {
       "declaration": "export type ConsumptionModeType =\n  | 'high'\n  | 'medium'\n  | 'low'",
       "docstring": "",
@@ -517,6 +522,16 @@
       "docstring": "",
       "path": "src/components/mds-pref-contrast/meta/types.ts"
     },
+    "src/type/language.ts::LanguageType": {
+      "declaration": "export type LanguageType =\n  | 'auto'\n  | `${Lowercase<string>}${Lowercase<string>}`\n  | `${Lowercase<string>}${Lowercase<string>}${Lowercase<string>}`",
+      "docstring": "",
+      "path": "src/type/language.ts"
+    },
+    "src/event-detail/language.ts::MdsPrefLanguageEventDetail": {
+      "declaration": "export interface MdsPrefLanguageEventDetail {\n  language?: LanguageType\n}",
+      "docstring": "",
+      "path": "src/event-detail/language.ts"
+    },
     "src/components/mds-pref-theme/meta/types.ts::ThemeModeType": {
       "declaration": "export type ThemeModeType =\n  | 'light'\n  | 'dark'\n  | 'system'",
       "docstring": "",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maggioli-design-system/mds-input-range",
-  "version": "1.2.0",
+  "version": "1.2.2",
   "description": "mds-input-range is a web-component from Magma Design System, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScirpt framework you are using.",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -24,8 +24,8 @@
     "test": "stencil test --spec --e2e"
   },
   "dependencies": {
-    "@maggioli-design-system/styles": "15.3.0",
-    "@maggioli-design-system/mds-text": "4.4.0",
+    "@maggioli-design-system/styles": "15.3.2",
+    "@maggioli-design-system/mds-text": "4.4.2",
     "@stencil/core": "4.21.0"
   },
   "license": "MIT",

package/src/common/locale.ts

@@ -1,35 +1,39 @@
 import Handlebars from 'handlebars'
 
 type LocaleConfig = {
+  el?: Record<string, string | string[]>
+  en: Record<string, string | string[]>
+  es?: Record<string, string | string[]>
   it?: Record<string, string | string[]>
-  en?: Record<string, string | string[]>
-  gr?: Record<string, string | string[]>
 }
 
 export class Locale {
-  defaultLanguage: string = 'en'
+  rollbackLanguage: string = 'en'
   language: string
   config: LocaleConfig
+  closestElement:HTMLElement
 
   constructor (configData: LocaleConfig) {
     this.config = configData
   }
 
   lang = (element: HTMLElement): void => {
-    const closestElement:HTMLElement = element.closest('[lang]') as HTMLElement
-    if (closestElement) {
-      if (closestElement.lang) {
-        this.language = closestElement.lang
+    this.closestElement = element.closest('[lang]') as HTMLElement
+
+    
+    if (this.closestElement) {
+      if (this.closestElement.lang) {
+        this.language = this.closestElement.lang
         return
       }
     }
 
-    this.language = this.defaultLanguage
+    this.language = this.rollbackLanguage
   }
 
   private pluralize = (tag: string | string[], context: Record<string, string | number>): string => {
 
-    const languagePhrase: string | string[] = this.config[this.language][tag] ?? this.config[this.defaultLanguage][tag]
+    const languagePhrase: string | string[] = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag]
     const phrases: string[] = []
     
     if (Array.isArray(languagePhrase)) {
@@ -61,6 +65,6 @@ export class Locale {
     if (context) {
       return this.pluralize(tag, context)
     }
-    return this.config[this.language][tag] ?? this.config[this.defaultLanguage][tag]
+    return this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag]
   }
 }

package/src/type/language.ts

@@ -0,0 +1,4 @@
+export type LanguageType =
+  | 'auto'
+  | `${Lowercase<string>}${Lowercase<string>}`
+  | `${Lowercase<string>}${Lowercase<string>}${Lowercase<string>}`

package/src/type/preference.ts

@@ -3,6 +3,7 @@ export type UIPreferenceType =
   | 'consumption'
   | 'contrast'
   | 'theme'
+  | 'language'
 
 export type ConsumptionModeType =
   | 'high'