@nil-/doc 1.0.0 → 2.0.1

package/components/navigation/Nav.svelte

@@ -1,4 +1,4 @@
-<script context="module">import { fuzz } from "./utils/fuzz";
+<script lang="ts" module>import { fuzz } from "./utils/fuzz";
 const apply = (paths, init, pre, next, post) => {
   const retval = {};
   for (const path of paths) {
@@ -38,18 +38,21 @@ const populate = (filter, info, renamer) => {
 };
 </script>
 
-<script>import Tree from "./Tree.svelte";
-export let info;
-export let selected;
-export let sorter;
-export let renamer;
-let filter = "";
-let states = apply(
+<script lang="ts">import Tree from "./Tree.svelte";
+let {
+  info,
+  selected,
+  sorter,
+  renamer,
+  onnavigate
+} = $props();
+let filter = $state("");
+let states = $state(apply(
   info,
   () => ({ expanded: false, sub: {} }),
   (t, path) => ({ expanded: t.expanded || selected === path, sub: t.sub }),
   (t) => t.sub
-);
+));
 const update = (selected2) => {
   if (!info.includes(selected2)) {
     return;
@@ -63,8 +66,7 @@ const update = (selected2) => {
     node = node[p].sub;
   }
 };
-$:
-  update(selected);
+$effect(() => update(selected));
 </script>
 
 <div class="nav">
@@ -77,8 +79,8 @@ $:
             {selected}
             {sorter}
             {renamer}
+            {onnavigate}
             bind:states
-            on:navigate
             expand={filter.length > 0}
         />
     </div>

package/components/navigation/Nav.svelte.d.ts

@@ -1,22 +1,13 @@
-import { SvelteComponentTyped } from "svelte";
 import type { Sorter, Renamer } from "./types";
-declare const __propDef: {
-    props: {
-        info: string[];
-        selected: string;
-        sorter: Sorter;
-        renamer: Renamer;
-    };
-    events: {
-        navigate: CustomEvent<string>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
+type $$ComponentProps = {
+    info: readonly string[];
+    selected: string;
+    sorter: Sorter;
+    renamer: Renamer;
+    onnavigate?: (e: {
+        detail: string;
+    }) => void;
 };
-export type NavProps = typeof __propDef.props;
-export type NavEvents = typeof __propDef.events;
-export type NavSlots = typeof __propDef.slots;
-export default class Nav extends SvelteComponentTyped<NavProps, NavEvents, NavSlots> {
-}
-export {};
+declare const Nav: import("svelte").Component<$$ComponentProps, {}, "">;
+type Nav = ReturnType<typeof Nav>;
+export default Nav;

package/components/navigation/Node.svelte

@@ -1,22 +1,22 @@
-<script>import { slide } from "svelte/transition";
+<script lang="ts">import { slide } from "svelte/transition";
 import { sort } from "./utils/sort";
-import { createEventDispatcher } from "svelte";
-export let key;
-export let value;
-export let depth;
-export let selected;
-export let expand;
-export let states;
-export let sorter;
-export let renamer;
-const dispatch = createEventDispatcher();
-$:
-  style = `padding-left: ${0.5 + depth}rem; padding-right: 0.5rem`;
-$:
-  hasChildren = Object.keys(value.sub).length > 0;
-const click = (link) => {
-  if (link != null && selected !== link) {
-    dispatch("navigate", link);
+import Node from "./Node.svelte";
+let {
+  key,
+  value,
+  depth,
+  selected,
+  expand,
+  states = $bindable(),
+  sorter,
+  renamer,
+  onnavigate
+} = $props();
+let style = $derived(`padding-left: ${0.5 + depth}rem; padding-right: 0.5rem`);
+let hasChildren = $derived(Object.keys(value.sub).length > 0);
+const onclick = () => {
+  if (value.url != null && selected !== value.url) {
+    onnavigate?.({ detail: value.url });
     if (hasChildren && !states.expanded) {
       states.expanded = true;
     }
@@ -29,8 +29,8 @@ const click = (link) => {
 <div class="wrapper">
     <div
         class="header"
-        on:click={() => click(value.url)}
-        on:keypress={null}
+        {onclick}
+        onkeypress={null}
         role="none"
         {style}
         class:selected={selected === value.url}
@@ -44,7 +44,7 @@ const click = (link) => {
     {#if expand || states.expanded}
         <div class="sub" transition:slide>
             {#each sort(value.sub, sorter) as [k, v] (k)}
-                <svelte:self
+                <Node
                     key={k}
                     value={v}
                     depth={depth + 1}
@@ -53,7 +53,7 @@ const click = (link) => {
                     {sorter}
                     {expand}
                     bind:states={states.sub[k]}
-                    on:navigate
+                    {onnavigate}
                 />
             {/each}
         </div>

package/components/navigation/Node.svelte.d.ts

@@ -1,26 +1,18 @@
-import { SvelteComponentTyped } from "svelte";
 import type { Tree, States, Sorter, Renamer } from "./types";
-declare const __propDef: {
-    props: {
-        key: string;
-        value: Tree;
-        depth: number;
-        selected: string;
-        expand: boolean;
-        states: States;
-        sorter: Sorter;
-        renamer: Renamer;
-    };
-    events: {
-        navigate: CustomEvent<string>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
+import Node from "./Node.svelte";
+type $$ComponentProps = {
+    key: string;
+    value: Tree;
+    depth: number;
+    selected: string;
+    expand: boolean;
+    states: States;
+    sorter: Sorter;
+    renamer: Renamer;
+    onnavigate?: (v: {
+        detail?: string;
+    }) => void;
 };
-export type NodeProps = typeof __propDef.props;
-export type NodeEvents = typeof __propDef.events;
-export type NodeSlots = typeof __propDef.slots;
-export default class Node extends SvelteComponentTyped<NodeProps, NodeEvents, NodeSlots> {
-}
-export {};
+declare const Node: import("svelte").Component<$$ComponentProps, {}, "states">;
+type Node = ReturnType<typeof Node>;
+export default Node;

package/components/navigation/Tree.svelte

@@ -1,11 +1,14 @@
-<script>import Node from "./Node.svelte";
+<script lang="ts">import Node from "./Node.svelte";
 import { sort } from "./utils/sort";
-export let tree;
-export let states;
-export let sorter;
-export let renamer;
-export let expand;
-export let selected;
+let {
+  tree,
+  states = $bindable(),
+  sorter,
+  renamer,
+  expand,
+  selected,
+  onnavigate
+} = $props();
 </script>
 
 {#each sort(tree, sorter) as [key, value] (key)}
@@ -18,6 +21,6 @@ export let selected;
         {renamer}
         {expand}
         bind:states={states[key]}
-        on:navigate
+        {onnavigate}
     />
 {/each}

package/components/navigation/Tree.svelte.d.ts

@@ -1,24 +1,15 @@
-import { SvelteComponentTyped } from "svelte";
 import type { Tree, States, Sorter, Renamer } from "./types";
-declare const __propDef: {
-    props: {
-        tree: Record<string, Tree>;
-        states: Record<string, States>;
-        sorter: Sorter;
-        renamer: Renamer;
-        expand: boolean;
-        selected: string;
-    };
-    events: {
-        navigate: CustomEvent<string>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
+type $$ComponentProps = {
+    tree: Record<string, Tree>;
+    states: Record<string, States>;
+    sorter: Sorter;
+    renamer: Renamer;
+    expand: boolean;
+    selected: string;
+    onnavigate?: (e: {
+        detail?: string;
+    }) => void;
 };
-export type TreeProps = typeof __propDef.props;
-export type TreeEvents = typeof __propDef.events;
-export type TreeSlots = typeof __propDef.slots;
-export default class Tree extends SvelteComponentTyped<TreeProps, TreeEvents, TreeSlots> {
-}
-export {};
+declare const Tree: import("svelte").Component<$$ComponentProps, {}, "states">;
+type Tree = ReturnType<typeof Tree>;
+export default Tree;

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@nil-/doc",
-  "version": "1.0.0",
+  "version": "2.0.1",
   "author": {
     "email": "njaldea@gmail.com",
     "name": "Neil Aldea"
   },
   "license": "ISC",
   "peerDependencies": {
-    "svelte": "^4.0.3"
+    "svelte": "^5.7.1"
   },
   "keywords": [
     "svelte",
@@ -24,6 +24,6 @@
     }
   },
   "dependencies": {
-    "vanilla-picker": "^2.12.1"
+    "vanilla-picker": "^2.12.3"
   }
 }

package/components/block/controls/props/Object.svelte.d.ts

@@ -1,22 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { ValueType } from "../../types";
-import type { Unionized, PropType } from "../types";
-declare const __propDef: {
-    props: {
-        value: Record<string, ValueType> | undefined;
-        info: Unionized<PropType<"object">>;
-        depth: number;
-        disabled?: boolean | undefined;
-        visible?: boolean | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ObjectProps = typeof __propDef.props;
-export type ObjectEvents = typeof __propDef.events;
-export type ObjectSlots = typeof __propDef.slots;
-export default class Object extends SvelteComponentTyped<ObjectProps, ObjectEvents, ObjectSlots> {
-}
-export {};