@svadmin/lite 0.2.5 → 0.3.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svadmin/lite",
-  "version": "0.2.5",
+  "version": "0.3.1",
   "description": "SSR-compatible lightweight admin UI for @svadmin — zero client-side JS, works in IE11",
   "type": "module",
   "files": [
@@ -21,11 +21,11 @@
   },
   "peerDependencies": {
     "svelte": "^5.0.0",
-    "@svadmin/core": "^0.19.4",
+    "@svadmin/core": "^0.21.1",
     "@sveltejs/kit": "^2.0.0"
   },
   "dependencies": {
-    "lucide-svelte": "^1.0.1",
+    "@lucide/svelte": "^1.7.0",
     "sveltekit-superforms": "^2.30.1",
     "zod": "^4.3.6"
   },

package/src/components/LiteShow.svelte

@@ -21,10 +21,10 @@
     canEdit = true,
   }: Props = $props();
 
-  const pk = resource.primaryKey ?? 'id';
-  const id = record[pk];
+  let pk = $derived(resource.primaryKey ?? 'id');
+  let id = $derived(record[pk]);
   const showFields = $derived(
-    resource.fields.filter(f => f.showInShow !== false && f.showInList !== false)
+    resource.fields.filter(f => f.showInShow !== false)
   );
 </script>
 

package/src/components/LiteTable.svelte

@@ -29,7 +29,7 @@
     canDelete = true,
   }: Props = $props();
 
-  const pk = resource.primaryKey ?? 'id';
+  let pk = $derived(resource.primaryKey ?? 'id');
   const listFields = $derived(
     resource.fields.filter(f => f.showInList !== false)
   );

package/src/components/buttons/LiteCloneButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Copy } from 'lucide-svelte';
+  import { Copy } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/buttons/LiteCreateButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Plus } from 'lucide-svelte';
+  import { Plus } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/buttons/LiteDeleteButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Trash2 } from 'lucide-svelte';
+  import { Trash2 } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/buttons/LiteEditButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Pencil } from 'lucide-svelte';
+  import { Pencil } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/buttons/LiteExportButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Download } from 'lucide-svelte';
+  import { Download } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/buttons/LiteImportButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Upload } from 'lucide-svelte';
+  import { Upload } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/buttons/LiteListButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { List } from 'lucide-svelte';
+  import { List } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/buttons/LiteRefreshButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { RefreshCw } from 'lucide-svelte';
+  import { RefreshCw } from '@lucide/svelte';
 
   interface Props {
     hideText?: boolean;

package/src/components/buttons/LiteSaveButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Save } from 'lucide-svelte';
+  import { Save } from '@lucide/svelte';
 
   interface Props {
     hideText?: boolean;

package/src/components/buttons/LiteShowButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { Eye } from 'lucide-svelte';
+  import { Eye } from '@lucide/svelte';
 
   interface Props {
     resource: string;

package/src/components/fields/LiteBooleanField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 </script>
 
 {#if mode === 'show'}

package/src/components/fields/LiteDateField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 
   function formatDate(v: unknown): string {
     if (!v) return '';

package/src/components/fields/LiteEmailField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 </script>
 
 {#if mode === 'show'}

package/src/components/fields/LiteFileField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 
   function getFiles(v: unknown): string[] {
     if (!v) return [];

package/src/components/fields/LiteImageField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
   
   function getUrls(v: unknown): string[] {
     if (!v) return [];

package/src/components/fields/LiteJsonField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
   
   function getJsonString(v: unknown): string {
     if (v == null) return '';

package/src/components/fields/LiteMarkdownField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 </script>
 
 {#if mode === 'show'}

package/src/components/fields/LiteMultiSelectField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 
   function displayOptions(valuesRaw: unknown): string[] {
     if (!valuesRaw || !Array.isArray(valuesRaw)) return [];

package/src/components/fields/LiteNumberField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 </script>
 
 {#if mode === 'show'}

package/src/components/fields/LiteRelationField.svelte

@@ -10,7 +10,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 
   // In Lite version, relations might need to be rendered via server-side joined data 
   // passed through options, or just standard inputs requesting ID.

package/src/components/fields/LiteSelectField.svelte

@@ -10,7 +10,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 
   function displaySelect(v: unknown): string {
     if (v == null) return '—';

package/src/components/fields/LiteTagField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
   const tags = $derived(Array.isArray(value) ? value.map(String) : []);
 </script>
 

package/src/components/fields/LiteTextField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 </script>
 
 {#if mode === 'show'}

package/src/components/fields/LiteUrlField.svelte

@@ -9,7 +9,7 @@
   }
 
   let { field, value, error = [], mode = 'show' }: Props = $props();
-  const hasError = error.length > 0;
+  let hasError = $derived(error.length > 0);
 </script>
 
 {#if mode === 'show'}

package/src/components/layout/LiteErrorComponent.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { t } from '@svadmin/core/i18n';
-  import { AlertTriangle } from 'lucide-svelte';
+  import { AlertTriangle } from '@lucide/svelte';
 
   interface Props {
     title?: string;

package/src/components/pages/LiteEditPage.svelte

@@ -24,8 +24,8 @@
     canShow = true,
   }: Props = $props();
 
-  const pk = resource.primaryKey ?? 'id';
-  const idStr = String(record[pk]);
+  let pk = $derived(resource.primaryKey ?? 'id');
+  let idStr = $derived(String(record[pk]));
 </script>
 
 <div class="lite-page">

package/src/components/pages/LiteShowPage.svelte

@@ -22,8 +22,8 @@
     canDelete = true,
   }: Props = $props();
 
-  const pk = resource.primaryKey ?? 'id';
-  const idStr = String(record[pk]);
+  let pk = $derived(resource.primaryKey ?? 'id');
+  let idStr = $derived(String(record[pk]));
   
   const showFields = $derived(
     resource.fields.filter(f => f.showInShow !== false)
@@ -48,9 +48,9 @@
     <div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px;">
       {#each showFields as field}
         <div>
-          <label style="display: block; font-size: 13px; font-weight: 500; color: #64748b; margin-bottom: 8px;">
+          <div style="display: block; font-size: 13px; font-weight: 500; color: #64748b; margin-bottom: 8px;">
             {field.label}
-          </label>
+          </div>
           <div style="color: #0f172a; font-size: 14px;">
             <LiteShowField {field} value={record[field.key]} />
           </div>