@svadmin/ui 0.73.0 → 0.74.0

package/dist/components/MultiTabKeepAlive.svelte

@@ -78,12 +78,13 @@
 
 <div class={cn('svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-8ef2268efbbc svadmin-u-65fdbade2025 svadmin-u-c9ed8c5f79ae svadmin-u-2859c861d7de svadmin-u-d5eab218aa34 svadmin-u-359090c2d529 svadmin-u-7f6912283f11', className)}>
   <!-- Tabs list -->
-  <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-44ee8ba0a421 svadmin-u-1384f66f41d0 svadmin-u-660d2effb880 scrollbar-none">
+  <div role="tablist" aria-label="Workspace tabs" class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-44ee8ba0a421 svadmin-u-1384f66f41d0 svadmin-u-660d2effb880 scrollbar-none">
     {#each tabs as tab (tab.id)}
       {@const isActive = tab.id === activeTabId}
       <div
-        role="button"
+        role="tab"
         tabindex="0"
+        aria-selected={isActive}
         class={cn(
           'group svadmin-u-d89972fe17d6 svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-58284b4ea568 svadmin-u-0e17f2bd9074 svadmin-u-ec0091ee009b svadmin-u-421ac2be5045 svadmin-u-359090c2d529 svadmin-u-2689f3958069 svadmin-u-0fe7d7d814d0 svadmin-u-34516836730d svadmin-u-ca6bcd4b6f3f',
           isActive
@@ -91,11 +92,11 @@
             : 'svadmin-u-7f19cdf4c5bb svadmin-u-bfa603190748 svadmin-u-521fa0c7c407 svadmin-u-68646cdcc246 svadmin-u-ea7b2e9e070e'
         )}
         onclick={() => handleSelect(tab)}
-        onkeydown={(e) => { if (e.key === 'Enter') handleSelect(tab); }}
+        onkeydown={(e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); handleSelect(tab); } }}
         oncontextmenu={(e) => handleContextMenu(e, tab.id)}
       >
         {#if tab.pinned}
-          <Pin class="svadmin-u-6a60c09e6aaa svadmin-u-9cea05671a29 svadmin-u-20aaf08a7ed1 svadmin-u-012fbd121f37 svadmin-u-c74901da6f6c" />
+          <Pin aria-hidden="true" class="svadmin-u-6a60c09e6aaa svadmin-u-9cea05671a29 svadmin-u-20aaf08a7ed1 svadmin-u-012fbd121f37 svadmin-u-c74901da6f6c" />
         {/if}
 
         <span class="svadmin-u-f283ea9bea0e svadmin-u-1d274d2422d8">{tab.title}</span>
@@ -105,6 +106,8 @@
             type="button"
             class="svadmin-u-60fbb7713999 svadmin-u-7fc7f732bf7e svadmin-u-bf600f8e029c svadmin-u-3960ffc248d9 svadmin-u-86843cf1e227 svadmin-u-ac204c108886 svadmin-u-7be4d67a6256 svadmin-u-8db899b4e072 svadmin-u-51e95020d6f2 svadmin-u-ceb69a6b0e5f svadmin-u-8a539c7fe216 svadmin-u-119b2aa0b8f6 svadmin-u-34516836730d"
             onclick={(e) => handleClose(e, tab.id)}
+            aria-label={`Close ${tab.title}`}
+            title={`Close ${tab.title}`}
           >
             <X class="svadmin-u-9b3d0721b628 svadmin-u-650758f4572a" />
           </button>
@@ -123,8 +126,10 @@
           size="sm"
           class="svadmin-u-d0a52b312f7d svadmin-u-cbbf90f9a828 svadmin-u-8a539c7fe216 svadmin-u-bfa603190748 svadmin-u-ea7b2e9e070e"
           onclick={() => onrefresh(curTab)}
+          aria-label={`Refresh ${curTab.title}`}
+          title={`Refresh ${curTab.title}`}
         >
-          <RefreshCw class="svadmin-u-6a60c09e6aaa svadmin-u-9cea05671a29" />
+          <RefreshCw aria-hidden="true" class="svadmin-u-6a60c09e6aaa svadmin-u-9cea05671a29" />
         </Button>
       {/if}
     {/if}
@@ -136,7 +141,7 @@
         class="svadmin-u-d0a52b312f7d svadmin-u-cbbf90f9a828 svadmin-u-8a539c7fe216 svadmin-u-bfa603190748 svadmin-u-51e95020d6f2"
         onclick={handleCloseAll}
       >
-        <XCircle class="svadmin-u-7fc7f732bf7e svadmin-u-bf600f8e029c" />
+        <XCircle aria-hidden="true" class="svadmin-u-7fc7f732bf7e svadmin-u-bf600f8e029c" />
       </Button>
     {/if}
   </div>

package/dist/components/NotificationsSettings.svelte

@@ -1,20 +1,86 @@
+<script lang="ts" module>
+  export interface NotificationPreferences {
+    email: { security: boolean; activity: boolean; reports: boolean };
+    push: { security: boolean; activity: boolean; reports: boolean };
+    sms: { security: boolean };
+  }
+  export interface NotificationPreferencesProvider {
+    /** 宿主提供的存储范围或服务边界说明。 */
+    description?: string;
+    load: () => Promise<NotificationPreferences>;
+    save: (preferences: NotificationPreferences) => Promise<void>;
+  }
+</script>
 <script lang="ts">
-  import { useNotification } from '@svadmin/core';
+  import { captureAdminContext, useNotification } from '@svadmin/core';
   import { useTranslation } from '@svadmin/core/i18n';
   import { Button } from './ui/button/index.js';
   import { Switch } from './ui/switch/index.js';
   import SettingsGroup from './content/SettingsGroup.svelte';
   import SettingsFieldRow from './content/SettingsFieldRow.svelte';
+  import DataState from './content/DataState.svelte';
+  import FeedbackNotice from './content/FeedbackNotice.svelte';
 
+  let { preferencesProvider }: { preferencesProvider?: NotificationPreferencesProvider } = $props();
   const i18n = useTranslation();
+  const context = captureAdminContext();
   const notification = useNotification();
   let emailAlerts = $state({ security: true, activity: false, reports: true });
   let pushAlerts = $state({ security: true, activity: true, reports: false });
   let smsAlerts = $state({ security: true });
-  function saveSettings() { notification.success(i18n.t('common.autoSaved'), 3000); }
+  let loading = $state(false);
+  let saving = $state(false);
+  let loaded = $state(false);
+  let error = $state('');
+  let epoch = 0;
+  async function load() {
+    const provider = preferencesProvider;
+    const request = ++epoch;
+    error = ''; loaded = false; saving = false;
+    loading = Boolean(provider);
+    if (!provider) return;
+    try {
+      const result = await provider.load();
+      if (request !== epoch) return;
+      emailAlerts = { ...result.email }; pushAlerts = { ...result.push }; smsAlerts = { ...result.sms };
+      loaded = true;
+    } catch (caught) {
+      if (request === epoch) error = caught instanceof Error ? caught.message : String(caught);
+    } finally {
+      if (request === epoch) loading = false;
+    }
+  }
+  $effect(() => {
+    void preferencesProvider; void context.authProvider; void context.tenantCacheKey?.__svadminTenant;
+    void load();
+    return () => { epoch += 1; };
+  });
+  async function saveSettings() {
+    const provider = preferencesProvider;
+    if (!provider || !loaded || saving) return;
+    const request = epoch;
+    saving = true; error = '';
+    try {
+      await provider.save({ email: { ...emailAlerts }, push: { ...pushAlerts }, sms: { ...smsAlerts } });
+      if (request === epoch) notification.success(i18n.t('common.updateSuccess'), 3000);
+    } catch (caught) {
+      if (request === epoch) error = caught instanceof Error ? caught.message : String(caught);
+    } finally {
+      if (request === epoch) saving = false;
+    }
+  }
 </script>
 
 <div class="svadmin-u-b3542e058833">
+  {#if preferencesProvider?.description}
+    <p role="note">{preferencesProvider.description}</p>
+  {/if}
+  {#if !preferencesProvider}
+    <FeedbackNotice tone="warning" message={i18n.locale === 'zh-CN' ? '未配置通知偏好存储服务，设置不可保存。' : 'Notification preference storage is not configured. Settings cannot be saved.'} />
+  {/if}
+  {#if loading}<DataState state="loading" />{/if}
+  {#if error}<p role="alert">{error}</p>{#if !loaded}<Button onclick={load}>{i18n.t('common.retry')}</Button>{/if}{/if}
+  <fieldset disabled={!loaded || loading || saving} class="svadmin-u-b3542e058833">
   <div class="svadmin-u-60fbb7713999 svadmin-u-8dddea0773ed svadmin-u-8ef2268efbbc svadmin-u-1004c0c3954c svadmin-u-020ba687fa12 svadmin-u-64cac80d2e9a"><div><h2 class="svadmin-u-d5c9b0001e7e svadmin-u-e83a7042bc91 svadmin-u-d4108abe6359">{i18n.t('settings.notifications')}</h2><p class="svadmin-u-b6b02c0ebef6 svadmin-u-fc7473ca09eb svadmin-u-bfa603190748">{i18n.t('settings.notificationsDescription')}</p></div><Button onclick={saveSettings}>{i18n.t('common.save')}</Button></div>
   <SettingsGroup title={i18n.t('notifications.emailTitle')} description={i18n.t('notifications.emailDescription')}>
     <div class="svadmin-u-fa6acbf81d74 svadmin-u-e783642739e3">
@@ -33,4 +99,5 @@
   <SettingsGroup title={i18n.t('notifications.smsTitle')} description={i18n.t('notifications.smsDescription')}>
     <SettingsFieldRow label={i18n.t('notifications.criticalSecurity')} description={i18n.t('notifications.criticalSecurityDesc')}>{#snippet control()}<Switch id="sms-security" bind:checked={smsAlerts.security} />{/snippet}</SettingsFieldRow>
   </SettingsGroup>
+  </fieldset>
 </div>

package/dist/components/NotificationsSettings.svelte.d.ts

@@ -1,3 +1,27 @@
-declare const NotificationsSettings: import("svelte").Component<Record<string, never>, {}, "">;
+export interface NotificationPreferences {
+    email: {
+        security: boolean;
+        activity: boolean;
+        reports: boolean;
+    };
+    push: {
+        security: boolean;
+        activity: boolean;
+        reports: boolean;
+    };
+    sms: {
+        security: boolean;
+    };
+}
+export interface NotificationPreferencesProvider {
+    /** 宿主提供的存储范围或服务边界说明。 */
+    description?: string;
+    load: () => Promise<NotificationPreferences>;
+    save: (preferences: NotificationPreferences) => Promise<void>;
+}
+type $$ComponentProps = {
+    preferencesProvider?: NotificationPreferencesProvider;
+};
+declare const NotificationsSettings: import("svelte").Component<$$ComponentProps, {}, "">;
 type NotificationsSettings = ReturnType<typeof NotificationsSettings>;
 export default NotificationsSettings;

package/dist/components/PermissionMatrix.svelte

@@ -4,7 +4,26 @@
   import type { RoleInfo, ResourceInfo, ActionInfo } from '../types.js';
   import { useTranslation } from '@svadmin/core/i18n';
 
-  const i18n = useTranslation();
+  const translation = useTranslation();
+  const fallback: Record<string, [string, string]> = {
+    title: ['Permission Matrix', '权限矩阵'],
+    description: ['Configure authorization rules for system modules and roles.', '配置系统模块与角色的授权规则。'],
+    roles: ['Roles', '角色'],
+    noRoles: ['No roles available', '暂无角色'],
+    currentRole: ['Current role', '当前角色'],
+    noneSelected: ['None selected', '未选择'],
+    toggleHint: ['Toggle checkboxes to grant or revoke permissions', '勾选或取消勾选以授予或撤销权限'],
+    conflicts: ['conflicting rules', '条冲突规则'],
+    resources: ['Resources', '资源'],
+    noResources: ['No resources available', '暂无资源'],
+  };
+  const i18n = {
+    t(key: string) {
+      const value = translation.t(key);
+      const labels = fallback[key.replace(/^permissions\./, '')];
+      return value === key && labels ? labels[translation.locale === 'zh-CN' ? 1 : 0] : value;
+    },
+  };
 
   
   let {

package/dist/components/PivotExportButton.svelte

@@ -0,0 +1,157 @@
+<script lang="ts">
+  import { onDestroy, untrack } from 'svelte';
+  import { Download } from '@lucide/svelte';
+  import {
+    captureAdminContext, captureAuthSession, useCan, useSubmitTask, useTask,
+    downloadExportArtifact, safeArtifactUrl, useTranslation,
+    type TaskProvider, type ExportFormat,
+  } from '@svadmin/core';
+  import { buildPivotExportRequest, snapshotPivotExportTaskResult, type PivotQuery } from '@svadmin/core/pivot';
+  import { definedOptions, definedReactiveOptions } from '@svadmin/core/options';
+  import { normalizeTaskStatus } from './task-utils';
+  import { Button } from './ui/button/index.js';
+
+  let { query, scopeKey, taskName, taskProvider, idempotencyKey, initialTaskId,
+    format = 'csv', disabled = false, onTaskSubmitted }: {
+    query: PivotQuery;
+    scopeKey: string;
+    taskName: string;
+    taskProvider?: TaskProvider;
+    idempotencyKey?: string;
+    initialTaskId?: string;
+    format?: ExportFormat;
+    disabled?: boolean;
+    onTaskSubmitted?: (id: string) => void | Promise<void>;
+  } = $props();
+
+  const context = captureAdminContext();
+  const i18n = useTranslation();
+  const request = $derived(buildPivotExportRequest(query, scopeKey, format));
+  const permission = useCan(() => ({
+    resource: query.resource, action: 'export',
+    queryOptions: { enabled: !disabled && !!request },
+  }));
+  const scope = $derived({
+    signature: JSON.stringify(request), provider: taskProvider ?? context.taskProvider,
+    taskName, idempotencyKey, tenant: context.tenantCacheKey?.__svadminTenant,
+    auth: context.authProvider, session: captureAuthSession(context.authProvider),
+    access: context.accessControlProvider, router: context.routerProvider,
+  });
+  const allowed = $derived(!disabled && !!request && permission.allowed && scope.session.available);
+  let mounted = true;
+  function current(origin: typeof scope) {
+    return mounted && origin.signature === scope.signature && origin.provider === scope.provider
+      && origin.taskName === scope.taskName && origin.idempotencyKey === scope.idempotencyKey
+      && origin.tenant === scope.tenant && origin.auth === scope.auth
+      && origin.access === scope.access && origin.router === scope.router && origin.session.isCurrent();
+  }
+
+  let owner = $state.raw<typeof scope | undefined>(untrack(() => initialTaskId ? scope : undefined));
+  let taskId = $state<string | undefined>(untrack(() => initialTaskId));
+  let attempt = $state.raw<{ origin: typeof scope }>();
+  let error = $state(false);
+  let completedId = $state<string>();
+  let wasAllowed = false;
+  const ownedId = $derived(owner && current(owner) && allowed ? taskId : undefined);
+  const submit = useSubmitTask();
+  const task = useTask(definedReactiveOptions({
+    get taskId() { return ownedId; },
+    get taskProvider() { return scope.provider; },
+    errorNotification: false,
+    successNotification: false,
+    get queryOptions() {
+      return { enabled: !!ownedId && !!scope.provider,
+        refetchInterval: ownedId && ownedId !== completedId ? 2000 : false as const };
+    },
+  }));
+  const status = $derived(ownedId ? normalizeTaskStatus(task.data?.status) : 'unknown');
+  const terminal = $derived(['completed', 'failed', 'cancelled'].includes(status));
+  $effect(() => { if (ownedId && terminal) completedId = ownedId; });
+  const artifact = $derived.by(() => {
+    if (!ownedId || status !== 'completed' || !request || !idempotencyKey) return;
+    const result = snapshotPivotExportTaskResult(task.data?.result ?? task.data?.result_data, { taskName, idempotencyKey, request });
+    if (!result || !safeArtifactUrl(result.downloadUrl)) return;
+    return {
+      format: result.format, downloadUrl: result.downloadUrl,
+      ...(result.fileName ? { fileName: result.fileName } : {}),
+    };
+  });
+  const failed = $derived(error || (!!ownedId && (task.isError || status === 'failed'
+    || (status === 'completed' && !artifact))));
+  const busy = $derived(!!attempt && current(attempt.origin));
+  const pending = $derived(!!ownedId && !terminal && !task.isError);
+
+  onDestroy(() => { mounted = false; attempt = undefined; });
+  $effect.pre(() => {
+    const revoked = wasAllowed && !allowed;
+    wasAllowed = allowed;
+    if (owner && (!current(owner) || revoked)) {
+      owner = undefined; taskId = undefined; completedId = undefined; error = false;
+    }
+    if (attempt && (!current(attempt.origin) || !allowed)) { attempt = undefined; error = false; }
+  });
+
+  async function run() {
+    if (!allowed || busy || !request || !scope.provider) return;
+    const origin = scope;
+    const source = scope.provider;
+    if (ownedId) {
+      if (artifact && owner && current(owner)) {
+        const token = { origin };
+        const receipt = artifact;
+        const resource = request.query.resource;
+        attempt = token;
+        error = false;
+        try {
+          const checked = origin.access ? await origin.access.can(definedOptions({
+            resource, action: 'export', meta: request.query.meta,
+          })) : { can: true };
+          if (attempt !== token || !current(origin) || !allowed) return;
+          if (!checked.can) {
+            owner = undefined; taskId = undefined; error = true;
+            return;
+          }
+          downloadExportArtifact(receipt, resource);
+        } catch {
+          if (attempt === token && current(origin) && allowed) error = true;
+        } finally {
+          if (attempt === token) attempt = undefined;
+        }
+      } else if (task.isError) {
+        try { await task.refetch(); } catch { /* 查询状态提供脱敏错误。 */ }
+      }
+      return;
+    }
+    if (!taskName.trim() || !idempotencyKey?.trim()) { error = true; return; }
+    const token = { origin };
+    const notify = onTaskSubmitted;
+    attempt = token;
+    error = false;
+    try {
+      const handle = await submit.mutation.mutateAsync({
+        taskName, taskProvider: source,
+        options: { idempotencyKey, body: { ...request } },
+        successNotification: false, errorNotification: false,
+      });
+      if (attempt !== token || !current(origin) || !allowed) return;
+      owner = origin;
+      taskId = handle.id;
+      try { void Promise.resolve(notify?.(handle.id)).catch(() => {}); } catch { /* 不重发已提交任务。 */ }
+    } catch {
+      if (attempt === token && current(origin) && allowed) error = true;
+    } finally {
+      if (attempt === token) attempt = undefined;
+    }
+  }
+
+  const label = $derived(artifact ? i18n.t('common.download') : task.isError && ownedId
+    ? i18n.t('common.retry') : busy || pending ? i18n.t('common.processing')
+    : ownedId && terminal ? i18n.t(status === 'cancelled' ? 'task.status.cancelled' : 'common.error')
+    : i18n.t('common.export'));
+</script>
+
+<Button variant="outline" size="sm" onclick={run} aria-busy={busy || pending}
+  disabled={!allowed || !scope.provider || busy || (!!ownedId && !artifact && !task.isError)}>
+  <Download aria-hidden="true" />{label}
+</Button>
+{#if allowed && failed}<p role="alert">{i18n.t('common.error')}</p>{/if}

package/dist/components/PivotExportButton.svelte.d.ts

@@ -0,0 +1,16 @@
+import { type TaskProvider, type ExportFormat } from '@svadmin/core';
+import { type PivotQuery } from '@svadmin/core/pivot';
+type $$ComponentProps = {
+    query: PivotQuery;
+    scopeKey: string;
+    taskName: string;
+    taskProvider?: TaskProvider;
+    idempotencyKey?: string;
+    initialTaskId?: string;
+    format?: ExportFormat;
+    disabled?: boolean;
+    onTaskSubmitted?: (id: string) => void | Promise<void>;
+};
+declare const PivotExportButton: import("svelte").Component<$$ComponentProps, {}, "">;
+type PivotExportButton = ReturnType<typeof PivotExportButton>;
+export default PivotExportButton;