Merge pull request #6250 from logto-io/gao-init-i18n

feat(elements): init i18n

commitlint.config.ts

@@ -7,7 +7,7 @@ const config: UserConfig = {
   extends: ['@commitlint/config-conventional'],
   rules: {
     'type-enum': [2, 'always', [...conventional.rules['type-enum'][2], 'api', 'release']],
-    'scope-enum': [2, 'always', ['connector', 'console', 'core', 'demo-app', 'test', 'phrases', 'schemas', 'shared', 'experience', 'deps', 'deps-dev', 'cli', 'toolkit', 'cloud', 'app-insights']],
+    'scope-enum': [2, 'always', ['connector', 'console', 'core', 'demo-app', 'test', 'phrases', 'schemas', 'shared', 'experience', 'deps', 'deps-dev', 'cli', 'toolkit', 'cloud', 'app-insights', 'elements']],
     // Slightly increase the tolerance to allow the appending PR number
     ...(isCi && { 'header-max-length': [2, 'always', 110] }),
     'body-max-line-length': [2, 'always', 110],

packages/console/src/pages/Profile/index.tsx

@@ -1,4 +1,4 @@
-import { createReactComponents } from '@logto/elements/react';
+import { createReactComponents, initLocalization } from '@logto/elements/react';
 import type { ConnectorResponse } from '@logto/schemas';
 import React, { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -32,7 +32,11 @@ import Skeleton from './components/Skeleton';
 import DeleteAccountModal from './containers/DeleteAccountModal';
 import * as styles from './index.module.scss';
 
-const { LogtoFormCard, LogtoThemeProvider } = createReactComponents(React);
+if (isDevFeaturesEnabled) {
+  initLocalization();
+}
+
+const { LogtoProfileCard, LogtoThemeProvider } = createReactComponents(React);
 
 function Profile() {
   const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
@@ -75,11 +79,7 @@ function Profile() {
                 <CardTitle title="profile.title" subtitle="profile.description" />
               </div>
               {showLoadingSkeleton && <Skeleton />}
-              {isDevFeaturesEnabled && (
+              {isDevFeaturesEnabled && <LogtoProfileCard />}
-                <LogtoFormCard title="sections.profile">
-                  <p>🚧 This section is a dev feature that is still working in progress.</p>
-                </LogtoFormCard>
-              )}
               {user && !showLoadingSkeleton && (
                 <div className={styles.content}>
                   <BasicUserInfoSection user={user} onUpdate={reload} />

packages/elements/.gitignore

@@ -0,0 +1 @@
+src/generated/

packages/elements/lit-localize.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://raw.githubusercontent.com/lit/lit/main/packages/localize-tools/config.schema.json",
+  "sourceLocale": "en",
+  "targetLocales": ["de", "es", "fr", "it", "ja", "ko", "pl-PL", "pt-BR", "pt-PT", "ru", "tr-TR", "zh-CN", "zh-HK", "zh-TW"],
+  "tsConfig": "./tsconfig.json",
+  "output": {
+    "mode": "runtime",
+    "outputDir": "./src/generated/locales",
+    "localeCodesModule": "./src/generated/locale-codes.ts"
+  },
+  "interchange": {
+    "format": "xliff",
+    "xliffDir": "./xliff/"
+  }
+}

packages/elements/package.json

@@ -27,13 +27,15 @@
   },
   "scripts": {
     "precommit": "lint-staged",
-    "build": "tsup",
+    "build": "lit-localize build && tsup",
-    "dev": "tsup --watch --no-splitting",
+    "dev": "lit-localize build && tsup --watch --no-splitting",
     "lint": "eslint --ext .ts src",
     "lint:report": "pnpm lint --format json --output-file report.json",
     "test": "echo \"No tests yet.\"",
     "test:ci": "pnpm run test --silent --coverage",
-    "prepack": "pnpm build"
+    "prepack": "pnpm check && pnpm build",
+    "localize": "lit-localize",
+    "check": "lit-localize extract && git add . -N && git diff --exit-code"
   },
   "engines": {
     "node": "^20.9.0"
@@ -48,6 +50,7 @@
     "lit": "^3.1.4"
   },
   "devDependencies": {
+    "@lit/localize-tools": "^0.7.2",
     "@silverhand/eslint-config": "6.0.1",
     "@silverhand/ts-config": "6.0.0",
     "eslint": "^8.56.0",
@@ -57,6 +60,9 @@
   },
   "eslintConfig": {
     "extends": "@silverhand",
+    "ignorePatterns": [
+      "src/generated/"
+    ],
     "rules": {
       "no-console": "error",
       "unicorn/prevent-abbreviations": [

packages/elements/src/components/logto-card-section.ts

@@ -0,0 +1,34 @@
+import { localized, msg } from '@lit/localize';
+import { LitElement, css, html } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+
+import { unit } from '../utils/css.js';
+import { vars } from '../utils/theme.js';
+
+const tagName = 'logto-card-section';
+
+@customElement(tagName)
+@localized()
+export class LogtoCardSection extends LitElement {
+  static tagName = tagName;
+  static styles = css`
+    header {
+      font: ${vars.fontLabel2};
+      color: ${vars.colorText};
+      margin-bottom: ${unit(1)};
+    }
+  `;
+
+  @property()
+  heading = msg('Not available', {
+    id: 'form-card.fallback-title',
+    desc: 'The fallback title of a form card when the title is not provided.',
+  });
+
+  render() {
+    return html`
+      <header>${this.heading}</header>
+      <slot></slot>
+    `;
+  }
+}

packages/elements/src/components/logto-form-card.ts

@@ -1,14 +1,15 @@
+import { localized, msg } from '@lit/localize';
 import { cond } from '@silverhand/essentials';
 import { LitElement, css, html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 
-import { type LocaleKeyOptional, type LocaleKey } from '../locales/index.js';
 import { unit } from '../utils/css.js';
 import { vars } from '../utils/theme.js';
 
 const tagName = 'logto-form-card';
 
 @customElement(tagName)
+@localized()
 export class LogtoFormCard extends LitElement {
   static tagName = tagName;
   static styles = css`
@@ -35,16 +36,19 @@ export class LogtoFormCard extends LitElement {
   `;
 
   @property()
-  title: LocaleKey = 'placeholders.not_available';
+  heading = msg('Not available', {
+    id: 'form-card.fallback-title',
+    desc: 'The fallback title of a form card when the title is not provided.',
+  });
 
   @property()
-  description: LocaleKeyOptional = '';
+  description = '';
 
   render() {
     return html`
       <logto-card>
         <header>
-          <div role="heading">${this.title}</div>
+          <div role="heading">${this.heading}</div>
           ${cond(this.description && html`<p>${this.description}</p>`)}
         </header>
         <div class="spacer"></div>

packages/elements/src/elements/logto-profile-card.ts

@@ -0,0 +1,30 @@
+import { localized, msg } from '@lit/localize';
+import { LitElement, css, html } from 'lit';
+import { customElement } from 'lit/decorators.js';
+
+import { vars } from '../utils/theme.js';
+
+const tagName = 'logto-profile-card';
+
+@customElement(tagName)
+@localized()
+export class LogtoProfileCard extends LitElement {
+  static tagName = tagName;
+  static styles = css`
+    p {
+      color: ${vars.colorTextSecondary};
+    }
+  `;
+
+  render() {
+    return html`
+      <logto-form-card heading=${msg('Profile', { id: 'account.profile.title' })}>
+        <logto-card-section
+          heading=${msg('Personal information', { id: 'account.profile.personal-info.title' })}
+        >
+          <p>🚧 This section is a dev feature that is still working in progress.</p>
+        </logto-card-section>
+      </logto-form-card>
+    `;
+  }
+}

packages/elements/src/index.ts

@@ -1,3 +1,6 @@
+export * from './components/logto-card-section.js';
 export * from './components/logto-card.js';
 export * from './components/logto-form-card.js';
 export * from './components/logto-theme-provider.js';
+export * from './elements/logto-profile-card.js';
+export * from './utils/locale.js';

packages/elements/src/locales/en.ts

@@ -1,9 +0,0 @@
-export const en = Object.freeze({
-  placeholders: {
-    not_available: 'Not available',
-  },
-  sections: {
-    profile: 'Profile',
-    security: 'Security',
-  },
-});

packages/elements/src/locales/index.ts

@@ -1,40 +0,0 @@
-import { type en } from './en.js';
-
-type KeyPath<T> = T extends Record<string, unknown>
-  ? {
-      [K in keyof T]: K extends string
-        ? T[K] extends Record<string, unknown>
-          ? `${K}.${KeyPath<T[K]>}`
-          : `${K}`
-        : never;
-    }[keyof T]
-  : '';
-
-/** The type of a full locale data object. */
-export type LocaleData = typeof en;
-
-/**
- * The type of a locale key. It is a string that represents a path to a value in the locale data
- * object.
- *
- * @example
- * With the following locale data object:
- *
- * ```ts
- * const en = {
- *   profile: {
- *     title: 'Profile',
- *     description: 'Your profile',
- *   },
- * };
- * ```
- *
- * The locale key for the title would be `'profile.title'`.
- */
-export type LocaleKey = KeyPath<LocaleData>;
-
-/**
- * The type of a locale key that is optional. Note that it uses an empty string to represent the
- * absence of a key since Web Components do not support `undefined` as a property value.
- */
-export type LocaleKeyOptional = LocaleKey | '';

packages/elements/src/react.ts

@@ -1,6 +1,8 @@
 import { createComponent } from '@lit/react';
 
-import { LogtoThemeProvider, LogtoCard, LogtoFormCard } from './index.js';
+import { LogtoThemeProvider, LogtoCard, LogtoFormCard, LogtoProfileCard } from './index.js';
+
+export * from './utils/locale.js';
 
 export const createReactComponents = (react: Parameters<typeof createComponent>[0]['react']) => {
   return {
@@ -9,6 +11,11 @@ export const createReactComponents = (react: Parameters<typeof createComponent>[
       elementClass: LogtoFormCard,
       react,
     }),
+    LogtoProfileCard: createComponent({
+      tagName: LogtoProfileCard.tagName,
+      elementClass: LogtoProfileCard,
+      react,
+    }),
     LogtoCard: createComponent({
       tagName: LogtoCard.tagName,
       elementClass: LogtoCard,

packages/elements/src/utils/locale.ts

@@ -0,0 +1,11 @@
+import { configureLocalization } from '@lit/localize';
+
+// Generated via output.localeCodesModule
+import { sourceLocale, targetLocales } from '../generated/locale-codes.js';
+
+export const initLocalization = () =>
+  configureLocalization({
+    sourceLocale,
+    targetLocales,
+    loadLocale: async (locale) => import(`/locales/${locale}.js`),
+  });

packages/elements/xliff/de.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="de" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Nicht verfügbar</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/es.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="es" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>No disponible</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/fr.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="fr" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Non disponible</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/it.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="it" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Non disponibile</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/ja.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="ja" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>利用できません</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/ko.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="ko" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>사용할 수 없음</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/pl-PL.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="pl-PL" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Niedostępne</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/pt-BR.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="pt-BR" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Não disponível</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/pt-PT.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="pt-PT" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Não disponível</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/ru.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="ru" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Недоступно</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/tr-TR.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="tr-TR" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>Mevcut değil</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/zh-CN.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="zh-CN" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>不可用</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/zh-HK.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="zh-HK" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>不可用</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

packages/elements/xliff/zh-TW.xlf

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+<file target-language="zh-TW" source-language="en" original="lit-localize-inputs" datatype="plaintext">
+<body>
+<trans-unit id="form-card.fallback-title">
+  <source>Not available</source>
+  <target>不可用</target>
+  <note from="lit-localize">The fallback title of a form card when the title is not provided.</note>
+</trans-unit>
+<trans-unit id="account.profile.title">
+  <source>Profile</source>
+</trans-unit>
+<trans-unit id="account.profile.personal-info.title">
+  <source>Personal information</source>
+</trans-unit>
+</body>
+</file>
+</xliff>

pnpm-lock.yaml

@@ -3144,7 +3144,7 @@ importers:
         version: 2.2.0(react@18.2.0)
       ts-node:
         specifier: ^10.9.2
-        version: 10.9.2(@swc/core@1.3.52)(@types/node@20.12.7)(typescript@5.3.3)
+        version: 10.9.2(@swc/core@1.3.52(@swc/helpers@0.5.1))(@types/node@20.12.7)(typescript@5.3.3)
       tslib:
         specifier: ^2.4.1
         version: 2.4.1
@@ -3573,6 +3573,9 @@ importers:
         specifier: ^3.1.4
         version: 3.1.4
     devDependencies:
+      '@lit/localize-tools':
+        specifier: ^0.7.2
+        version: 0.7.2
       '@silverhand/eslint-config':
         specifier: 6.0.1
         version: 6.0.1(eslint@8.57.0)(prettier@3.0.0)(typescript@5.3.3)
@@ -5223,6 +5226,10 @@ packages:
   '@lit-labs/ssr-dom-shim@1.2.0':
     resolution: {integrity: sha512-yWJKmpGE6lUURKAaIltoPIE/wrbY3TEkqQt+X0m+7fQNnAv0keydnYvbiJFP1PnMhizmIWRWOG5KLhYyc/xl+g==}
 
+  '@lit/localize-tools@0.7.2':
+    resolution: {integrity: sha512-d5tehVao3Hz1DlTq6jy7TUYrCeyFi/E4BkzWr8MuAMjIM8aoKCR9s3cUw6m++8ZIiqGm2z7+6aHaPc/p1FGHyA==}
+    hasBin: true
+
   '@lit/localize@0.12.1':
     resolution: {integrity: sha512-uuF6OO6fjqomCf3jXsJ5cTGf1APYuN88S4Gvo/fjt9YkG4OMaMvpEUqd5oWhyzrJfY+HcenAbLJNi2Cq3H7gdg==}
 
@@ -5658,6 +5665,9 @@ packages:
     peerDependencies:
       '@parcel/core': ^2.9.3
 
+  '@parse5/tools@0.3.0':
+    resolution: {integrity: sha512-zxRyTHkqb7WQMV8kTNBKWb1BeOFUKXBXTBWuxg9H9hfvQB3IwP6Iw2U75Ia5eyRxPNltmY7E8YAlz6zWwUnjKg==}
+
   '@peculiar/asn1-android@2.3.10':
     resolution: {integrity: sha512-z9Rx9cFJv7UUablZISe7uksNbFJCq13hO0yEAOoIpAymALTLlvUOSLnGiQS7okPaM5dP42oTLhezH6XDXRXjGw==}
 
@@ -8824,6 +8834,10 @@ packages:
     resolution: {integrity: sha512-cR/vflFyPZtrN6b38ZyWxpWdhlXrzZEBawlpBQMq7033xVY7/kg0GDMBK5jg8lDYQckdJ5x/YC88lM3C7VMsLg==}
     engines: {node: '>=0.10.0'}
 
+  fs-extra@10.1.0:
+    resolution: {integrity: sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==}
+    engines: {node: '>=12'}
+
   fs-extra@7.0.1:
     resolution: {integrity: sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==}
     engines: {node: '>=6 <7 || >=8'}
@@ -9961,10 +9975,16 @@ packages:
   jsonfile@4.0.0:
     resolution: {integrity: sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==}
 
+  jsonfile@6.1.0:
+    resolution: {integrity: sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==}
+
   jsonparse@1.3.1:
     resolution: {integrity: sha512-POQXvpdL69+CluYsillJ7SUhKvytYjW9vG/GKpnf+xP8UWgYEM/RaMzHHofbALDiKbbP1W8UEYmgGl39WkPZsg==}
     engines: {'0': node >= 0.2.0}
 
+  jsonschema@1.4.1:
+    resolution: {integrity: sha512-S6cATIPVv1z0IlxdN+zUk5EPjkGCdnhN4wVSBlvoUO1tOLJootbo9CquNJmbIh4yikWHiUedhRYrNPn1arpEmQ==}
+
   jsonwebtoken@9.0.2:
     resolution: {integrity: sha512-PRp66vJ865SSqOlgqS8hujT5U4AOgMfhrwYIuIhfKaoSCZcirrmASQr8CX7cUg+RMih+hgznrjp99o+W4pJLHQ==}
     engines: {node: '>=12', npm: '>=6'}
@@ -12256,6 +12276,9 @@ packages:
   source-map-support@0.5.13:
     resolution: {integrity: sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==}
 
+  source-map-support@0.5.21:
+    resolution: {integrity: sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==}
+
   source-map@0.6.1:
     resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
     engines: {node: '>=0.10.0'}
@@ -12903,6 +12926,10 @@ packages:
     resolution: {integrity: sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==}
     engines: {node: '>= 4.0.0'}
 
+  universalify@2.0.1:
+    resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==}
+    engines: {node: '>= 10.0.0'}
+
   unpipe@1.0.0:
     resolution: {integrity: sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==}
     engines: {node: '>= 0.8'}
@@ -14958,6 +14985,20 @@ snapshots:
 
   '@lit-labs/ssr-dom-shim@1.2.0': {}
 
+  '@lit/localize-tools@0.7.2':
+    dependencies:
+      '@lit/localize': 0.12.1
+      '@parse5/tools': 0.3.0
+      '@xmldom/xmldom': 0.8.7
+      fast-glob: 3.3.2
+      fs-extra: 10.1.0
+      jsonschema: 1.4.1
+      lit: 3.1.4
+      minimist: 1.2.8
+      parse5: 7.1.1
+      source-map-support: 0.5.21
+      typescript: 5.3.3
+
   '@lit/localize@0.12.1':
     dependencies:
       lit: 3.1.4
@@ -15734,6 +15775,10 @@ snapshots:
       '@parcel/utils': 2.9.3
       nullthrows: 1.1.1
 
+  '@parse5/tools@0.3.0':
+    dependencies:
+      parse5: 7.1.1
+
   '@peculiar/asn1-android@2.3.10':
     dependencies:
       '@peculiar/asn1-schema': 2.3.8
@@ -16075,10 +16120,10 @@ snapshots:
       eslint-config-prettier: 9.1.0(eslint@8.57.0)
       eslint-config-xo: 0.44.0(eslint@8.57.0)
       eslint-config-xo-typescript: 4.0.0(@typescript-eslint/eslint-plugin@7.7.0(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0)(typescript@5.3.3))(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0)(typescript@5.3.3)
-      eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0)
+      eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0)
       eslint-plugin-consistent-default-export-name: 0.0.15
       eslint-plugin-eslint-comments: 3.2.0(eslint@8.57.0)
-      eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0))(eslint@8.57.0)
+      eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.0)
       eslint-plugin-n: 17.2.1(eslint@8.57.0)
       eslint-plugin-no-use-extend-native: 0.5.0
       eslint-plugin-prettier: 5.1.3(eslint-config-prettier@9.1.0(eslint@8.57.0))(eslint@8.57.0)(prettier@3.0.0)
@@ -18917,13 +18962,13 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0):
+  eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0):
     dependencies:
       debug: 4.3.4
       enhanced-resolve: 5.16.0
       eslint: 8.57.0
-      eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0))(eslint@8.57.0)
+      eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0)
-      eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0))(eslint@8.57.0)
+      eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.0)
       fast-glob: 3.3.2
       get-tsconfig: 4.7.3
       is-core-module: 2.13.1
@@ -18934,14 +18979,14 @@ snapshots:
       - eslint-import-resolver-webpack
       - supports-color
 
-  eslint-module-utils@2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0))(eslint@8.57.0):
+  eslint-module-utils@2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0):
     dependencies:
       debug: 3.2.7(supports-color@5.5.0)
     optionalDependencies:
       '@typescript-eslint/parser': 7.7.0(eslint@8.57.0)(typescript@5.3.3)
       eslint: 8.57.0
       eslint-import-resolver-node: 0.3.9
-      eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0)
+      eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0)
     transitivePeerDependencies:
       - supports-color
 
@@ -18963,7 +19008,7 @@ snapshots:
       eslint: 8.57.0
       ignore: 5.3.1
 
-  eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0))(eslint@8.57.0):
+  eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.0):
     dependencies:
       array-includes: 3.1.8
       array.prototype.findlastindex: 1.2.5
@@ -18973,7 +19018,7 @@ snapshots:
       doctrine: 2.1.0
       eslint: 8.57.0
       eslint-import-resolver-node: 0.3.9
-      eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0))(eslint@8.57.0))(eslint@8.57.0)
+      eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.3.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0)
       hasown: 2.0.2
       is-core-module: 2.13.1
       is-glob: 4.0.3
@@ -19476,6 +19521,12 @@ snapshots:
 
   fs-exists-sync@0.1.0: {}
 
+  fs-extra@10.1.0:
+    dependencies:
+      graceful-fs: 4.2.11
+      jsonfile: 6.1.0
+      universalify: 2.0.1
+
   fs-extra@7.0.1:
     dependencies:
       graceful-fs: 4.2.11
@@ -20547,7 +20598,7 @@ snapshots:
       strip-json-comments: 3.1.1
     optionalDependencies:
       '@types/node': 20.12.7
-      ts-node: 10.9.2(@swc/core@1.3.52)(@types/node@20.12.7)(typescript@5.3.3)
+      ts-node: 10.9.2(@swc/core@1.3.52(@swc/helpers@0.5.1))(@types/node@20.12.7)(typescript@5.3.3)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
@@ -21006,8 +21057,16 @@ snapshots:
     optionalDependencies:
       graceful-fs: 4.2.11
 
+  jsonfile@6.1.0:
+    dependencies:
+      universalify: 2.0.1
+    optionalDependencies:
+      graceful-fs: 4.2.11
+
   jsonparse@1.3.1: {}
 
+  jsonschema@1.4.1: {}
+
   jsonwebtoken@9.0.2:
     dependencies:
       jws: 3.2.2
@@ -22839,7 +22898,7 @@ snapshots:
       yaml: 2.4.5
     optionalDependencies:
       postcss: 8.4.39
-      ts-node: 10.9.2(@swc/core@1.3.52)(@types/node@20.12.7)(typescript@5.3.3)
+      ts-node: 10.9.2(@swc/core@1.3.52(@swc/helpers@0.5.1))(@types/node@20.12.7)(typescript@5.3.3)
 
   postcss-media-query-parser@0.2.3: {}
 
@@ -23902,6 +23961,11 @@ snapshots:
       buffer-from: 1.1.2
       source-map: 0.6.1
 
+  source-map-support@0.5.21:
+    dependencies:
+      buffer-from: 1.1.2
+      source-map: 0.6.1
+
   source-map@0.6.1: {}
 
   source-map@0.7.4: {}
@@ -24418,7 +24482,7 @@ snapshots:
 
   ts-interface-checker@0.1.13: {}
 
-  ts-node@10.9.2(@swc/core@1.3.52)(@types/node@20.12.7)(typescript@5.3.3):
+  ts-node@10.9.2(@swc/core@1.3.52(@swc/helpers@0.5.1))(@types/node@20.12.7)(typescript@5.3.3):
     dependencies:
       '@cspotcode/source-map-support': 0.8.1
       '@tsconfig/node10': 1.0.9
@@ -24628,6 +24692,8 @@ snapshots:
 
   universalify@0.2.0: {}
 
+  universalify@2.0.1: {}
+
   unpipe@1.0.0: {}
 
   update-browserslist-db@1.0.10(browserslist@4.21.4):