sveltekit-admin 0.6.0 → 0.8.1

package/dist/server/views/Form.svelte

@@ -1,23 +1,26 @@
 <script lang="ts">
   import type { AdminHandlerConfig } from '../handler.js';
-  import type { ViewModel } from './types.js';
+  import type { RecordAction, ViewModel } from './types.js';
   import FieldInput from './FieldInput.svelte';
   import RelationSelect from './RelationSelect.svelte';
   import RelationCheckboxes from './RelationCheckboxes.svelte';
   import RelatedBlock from './RelatedBlock.svelte';
+  import { escapeHtml } from './html.js';
 
   let {
     mode,
     model,
     basePath,
     config,
-    item
+    item,
+    recordActions = []
   }: {
     mode: 'create' | 'edit';
     model: ViewModel;
     basePath: string;
     config: AdminHandlerConfig;
     item?: any;
+    recordActions?: RecordAction[];
   } = $props();
 
   const modelConfig = $derived(config.models?.[model.name] || {});
@@ -77,6 +80,24 @@
       : []
   );
 
+  // Built as a single string (rather than {#if}/{#each}) so an empty/create-mode
+  // render stays a single @html call: Svelte 5's SSR wraps every {#if}/{#each} node
+  // in its own hydration-boundary comment regardless of the branch/array taken, so
+  // nesting recordActions in its own control-flow blocks would add bytes to every
+  // edit-form render even when recordActions is []. `label` and `href` are both
+  // escaped manually since this goes through @html instead of Svelte's
+  // auto-escaped text/attributes.
+  const recordActionsHtml = $derived(
+    mode === 'edit' && recordActions.length > 0
+      ? `<div class="ska-record-actions">${recordActions
+          .map(
+            (action) =>
+              `<a href="${escapeHtml(action.href)}" class="ska-btn ska-btn--secondary ska-btn--sm">${escapeHtml(action.label)}</a>`
+          )
+          .join('')}</div>`
+      : ''
+  );
+
   const inverseEdges = $derived(
     model.relationGraph
       ? [...model.relationGraph.edges.values()].filter(
@@ -92,6 +113,9 @@
   <p class="ska-subtitle">ID: {item[model.primaryKey]}</p>
 {/if}
 
+<!-- eslint-disable-next-line svelte/no-at-html-tags -- recordActionsHtml escapes both action.label and action.href via escapeHtml -->
+{@html recordActionsHtml}
+
 <div class="ska-card">
   <form method="POST" class="ska-form">
     <input type="hidden" name="_action" value={mode === 'create' ? 'create' : 'update'} />

package/dist/server/views/Form.svelte.d.ts

@@ -1,11 +1,12 @@
 import type { AdminHandlerConfig } from '../handler.js';
-import type { ViewModel } from './types.js';
+import type { RecordAction, ViewModel } from './types.js';
 type $$ComponentProps = {
     mode: 'create' | 'edit';
     model: ViewModel;
     basePath: string;
     config: AdminHandlerConfig;
     item?: any;
+    recordActions?: RecordAction[];
 };
 declare const Form: import("svelte").Component<$$ComponentProps, {}, "">;
 type Form = ReturnType<typeof Form>;

package/dist/server/views/Layout.svelte

@@ -6,12 +6,16 @@
     content,
     config,
     modelList,
-    currentModel
+    currentModel,
+    extraStyles = '',
+    extraScripts = ''
   }: {
     content: string;
     config: AdminHandlerConfig;
     modelList: Array<{ name: string; label: string }>;
     currentModel?: string;
+    extraStyles?: string;
+    extraScripts?: string;
   } = $props();
 
   const branding = $derived(config.branding ?? {});
@@ -21,6 +25,25 @@
   // No button at all if `logout` isn't configured — an admin that never
   // opted into this option looks exactly as it did before it existed.
   const showLogout = $derived(Boolean(config.logout));
+
+  // extraStyles is concatenated into the SAME @html expression as the theme <style>
+  // below, rather than a sibling {#if}/{@html} block: Svelte 5's SSR unconditionally
+  // wraps every {#if}/{#each}/{@html} node in its own hydration-boundary comment, even
+  // for a false/empty branch (see svelte/internal/server's `html()` helper) — a sibling
+  // block would add bytes to every render regardless of extraStyles being set.
+  // Concatenating keeps this ONE @html call, byte-identical to the pre-plugin-slots
+  // template when extraStyles is ''. extraScripts (bottom of <body>) has no such
+  // pre-existing @html call to fold into, so it stays its own @html — the smallest
+  // achievable footprint, though it still adds a fixed hydration-boundary comment
+  // pair even when empty (see task-6-report.md fix-round-1 notes).
+  //
+  // Built as a $derived here (rather than a nested template literal inline in the
+  // markup below) so tooling that tag-sniffs {@html} expressions for literal
+  // <style>/<script> text doesn't misparse the nested backticks.
+  const headStyleHtml = $derived(
+    `<style>${styles(primaryColor)}</style>${extraStyles ? `<style>${extraStyles}</style>` : ''}`
+  );
+  const bodyScriptHtml = $derived(extraScripts ? '<script>' + extraScripts + '</scr' + 'ipt>' : '');
 </script>
 
 <!doctype html>
@@ -31,7 +54,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>{title}</title>
   <!-- eslint-disable-next-line svelte/no-at-html-tags -- CSS injected as raw text; a literal <style> block can't take a dynamic value; primaryColor is developer-supplied config, not request/database data, and this raw interpolation is unchanged from the original layout.ts implementation, not a new injection point introduced by this migration -->
-  {@html `<style>${styles(primaryColor)}</style>`}
+  {@html headStyleHtml}
 </head>
 <!-- eslint-disable-next-line svelte/no-raw-special-elements -- server-only full-document template, never mounted client-side -->
 <body>
@@ -74,5 +97,7 @@
       {@html content}
     </main>
   </div>
+  <!-- eslint-disable-next-line svelte/no-at-html-tags -- plugin JS is developer-supplied, same trust as branding.primaryColor -->
+  {@html bodyScriptHtml}
 </body>
 </html>

package/dist/server/views/Layout.svelte.d.ts

@@ -7,6 +7,8 @@ type $$ComponentProps = {
         label: string;
     }>;
     currentModel?: string;
+    extraStyles?: string;
+    extraScripts?: string;
 };
 declare const Layout: import("svelte").Component<$$ComponentProps, {}, "">;
 type Layout = ReturnType<typeof Layout>;

package/dist/server/views/List.svelte

@@ -1,10 +1,9 @@
 <script lang="ts">
   import type { AdminHandlerConfig } from '../handler.js';
-  import type { ViewModel } from './types.js';
+  import type { ViewModel, ListRecordAction, FkFilterMeta } from './types.js';
   import type { ListQuery } from '../query/listQuery.js';
   import type { ResolvedFilterField } from '../query/filterDetection.js';
   import { DATETIME_PRESETS } from '../query/filterDetection.js';
-  import type { FkFilterMeta } from './types.js';
   import { getDisplayFields } from '../introspection/parser.js';
   import { buildListUrl, hiddenParams } from '../query/urls.js';
   import { escapeHtml, toLabel, formatValue } from './html.js';
@@ -19,7 +18,8 @@
     query,
     currentUrl,
     listFilters,
-    fkFilterMeta
+    fkFilterMeta,
+    recordActions = []
   }: {
     model: ViewModel;
     items: any[];
@@ -34,6 +34,7 @@
     listFilters?: ResolvedFilterField[];
     /** Métadonnées async (options scopées + label actif) pour les filtres FK configurés. */
     fkFilterMeta?: Map<string, FkFilterMeta>;
+    recordActions?: ListRecordAction[];
   } = $props();
 
   const modelConfig = $derived(config.models?.[model.name] || {});
@@ -126,6 +127,28 @@
    * pour un champ sensible que pour un champ inconnu (§0.a, §5.4) — ne
    * jamais dire "champ interdit", ça confirmerait son existence.
    */
+  // A per-row function (rather than {#each} in the markup) so an empty recordActions
+  // keeps this to the smallest possible footprint: Svelte 5's SSR wraps every
+  // {#each}/{@html} node in its own hydration-boundary comment regardless of the
+  // array's length/content (verified empirically — even {@html ''} still emits
+  // `<!--hash--><!---->`), so there is no template-level construct that renders zero
+  // bytes for an empty array here. Folding this into the pre-existing delete-form
+  // {@html} call (right below) was considered and rejected: recordActions must render
+  // *before* Edit (see list.test.ts "rend le lien avant Edit"), but the delete form's
+  // pre-existing {@html} — and thus its hydration marker — sits *after* Edit, so
+  // reusing it would either reorder Edit/recordActions or move the marker in front of
+  // Edit for every row, not just when recordActions is non-empty. Neither is
+  // byte-identical to the pre-recordActions baseline (see task-6-report.md fix-round-1
+  // notes). `action.label` and `hrefFor`'s return value are both escaped manually
+  // since this goes through @html instead of Svelte's auto-escaped text/attributes.
+  const recordActionsHtml = (id: string | number) =>
+    recordActions
+      .map(
+        (action) =>
+          `<a href="${escapeHtml(action.hrefFor(id))}" class="ska-btn ska-btn--secondary ska-btn--sm">${escapeHtml(action.label)}</a>`
+      )
+      .join('');
+
   const ignoredMessages = $derived.by(() => {
     return (query?.ignored ?? []).map((entry) => {
       // `param` est soit `f.<field>` / `f.<field>__<op>` (nouveau format),
@@ -217,6 +240,8 @@
               <!-- eslint-disable-next-line svelte/no-at-html-tags -- formatValue already escapes string values itself and returns a literal <span> only for null/undefined -->
               {#each displayFields as f (f.name)}<td>{@html formatValue(item[f.name], f.type)}</td>{/each}
               <td class="ska-table__actions">
+                <!-- eslint-disable-next-line svelte/no-at-html-tags -- recordActionsHtml escapes both action.label and hrefFor's return value via escapeHtml -->
+                {@html recordActionsHtml(item[model.primaryKey])}
                 <a href="{listPath}/{item[model.primaryKey]}" class="ska-btn ska-btn--secondary ska-btn--sm">Edit</a>
                 <!-- eslint-disable-next-line svelte/no-at-html-tags -- Svelte 5 rejects a literal onsubmit string as an event attribute; the PK is escaped manually here since it can't go through Svelte's native attribute escaping; the whole form (not just onsubmit) is rendered as raw HTML because there's no native-Svelte way to attach a plain inline onsubmit="..." string attribute at all in Svelte 5 templates, so the whole element had to be raw text to preserve the exact prior confirm-dialog behavior in a page that's never hydrated by a Svelte runtime -->
                 {@html `<form method="POST" action="${listPath}/${escapeHtml(String(item[model.primaryKey]))}" style="display:inline" onsubmit="return confirm('Delete this item?')"><input type="hidden" name="_action" value="delete"><button type="submit" class="ska-btn ska-btn--danger ska-btn--sm">Delete</button></form>`}

package/dist/server/views/List.svelte.d.ts

@@ -1,8 +1,7 @@
 import type { AdminHandlerConfig } from '../handler.js';
-import type { ViewModel } from './types.js';
+import type { ViewModel, ListRecordAction, FkFilterMeta } from './types.js';
 import type { ListQuery } from '../query/listQuery.js';
 import type { ResolvedFilterField } from '../query/filterDetection.js';
-import type { FkFilterMeta } from './types.js';
 type $$ComponentProps = {
     model: ViewModel;
     items: any[];
@@ -21,6 +20,7 @@ type $$ComponentProps = {
     listFilters?: ResolvedFilterField[];
     /** Métadonnées async (options scopées + label actif) pour les filtres FK configurés. */
     fkFilterMeta?: Map<string, FkFilterMeta>;
+    recordActions?: ListRecordAction[];
 };
 declare const List: import("svelte").Component<$$ComponentProps, {}, "">;
 type List = ReturnType<typeof List>;

package/dist/server/views/types.d.ts

@@ -22,6 +22,14 @@ export interface ViewModel {
     /** Compteurs des relations inverses (1-N, 1-1), indexés par "Model.field" */
     relatedCounts?: Map<string, number>;
 }
+export interface RecordAction {
+    label: string;
+    href: string;
+}
+export interface ListRecordAction {
+    label: string;
+    hrefFor: (id: string | number) => string;
+}
 /**
  * Résolution async d'un filtre FK (kind 'fk' dans ResolvedFilterField) :
  * options scopées pour la sidebar + label du chip actif scopé lui aussi

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sveltekit-admin",
-  "version": "0.6.0",
+  "version": "0.8.1",
   "description": "Django-like admin panel for SvelteKit + Prisma",
   "type": "module",
   "svelte": "./dist/index.js",
@@ -22,23 +22,8 @@
     "!dist/**/*.test.*",
     "!dist/**/*.spec.*"
   ],
-  "scripts": {
-    "dev": "vite dev",
-    "build": "npm run package",
-    "package": "svelte-kit sync && svelte-package -o dist && echo 'Package size:' && bun pm pack --dry-run 2>&1 | grep -E 'Total files|Unpacked size'",
-    "prepublishOnly": "npm run package",
-    "size": "bun run package && node scripts/package-size.mjs",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "test:gen": "prisma generate --schema tests/fixtures/prisma/schema.prisma",
-    "test": "svelte-kit sync && npm run test:gen && vitest run",
-    "test:watch": "svelte-kit sync && npm run test:gen && vitest",
-    "test:coverage": "svelte-kit sync && npm run test:gen && vitest run --coverage",
-    "lint": "svelte-kit sync && eslint .",
-    "format": "prettier --write .",
-    "changeset": "changeset",
-    "version-packages": "changeset version",
-    "release": "npm run package && changeset publish"
+  "publishConfig": {
+    "provenance": true
   },
   "peerDependencies": {
     "@prisma/client": ">=5.0.0",
@@ -55,7 +40,7 @@
     }
   },
   "devDependencies": {
-    "@changesets/cli": "^3.0.0",
+    "@changesets/cli": "^3.0.1",
     "@eslint/js": "9",
     "@prisma/client": "^6.19.3",
     "@sveltejs/adapter-auto": "^7.0.1",
@@ -98,5 +83,22 @@
   "bugs": {
     "url": "https://github.com/dotNacer/sveltekit-admin/issues"
   },
-  "author": "dotNacer"
-}
+  "author": "dotNacer",
+  "scripts": {
+    "dev": "vite dev",
+    "build": "pnpm run package",
+    "package": "svelte-kit sync && svelte-package -o dist",
+    "size": "pnpm run package && node scripts/package-size.mjs",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+    "test:gen": "prisma generate --schema tests/fixtures/prisma/schema.prisma",
+    "test": "svelte-kit sync && pnpm run test:gen && vitest run",
+    "test:watch": "svelte-kit sync && pnpm run test:gen && vitest",
+    "test:coverage": "svelte-kit sync && pnpm run test:gen && vitest run --coverage",
+    "lint": "svelte-kit sync && eslint .",
+    "format": "prettier --write .",
+    "changeset": "changeset",
+    "version-packages": "changeset version",
+    "release": "pnpm run package && changeset publish"
+  }
+}