@xleddyl/443-components-vue 0.0.0 → 0.2.0

package/dist/components/templates/AppearanceSettings.vue.d.ts

@@ -20,7 +20,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     id?: string | undefined | undefined;
     inert?: (boolean | "true" | "false") | undefined;
@@ -66,7 +66,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -75,7 +75,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
@@ -220,7 +220,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     id?: string | undefined | undefined;
     inert?: (boolean | "true" | "false") | undefined;
@@ -266,7 +266,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -275,7 +275,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
@@ -404,13 +404,9 @@ declare const __VLS_base: import("vue").DefineComponent<{
     ref_for?: boolean | undefined | undefined;
     ref_key?: string | undefined | undefined;
 }> & Readonly<{}>, {
-    level: 2 | 3 | 4;
+    level: 2 | 4 | 3;
     presets: false | readonly ThemePreset[];
     themes: boolean;
-    themeLabel: string;
-    themeText: string;
-    presetLabel: string;
-    presetText: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/templates/AuthLayout.vue

@@ -1,6 +1,6 @@
 <template>
    <div class="k-auth" :class="`k-auth-${variant}`">
-      <a class="k-auth-skip k-visually-hidden-focusable" :href="`#${mainId}`">{{ skipLabel }}</a>
+      <a class="k-auth-skip k-visually-hidden-focusable" :href="`#${mainId}`">{{ skipText }}</a>
       <div v-if="themeSwitch || $slots.corner" class="k-auth-corner">
          <slot name="corner" />
          <ThemeSwitch v-if="themeSwitch" variant="icon" :label="themeLabel" />
@@ -38,7 +38,7 @@
             </footer>
          </div>
       </main>
-      <aside v-if="variant === 'split'" class="k-auth-aside" :aria-label="asideLabel">
+      <aside v-if="variant === 'split'" class="k-auth-aside" :aria-label="asideText">
          <slot name="aside">
             <div class="k-auth-aside-art" aria-hidden="true">
                <span class="k-auth-aside-orb" />
@@ -63,10 +63,11 @@
 </template>
 
 <script setup>
-import { useId } from "vue";
+import { computed, useId } from "vue";
+import { useLocale } from "../../composables/useLocale";
 import ThemeSwitch from "../layout/ThemeSwitch.vue";
 import Brand from "./Brand.vue";
-defineProps({
+const props = defineProps({
   variant: { type: String, required: false, default: "centered" },
   title: { type: String, required: false },
   description: { type: String, required: false },
@@ -78,10 +79,13 @@ defineProps({
   brandTo: { type: [String, Object], required: false },
   asideTitle: { type: String, required: false },
   asideDescription: { type: String, required: false },
-  asideLabel: { type: String, required: false, default: "About" },
+  asideLabel: { type: String, required: false },
   themeSwitch: { type: Boolean, required: false },
-  themeLabel: { type: String, required: false, default: "Theme" },
-  skipLabel: { type: String, required: false, default: "Skip to content" }
+  themeLabel: { type: String, required: false },
+  skipLabel: { type: String, required: false }
 });
+const { t } = useLocale();
+const asideText = computed(() => props.asideLabel ?? t("auth.aside"));
+const skipText = computed(() => props.skipLabel ?? t("shell.skipToContent"));
 const mainId = useId();
 </script>

package/dist/components/templates/AuthLayout.vue.d.ts

@@ -44,7 +44,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     id?: string | undefined | undefined;
     inert?: (boolean | "true" | "false") | undefined;
@@ -89,7 +89,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -98,7 +98,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
@@ -251,7 +251,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     id?: string | undefined | undefined;
     inert?: (boolean | "true" | "false") | undefined;
@@ -296,7 +296,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -305,7 +305,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
@@ -435,9 +435,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     ref_key?: string | undefined | undefined;
 }> & Readonly<{}>, {
     variant: AuthLayoutVariant;
-    skipLabel: string;
-    themeLabel: string;
-    asideLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/templates/Brand.vue.d.ts

@@ -22,17 +22,19 @@ declare const __VLS_base: import("vue").DefineComponent<{
     inlist?: any;
     download?: any;
     key?: PropertyKey | undefined;
+    prefix?: string | undefined;
+    title?: string | undefined;
+    style?: import("vue").StyleValue;
+    results?: (string | number) | undefined;
+    placeholder?: string | undefined;
     bind?: Record<string, unknown>;
     type?: string | undefined;
     ref?: import("vue").VNodeRef | undefined;
-    placeholder?: string | undefined;
     target?: string | undefined;
     class?: import("vue").ClassValue;
     role?: string | undefined;
     'aria-label'?: string | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: import("vue").StyleValue;
-    title?: string | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -195,7 +197,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     radiogroup?: string | undefined;
     about?: string | undefined;
     datatype?: string | undefined;
-    prefix?: string | undefined;
     property?: string | undefined;
     resource?: string | undefined;
     typeof?: string | undefined;
@@ -208,7 +209,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     itemtype?: string | undefined;
     itemid?: string | undefined;
     itemref?: string | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
@@ -240,17 +240,19 @@ declare const __VLS_base: import("vue").DefineComponent<{
     inlist?: any;
     download?: any;
     key?: PropertyKey | undefined;
+    prefix?: string | undefined;
+    title?: string | undefined;
+    style?: import("vue").StyleValue;
+    results?: (string | number) | undefined;
+    placeholder?: string | undefined;
     bind?: Record<string, unknown>;
     type?: string | undefined;
     ref?: import("vue").VNodeRef | undefined;
-    placeholder?: string | undefined;
     target?: string | undefined;
     class?: import("vue").ClassValue;
     role?: string | undefined;
     'aria-label'?: string | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: import("vue").StyleValue;
-    title?: string | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -413,7 +415,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     radiogroup?: string | undefined;
     about?: string | undefined;
     datatype?: string | undefined;
-    prefix?: string | undefined;
     property?: string | undefined;
     resource?: string | undefined;
     typeof?: string | undefined;
@@ -426,7 +427,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     itemtype?: string | undefined;
     itemid?: string | undefined;
     itemref?: string | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;

package/dist/components/templates/DashboardLayout.vue

@@ -38,7 +38,7 @@
                      v-model:open="searchOpen"
                      :groups="commandGroups"
                      :trigger-label="searchLabel"
-                     :placeholder="searchPlaceholder"
+                     :placeholder="searchPlaceholderText"
                      :shortcut="searchShortcut"
                      class="k-dashboard-search"
                   />
@@ -66,7 +66,7 @@
                            :email="account.email"
                            :avatar="account.avatar"
                            :active="settingsOpen"
-                           :aria-label="`${account.name}: ${settingsTitle}`"
+                           :aria-label="`${account.name}: ${settingsTitleText}`"
                            aria-haspopup="dialog"
                            @click="settingsOpen = true"
                         />
@@ -123,7 +123,7 @@
             :sections="settingsSections"
             :account="account"
             :presets="settingsPresets"
-            :title="settingsTitle"
+            :title="settingsTitleText"
             :on-sign-out="onSignOut"
          >
             <template v-for="entry in settingsSlots" :key="entry.source" #[entry.target]="scope">
@@ -136,6 +136,7 @@
 
 <script setup>
 import { computed, ref, useSlots, useTemplateRef } from "vue";
+import { useLocale } from "../../composables/useLocale";
 import { navCommands, toNavSections } from "../../internal/layout/navigation";
 import AppShell from "../layout/AppShell.vue";
 import Breadcrumbs from "../layout/Breadcrumbs.vue";
@@ -159,34 +160,42 @@ const props = defineProps({
   accountAction: { type: String, required: false, default: "settings" },
   settingsSections: { type: Array, required: false, default: void 0 },
   settingsPresets: { type: [Array, Boolean], required: false, default: void 0 },
-  settingsTitle: { type: String, required: false, default: "Settings" },
+  settingsTitle: { type: String, required: false },
   onSignOut: { type: Function, required: false },
   breadcrumbs: { type: Array, required: false },
   search: { type: [Boolean, Array], required: false },
-  searchLabel: { type: String, required: false, default: "Search" },
-  searchPlaceholder: { type: String, required: false, default: "Search pages and actions" },
+  searchLabel: { type: String, required: false },
+  searchPlaceholder: { type: String, required: false },
   searchShortcut: { type: [String, Boolean], required: false, default: "mod+k" },
-  searchNavigationLabel: { type: String, required: false, default: "Pages" },
+  searchNavigationLabel: { type: String, required: false },
   themeSwitch: { type: [String, Boolean], required: false, default: "sidebar" },
   collapsible: { type: Boolean, required: false, default: true },
   storageKey: { type: [String, Boolean], required: false, default: "k-sidebar-collapsed" },
   shortcut: { type: [String, Boolean], required: false, default: "mod+b" },
   fluid: { type: Boolean, required: false },
   viewTransition: { type: Boolean, required: false, default: true },
-  navLabel: { type: String, required: false, default: "Main" },
-  sidebarLabel: { type: String, required: false, default: "Sidebar" },
-  menuLabel: { type: String, required: false, default: "Open navigation" },
-  skipLabel: { type: String, required: false, default: "Skip to content" },
-  collapseLabel: { type: String, required: false, default: "Collapse sidebar" },
-  expandLabel: { type: String, required: false, default: "Expand sidebar" },
-  accountLabel: { type: String, required: false, default: "Account" },
-  themeLabel: { type: String, required: false, default: "Theme" }
+  navLabel: { type: String, required: false },
+  sidebarLabel: { type: String, required: false },
+  menuLabel: { type: String, required: false },
+  skipLabel: { type: String, required: false },
+  collapseLabel: { type: String, required: false },
+  expandLabel: { type: String, required: false },
+  accountLabel: { type: String, required: false },
+  themeLabel: { type: String, required: false }
 });
 const emit = defineEmits(["accountSelect"]);
 const collapsed = defineModel("collapsed", { type: Boolean, ...{ default: false } });
 const open = defineModel("open", { type: Boolean, ...{ default: false } });
 const settingsOpen = defineModel("settingsOpen", { type: Boolean, ...{ default: false } });
 const settingsSection = defineModel("settingsSection", { type: String });
+const { t } = useLocale();
+const settingsTitleText = computed(() => props.settingsTitle ?? t("settings.title"));
+const searchPlaceholderText = computed(
+  () => props.searchPlaceholder ?? t("dashboardLayout.searchPlaceholder")
+);
+const navigationGroupLabel = computed(
+  () => props.searchNavigationLabel ?? t("dashboardLayout.pages")
+);
 const slots = useSlots();
 const shell = useTemplateRef("shell");
 const searchOpen = ref(false);
@@ -216,7 +225,7 @@ const commandGroups = computed(() => {
   if (navigationCommands.value.length)
     groups.push({
       id: "navigation",
-      label: props.searchNavigationLabel,
+      label: navigationGroupLabel.value,
       items: navigationCommands.value
     });
   if (Array.isArray(props.search)) groups.push(...props.search);

package/dist/components/templates/DashboardLayout.vue.d.ts

@@ -44,7 +44,7 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_88) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<{
-    variant?: "inset" | "sidebar" | "floating" | undefined;
+    variant?: "sidebar" | "inset" | "floating" | undefined;
     navigation?: DashboardNavigation;
     currentPath?: string;
     brandName?: string;
@@ -83,14 +83,16 @@ declare const __VLS_base: import("vue").DefineComponent<{
     settingsOpen?: boolean;
     settingsSection?: string;
     key?: PropertyKey | undefined;
-    ref?: import("vue").VNodeRef | undefined;
+    prefix?: string | undefined;
+    title?: string | undefined;
+    style?: import("vue").StyleValue;
+    results?: (string | number) | undefined;
     placeholder?: string | undefined;
+    ref?: import("vue").VNodeRef | undefined;
     class?: import("vue").ClassValue;
     role?: string | undefined;
     'aria-label'?: string | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: import("vue").StyleValue;
-    title?: string | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -253,7 +255,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     about?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
-    prefix?: string | undefined;
     property?: string | undefined;
     resource?: string | undefined;
     typeof?: string | undefined;
@@ -266,7 +267,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     itemtype?: string | undefined;
     itemid?: string | undefined;
     itemref?: string | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
@@ -294,7 +294,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     "update:settingsOpen": (value: boolean) => any;
     "update:settingsSection": (value: string | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<{
-    variant?: "inset" | "sidebar" | "floating" | undefined;
+    variant?: "sidebar" | "inset" | "floating" | undefined;
     navigation?: DashboardNavigation;
     currentPath?: string;
     brandName?: string;
@@ -333,14 +333,16 @@ declare const __VLS_base: import("vue").DefineComponent<{
     settingsOpen?: boolean;
     settingsSection?: string;
     key?: PropertyKey | undefined;
-    ref?: import("vue").VNodeRef | undefined;
+    prefix?: string | undefined;
+    title?: string | undefined;
+    style?: import("vue").StyleValue;
+    results?: (string | number) | undefined;
     placeholder?: string | undefined;
+    ref?: import("vue").VNodeRef | undefined;
     class?: import("vue").ClassValue;
     role?: string | undefined;
     'aria-label'?: string | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: import("vue").StyleValue;
-    title?: string | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -503,7 +505,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     about?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
-    prefix?: string | undefined;
     property?: string | undefined;
     resource?: string | undefined;
     typeof?: string | undefined;
@@ -516,7 +517,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     itemtype?: string | undefined;
     itemid?: string | undefined;
     itemref?: string | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
@@ -540,27 +540,15 @@ declare const __VLS_base: import("vue").DefineComponent<{
 }>, {
     variant: DashboardVariant;
     collapsible: boolean;
-    sidebarLabel: string;
-    menuLabel: string;
-    skipLabel: string;
     storageKey: string | false;
     shortcut: string | false;
     viewTransition: boolean;
-    collapseLabel: string;
-    expandLabel: string;
-    themeLabel: string;
     brandTo: LinkTarget;
     themeSwitch: ThemeSwitchPlacement;
-    navLabel: string;
-    accountLabel: string;
     accountAction: AccountAction;
     settingsSections: SettingsModalSection[];
     settingsPresets: false | readonly ThemePreset[];
-    settingsTitle: string;
-    searchLabel: string;
-    searchPlaceholder: string;
     searchShortcut: string | false;
-    searchNavigationLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/templates/DashboardPage.vue

@@ -20,7 +20,7 @@
       <section
          v-if="stats?.length || $slots.stats"
          class="k-dashboard-stats"
-         :aria-label="statsLabel"
+         :aria-label="statsText"
       >
          <slot name="stats" :loading="loading">
             <Grid :columns="statsColumns">
@@ -55,10 +55,12 @@
 </template>
 
 <script setup>
+import { computed } from "vue";
+import { useLocale } from "../../composables/useLocale";
 import Stat from "../data/Stat.vue";
 import Grid from "../layout/Grid.vue";
 import PageHeader from "../layout/PageHeader.vue";
-defineProps({
+const props = defineProps({
   title: { type: String, required: false },
   description: { type: String, required: false },
   eyebrow: { type: String, required: false },
@@ -66,10 +68,12 @@ defineProps({
   breadcrumbs: { type: Array, required: false },
   level: { type: Number, required: false, default: 1 },
   stats: { type: Array, required: false },
-  statsLabel: { type: String, required: false, default: "Key figures" },
+  statsLabel: { type: String, required: false },
   statsColumns: { type: [Number, Object], required: false, default: () => ({ base: 1, sm: 2, lg: 4 }) },
   columns: { type: [Number, Object], required: false, default: () => ({ base: 1, lg: 3 }) },
   loading: { type: Boolean, required: false }
 });
+const { t } = useLocale();
+const statsText = computed(() => props.statsLabel ?? t("dashboardPage.stats"));
 defineSlots();
 </script>

package/dist/components/templates/DashboardPage.vue.d.ts

@@ -37,7 +37,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     id?: string | undefined | undefined;
     inert?: (boolean | "true" | "false") | undefined;
@@ -82,7 +82,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -91,7 +91,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
@@ -240,7 +240,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     id?: string | undefined | undefined;
     inert?: (boolean | "true" | "false") | undefined;
@@ -285,7 +285,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -294,7 +294,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
@@ -425,7 +425,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
 }> & Readonly<{}>, {
     columns: number | GridColumns;
     level: HeadingLevel;
-    statsLabel: string;
     statsColumns: number | GridColumns;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/components/templates/DetailPage.vue

@@ -8,7 +8,7 @@
             icon="arrow-left"
             :to="backTo"
             :href="backHref"
-            >{{ backLabel }}</Button
+            >{{ backText }}</Button
          >
       </div>
       <PageHeader
@@ -35,7 +35,7 @@
       <Alert
          v-if="error"
          tone="danger"
-         :title="errorTitle"
+         :title="errorText"
          :description="typeof error === 'string' ? error : void 0"
          role="alert"
       />
@@ -50,7 +50,7 @@
                   <Skeleton :lines="3" />
                </Card>
             </template>
-            <Tabs v-else-if="tabs?.length" v-model="tab" :items="tabs" :label="tabsLabel">
+            <Tabs v-else-if="tabs?.length" v-model="tab" :items="tabs" :label="tabsText">
                <template v-for="name in panelSlots" :key="name" #[name]="scope">
                   <slot :name="name" v-bind="scope" />
                </template>
@@ -60,7 +60,7 @@
             </Tabs>
             <slot v-else />
          </div>
-         <aside v-if="hasAside" class="k-detail-aside" :aria-label="asideLabel">
+         <aside v-if="hasAside" class="k-detail-aside" :aria-label="asideText">
             <template v-if="loading">
                <Card>
                   <Skeleton :lines="5" />
@@ -87,6 +87,7 @@
 
 <script setup>
 import { computed, useSlots } from "vue";
+import { useLocale } from "../../composables/useLocale";
 import Button from "../core/Button.vue";
 import Badge from "../data/Badge.vue";
 import DescriptionList from "../data/DescriptionList.vue";
@@ -103,17 +104,22 @@ const props = defineProps({
   level: { type: Number, required: false, default: 1 },
   backTo: { type: [String, Object], required: false },
   backHref: { type: String, required: false },
-  backLabel: { type: String, required: false, default: "Back" },
+  backLabel: { type: String, required: false },
   status: { type: Object, required: false },
   tabs: { type: Array, required: false },
-  tabsLabel: { type: String, required: false, default: "Sections" },
+  tabsLabel: { type: String, required: false },
   sections: { type: Array, required: false },
-  asideLabel: { type: String, required: false, default: "Details" },
+  asideLabel: { type: String, required: false },
   loading: { type: Boolean, required: false },
   error: { type: [String, Boolean], required: false },
-  errorTitle: { type: String, required: false, default: "Could not load this record" }
+  errorTitle: { type: String, required: false }
 });
 defineSlots();
+const { t } = useLocale();
+const backText = computed(() => props.backLabel ?? t("common.back"));
+const tabsText = computed(() => props.tabsLabel ?? t("detailPage.sections"));
+const asideText = computed(() => props.asideLabel ?? t("detailPage.details"));
+const errorText = computed(() => props.errorTitle ?? t("detailPage.error"));
 const tab = defineModel("tab", { type: [String, Number] });
 const slots = useSlots();
 const panelSlots = computed(