@svadmin/ui 0.70.0 → 0.73.0

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

@@ -2,6 +2,7 @@ export interface TreeSelectOption {
     value: string | number;
     label: string;
     children?: TreeSelectOption[];
+    hasChildren?: boolean;
     disabled?: boolean;
     expanded?: boolean;
 }
@@ -14,9 +15,10 @@ interface Props {
     onlyLeafSelectable?: boolean;
     disabled?: boolean;
     allowClear?: boolean;
+    loadChildren?: (node: TreeSelectOption) => Promise<TreeSelectOption[]>;
     class?: string;
     onchange?: (value: string | number | (string | number)[] | undefined) => void;
 }
-declare const TreeSelect: import("svelte").Component<Props, {}, "value">;
+declare const TreeSelect: import("svelte").Component<Props, {}, "value" | "options">;
 type TreeSelect = ReturnType<typeof TreeSelect>;
 export default TreeSelect;

package/dist/components/ValidatedField.svelte

@@ -0,0 +1,27 @@
+<script lang="ts" generics="P extends Record<string, unknown>">
+  import type { Component } from 'svelte';
+  import { useTranslation } from '@svadmin/core/i18n';
+  import type { FieldDisplayProps } from './fieldComponentMap';
+
+  let { component: Display, resolve, input }: {
+    component: Component<P>;
+    resolve: (input: FieldDisplayProps) => { ok: true; props: P } | { ok: false };
+    input: FieldDisplayProps;
+  } = $props();
+
+  const i18n = useTranslation();
+  const result = $derived.by(() => {
+    try {
+      return resolve(input);
+    } catch {
+      // Invalid recursive values and schema failures must not reach the renderer.
+      return { ok: false } as const;
+    }
+  });
+</script>
+
+{#if result.ok}
+  <Display {...result.props} />
+{:else}
+  <span role="status" data-svadmin-invalid-field>{i18n.t('validation.invalidFormat')}</span>
+{/if}

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

@@ -0,0 +1,35 @@
+import type { Component } from 'svelte';
+import type { FieldDisplayProps } from './fieldComponentMap';
+declare function $$render<P extends Record<string, unknown>>(): {
+    props: {
+        component: Component<P>;
+        resolve: (input: FieldDisplayProps) => {
+            ok: true;
+            props: P;
+        } | {
+            ok: false;
+        };
+        input: FieldDisplayProps;
+    };
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<P extends Record<string, unknown>> {
+    props(): ReturnType<typeof $$render<P>>['props'];
+    events(): ReturnType<typeof $$render<P>>['events'];
+    slots(): ReturnType<typeof $$render<P>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <P extends Record<string, unknown>>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<P>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<P>['props']>, ReturnType<__sveltets_Render<P>['events']>, ReturnType<__sveltets_Render<P>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<P>['bindings']>;
+    } & ReturnType<__sveltets_Render<P>['exports']>;
+    <P extends Record<string, unknown>>(internal: unknown, props: ReturnType<__sveltets_Render<P>['props']> & {}): ReturnType<__sveltets_Render<P>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const ValidatedField: $$IsomorphicComponent;
+type ValidatedField<P extends Record<string, unknown>> = InstanceType<typeof ValidatedField<P>>;
+export default ValidatedField;

package/dist/components/account/ImportMembersPage.svelte

@@ -40,7 +40,7 @@
   }
 
   function handleFileSelect(e: Event) {
-    const file = (e.target as HTMLInputElement).files?.[0];
+    const file = e.target instanceof HTMLInputElement ? e.target.files?.[0] : undefined;
     if (file) processFile(file);
   }
 
@@ -162,7 +162,7 @@
         {#each importOptions as option, i (option.key)}
           <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-8ef2268efbbc svadmin-u-0c3bc98565dd">
             <Label for="import-option-{i}" class="svadmin-u-fc7473ca09eb svadmin-u-8ecebc9f80e6 svadmin-u-d4108abe6359">{i18n.t(option.key)}</Label>
-            <Switch id="import-option-{i}" bind:checked={optionStates[i]} />
+            <Switch id="import-option-{i}" checked={optionStates[i] ?? option.checked} onCheckedChange={(checked) => { optionStates[i] = checked; }} />
           </div>
         {/each}
         <div class="svadmin-u-60fbb7713999 svadmin-u-77c08e015d14 svadmin-u-b950dda299d3 svadmin-u-173fa8f06789">

package/dist/components/account/SecurityLogPage.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+  import { definedOptions } from '@svadmin/core/options';
+
   import { useTranslation } from '@svadmin/core/i18n';
   import { Download } from '@lucide/svelte';
   import { Button } from '../ui/button/index.js';
@@ -15,7 +17,7 @@
 </script>
 
 <ContentPageShell pageId="account-security-log" width="wide">
-  <ContentPageHeader title={i18n.t('account.securityLog')} description={i18n.t('account.securityLogDescription')} actions={undefined} />
+  <ContentPageHeader title={i18n.t('account.securityLog')} description={i18n.t('account.securityLogDescription')} {...definedOptions({ "actions": undefined })} />
   <div class="svadmin-u-60fbb7713999 svadmin-u-77c08e015d14"><Button variant="outline" size="sm"><Download class="svadmin-u-783b0d9d1e2c" />{i18n.t('common.export')}</Button></div>
   <FilterToolbar bind:query placeholder={i18n.t('common.search')} />
   <SecurityEventTable events={filtered} />

package/dist/components/account/SettingsEnterprisePage.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+  import { definedOptions } from '@svadmin/core/options';
+
   import {
     captureAdminContext,
     notifyWithProvider,
@@ -167,13 +169,13 @@
     testing = true;
     try {
       const selectedProvider = target ?? identityProviders[0];
-      const result = await provider.testIdentityProvider({
+      const result = await provider.testIdentityProvider(definedOptions({
         id: selectedProvider?.id,
         protocol: selectedProvider?.protocol,
         metadataUrl: target
           ? target.metadataUrl
           : (metadataUrl.trim() || selectedProvider?.metadataUrl),
-      }, context);
+      }), context);
       if (currentRequest !== requestId) return;
       notifyWithProvider({
         type: result.success ? 'success' : 'error',
@@ -189,14 +191,14 @@
     }
   }
 
-  const displayEvents = $derived(events.map((event): SecurityEvent => ({
+  const displayEvents = $derived(events.map((event): SecurityEvent => (definedOptions({
     id: event.id,
     event: event.event,
     actor: event.actor,
     location: event.location,
     createdAt: event.createdAt instanceof Date ? event.createdAt.toLocaleString() : String(event.createdAt),
     severity: event.severity === 'critical' ? 'danger' : (event.severity ?? 'info'),
-  })));
+  }))));
 </script>
 
 {#snippet auditControl()}
@@ -242,7 +244,7 @@
         <DataState state="empty" title={isZh ? '尚未配置身份源' : 'No identity provider configured'} description={isZh ? '请在后端 IdentityGovernanceProvider 中创建并验证身份源。' : 'Create and verify an identity provider through the backend IdentityGovernanceProvider.'} />
       {:else}
         {#each identityProviders as connection (connection.id)}
-          <IntegrationCard integration={{ id: connection.id, name: connection.name, account: connection.protocol.toUpperCase(), connected: connection.status === 'connected', description: connection.domain ?? connection.metadataUrl }} onconnect={() => testConnection(connection)} />
+          <IntegrationCard integration={definedOptions({ id: connection.id, name: connection.name, account: connection.protocol.toUpperCase(), connected: connection.status === 'connected', description: connection.domain ?? connection.metadataUrl })} onconnect={() => testConnection(connection)} />
         {/each}
       {/if}
     </section>

package/dist/components/account/TeamMembersPage.svelte

@@ -17,7 +17,7 @@
   let inviteStatus = $state('');
   let members = $state<MemberSummary[]>(referenceDemoData.members.map((member) => ({ ...member, status: member.status === 'active' ? 'success' : member.status === 'invited' ? 'warning' : 'neutral' })));
   const filtered = $derived(query ? members.filter((member) => `${member.name} ${member.email} ${member.department}`.toLowerCase().includes(query.toLowerCase())) : members);
-  function sendInvite() { const email = inviteEmail.trim(); if (!email) return; members = [...members, { id: `invite-${Date.now()}`, name: email.split('@')[0], email, role: 'Viewer', department: 'Pending assignment', status: 'warning' }]; inviteStatus = email; inviteEmail = ''; }
+  function sendInvite() { const email = inviteEmail.trim(); if (!email) return; members = [...members, { id: `invite-${Date.now()}`, name: email.replace(/@.*$/, ''), email, role: 'Viewer', department: 'Pending assignment', status: 'warning' }]; inviteStatus = email; inviteEmail = ''; }
 </script>
 
 <ContentPageShell pageId="account-team-members" width="wide">

package/dist/components/auto-table-grid.d.ts

@@ -0,0 +1,26 @@
+import type { Snippet } from 'svelte';
+import type { Sort } from '@svadmin/core';
+/** 可信宿主的渲染扩展；资源查询、权限、操作和偏好状态仍由 AutoTable 持有。 */
+export interface AutoTableGridState {
+    readonly records: readonly Record<string, unknown>[];
+    readonly columns: readonly {
+        key: string;
+        label: string;
+        width: number;
+        sortable: boolean;
+    }[];
+    readonly primaryKey: string;
+    readonly sorters: readonly Sort[];
+    readonly density: 'compact' | 'comfortable';
+    readonly locale: string;
+    readonly label: string;
+    readonly scopeKey: string;
+    readonly disabled: boolean;
+    readonly onSortChange: (sorters: readonly Sort[]) => void;
+    readonly cell: Snippet<[{
+        id: string | number;
+        field: string;
+    }]>;
+    readonly controls: Snippet;
+    readonly after: Snippet;
+}

package/dist/components/auto-table-grid.js

@@ -0,0 +1 @@
+export {};

package/dist/components/buttons/CloneButton.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+  import { definedOptions } from '@svadmin/core/options';
+
   import type { Snippet } from 'svelte';
   import { getResource, useNavigation, useCan, useTranslation } from '@svadmin/core';
   import { Button } from '../ui/button/index.js';
@@ -16,7 +18,7 @@
     hideText = false,
     accessControl = { enabled: true, hideIfUnauthorized: true },
     class: className = '',
-  } = $props<{
+  }: {
     resource: string;
     recordItemId: string | number;
     label?: string;
@@ -24,7 +26,7 @@
     hideText?: boolean;
     accessControl?: ButtonAccessControl;
     class?: string;
-  }>();
+  } = $props();
 
   const nav = useNavigation();
   const resourceDefinition = $derived.by(() => {
@@ -34,13 +36,13 @@
       return null;
     }
   });
-  const can = useCan(() => ({
+  const can = useCan(() => (definedOptions({
     resource,
     action: 'create',
     params: withRecordId(accessControl?.params, recordItemId),
     meta: accessControl?.meta,
     queryOptions: { enabled: accessControl?.enabled ?? true }
-  }));
+  })));
   const displayText = $derived(label ?? i18n.t('common.clone'));
   const hidden = $derived(resourceDefinition?.canCreate === false || (accessControl?.hideIfUnauthorized && !can.allowed));
 </script>

package/dist/components/buttons/DeleteButton.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
+  import { definedOptions, definedReactiveOptions } from '@svadmin/core/options';
+
   import type { Snippet } from 'svelte';
-  import { getResource, useDelete, useCan, useTranslation } from '@svadmin/core';
+  import { captureAdminContext, captureAuthSession, useResourceContract, useDelete, useCan, useTranslation, UndoError } from '@svadmin/core';
   import { Button } from '../ui/button/index.js';
   import { Trash2 } from '@lucide/svelte';
   import type { ButtonAccessControl } from './access-control';
-  import { withRecordId } from './access-control';
 
   const i18n = useTranslation();
 
@@ -17,8 +18,10 @@
     accessControl = { enabled: true, hideIfUnauthorized: true },
     onSuccess,
     undoable = false,
+    undoableTimeout,
+    variables,
     class: className = '',
-  } = $props<{
+  }: {
     resource: string;
     recordItemId: string | number;
     label?: string;
@@ -27,59 +30,119 @@
     accessControl?: ButtonAccessControl;
     onSuccess?: () => void;
     undoable?: boolean;
+    undoableTimeout?: number;
+    variables?: unknown;
     class?: string;
-  }>();
+  } = $props();
 
-  const deleteMut = useDelete({ get resource() { return resource; }, get mutationMode() { return undoable ? 'undoable' as const : 'pessimistic' as const; } });
-  const resourceDefinition = $derived.by(() => {
-    try {
-      return getResource(resource);
-    } catch {
-      return null;
-    }
-  });
-  const can = useCan(() => ({
+  const binding = useResourceContract(() => resource);
+  const context = captureAdminContext();
+  const resourceDefinition = $derived(context.getResource(resource));
+  const can = useCan(() => (definedOptions({
     resource,
     action: 'delete',
-    params: withRecordId(accessControl?.params, recordItemId),
+    id: recordItemId,
+    params: accessControl?.params,
     meta: accessControl?.meta,
     queryOptions: { enabled: accessControl?.enabled ?? true }
-  }));
+  })));
   const displayText = $derived(label ?? i18n.t('common.delete'));
-  const hidden = $derived(resourceDefinition?.canDelete === false || (accessControl?.hideIfUnauthorized && !can.allowed));
+  const session = $derived(captureAuthSession(context.authProvider));
+  const policyAllowed = $derived(accessControl.enabled === false || can.allowed === true);
+  const allowed = $derived(session.available && policyAllowed);
+  const hidden = $derived(resourceDefinition.canDelete === false || (accessControl.hideIfUnauthorized && !allowed));
+  const deleteMut = useDelete(definedReactiveOptions({
+    get resource() { return binding.resource; },
+    get id() { return recordItemId; },
+    get enabled() { return policyAllowed && resourceDefinition.canDelete !== false; },
+    get undoable() { return undoable; },
+    get undoableTimeout() { return undoableTimeout; },
+  }));
   let confirming = $state(false);
-
-  async function handleDelete() {
-    if (!confirming) {
-      confirming = true;
-      return;
+  let pending = $state(false);
+  let failed = $state(false);
+  const scope = $derived({
+    contract: binding.resource, id: recordItemId, variables,
+    provider: context.providers?.[binding.dataProviderName],
+    tenant: context.tenantCacheKey?.__svadminTenant,
+    meta: binding.meta, allowed, hidden, auth: context.authProvider, session,
+  });
+  let confirmationScope = $state.raw<typeof scope>();
+  let previousScope: typeof scope | undefined;
+  let active: object | undefined;
+  $effect(() => {
+    if (previousScope !== scope) {
+      // The hook owns session retirement; do not cancel its own checked logout delegate.
+      if (active && previousScope?.session.isCurrent()) deleteMut.mutation.reset();
+      previousScope = scope;
+      active = undefined;
+      confirming = false;
+      confirmationScope = undefined;
+      pending = false;
+      failed = false;
     }
+  });
+  $effect(() => () => { active = undefined; });
+
+  function beginConfirmation() {
+    if (pending || !allowed || hidden || !session.isCurrent()) return;
+    confirmationScope = scope;
+    confirming = true;
+  }
+
+  const confirmDelete = $derived.by(() => {
+    const captured = scope;
+    return () => handleDelete(captured);
+  });
+  async function handleDelete(capturedScope: typeof scope) {
+    if (pending || !allowed || hidden || !capturedScope.session.isCurrent() ||
+      capturedScope !== scope || !confirming || confirmationScope !== capturedScope) return;
+    const token = {};
+    const success = onSuccess;
+    previousScope = capturedScope;
+    active = token;
     confirming = false;
-    await deleteMut.mutation.mutateAsync({ id: recordItemId, resource });
-    onSuccess?.();
+    confirmationScope = undefined;
+    pending = true;
+    failed = false;
+    try {
+      await deleteMut.mutation.mutateAsync(definedOptions({
+        variables, dataProviderName: binding.dataProviderName,
+      }));
+      if (active === token && scope === capturedScope && capturedScope.session.isCurrent()) success?.();
+    } catch (error) {
+      if (!(error instanceof UndoError) && active === token && scope === capturedScope && capturedScope.session.isCurrent()) failed = true;
+    } finally {
+      if (active === token && scope === capturedScope && capturedScope.session.isCurrent()) {
+        active = undefined;
+        pending = false;
+      }
+    }
   }
 
-  function cancel() { confirming = false; }
+  function cancel() { confirming = false; confirmationScope = undefined; }
 </script>
 
 {#if !hidden}
-  {#if confirming}
+  {#if confirming && confirmationScope === scope && session.isCurrent()}
     <div class="svadmin-u-52083e7da442 svadmin-u-3960ffc248d9 svadmin-u-44ee8ba0a421">
-      <Button variant="destructive" size="sm" onclick={handleDelete}>
+      <Button type="button" variant="destructive" size="sm" disabled={pending || !allowed} onclick={confirmDelete}>
         {i18n.t('common.confirm')}
       </Button>
-      <Button variant="ghost" size="sm" onclick={cancel}>
+      <Button type="button" variant="ghost" size="sm" disabled={pending} onclick={cancel}>
         {i18n.t('common.cancel')}
       </Button>
     </div>
   {:else}
     <Button
+      type="button"
       variant="ghost"
       size={hideText ? 'icon' : 'sm'}
       class="svadmin-u-811148b13d1e svadmin-u-51e95020d6f2 {className}"
       aria-label={hideText ? displayText : undefined}
-      disabled={!can.allowed}
-      onclick={handleDelete}
+      disabled={pending || !allowed}
+      aria-busy={pending}
+      onclick={beginConfirmation}
     >
       <Trash2 class="svadmin-u-11e59c6d5f6b svadmin-u-dc7972ebf3f3" />
       {#if !hideText}
@@ -93,4 +156,7 @@
       {/if}
     </Button>
   {/if}
+  {#if failed}
+    <p role="alert">{i18n.t('common.error')}</p>
+  {/if}
 {/if}

package/dist/components/buttons/DeleteButton.svelte.d.ts

@@ -9,6 +9,8 @@ type $$ComponentProps = {
     accessControl?: ButtonAccessControl;
     onSuccess?: () => void;
     undoable?: boolean;
+    undoableTimeout?: number;
+    variables?: unknown;
     class?: string;
 };
 declare const DeleteButton: import("svelte").Component<$$ComponentProps, {}, "">;

package/dist/components/buttons/EditButton.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+  import { definedOptions } from '@svadmin/core/options';
+
   import type { Snippet } from 'svelte';
   import { getResource, useNavigation, useCan, useTranslation } from '@svadmin/core';
   import { Button } from '../ui/button/index.js';
@@ -16,7 +18,7 @@
     hideText = false,
     accessControl = { enabled: true, hideIfUnauthorized: true },
     class: className = '',
-  } = $props<{
+  }: {
     resource: string;
     recordItemId: string | number;
     label?: string;
@@ -24,7 +26,7 @@
     hideText?: boolean;
     accessControl?: ButtonAccessControl;
     class?: string;
-  }>();
+  } = $props();
 
   const nav = useNavigation();
   const resourceDefinition = $derived.by(() => {
@@ -34,13 +36,13 @@
       return null;
     }
   });
-  const can = useCan(() => ({
+  const can = useCan(() => (definedOptions({
     resource,
     action: 'edit',
     params: withRecordId(accessControl?.params, recordItemId),
     meta: accessControl?.meta,
     queryOptions: { enabled: accessControl?.enabled ?? true }
-  }));
+  })));
   const displayText = $derived(label ?? i18n.t('common.edit'));
   const hidden = $derived(resourceDefinition?.canEdit === false || (accessControl?.hideIfUnauthorized && !can.allowed));
 </script>

package/dist/components/buttons/ExportButton.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import type { Snippet } from 'svelte';
-  import { useExport, useCan, useTranslation } from '@svadmin/core';
+  import { useCan, useTranslation, useExport, useResourceContract } from '@svadmin/core';
+  import { definedReactiveOptions } from '@svadmin/core/options';
   import { Button } from '../ui/button/index.js';
   import { Download } from '@lucide/svelte';
   import type { ButtonAccessControl } from './access-control';
@@ -23,7 +24,12 @@
     class?: string;
   }>();
 
-  const { triggerExport, isLoading } = useExport({ get resource() { return resource; } });
+  const binding = useResourceContract(() => resource);
+  const exporter = useExport(definedReactiveOptions({
+    get resource() { return binding.resource; },
+    get dataProviderName() { return binding.dataProviderName; },
+    get meta() { return binding.meta; },
+  }));
   const can = useCan(() => ({
     resource,
     action: 'export',
@@ -33,6 +39,14 @@
   }));
   const hidden = $derived(accessControl?.hideIfUnauthorized && !can.allowed);
   const displayText = $derived(label ?? i18n.t('common.export'));
+
+  async function exportRecords() {
+    if (!can.allowed || exporter.isLoading) return;
+    try { await exporter.triggerExport(); }
+    catch {
+      // The hook exposes a sanitized error; stale-scope cancellations remain silent.
+    }
+  }
 </script>
 
 {#if !hidden}
@@ -41,8 +55,9 @@
     size={hideText ? 'icon' : 'sm'}
     class={className}
     aria-label={hideText ? displayText : undefined}
-    disabled={isLoading || !can.allowed}
-    onclick={triggerExport}
+    disabled={exporter.isLoading || !can.allowed}
+    aria-busy={exporter.isLoading}
+    onclick={exportRecords}
   >
     <Download class="svadmin-u-11e59c6d5f6b svadmin-u-dc7972ebf3f3" />
     {#if !hideText}
@@ -55,4 +70,7 @@
       </span>
     {/if}
   </Button>
+  {#if exporter.error}
+    <p role="alert">{i18n.t('common.error')}</p>
+  {/if}
 {/if}