@svadmin/ui 0.57.0 → 0.59.0

package/dist/components/AICommandBar.svelte

@@ -1,15 +1,17 @@
 <script lang="ts">
-  import { captureAdminContext, toggleTheme } from '@svadmin/core';
+  import { captureAdminContext, toggleTheme, useNavigation } from '@svadmin/core';
   import { useTranslation } from '@svadmin/core/i18n';
   import { Command } from './ui/command/index.js';
   import * as Dialog from './ui/dialog/index.js';
   import { Search, LayoutDashboard, Plus, Sun, FileText, Sparkles, Loader2 } from '@lucide/svelte';
   import MarkdownRenderer from './MarkdownRenderer.svelte';
+  import CanAccess from './CanAccess.svelte';
 
   const i18n = useTranslation();
 
   let { open = $bindable(false) } = $props<{ open?: boolean }>();
   const adminContext = captureAdminContext();
+  const navigation = useNavigation();
   let searchValue = $state('');
   
   const resources = $derived(adminContext.resources);
@@ -109,6 +111,7 @@
 
 <Dialog.Dialog bind:open onOpenChange={(v: boolean) => !v && close()}>
   <Dialog.DialogContent class="overflow-hidden p-0 sm:max-w-[600px] border-none shadow-2xl">
+    <Dialog.DialogTitle class="sr-only">{i18n.t('common.actions')}</Dialog.DialogTitle>
     <Command.Root
       shouldFilter={!aiMode}
       class="flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground [&_[data-command-group-heading]]:text-muted-foreground [&_[data-command-group-heading]]:px-2 [&_[data-command-group-heading]]:py-1.5 [&_[data-command-group-heading]]:text-xs [&_[data-command-group-heading]]:font-semibold [&_[data-command-group-heading]]:uppercase [&_[data-command-group-heading]]:tracking-wider"
@@ -127,7 +130,8 @@
         />
         {#if searchValue.trim() && !aiMode}
           <button 
-            class="absolute right-3 flex items-center gap-1 text-[10px] font-medium text-warning bg-warning/10 hover:bg-warning/20 px-2 py-1 rounded transition-colors"
+            type="button"
+            class="absolute right-3 flex items-center gap-1 text-[10px] font-medium text-warning bg-warning/10 hover:bg-warning/20 px-2 py-1 rounded transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
             onclick={askAI}
           >
             <Sparkles class="h-3 w-3" />
@@ -149,10 +153,19 @@
               {i18n.t('common.home')}
             </Command.Item>
             {#each resources as r, _i (_i)}
-              <Command.Item value={r.name} onSelect={() => act(() => adminContext.navigate(`/${r.name}`))} class={itemClass}>
-                <FileText class="h-4 w-4 text-muted-foreground" />
-                {r.label}
-              </Command.Item>
+              {#if adminContext.accessControlProvider}
+                <CanAccess resource={r.name} action="list">
+                  <Command.Item value={r.name} onSelect={() => act(() => navigation.list(r.name))} class={itemClass}>
+                    <FileText class="h-4 w-4 text-muted-foreground" />
+                    {r.label}
+                  </Command.Item>
+                </CanAccess>
+              {:else}
+                <Command.Item value={r.name} onSelect={() => act(() => navigation.list(r.name))} class={itemClass}>
+                  <FileText class="h-4 w-4 text-muted-foreground" />
+                  {r.label}
+                </Command.Item>
+              {/if}
             {/each}
           </Command.Group>
 
@@ -161,10 +174,21 @@
           <!-- Actions -->
           <Command.Group heading={i18n.t('common.actions')}>
             {#each resources as r, _i (_i)}
-              <Command.Item value={`create-${r.name}`} onSelect={() => act(() => adminContext.navigate(`/${r.name}/create`))} class={itemClass}>
-                <Plus class="h-4 w-4 text-muted-foreground" />
-                {i18n.t('common.create')} {r.label}
-              </Command.Item>
+              {#if r.canCreate !== false}
+                {#if adminContext.accessControlProvider}
+                  <CanAccess resource={r.name} action="create">
+                    <Command.Item value={`create-${r.name}`} onSelect={() => act(() => navigation.create(r.name))} class={itemClass}>
+                      <Plus class="h-4 w-4 text-muted-foreground" />
+                      {i18n.t('common.create')} {r.label}
+                    </Command.Item>
+                  </CanAccess>
+                {:else}
+                  <Command.Item value={`create-${r.name}`} onSelect={() => act(() => navigation.create(r.name))} class={itemClass}>
+                    <Plus class="h-4 w-4 text-muted-foreground" />
+                    {i18n.t('common.create')} {r.label}
+                  </Command.Item>
+                {/if}
+              {/if}
             {/each}
             <Command.Item value="toggle-theme" onSelect={() => act(() => toggleTheme())} class={itemClass}>
               <Sun class="h-4 w-4 text-muted-foreground" />

package/dist/components/AdminApp.svelte

@@ -73,6 +73,7 @@
   import ErrorPage from './ErrorPage.svelte';
   import SystemPageShell from './SystemPageShell.svelte';
   import LazyPage from './LazyPage.svelte';
+  import ResourceAccessGuard from './ResourceAccessGuard.svelte';
   import { Button } from './ui/button/index.js';
   import { Input } from './ui/input/index.js';
   import { Badge } from './ui/badge/index.js';
@@ -609,27 +610,37 @@
       {:else if (renderedRoute === '/:resource' || renderedRoute === '/:parent/:parentId/:resource') && renderedHasRouteResource}
         {#key renderedParams.resource}
           {@const Comp = renderedResourcePages?.list ?? mergedComponents.AutoTable}
-          <Comp resourceName={renderedParams.resource} />
+          <ResourceAccessGuard resourceName={renderedParams.resource} action="list">
+            <Comp resourceName={renderedParams.resource} />
+          </ResourceAccessGuard>
         {/key}
       {:else if (renderedRoute === '/:resource/create' || renderedRoute === '/:parent/:parentId/:resource/create') && renderedHasRouteResource}
         {#key renderedParams.resource}
           {@const Comp = renderedResourcePages?.create ?? mergedComponents.AutoForm}
-          <Comp resourceName={renderedParams.resource} mode="create" />
+          <ResourceAccessGuard resourceName={renderedParams.resource} action="create">
+            <Comp resourceName={renderedParams.resource} mode="create" />
+          </ResourceAccessGuard>
         {/key}
       {:else if (renderedRoute === '/:resource/edit/:id' || renderedRoute === '/:resource/:id/edit' || renderedRoute === '/:parent/:parentId/:resource/edit/:id') && renderedHasRouteResource}
         {#key `${renderedParams.resource}-${renderedParams.id}`}
           {@const Comp = renderedResourcePages?.edit ?? mergedComponents.AutoForm}
-          <Comp resourceName={renderedParams.resource} mode="edit" id={renderedParams.id} />
+          <ResourceAccessGuard resourceName={renderedParams.resource} action="edit" id={renderedParams.id}>
+            <Comp resourceName={renderedParams.resource} mode="edit" id={renderedParams.id} />
+          </ResourceAccessGuard>
         {/key}
       {:else if (renderedRoute === '/:resource/show/:id' || renderedRoute === '/:resource/:id' || renderedRoute === '/:parent/:parentId/:resource/show/:id') && renderedHasRouteResource}
         {#key `${renderedParams.resource}-${renderedParams.id}`}
           {@const Comp = renderedResourcePages?.show ?? mergedComponents.ShowPage}
-          <Comp resourceName={renderedParams.resource} id={renderedParams.id} />
+          <ResourceAccessGuard resourceName={renderedParams.resource} action="show" id={renderedParams.id}>
+            <Comp resourceName={renderedParams.resource} id={renderedParams.id} />
+          </ResourceAccessGuard>
         {/key}
       {:else if (renderedRoute === '/:resource/clone/:id' || renderedRoute === '/:parent/:parentId/:resource/clone/:id') && renderedHasRouteResource}
         {#key `${renderedParams.resource}-clone-${renderedParams.id}`}
           {@const Comp = renderedResourcePages?.clone ?? mergedComponents.AutoForm}
-          <Comp resourceName={renderedParams.resource} mode="clone" id={renderedParams.id} />
+          <ResourceAccessGuard resourceName={renderedParams.resource} action="create" id={renderedParams.id} requireSourceRead>
+            <Comp resourceName={renderedParams.resource} mode="clone" id={renderedParams.id} />
+          </ResourceAccessGuard>
         {/key}
       {:else}
         {@const ErrorComp = mergedComponents.ErrorPage || ErrorPage}

package/dist/components/AutoForm.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { captureAdminContext, useForm, getResource, deriveValidator } from '@svadmin/core';
+  import { useForm, getResource, deriveValidator, useNavigation } from '@svadmin/core';
   import { slide } from 'svelte/transition';
   import type { FieldDefinition } from '@svadmin/core';
   import { useTranslation } from '@svadmin/core/i18n';
@@ -45,7 +45,7 @@
     onSuccess,
     onNavigationGuardReady,
   }: Props = $props();
-  const adminContext = captureAdminContext();
+  const navigation = useNavigation();
   const isReadonly = $derived(mode === 'show');
   const isCompact = $derived(density === 'compact');
 
@@ -196,7 +196,7 @@
     <div class="flex items-center gap-4">
       <TooltipButton
         tooltip={i18n.t('common.back')}
-        onclick={() => guardNavigate(() => adminContext.navigate(`/${resourceName}`))}
+        onclick={() => guardNavigate(() => navigation.list(resourceName))}
       >
         <ArrowLeft class="h-5 w-5" />
       </TooltipButton>
@@ -311,7 +311,7 @@
             type="button"
             variant="outline"
             size={isCompact ? 'sm' : 'default'}
-            onclick={() => guardNavigate(() => adminContext.navigate(`/${resourceName}`))}
+            onclick={() => guardNavigate(() => navigation.list(resourceName))}
           >
             {i18n.t('common.cancel')}
           </Button>