fuma 0.1.4 → 0.1.6

package/dist/server/sse.d.ts

@@ -1,3 +1,5 @@
+/// <reference types="node" />
+import type { EventEmitter } from 'node:events';
 export declare function createSSE(last_id?: number, retry?: number): {
     readable: ReadableStream<any>;
     subscribe(eventEmitter: EventEmitter, event: string): Promise<void>;

package/dist/ui/Slot.svelte

@@ -0,0 +1,21 @@
+<script>export let slot = void 0;
+export let args = void 0;
+function getComponentAndProps(_slot) {
+  if (typeof _slot === "object")
+    return _slot;
+  if (!args) {
+    console.error("args prop is required with slot as function");
+    return null;
+  }
+  return _slot(args);
+}
+</script>
+
+{#if slot}
+	{@const s = getComponentAndProps(slot)}
+	{#if s !== null}
+		<svelte:component this={s.component} {...s.props} />
+	{/if}
+{:else}
+	<slot />
+{/if}

package/dist/ui/index.d.ts

@@ -14,4 +14,5 @@ export { default as Placeholder } from './Placeholder.svelte';
 export { default as PlaceholderImage } from './PlaceholderImage.svelte';
 export { default as Login } from './Login.svelte';
 export { default as ToggleMode } from './ToggleMode.svelte';
-export * from 'mode-watcher';
+export { default as Slot } from './Slot.svelte';
+export { mode, setMode, resetMode, toggleMode, userPrefersMode, systemPrefersMode } from 'mode-watcher';

package/dist/ui/index.js

@@ -14,4 +14,5 @@ export { default as Placeholder } from './Placeholder.svelte';
 export { default as PlaceholderImage } from './PlaceholderImage.svelte';
 export { default as Login } from './Login.svelte';
 export { default as ToggleMode } from './ToggleMode.svelte';
-export * from 'mode-watcher';
+export { default as Slot } from './Slot.svelte';
+export { mode, setMode, resetMode, toggleMode, userPrefersMode, systemPrefersMode } from 'mode-watcher';

package/dist/ui/input/InputRelation.svelte

@@ -2,7 +2,7 @@
 import debounce from "debounce";
 import { toast } from "svelte-sonner";
 import { mdiClose } from "@mdi/js";
-import { FormControl, DropDown, Icon, SelectorList } from "../index.js";
+import { FormControl, DropDown, Icon, SelectorList, Slot } from "../index.js";
 import RelationAfter from "./RelationAfter.svelte";
 export let key = "";
 export let label = "";
@@ -14,6 +14,8 @@ export let error = "";
 export let placeholder = "";
 export let tippyProps = {};
 export let flatMode = false;
+export let slotItem = null;
+export let slotSuggestion = null;
 let klass = "";
 export { klass as class };
 export let classList = "";
@@ -85,7 +87,9 @@ async function handleBlur() {
 				<div class="flex h-12 items-center gap-2 rounded-lg border pl-4 pr-2">
 					<div class="grow">
 						<slot name="item" {item}>
-							{item.id}
+							<Slot slot={slotItem} args={item}>
+								{item.id}
+							</Slot>
 						</slot>
 					</div>
 					<button type="button" on:click={() => clear()} class="btn btn-square btn-sm">
@@ -107,8 +111,10 @@ async function handleBlur() {
 		class="w-full {classList}"
 		on:select={({ detail }) => select(detail)}
 	>
-		<slot name="listItem" item={proposedItems[index]}>
-			{proposedItems[index].id}
+		<slot name="suggestion" item={proposedItems[index]}>
+			<Slot slot={slotSuggestion} args={proposedItems[index]}>
+				{proposedItems[index].id}
+			</Slot>
 		</slot>
 	</SelectorList>
 </DropDown>

package/dist/ui/input/InputRelation.svelte.d.ts

@@ -1,5 +1,6 @@
 import { SvelteComponent } from "svelte";
 import type { TippyProps } from '../../utils/tippy.js';
+import type { ComponentAndProps } from '../../index.js';
 declare class __sveltets_Render<RelationItem extends {
     id: string;
 }> {
@@ -14,6 +15,8 @@ declare class __sveltets_Render<RelationItem extends {
         placeholder?: string | undefined;
         tippyProps?: Partial<TippyProps> | undefined;
         flatMode?: boolean | undefined;
+        slotItem?: ((item: RelationItem) => ComponentAndProps) | null | undefined;
+        slotSuggestion?: ((item: RelationItem) => ComponentAndProps) | null | undefined;
         class?: string | undefined;
         classList?: string | undefined;
         clear?: (() => Promise<void>) | undefined;
@@ -30,7 +33,7 @@ declare class __sveltets_Render<RelationItem extends {
         item: {
             item: RelationItem | null;
         };
-        listItem: {
+        suggestion: {
             item: RelationItem;
         };
     };

package/dist/ui/input/InputRelations.svelte

@@ -3,7 +3,7 @@ import { slide } from "svelte/transition";
 import { toast } from "svelte-sonner";
 import { mdiClose } from "@mdi/js";
 import debounce from "debounce";
-import { FormControl, Icon, DropDown, SelectorList } from "../index.js";
+import { FormControl, Icon, DropDown, SelectorList, Slot } from "../index.js";
 import RelationAfter from "./RelationAfter.svelte";
 export let key = "";
 export let label = "";
@@ -13,6 +13,8 @@ export let createTitle = "";
 export let error = "";
 export let placeholder = "";
 export let flatMode = false;
+export let slotItem = null;
+export let slotSuggestion = null;
 let klass = "";
 export { klass as class };
 export let classList = "";
@@ -81,7 +83,11 @@ async function handleBlur() {
 								transition:slide|local={{ axis: 'x', duration: 200 }}
 								class="badge badge-outline badge-lg items-center whitespace-nowrap pr-0 text-right"
 							>
-								<slot {item} name="badge">{item.id}</slot>
+								<slot {item} name="item">
+									<Slot slot={slotItem} args={item}>
+										{item.id}
+									</Slot>
+								</slot>
 								<div
 									class="btn btn-circle btn-ghost btn-xs ml-1 mr-[2px] h-[18px] min-h-[18px] w-[18px]"
 									role="button"
@@ -131,8 +137,10 @@ async function handleBlur() {
 		class="w-full {classList}"
 		on:select={({ detail }) => select(detail)}
 	>
-		<slot name="listItem" item={proposedItems[index]}>
-			{proposedItems[index].id}
+		<slot name="suggestion" item={proposedItems[index]}>
+			<Slot slot={slotSuggestion} args={proposedItems[index]}>
+				{proposedItems[index].id}
+			</Slot>
 		</slot>
 	</SelectorList>
 </DropDown>

package/dist/ui/input/InputRelations.svelte.d.ts

@@ -1,4 +1,5 @@
 import { SvelteComponent } from "svelte";
+import type { ComponentAndProps } from '../../index.js';
 declare class __sveltets_Render<RelationItem extends {
     id: string;
 }> {
@@ -11,6 +12,8 @@ declare class __sveltets_Render<RelationItem extends {
         error?: string | undefined;
         placeholder?: string | undefined;
         flatMode?: boolean | undefined;
+        slotItem?: ((item: RelationItem) => ComponentAndProps) | null | undefined;
+        slotSuggestion?: ((item: RelationItem) => ComponentAndProps) | null | undefined;
         class?: string | undefined;
         classList?: string | undefined;
         items?: RelationItem[] | null | undefined;
@@ -24,11 +27,11 @@ declare class __sveltets_Render<RelationItem extends {
         [evt: string]: CustomEvent<any>;
     };
     slots(): {
-        badge: {
+        item: {
             item: RelationItem;
         };
         append: {};
-        listItem: {
+        suggestion: {
             item: RelationItem;
         };
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fuma",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "My fullstack material build with sveltekit, daisyui, zod and more",
   "author": {
     "name": "Jonas Voisard",
@@ -35,6 +35,7 @@
     "@sveltejs/vite-plugin-svelte": "^3.0.0",
     "@types/debounce": "^1.2.4",
     "@types/eslint": "^8.56.0",
+    "@types/node": "^20.12.7",
     "@typescript-eslint/eslint-plugin": "^7.0.0",
     "@typescript-eslint/parser": "^7.0.0",
     "autoprefixer": "^10.4.16",