imba-localization 0.4.8 → 0.4.10

package/README.md

@@ -10,6 +10,7 @@ A lightweight Imba module for loading and handling JSON-based localization files
 - 🔄 **Smart fallback system** - Falls back to a default language when needed
 - 🧠 **Intuitive access** - Proxy-based access to translation strings
 - 📡 **Event handling** - Support for `onready`, `onchange`, and `onerror` events
+- 🧾 **Type declarations** - Includes package-level TypeScript declarations for editor and language-server imports
 - 🚀 **Simple integration** - Easy to use in any Imba-based web application
 - 🧩 **`<language-selector>`** - Plug and play tag component for switching languages
 
@@ -310,4 +311,4 @@ tag App
       css w:20px h:20px stroke:red
 		  <{svg-arrow-down}>
 			
-```
+```

package/index.d.ts

@@ -0,0 +1,33 @@
+export type LocalizationLanguage = Record<string, any>;
+export type LocalizationLanguages = Record<string, LocalizationLanguage>;
+
+export interface LocalizationErrorState {
+  cache: Record<string, boolean>;
+  throw(code: string, details?: any): void;
+}
+
+export class Localization {
+  constructor(url: string, fallback?: string);
+
+  onready?: () => void;
+  onerror?: (error: string, details?: any) => void;
+  onchange?: (language: string) => void;
+
+  languages: LocalizationLanguages;
+  preferred: string;
+  default: string;
+  ready: boolean;
+  err: LocalizationErrorState;
+
+  active: string;
+
+  [key: string]: any;
+}
+
+export const flags: Record<string, string>;
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "language-selector": HTMLElement;
+  }
+}

package/localization.imba

@@ -1,3 +1,67 @@
+# Emoji flags mapping - comprehensive list by region
+export const flags = {
+	# Europe
+	'gb': '🇬🇧', 'us': '🇺🇸', 'ru': '🇷🇺', 'de': '🇩🇪', 'fr': '🇫🇷',
+	'es': '🇪🇸', 'it': '🇮🇹', 'nl': '🇳🇱', 'pl': '🇵🇱', 'ua': '🇺🇦',
+	'cz': '🇨🇿', 'gr': '🇬🇷', 'hu': '🇭🇺', 'ro': '🇷🇴', 'se': '🇸🇪',
+	'no': '🇳🇴', 'dk': '🇩🇰', 'fi': '🇫🇮', 'pt': '🇵🇹', 'ie': '🇮🇪',
+	'be': '🇧🇪', 'at': '🇦🇹', 'ch': '🇨🇭', 'sk': '🇸🇰', 'bg': '🇧🇬',
+	'hr': '🇭🇷', 'rs': '🇷🇸', 'si': '🇸🇮', 'lt': '🇱🇹', 'lv': '🇱🇻',
+	'ee': '🇪🇪', 'is': '🇮🇸', 'lu': '🇱🇺', 'mt': '🇲🇹', 'cy': '🇨🇾',
+	'ba': '🇧🇦', 'mk': '🇲🇰', 'al': '🇦🇱', 'md': '🇲🇩', 'me': '🇲🇪',
+	'by': '🇧🇾', 'ru': '🇷🇺', 'ge': '🇬🇪', 'am': '🇦🇲', 'az': '🇦🇿',
+	
+	# Asia
+	'cn': '🇨🇳', 'jp': '🇯🇵', 'kr': '🇰🇷', 'in': '🇮🇳', 'id': '🇮🇩',
+	'th': '🇹🇭', 'vn': '🇻🇳', 'ph': '🇵🇭', 'sg': '🇸🇬', 'my': '🇲🇾',
+	'hk': '🇭🇰', 'tw': '🇹🇼', 'pk': '🇵🇰', 'bd': '🇧🇩', 'lk': '🇱🇰',
+	'kh': '🇰🇭', 'la': '🇱🇦', 'mm': '🇲🇲', 'bn': '🇧🇳', 'mo': '🇲🇴',
+	'mn': '🇲🇳', 'np': '🇳🇵', 'bt': '🇧🇹', 'mv': '🇲🇻', 'kz': '🇰🇿',
+	'uz': '🇺🇿', 'tm': '🇹🇲', 'kg': '🇰🇬', 'tj': '🇹🇯', 'af': '🇦🇫',
+	
+	# Middle East
+	'tr': '🇹🇷', 'il': '🇮🇱', 'ae': '🇦🇪', 'sa': '🇸🇦', 'qa': '🇶🇦',
+	'kw': '🇰🇼', 'bh': '🇧🇭', 'om': '🇴🇲', 'jo': '🇯🇴', 'lb': '🇱🇧',
+	'iq': '🇮🇶', 'ir': '🇮🇷', 'sy': '🇸🇾', 'ye': '🇾🇪', 'ps': '🇵🇸',
+	
+	# Americas
+	'br': '🇧🇷', 'mx': '🇲🇽', 'ca': '🇨🇦', 'ar': '🇦🇷', 'cl': '🇨🇱',
+	'co': '🇨🇴', 'pe': '🇵🇪', 've': '🇻🇪', 'ec': '🇪🇨', 'uy': '🇺🇾',
+	'py': '🇵🇾', 'bo': '🇧🇴', 'cr': '🇨🇷', 'pa': '🇵🇦', 'gt': '🇬🇹',
+	'cu': '🇨🇺', 'do': '🇩🇴', 'hn': '🇭🇳', 'sv': '🇸🇻', 'ni': '🇳🇮',
+	'jm': '🇯🇲', 'tt': '🇹🇹', 'bs': '🇧🇸', 'bb': '🇧🇧', 'pr': '🇵🇷',
+	
+	# Africa
+	'za': '🇿🇦', 'eg': '🇪🇬', 'ng': '🇳🇬', 'ke': '🇰🇪', 'gh': '🇬🇭',
+	'ma': '🇲🇦', 'dz': '🇩🇿', 'tn': '🇹🇳', 'et': '🇪🇹', 'tz': '🇹🇿',
+	'ug': '🇺🇬', 'zw': '🇿🇼', 'ao': '🇦🇴', 'cm': '🇨🇲', 'ci': '🇨🇮',
+	'cd': '🇨🇩', 'sn': '🇸🇳', 'ml': '🇲🇱', 'bf': '🇧🇫', 'ne': '🇳🇪',
+	'tg': '🇹🇬', 'bw': '🇧🇼', 'na': '🇳🇦', 'mz': '🇲🇿', 'mg': '🇲🇬',
+	
+	# Oceania
+	'au': '🇦🇺', 'nz': '🇳🇿', 'fj': '🇫🇯', 'pg': '🇵🇬', 'ws': '🇼🇸',
+	'to': '🇹🇴', 'vu': '🇻🇺', 'sb': '🇸🇧', 'nc': '🇳🇨', 'pf': '🇵🇫',
+	'gu': '🇬🇺', 'as': '🇦🇸', 'ck': '🇨🇰', 'nu': '🇳🇺', 'tk': '🇹🇰',
+	
+	# Caribbean & Atlantic
+	'bm': '🇧🇲', 'ky': '🇰🇾', 'vi': '🇻🇮', 'ag': '🇦🇬', 'dm': '🇩🇲',
+	'gd': '🇬🇩', 'kn': '🇰🇳', 'lc': '🇱🇨', 'vc': '🇻🇨', 'ai': '🇦🇮',
+	'ms': '🇲🇸', 'gp': '🇬🇵', 'mq': '🇲🇶', 'gf': '🇬🇫', 'aw': '🇦🇼',
+	'cw': '🇨🇼', 'sx': '🇸🇽', 'bq': '🇧🇶', 'tc': '🇹🇨', 'vg': '🇻🇬',
+	
+	# Indian Ocean
+	'mu': '🇲🇺', 'sc': '🇸🇨', 're': '🇷🇪', 'yt': '🇾🇹', 'km': '🇰🇲',
+	'mv': '🇲🇻', 'io': '🇮🇴', 'cx': '🇨🇽', 'cc': '🇨🇨', 'hm': '🇭🇲',
+	
+	# Arctic & Antarctic
+	'gl': '🇬🇱', 'fo': '🇫🇴', 'sj': '🇸🇯', 'ax': '🇦🇽', 'tf': '🇹🇫',
+	'bv': '🇧🇻', 'gs': '🇬🇸', 'aq': '🇦🇶', 'tf': '🇹🇫',
+	
+	# Special territories
+	'eu': '🇪🇺', 'un': '🇺🇳', 'ac': '🇦🇨', 'ta': '🇹🇦', 'cp': '🇨🇵',
+	'dg': '🇩🇬', 'ea': '🇪🇦', 'ic': '🇮🇨', 'xk': '🇽🇰'
+}
+
 export class Localization
 	onready
 	onerror
@@ -65,70 +129,6 @@ export class Localization
 
 export const path-arrow-down = <path d="M213.66,165.66a8,8,0,0,1-11.32,0L128,91.31,53.66,165.66a8,8,0,0,1-11.32-11.32l80-80a8,8,0,0,1,11.32,0l80,80A8,8,0,0,1,213.66,165.66Z">
 
-# Emoji flags mapping - comprehensive list by region
-const flags = {
-	# Europe
-	'gb': '🇬🇧', 'us': '🇺🇸', 'ru': '🇷🇺', 'de': '🇩🇪', 'fr': '🇫🇷',
-	'es': '🇪🇸', 'it': '🇮🇹', 'nl': '🇳🇱', 'pl': '🇵🇱', 'ua': '🇺🇦',
-	'cz': '🇨🇿', 'gr': '🇬🇷', 'hu': '🇭🇺', 'ro': '🇷🇴', 'se': '🇸🇪',
-	'no': '🇳🇴', 'dk': '🇩🇰', 'fi': '🇫🇮', 'pt': '🇵🇹', 'ie': '🇮🇪',
-	'be': '🇧🇪', 'at': '🇦🇹', 'ch': '🇨🇭', 'sk': '🇸🇰', 'bg': '🇧🇬',
-	'hr': '🇭🇷', 'rs': '🇷🇸', 'si': '🇸🇮', 'lt': '🇱🇹', 'lv': '🇱🇻',
-	'ee': '🇪🇪', 'is': '🇮🇸', 'lu': '🇱🇺', 'mt': '🇲🇹', 'cy': '🇨🇾',
-	'ba': '🇧🇦', 'mk': '🇲🇰', 'al': '🇦🇱', 'md': '🇲🇩', 'me': '🇲🇪',
-	'by': '🇧🇾', 'ru': '🇷🇺', 'ge': '🇬🇪', 'am': '🇦🇲', 'az': '🇦🇿',
-	
-	# Asia
-	'cn': '🇨🇳', 'jp': '🇯🇵', 'kr': '🇰🇷', 'in': '🇮🇳', 'id': '🇮🇩',
-	'th': '🇹🇭', 'vn': '🇻🇳', 'ph': '🇵🇭', 'sg': '🇸🇬', 'my': '🇲🇾',
-	'hk': '🇭🇰', 'tw': '🇹🇼', 'pk': '🇵🇰', 'bd': '🇧🇩', 'lk': '🇱🇰',
-	'kh': '🇰🇭', 'la': '🇱🇦', 'mm': '🇲🇲', 'bn': '🇧🇳', 'mo': '🇲🇴',
-	'mn': '🇲🇳', 'np': '🇳🇵', 'bt': '🇧🇹', 'mv': '🇲🇻', 'kz': '🇰🇿',
-	'uz': '🇺🇿', 'tm': '🇹🇲', 'kg': '🇰🇬', 'tj': '🇹🇯', 'af': '🇦🇫',
-	
-	# Middle East
-	'tr': '🇹🇷', 'il': '🇮🇱', 'ae': '🇦🇪', 'sa': '🇸🇦', 'qa': '🇶🇦',
-	'kw': '🇰🇼', 'bh': '🇧🇭', 'om': '🇴🇲', 'jo': '🇯🇴', 'lb': '🇱🇧',
-	'iq': '🇮🇶', 'ir': '🇮🇷', 'sy': '🇸🇾', 'ye': '🇾🇪', 'ps': '🇵🇸',
-	
-	# Americas
-	'br': '🇧🇷', 'mx': '🇲🇽', 'ca': '🇨🇦', 'ar': '🇦🇷', 'cl': '🇨🇱',
-	'co': '🇨🇴', 'pe': '🇵🇪', 've': '🇻🇪', 'ec': '🇪🇨', 'uy': '🇺🇾',
-	'py': '🇵🇾', 'bo': '🇧🇴', 'cr': '🇨🇷', 'pa': '🇵🇦', 'gt': '🇬🇹',
-	'cu': '🇨🇺', 'do': '🇩🇴', 'hn': '🇭🇳', 'sv': '🇸🇻', 'ni': '🇳🇮',
-	'jm': '🇯🇲', 'tt': '🇹🇹', 'bs': '🇧🇸', 'bb': '🇧🇧', 'pr': '🇵🇷',
-	
-	# Africa
-	'za': '🇿🇦', 'eg': '🇪🇬', 'ng': '🇳🇬', 'ke': '🇰🇪', 'gh': '🇬🇭',
-	'ma': '🇲🇦', 'dz': '🇩🇿', 'tn': '🇹🇳', 'et': '🇪🇹', 'tz': '🇹🇿',
-	'ug': '🇺🇬', 'zw': '🇿🇼', 'ao': '🇦🇴', 'cm': '🇨🇲', 'ci': '🇨🇮',
-	'cd': '🇨🇩', 'sn': '🇸🇳', 'ml': '🇲🇱', 'bf': '🇧🇫', 'ne': '🇳🇪',
-	'tg': '🇹🇬', 'bw': '🇧🇼', 'na': '🇳🇦', 'mz': '🇲🇿', 'mg': '🇲🇬',
-	
-	# Oceania
-	'au': '🇦🇺', 'nz': '🇳🇿', 'fj': '🇫🇯', 'pg': '🇵🇬', 'ws': '🇼🇸',
-	'to': '🇹🇴', 'vu': '🇻🇺', 'sb': '🇸🇧', 'nc': '🇳🇨', 'pf': '🇵🇫',
-	'gu': '🇬🇺', 'as': '🇦🇸', 'ck': '🇨🇰', 'nu': '🇳🇺', 'tk': '🇹🇰',
-	
-	# Caribbean & Atlantic
-	'bm': '🇧🇲', 'ky': '🇰🇾', 'vi': '🇻🇮', 'ag': '🇦🇬', 'dm': '🇩🇲',
-	'gd': '🇬🇩', 'kn': '🇰🇳', 'lc': '🇱🇨', 'vc': '🇻🇨', 'ai': '🇦🇮',
-	'ms': '🇲🇸', 'gp': '🇬🇵', 'mq': '🇲🇶', 'gf': '🇬🇫', 'aw': '🇦🇼',
-	'cw': '🇨🇼', 'sx': '🇸🇽', 'bq': '🇧🇶', 'tc': '🇹🇨', 'vg': '🇻🇬',
-	
-	# Indian Ocean
-	'mu': '🇲🇺', 'sc': '🇸🇨', 're': '🇷🇪', 'yt': '🇾🇹', 'km': '🇰🇲',
-	'mv': '🇲🇻', 'io': '🇮🇴', 'cx': '🇨🇽', 'cc': '🇨🇨', 'hm': '🇭🇲',
-	
-	# Arctic & Antarctic
-	'gl': '🇬🇱', 'fo': '🇫🇴', 'sj': '🇸🇯', 'ax': '🇦🇽', 'tf': '🇹🇫',
-	'bv': '🇧🇻', 'gs': '🇬🇸', 'aq': '🇦🇶', 'tf': '🇹🇫',
-	
-	# Special territories
-	'eu': '🇪🇺', 'un': '🇺🇳', 'ac': '🇦🇨', 'ta': '🇹🇦', 'cp': '🇨🇵',
-	'dg': '🇩🇬', 'ea': '🇪🇦', 'ic': '🇮🇨', 'xk': '🇽🇰'
-}
-
 tag language-selector
 	state
 	#dropdown = false
@@ -136,9 +136,6 @@ tag language-selector
 	passive = false
 	first = true  # Show selected language first in dropdown
 
-	def setup
-		data = state.active
-
 	def onselect key
 		#dropdown = false
 		data = key
@@ -195,22 +192,23 @@ tag language-selector
 		.text fs:13px bd:1px solid transparent
 
 	<self [pos:rel] @mouseenter=mouseenter @mouseleave=mouseleave @click=click>
-		<div.container [pos:rel d:hcc] .active=#dropdown [cursor:pointer]=(Object.keys(state.languages).length > 1)>
-			<span.flag> flag(state[data])
-			<div.name> name(state[data])
-			if Object.keys(state.languages).length > 1
-				<svg.arrow [ead:$ease] .active=#dropdown viewBox="0 0 256 256">
-					<{arrow}>
+			<global @click.outside=(do #dropdown = false)>
+			<div.container [pos:rel d:hcc] .active=#dropdown [cursor:pointer]=(Object.keys(state.languages).length > 1)>
+				<span.flag> flag(state.languages[data])
+				<div.name> name(state.languages[data])
+				if Object.keys(state.languages).length > 1
+					<svg.arrow [ead:$ease] .active=#dropdown viewBox="0 0 256 256">
+						<{arrow}>
 
-		if #dropdown and Object.keys(state.languages).length > 1
-			<div$menu.menu [pos:abs w:100% > max-content o@off:0] ease>
-				# Current language first (if first is true)
-				if first
-					<div.item @click.trap=onselect(data)>
-						<span.icon> flag(state[data])
-						<span.text> name(state[data])
-				# Other languages
-				for own key, value of state.languages
-					<div.item @click.trap=onselect(key) [d:none]=(key == data && first)>
-						<span.icon> flag(value)
-						<span.text> name(value)
+			if #dropdown and Object.keys(state.languages).length > 1
+				<div$menu.menu [pos:abs w:100% > max-content o@off:0] ease>
+					# Current language first (if first is true)
+					if first
+						<div.item>
+							<span.icon> flag(state.languages[data])
+							<span.text> name(state.languages[data])
+					# Other languages
+					for own key, value of state.languages
+						<div.item @click.trap=onselect(key) [d:none]=(key == data && first)>
+							<span.icon> flag(value)
+							<span.text> name(value)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "imba-localization",
-  "version": "0.4.8",
+  "version": "0.4.10",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/HeapVoid/imba-localization.git"
@@ -8,11 +8,25 @@
   "main": "localization.imba",
   "module": "localization.imba",
   "browser": "localization.imba",
+  "types": "index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./localization.imba",
+      "default": "./localization.imba"
+    },
+    "./localization.imba": {
+      "types": "./index.d.ts",
+      "import": "./localization.imba",
+      "default": "./localization.imba"
+    }
+  },
   "description": "A class to make using language localizations in Imba easier.",
   "keywords": ["imba", "theme", "localization"],
   "license": "MIT",
   "type": "module",
   "files": [
-    "localization.imba"
+    "localization.imba",
+    "index.d.ts"
   ]
-}
+}