@celestia-island/hikari 0.55.76 → 0.55.77

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@celestia-island/hikari",
-  "version": "0.55.76",
+  "version": "0.55.77",
   "private": false,
   "type": "module",
   "description": "Hikari Vue 3 component library — production-grade UI components based on shittim-chest design system",

package/src/components/HkThemeToggle.test.ts

@@ -427,3 +427,26 @@ describe("HkThemeToggle exposed closeMenu", () => {
     expect(document.body.querySelector(".s-theme-menu")).toBeTruthy();
   });
 });
+
+describe("HkThemeToggle theme names", () => {
+  it("localizes a name that is a message key and passes literal names through", async () => {
+    // The ThemePreset.name convention: a resolvable catalog key renders its
+    // message (hosts ship localized built-ins); anything else — user-named
+    // customs, strings that merely LOOK like dotted keys — renders raw,
+    // because t() falls back to the input when the key is unknown.
+    useTheme().addCustomTheme({ ...anyPresetTokens(), id: "test-keyed", name: "hikari::theme.defaultThemeName" });
+    useTheme().addCustomTheme({ ...anyPresetTokens(), id: "test-literal", name: "Not A Catalog Key.At All" });
+    const { container } = mountToggle(true);
+    await settle();
+
+    openMenu(container);
+    await settle();
+
+    const names = [...document.body.querySelectorAll<HTMLElement>(".s-theme-menu .s-theme-item-row .s-theme-item-name")]
+      .map((el) => el.textContent?.trim());
+    // en bundle value of the key (the test locale is hikari's default).
+    expect(names).toContain("Default");
+    expect(names).toContain("Not A Catalog Key.At All");
+    expect(names).not.toContain("hikari::theme.defaultThemeName");
+  });
+});

package/src/components/HkThemeToggle.tsx

@@ -24,7 +24,9 @@ const AUTO_MERGE_KEYS = ["light", "dark"];
 
 /** Scoped payload handed to the `item-leading` / `item-trailing` slots:
  *  one object per theme row, carrying enough identity for the host to
- *  render swatches or affordances without re-deriving the preset. */
+ *  render swatches or affordances without re-deriving the preset.
+ *  `name` is the RAW stored string — it may be a message key (see
+ *  `ThemePreset.name`); the row cell resolves it through the catalog. */
 export interface ThemeItemScope {
   id: ThemeId;
   name: string;
@@ -314,6 +316,13 @@ export const HkThemeToggle = defineComponent({
               };
               const leadingSlot = slots["item-leading"];
               const trailingSlot = slots["item-trailing"];
+              // A preset/custom name may be a message key into hikari's own
+              // catalog (the documented ThemePreset.name convention — hosts
+              // ship localized built-ins like "hikari::theme.defaultThemeName").
+              // `t()` falls back to the raw string for anything that is not a
+              // key, so literal display names pass through unchanged, and the
+              // reactive message lookup re-renders rows on locale switches.
+              const displayName = t(th.name);
               return (
                 <div
                   key={th.id}
@@ -334,7 +343,7 @@ export const HkThemeToggle = defineComponent({
                     ) : currentTheme.value === th.id ? (
                       <span class="hk-menu-item-icon s-theme-item-check"><Check size={14} /></span>
                     ) : null}
-                    <span class="s-theme-item-name">{th.name}</span>
+                    <span class="s-theme-item-name">{displayName}</span>
                   </button>
                   {trailingSlot ? (
                     <span class="s-theme-item-trailing">{trailingSlot(scope)}</span>

package/src/i18n/locales/ar/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "إعادة الترتيب — {label}",
   "hikari::modal.hiddenLayers": "الطبقات المخفية",
   "hikari::theme.modeTabHint": "هذه التبويبات تختار لوحة الألوان التي تحرّرها؛ لتبديل الوضع الفاتح/الداكن للتطبيق كله استخدم شريط الأوضاع أعلى نافذة السمة.",
+  "hikari::theme.defaultThemeName": "افتراضي",
   "hikari::emptyState.loading": "جارٍ التحميل",
   "hikari::mfaVerify.title": "التحقق من الحساب",
   "hikari::mfaVerify.verifySubtitle": "جارٍ التحقق من {name} — أكمل طريقة تسجيل الدخول للمتابعة",

package/src/i18n/locales/de/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "Neu anordnen — {label}",
   "hikari::modal.hiddenLayers": "Verdeckte Ebenen",
   "hikari::theme.modeTabHint": "Diese Reiter wählen die zu bearbeitende Palette; die appweite Hell/Dunkel-Umschaltung liegt im Modusstreifen des Themen-Popups.",
+  "hikari::theme.defaultThemeName": "Standard",
   "hikari::emptyState.loading": "Wird geladen",
   "hikari::mfaVerify.title": "Konto verifizieren",
   "hikari::mfaVerify.verifySubtitle": "{name} wird verifiziert — Anmeldung abschließen, um fortzufahren",

package/src/i18n/locales/en/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "Reorder {label}",
   "hikari::modal.hiddenLayers": "Hidden layers",
   "hikari::theme.modeTabHint": "These tabs pick which palette you are EDITING; to switch the app-wide light/dark, use the mode strip at the top of the theme popup.",
+  "hikari::theme.defaultThemeName": "Default",
   "hikari::emptyState.loading": "Loading",
   "hikari::mfaVerify.title": "Verify account",
   "hikari::mfaVerify.verifySubtitle": "Verifying {name} — complete a sign-in method to continue",

package/src/i18n/locales/es/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "Reordenar — {label}",
   "hikari::modal.hiddenLayers": "Capas ocultas",
   "hikari::theme.modeTabHint": "Estas pestañas eligen la paleta que estás EDITANDO; para cambiar el modo claro/oscuro de toda la app, usa la franja de modos de la parte superior del panel de temas.",
+  "hikari::theme.defaultThemeName": "Predeterminado",
   "hikari::emptyState.loading": "Cargando",
   "hikari::mfaVerify.title": "Verificar cuenta",
   "hikari::mfaVerify.verifySubtitle": "Verificando {name}: completa un método de acceso para continuar",

package/src/i18n/locales/fr/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "Réorganiser — {label}",
   "hikari::modal.hiddenLayers": "Couches masquées",
   "hikari::theme.modeTabHint": "Ces onglets choisissent la palette éditée ; pour basculer clair/sombre dans toute l’app, utilisez la barre de mode du menu de thème.",
+  "hikari::theme.defaultThemeName": "Par défaut",
   "hikari::emptyState.loading": "Chargement",
   "hikari::mfaVerify.title": "Vérifier le compte",
   "hikari::mfaVerify.verifySubtitle": "Vérification de {name} — terminez une méthode de connexion pour continuer",

package/src/i18n/locales/ja/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "並べ替え — {label}",
   "hikari::modal.hiddenLayers": "非表示の階層",
   "hikari::theme.modeTabHint": "このタブは編集対象のパレットを選ぶだけです。アプリ全体の明/暗はテーマポップアップ上部のモードストリップで切り替えてください。",
+  "hikari::theme.defaultThemeName": "デフォルト",
   "hikari::emptyState.loading": "読み込み中",
   "hikari::mfaVerify.title": "アカウントの確認",
   "hikari::mfaVerify.verifySubtitle": "{name} の本人確認を続行します",

package/src/i18n/locales/ko/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "순서 변경 — {label}",
   "hikari::modal.hiddenLayers": "숨겨진 레이어",
   "hikari::theme.modeTabHint": "이 탭은 편집할 팔레트를 고를 뿐입니다. 앱 전체 밝기/어둠은 테마 팝업 상단의 모드 스트립에서 바꾸세요.",
+  "hikari::theme.defaultThemeName": "기본값",
   "hikari::emptyState.loading": "불러오는 중",
   "hikari::mfaVerify.title": "계정 확인",
   "hikari::mfaVerify.verifySubtitle": "{name} 님의 신원을 확인하여 로그인을 계속하세요",

package/src/i18n/locales/pt/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "Reordenar — {label}",
   "hikari::modal.hiddenLayers": "Camadas ocultas",
   "hikari::theme.modeTabHint": "Estas abas escolhem a paleta que você está EDITANDO; para alternar o claro/escuro do app inteiro, use a faixa de modos no topo do painel de temas.",
+  "hikari::theme.defaultThemeName": "Padrão",
   "hikari::emptyState.loading": "Carregando",
   "hikari::mfaVerify.title": "Verificar conta",
   "hikari::mfaVerify.verifySubtitle": "Verificando {name} — conclua um método de acesso para continuar",

package/src/i18n/locales/ru/components.json

@@ -220,6 +220,7 @@
   "hikari::tagInput.reorder": "Изменить порядок — {label}",
   "hikari::modal.hiddenLayers": "Скрытые слои",
   "hikari::theme.modeTabHint": "Вкладки выбирают редактируемую палитру; общесистемное переключение светлой/тёмной — в полосе режимов вверху меню темы.",
+  "hikari::theme.defaultThemeName": "По умолчанию",
   "hikari::emptyState.loading": "Загрузка",
   "hikari::mfaVerify.title": "Подтверждение аккаунта",
   "hikari::mfaVerify.verifySubtitle": "Проверка {name} — завершите вход, чтобы продолжить",

package/src/i18n/locales/zh-Hans/components.json

@@ -224,6 +224,7 @@
   "hikari::tagInput.reorder": "拖动排序 — {label}",
   "hikari::modal.hiddenLayers": "隐藏层级",
   "hikari::theme.modeTabHint": "切换这里编辑的是对应模式的调色板；要切换应用整体深/浅，请用主题弹窗顶部的模式条。",
+  "hikari::theme.defaultThemeName": "默认",
   "hikari::emptyState.loading": "加载中",
   "hikari::mfaVerify.title": "验证账户",
   "hikari::mfaVerify.verifySubtitle": "正在验证 {name} 的身份，请完成验证以继续登录",

package/src/i18n/locales/zh-Hant/components.json

@@ -224,6 +224,7 @@
   "hikari::tagInput.reorder": "拖曳排序 — {label}",
   "hikari::modal.hiddenLayers": "隱藏層級",
   "hikari::theme.modeTabHint": "切換這裡編輯的是對應模式的調色盤；要切換應用整體深/淺，請用主題彈窗頂部的模式條。",
+  "hikari::theme.defaultThemeName": "預設",
   "hikari::emptyState.loading": "載入中",
   "hikari::mfaVerify.title": "驗證帳戶",
   "hikari::mfaVerify.verifySubtitle": "正在驗證 {name} 的身分，請完成驗證以繼續登入",

package/src/theme/presets.ts

@@ -60,6 +60,13 @@ export interface ThemeTokenGroupModes {
 
 export interface ThemePreset {
   id: string;
+  /**
+   * Display name: either a literal string or a message key resolvable in
+   * hikari's own i18n catalog (e.g. "hikari::theme.defaultThemeName").
+   * Theme rows resolve names through `t()`, which falls back to the raw
+   * string for anything that is not a key, so user-named customs and
+   * literal preset names render unchanged while keyed built-ins localize.
+   */
   name: string;
   dark: ThemeSchemeTokens;
   light: ThemeSchemeTokens;