runeforge 0.0.41 → 0.0.43

package/dist/components/Modal.svelte

@@ -5,6 +5,8 @@
   let {
     title = '',
     onClose,
+    closeOnClickOutside = true,
+    onClickOutside,
     children,
     class: additionalClass,
     width,
@@ -14,6 +16,10 @@
   }: {
     title?: string;
     onClose?: () => void;
+    /** Whether clicking the backdrop (outside the modal box) closes the modal. */
+    closeOnClickOutside?: boolean;
+    /** Callback invoked when clicking outside the modal. Defaults to `onClose`. */
+    onClickOutside?: () => void;
     children: Snippet;
     /** Extra classes merged onto the modal box, e.g. Tailwind size utilities
      * like `max-w-4xl` or `w-11/12`. */
@@ -26,6 +32,8 @@
     maxHeight?: string;
   } = $props();
 
+  const handleClickOutside = $derived(onClickOutside ?? onClose);
+
   const boxStyle = $derived(
     [
       width ? `width:${width}` : '',
@@ -59,9 +67,9 @@
     {@render children()}
   </div>
 
-  {#if onClose}
+  {#if closeOnClickOutside && handleClickOutside}
     <div class="modal-backdrop">
-      <button onclick={onClose} aria-label="Cerrar"></button>
+      <button onclick={handleClickOutside} aria-label="Cerrar"></button>
     </div>
   {/if}
 </dialog>

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

@@ -2,6 +2,10 @@ import type { Snippet } from 'svelte';
 type $$ComponentProps = {
     title?: string;
     onClose?: () => void;
+    /** Whether clicking the backdrop (outside the modal box) closes the modal. */
+    closeOnClickOutside?: boolean;
+    /** Callback invoked when clicking outside the modal. Defaults to `onClose`. */
+    onClickOutside?: () => void;
     children: Snippet;
     /** Extra classes merged onto the modal box, e.g. Tailwind size utilities
      * like `max-w-4xl` or `w-11/12`. */

package/dist/components/crud/views/List.svelte

@@ -102,6 +102,7 @@
 	const allowRead = $derived(read.enabled ?? true);
 	const allowUpdate = $derived(update.enabled ?? true);
 	const allowDelete = $derived(deletion.enabled ?? true);
+	const allowCreate = $derived(creation.enabled ?? true);
 	const deleteLabel = $derived(deletion.label ?? strings.delete);
 	const updateLabel = $derived(update.label ?? strings.edit);
 	const readLabel = $derived(read.label ?? strings.view);
@@ -353,15 +354,17 @@
 		</Button>
 	{/if}
 
-	{@const CreateIcon = icons.create}
-	<Button variant="primary" onclick={measuring ? undefined : handleCreate}>
-		<CreateIcon class="size-5" />
-		{#if creation.label}
-			<span>{creation.label}</span>
-		{:else}
-			<span>{strings.create}<span class="hidden sm:inline">&nbsp;{labelOne}</span></span>
-		{/if}
-	</Button>
+	{#if allowCreate}
+		{@const CreateIcon = icons.create}
+		<Button variant="primary" onclick={measuring ? undefined : handleCreate}>
+			<CreateIcon class="size-5" />
+			{#if creation.label}
+				<span>{creation.label}</span>
+			{:else}
+				<span>{strings.create}<span class="hidden sm:inline">&nbsp;{labelOne}</span></span>
+			{/if}
+		</Button>
+	{/if}
 {/snippet}
 
 {#snippet actionsCell(item: T)}
@@ -415,7 +418,6 @@
 						<SearchInput config={search} />
 					{/if}
 
-					{@const CreateIcon = icons.create}
 					<Button
 						variant="ghost"
 						class="btn-square"
@@ -433,17 +435,20 @@
 						class="dropdown dropdown-end w-56 rounded-box border border-base-content/10 bg-base-100 p-1 shadow-lg"
 						bind:this={actionsPopoverEl}
 					>
-						<Button
-							variant="ghost"
-							class="btn-sm w-full justify-start"
-							onclick={() => {
-								actionsPopoverEl?.hidePopover();
-								handleCreate();
-							}}
-						>
-							<CreateIcon class="size-4" />
-							{creation.label || `${strings.create} ${labelOne}`}
-						</Button>
+						{#if allowCreate}
+							{@const CreateIcon = icons.create}
+							<Button
+								variant="ghost"
+								class="btn-sm w-full justify-start"
+								onclick={() => {
+									actionsPopoverEl?.hidePopover();
+									handleCreate();
+								}}
+							>
+								<CreateIcon class="size-4" />
+								{creation.label || `${strings.create} ${labelOne}`}
+							</Button>
+						{/if}
 
 						{#if allowDelete}
 							<Button

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "runeforge",
-  "version": "0.0.41",
+  "version": "0.0.43",
   "description": "SvelteKit toolkit for building metadata-driven CRUD interfaces with tables, forms, and actions",
   "license": "MIT",
   "author": "Ezequiel Puerta",