upgrade localization lib

docs/resources/changelog.md

@@ -13,6 +13,8 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
 - Improved RTL animations for `<sl-drawer>` [#784](https://github.com/shoelace-style/shoelace/issues/784)
 - Improved RTL styles for `<sl-button-group>` [#783](https://github.com/shoelace-style/shoelace/issues/783)
 - Improved RTL styles for the toast stack [#785](https://github.com/shoelace-style/shoelace/issues/785)
+- Improved typings for translations and localized terms
+- Upgraded @shoelace-style/localize to 3.0
 
 ## 2.0.0-beta.75
 

package-lock.json

@@ -12,7 +12,7 @@
         "@floating-ui/dom": "^0.5.2",
         "@lit-labs/react": "^1.0.4",
         "@shoelace-style/animations": "^1.1.0",
-        "@shoelace-style/localize": "^2.2.1",
+        "@shoelace-style/localize": "^3.0.0",
         "color": "4.2",
         "lit": "^2.2.5",
         "qr-creator": "^1.0.0"
@@ -960,9 +960,9 @@
       }
     },
     "node_modules/@shoelace-style/localize": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@shoelace-style/localize/-/localize-2.2.1.tgz",
-      "integrity": "sha512-bzKaqla+yF4qQhgZAaURq1HKtTP8fwIvIxcDw9JqHjophuMR1MI2xl1SnhFTYJhlQRctdKs2imZvFVtg5WERjQ=="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@shoelace-style/localize/-/localize-3.0.0.tgz",
+      "integrity": "sha512-V+MWxPcTouKBK84t49v8+XE2AAffEIly7chn4md2i7+5wRqrk1uDBjkt8zxKXUx7CWeHT/i/oftjvWVhHRmC1A=="
     },
     "node_modules/@sindresorhus/is": {
       "version": "0.7.0",
@@ -14837,9 +14837,9 @@
       "integrity": "sha512-Be+cahtZyI2dPKRm8EZSx3YJQ+jLvEcn3xzRP7tM4tqBnvd/eW/64Xh0iOf0t2w5P8iJKfdBbpVNE9naCaOf2g=="
     },
     "@shoelace-style/localize": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@shoelace-style/localize/-/localize-2.2.1.tgz",
-      "integrity": "sha512-bzKaqla+yF4qQhgZAaURq1HKtTP8fwIvIxcDw9JqHjophuMR1MI2xl1SnhFTYJhlQRctdKs2imZvFVtg5WERjQ=="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@shoelace-style/localize/-/localize-3.0.0.tgz",
+      "integrity": "sha512-V+MWxPcTouKBK84t49v8+XE2AAffEIly7chn4md2i7+5wRqrk1uDBjkt8zxKXUx7CWeHT/i/oftjvWVhHRmC1A=="
     },
     "@sindresorhus/is": {
       "version": "0.7.0",

package.json

@@ -55,7 +55,7 @@
     "@floating-ui/dom": "^0.5.2",
     "@lit-labs/react": "^1.0.4",
     "@shoelace-style/animations": "^1.1.0",
-    "@shoelace-style/localize": "^2.2.1",
+    "@shoelace-style/localize": "^3.0.0",
     "color": "4.2",
     "lit": "^2.2.5",
     "qr-creator": "^1.0.0"

src/utilities/localize.ts

@@ -1,5 +1,29 @@
-// Register English as the default/fallback language
-import '../translations/en';
+import { LocalizeController as DefaultLocalizationController } from '@shoelace-style/localize';
+import '../translations/en'; // Register English as the default/fallback language
+import type { Translation as DefaultTranslation } from '@shoelace-style/localize';
+
+// Extend the controller and apply our own translation interface for better typings
+export class LocalizeController extends DefaultLocalizationController<Translation> {}
 
 // Export functions from the localize lib so we have one central place to import them from
-export * from '@shoelace-style/localize';
+export { registerTranslation } from '@shoelace-style/localize';
+
+export interface Translation extends DefaultTranslation {
+  $code: string; // e.g. en, en-GB
+  $name: string; // e.g. English, Español
+  $dir: 'ltr' | 'rtl';
+
+  clearEntry: string;
+  close: string;
+  copy: string;
+  currentValue: string;
+  hidePassword: string;
+  progress: string;
+  remove: string;
+  resize: string;
+  scrollToEnd: string;
+  scrollToStart: string;
+  selectAColorFromTheScreen: string;
+  showPassword: string;
+  toggleColorFormat: string;
+}