@svadmin/ui 0.26.1 → 0.26.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svadmin/ui",
-  "version": "0.26.1",
+  "version": "0.26.3",
   "description": "Pre-built admin UI components — AdminApp, AutoTable, AutoForm, Sidebar, Layout",
   "type": "module",
   "sideEffects": [
@@ -49,15 +49,15 @@
     }
   },
   "dependencies": {
-    "@lucide/svelte": "^0.577.0",
+    "@lucide/svelte": "^1.7.0",
     "@tanstack/svelte-table": "^9.0.0-alpha.10",
-    "bits-ui": "^2.0.0",
-    "clsx": "^2.0.0",
+    "bits-ui": "^2.16.5",
+    "clsx": "^2.1.1",
     "cmdk-sv": "^0.0.19",
-    "lucide-svelte": "^0.577.0",
+    "lucide-svelte": "^1.0.1",
     "sonner-svelte": "^0.3.3",
-    "tailwind-merge": "^3.0.0",
-    "tailwind-variants": "^3.0.0"
+    "tailwind-merge": "^3.5.0",
+    "tailwind-variants": "^3.2.2"
   },
   "license": "MIT",
   "author": "zuohuadong",

package/src/components/AutoTable.svelte

@@ -120,7 +120,18 @@
   const activeFilters = $derived.by(() => {
     const result: Filter[] = [...filters];
     if (searchText.trim() && searchableFields.length > 0) {
-      result.push({ field: searchableFields[0].key, operator: 'contains', value: searchText });
+      if (searchableFields.length === 1) {
+        result.push({ field: searchableFields[0].key, operator: 'contains', value: searchText });
+      } else {
+        result.push({
+          operator: 'or',
+          value: searchableFields.map(f => ({
+            field: f.key,
+            operator: 'contains',
+            value: searchText
+          }))
+        } as any);
+      }
     }
     // Add popover filters
     for (const [key, value] of Object.entries(filterValues)) {

package/src/components/ListPage.svelte

@@ -63,7 +63,7 @@
   <AutoTable
     {resourceName}
     {selectable}
-    {cellRenderer}
+    defaultCellRenderer={cellRenderer}
     {rowActions}
     {emptyState}
     {expandedRowRender}

package/src/components/MarkdownRenderer.svelte

@@ -13,6 +13,7 @@
 
   // Only safely import css if hljs exists
   if (hljsModule && Object.keys(hljsModule).length > 0) {
+    // @ts-ignore
     import("highlight.js/styles/github-dark.css").catch(() => {});
   }
 
@@ -27,7 +28,7 @@
 
   let { content, streaming = false, class: className = "" }: Props = $props();
 
-  const hasMarkdownDeps = !!(Marked && markedHighlight && DOMPurify && Object.keys(DOMPurify).length > 0);
+  const hasMarkdownDeps = !!(Marked && Object.keys(DOMPurify || {}).length > 0);
 
   // Configure marked with syntax highlighting if available
   const markedObj = hasMarkdownDeps ? new Marked(
@@ -43,7 +44,7 @@
   // Render HTML safely
   const html = $derived(
     hasMarkdownDeps
-      ? DOMPurify.sanitize(markedObj.parse(content || "") as string)
+      ? DOMPurify.sanitize(markedObj!.parse(content || "") as string)
       : `<div style="white-space: pre-wrap">${String(content || "").replace(/</g, "&lt;").replace(/>/g, "&gt;")}</div>`
   );
 

package/src/components/RolesSettings.svelte

@@ -2,8 +2,10 @@
   import { t } from '@svadmin/core/i18n';
   import { getAuthProvider, getResources } from '@svadmin/core';
   import type { Role } from '@svadmin/core';
-  import PermissionMatrix, { type RoleInfo, type ResourceInfo, type ActionInfo } from './PermissionMatrix.svelte';
+  import PermissionMatrix from './PermissionMatrix.svelte';
+  import type { RoleInfo, ResourceInfo, ActionInfo } from '../types.js';
   import { toast } from '@svadmin/core/toast';
+  import { AlertCircle } from 'lucide-svelte';
 
   const authProvider = getAuthProvider();
   const rawResources = getResources();
@@ -42,7 +44,7 @@
     }
     try {
       const fetchedRoles = await authProvider.getRoles();
-      roles = fetchedRoles.map(r => ({ code: r.id, name: r.name, ...r }));
+      roles = fetchedRoles.map(r => ({ code: r.id, ...r }));
       if (roles.length > 0 && !selectedRoleCode) {
         selectedRoleCode = roles[0].code;
       }

package/src/components/Toast.svelte

@@ -28,17 +28,19 @@
       consumePromiseQueue();
     }
   });
+
+  const toasterProps = $derived({
+    position: "top-right",
+    richColors: true,
+    closeButton: true,
+    expand: true,
+    theme,
+    toastOptions: {
+      classes: {
+        toast: 'font-sans',
+      },
+    }
+  } as any);
 </script>
 
-<Toaster
-  position="top-right"
-  richColors
-  closeButton
-  expand
-  {theme}
-  toastOptions={{
-    classes: {
-      toast: 'font-sans',
-    },
-  }}
-/>
+<Toaster {...toasterProps} />

package/src/components/TooltipButton.svelte

@@ -32,18 +32,8 @@
 <Tooltip.Root>
   <Tooltip.Trigger>
     {#snippet child({ props })}
-      <Button
-        {...props}
-        {...restProps}
-        {variant}
-        {size}
-        {type}
-        class={className}
-        aria-label={restProps['aria-label'] ?? tooltip}
-        {onclick}
-        {disabled}
-        {tabindex}
-      >
+      {@const buttonProps = { ...props, ...restProps, variant, size, type, class: className, 'aria-label': restProps['aria-label'] ?? tooltip, onclick, disabled, tabindex } as any}
+      <Button {...buttonProps}>
         {@render children()}
       </Button>
     {/snippet}