polen 0.10.0-next.14 → 0.10.0-next.3

package/src/lib/tree/tree.test.ts

@@ -0,0 +1,117 @@
+import { describe, expect, test } from 'vitest'
+import * as Tree from './tree.ts'
+
+describe('Tree', () => {
+  const sampleTree = Tree.node('root', [
+    Tree.node('a', [
+      Tree.node('a1'),
+      Tree.node('a2'),
+    ]),
+    Tree.node('b', [
+      Tree.node('b1'),
+    ]),
+    Tree.node('c'),
+  ])
+
+  test('node creates a tree node', () => {
+    const leaf = Tree.node('leaf')
+    expect(leaf).toEqual({ value: 'leaf', children: [] })
+
+    const parent = Tree.node('parent', [leaf])
+    expect(parent).toEqual({ value: 'parent', children: [leaf] })
+  })
+
+  test('map transforms node values', () => {
+    const upperTree = Tree.map(sampleTree, value => value.toUpperCase())
+
+    expect(upperTree.value).toBe('ROOT')
+    expect(upperTree.children[0]!.value).toBe('A')
+    expect(upperTree.children[0]!.children[0]!.value).toBe('A1')
+  })
+
+  test('map provides depth and path', () => {
+    const depths: number[] = []
+    const paths: string[][] = []
+
+    Tree.map(sampleTree, (value, depth, path) => {
+      depths.push(depth)
+      paths.push(path)
+      return value
+    })
+
+    expect(depths).toEqual([0, 1, 2, 2, 1, 2, 1])
+    expect(paths[0]).toEqual([])
+    expect(paths[1]).toEqual(['root'])
+    expect(paths[2]).toEqual(['root', 'a'])
+  })
+
+  test('visit traverses all nodes', () => {
+    const visited: string[] = []
+    Tree.visit(sampleTree, node => visited.push(node.value))
+
+    expect(visited).toEqual(['root', 'a', 'a1', 'a2', 'b', 'b1', 'c'])
+  })
+
+  test('find locates node', () => {
+    const found = Tree.find(sampleTree, value => value === 'b1')
+    expect(found?.value).toBe('b1')
+
+    const notFound = Tree.find(sampleTree, value => value === 'x')
+    expect(notFound).toBeUndefined()
+  })
+
+  test('filter removes non-matching nodes', () => {
+    const filtered = Tree.filter(sampleTree, value => !value.includes('2'))
+
+    expect(filtered).toBeDefined()
+    expect(Tree.flatten(filtered!)).toEqual(['root', 'a', 'a1', 'b', 'b1', 'c'])
+  })
+
+  test('sort orders children', () => {
+    const sorted = Tree.sort(sampleTree, (a, b) => b.localeCompare(a))
+
+    expect(sorted.children.map(c => c.value)).toEqual(['c', 'b', 'a'])
+    expect(sorted.children[2]!.children.map(c => c.value)).toEqual(['a2', 'a1'])
+  })
+
+  test('flatten returns all values', () => {
+    const flat = Tree.flatten(sampleTree)
+    expect(flat).toEqual(['root', 'a', 'a1', 'a2', 'b', 'b1', 'c'])
+  })
+
+  test('depth calculates tree depth', () => {
+    expect(Tree.depth(Tree.node('single'))).toBe(0)
+    expect(Tree.depth(sampleTree)).toBe(2)
+  })
+
+  test('count counts all nodes', () => {
+    expect(Tree.count(Tree.node('single'))).toBe(1)
+    expect(Tree.count(sampleTree)).toBe(7)
+  })
+
+  test('isLeaf identifies leaf nodes', () => {
+    expect(Tree.isLeaf(sampleTree)).toBe(false)
+    expect(Tree.isLeaf(sampleTree.children[0]!)).toBe(false)
+    expect(Tree.isLeaf(sampleTree.children[0]!.children[0]!)).toBe(true)
+  })
+
+  test('leaves gets all leaf nodes', () => {
+    const leafNodes = Tree.leaves(sampleTree)
+    expect(leafNodes.map(n => n.value)).toEqual(['a1', 'a2', 'b1', 'c'])
+  })
+
+  test('fromList builds tree from flat list', () => {
+    const items = [
+      { id: '1', name: 'root' },
+      { id: '2', parentId: '1', name: 'child1' },
+      { id: '3', parentId: '1', name: 'child2' },
+      { id: '4', parentId: '2', name: 'grandchild' },
+    ]
+
+    const trees = Tree.fromList(items, undefined)
+    expect(trees).toHaveLength(1)
+    expect(trees[0]!.value.name).toBe('root')
+    expect(trees[0]!.children).toHaveLength(2)
+    expect(trees[0]!.children[0]!.children[0]!.value.name).toBe('grandchild')
+  })
+})

package/src/lib/tree/tree.ts

@@ -0,0 +1,183 @@
+/**
+ * Generic tree data structure and utilities
+ */
+
+export interface TreeNode<T> {
+  value: T
+  children: TreeNode<T>[]
+}
+
+export type TreeVisitor<T, R = void> = (node: TreeNode<T>, depth: number, path: T[]) => R
+
+export type TreeMapper<T, U> = (value: T, depth: number, path: T[]) => U
+
+export type TreePredicate<T> = (value: T, depth: number, path: T[]) => boolean
+
+/**
+ * Create a new tree node
+ */
+export const node = <T>(value: T, children: TreeNode<T>[] = []): TreeNode<T> => ({
+  value,
+  children,
+})
+
+/**
+ * Map over a tree, transforming each node's value
+ */
+export const map = <T, U>(
+  tree: TreeNode<T>,
+  mapper: TreeMapper<T, U>,
+  depth = 0,
+  path: T[] = [],
+): TreeNode<U> => {
+  const newPath = [...path, tree.value]
+  return {
+    value: mapper(tree.value, depth, path),
+    children: tree.children.map(child => map(child, mapper, depth + 1, newPath)),
+  }
+}
+
+/**
+ * Visit each node in the tree (depth-first)
+ */
+export const visit = <T>(
+  tree: TreeNode<T>,
+  visitor: TreeVisitor<T>,
+  depth = 0,
+  path: T[] = [],
+): void => {
+  visitor(tree, depth, path)
+  const newPath = [...path, tree.value]
+  tree.children.forEach(child => visit(child, visitor, depth + 1, newPath))
+}
+
+/**
+ * Find a node in the tree
+ */
+export const find = <T>(
+  tree: TreeNode<T>,
+  predicate: TreePredicate<T>,
+  depth = 0,
+  path: T[] = [],
+): TreeNode<T> | undefined => {
+  if (predicate(tree.value, depth, path)) {
+    return tree
+  }
+  const newPath = [...path, tree.value]
+  for (const child of tree.children) {
+    const found = find(child, predicate, depth + 1, newPath)
+    if (found) return found
+  }
+  return undefined
+}
+
+/**
+ * Filter tree nodes (keeps structure, removes non-matching nodes)
+ */
+export const filter = <T>(
+  tree: TreeNode<T>,
+  predicate: TreePredicate<T>,
+  depth = 0,
+  path: T[] = [],
+): TreeNode<T> | undefined => {
+  const newPath = [...path, tree.value]
+  const filteredChildren = tree.children
+    .map(child => filter(child, predicate, depth + 1, newPath))
+    .filter((child): child is TreeNode<T> => child !== undefined)
+
+  // Keep node if it matches or has matching children
+  if (predicate(tree.value, depth, path) || filteredChildren.length > 0) {
+    return {
+      value: tree.value,
+      children: filteredChildren,
+    }
+  }
+
+  return undefined
+}
+
+/**
+ * Sort a tree's children at each level
+ */
+export const sort = <T>(
+  tree: TreeNode<T>,
+  compareFn: (a: T, b: T) => number,
+): TreeNode<T> => ({
+  value: tree.value,
+  children: tree.children
+    .map(child => sort(child, compareFn))
+    .sort((a, b) => compareFn(a.value, b.value)),
+})
+
+/**
+ * Flatten a tree into an array (depth-first)
+ */
+export const flatten = <T>(tree: TreeNode<T>): T[] => {
+  const result: T[] = [tree.value]
+  tree.children.forEach(child => {
+    result.push(...flatten(child))
+  })
+  return result
+}
+
+/**
+ * Get the depth of the tree
+ */
+export const depth = <T>(tree: TreeNode<T>): number => {
+  if (tree.children.length === 0) return 0
+  return 1 + Math.max(...tree.children.map(depth))
+}
+
+/**
+ * Count total nodes in the tree
+ */
+export const count = <T>(tree: TreeNode<T>): number => {
+  return 1 + tree.children.reduce((sum, child) => sum + count(child), 0)
+}
+
+/**
+ * Check if a node is a leaf (has no children)
+ */
+export const isLeaf = <T>(node: TreeNode<T>): boolean => {
+  return node.children.length === 0
+}
+
+/**
+ * Get all leaf nodes
+ */
+export const leaves = <T>(tree: TreeNode<T>): TreeNode<T>[] => {
+  if (isLeaf(tree)) return [tree]
+  return tree.children.flatMap(leaves)
+}
+
+/**
+ * Build a tree from a flat list with parent references
+ */
+export const fromList = <T extends { id: string; parentId?: string }>(
+  items: T[],
+  rootId?: string,
+): TreeNode<T>[] => {
+  const itemMap = new Map(items.map(item => [item.id, item]))
+  const roots: TreeNode<T>[] = []
+  const nodeMap = new Map<string, TreeNode<T>>()
+
+  // Create all nodes
+  items.forEach(item => {
+    nodeMap.set(item.id, node(item))
+  })
+
+  // Build hierarchy
+  items.forEach(item => {
+    const itemNode = nodeMap.get(item.id)!
+    if (item.parentId === rootId) {
+      roots.push(itemNode)
+    } else if (item.parentId) {
+      const parent = nodeMap.get(item.parentId)
+      if (parent) {
+        parent.children.push(itemNode)
+      }
+    }
+  })
+
+  return roots
+}

package/src/lib/vite-plugin-reactive-data/vite-plugin-reactive-data.ts

@@ -1,6 +1,8 @@
+import { ensureEnd } from '#lib/kit-temp'
 import { VitePluginJson } from '#lib/vite-plugin-json/index'
-import { debugPolen } from '#singletons/debug'
+import { superjson } from '#singletons/superjson'
 import { type ComputedRef, effect, isRef } from '@vue/reactivity'
+import { Debug } from '@wollybeard/kit'
 import type { Plugin, ViteDevServer } from 'vite'
 
 interface ReactiveDataOptions {
@@ -17,9 +19,11 @@ interface ReactiveDataOptions {
    * - A reactive value directly
    */
   data: ComputedRef<object | unknown[]> | (() => object | unknown[]) | object | unknown[]
+  /** Debounce updates (ms). If not set, uses process.nextTick for batching */
+  debounce?: number
   /**
    * JSON codec to use (e.g., superjson)
-   * Default: JSON
+   * Default: superjson
    * Only used when includeJsonPlugin is true
    */
   codec?: VitePluginJson.Codec
@@ -28,46 +32,47 @@ interface ReactiveDataOptions {
    @default 'reactive-data'
    */
   name?: string
+  /**
+   * Module type to return. Default: 'json'
+   * Use 'superjson' to avoid conflicts with built-in JSON plugin
+   */
+  moduleType?: string
 }
 
-const pluginDebug = debugPolen.sub('vite-reactive-data')
+const debug = Debug.create('vite-plugin-reactive-data')
 
 export const create = (options: ReactiveDataOptions): Plugin => {
-  const codec = options.codec ?? JSON
-  const moduleId = options.moduleId
+  const codec = options.codec ?? superjson
+  const moduleType = options.moduleType ?? 'json'
+  const moduleId = ensureEnd(options.moduleId, `.${moduleType}`)
   const name = options.name ?? `reactive-data`
 
-  const debug = pluginDebug.sub(name)
-  debug('constructor', { moduleId })
+  let server: ViteDevServer
+  let updateTimer: NodeJS.Timeout | undefined
+  let updateScheduled = false
 
-  let $server: ViteDevServer
-  let $invalidationScheduled = false
-
-  const tryInvalidate = () => {
-    $invalidationScheduled = false
-    // updateTimer = undefined
-    if (!$server) throw new Error('Server not available yet - this should be impossible')
-    const moduleNode = $server.moduleGraph.getModuleById(moduleId)
+  const doUpdate = () => {
+    debug('update')
+    updateTimer = undefined
+    updateScheduled = false
+    if (!server) return
+    const moduleNode = server.moduleGraph.getModuleById(moduleId)
     if (moduleNode) {
-      debug('invalidate', { id: moduleNode.id })
-      $server.moduleGraph.invalidateModule(moduleNode)
-    } else {
-      debug('cannot invalidate', {
-        reason: 'notInModuleGraph',
-        moduleId,
-        hint: 'maybe it was not loaded yet',
-      })
+      server.moduleGraph.invalidateModule(moduleNode)
     }
   }
 
-  const scheduleInvalidate = () => {
-    if ($invalidationScheduled) return // already scheduled
-
-    $invalidationScheduled = true
-
-    if (!$server) return // server will flush when ready
-
-    tryInvalidate()
+  const scheduleUpdate = () => {
+    if (options.debounce) {
+      // User wants actual debouncing for rapid updates
+      if (updateTimer) clearTimeout(updateTimer)
+      updateTimer = setTimeout(doUpdate, options.debounce)
+    } else {
+      // Just batch synchronous updates using nextTick
+      if (updateScheduled) return
+      updateScheduled = true
+      process.nextTick(doUpdate)
+    }
   }
 
   // Helper to get the current data value
@@ -85,21 +90,20 @@ export const create = (options: ReactiveDataOptions): Plugin => {
   effect(() => {
     // Access data to track dependencies
     const data = getData()
-    debug('effect triggered', { data })
-
-    scheduleInvalidate()
+    debug('data changed:', data)
+    // Trigger update only if server is available
+    if (server) {
+      scheduleUpdate()
+    }
   })
 
   return {
     name,
 
     configureServer(_server) {
-      debug('hook configureServer')
-      $server = _server
-      if ($invalidationScheduled) {
-        debug('try invalidate scheduled before server was ready')
-        tryInvalidate()
-      }
+      server = _server
+      // Trigger initial update since server is now available
+      scheduleUpdate()
     },
 
     resolveId(id) {
@@ -108,18 +112,20 @@ export const create = (options: ReactiveDataOptions): Plugin => {
       }
     },
 
-    // todo make use of Vite's builtin json plugin
-    // for example, call it here somehow
-    load(id) {
-      if (id !== moduleId) return
-
-      const data = getData()
-      debug('hook load', { data })
-
-      return {
-        code: codec.stringify(data),
-        map: null,
-      }
+    load: {
+      // todo: doesn't work for some reason, prefer over handler
+      // filter: {
+      //   id: {
+      //     include: moduleId,
+      //   },
+      // },
+      handler: (id) => {
+        if (id !== moduleId) return
+
+        const data = getData()
+        // Return just the raw JSON string - let the JSON plugin handle the transformation
+        return codec.stringify(data)
+      },
     },
   }
 }

package/src/package-paths.ts

@@ -49,11 +49,11 @@ export const packagePaths: PackagePaths = {
   template: {
     rootDir: templateDir,
     server: {
-      app: Path.join(templateDir, `server/app${sourceKind}`),
-      entrypoint: Path.join(templateDir, `server/main${sourceKind}`),
+      app: Path.join(templateDir, `server/app.js`),
+      entrypoint: Path.join(templateDir, `server/main.js`),
     },
     client: {
-      entrypoint: Path.join(templateDir, `entry.client${isRunningFromSource ? `.tsx` : `.js`}`),
+      entrypoint: Path.join(templateDir, `entry.client.jsx`),
     },
   },
 }

package/src/singletons/debug.ts

@@ -1,3 +1,3 @@
 import { Debug } from '@wollybeard/kit'
 
-export const debugPolen = Debug.create(`polen`)
+export const debug = Debug.create(`polen`)

package/src/template/components/ArgumentAnnotation.tsx

@@ -1,7 +1,7 @@
 import { Box, Flex, Text } from '@radix-ui/themes'
 import type { GraphQLArgument } from 'graphql'
 import type { FC } from 'react'
-import { TypeAnnotation } from './TypeAnnotation.js'
+import { TypeAnnotation } from './TypeAnnotation.jsx'
 
 export interface Props {
   data: GraphQLArgument

package/src/template/components/ArgumentList.tsx

@@ -1,7 +1,7 @@
 import { Box, Flex, Heading, Text } from '@radix-ui/themes'
 import type { GraphQLArgument } from 'graphql'
 import type { FC } from 'react'
-import { TypeAnnotation } from './TypeAnnotation.tsx'
+import { TypeAnnotation } from './TypeAnnotation.jsx'
 
 export interface Props {
   args: readonly GraphQLArgument[]

package/src/template/components/ArgumentListAnnotation.tsx

@@ -2,8 +2,8 @@ import { GrafaidOld } from '#lib/grafaid-old/index'
 import { Box, Text } from '@radix-ui/themes'
 import type { GraphQLField } from 'graphql'
 import type { FC } from 'react'
-import { ArgumentAnnotation } from './ArgumentAnnotation.tsx'
-import { FieldList } from './FieldList.tsx'
+import { ArgumentAnnotation } from './ArgumentAnnotation.jsx'
+import { FieldList } from './FieldList.jsx'
 
 export interface Props {
   field: GraphQLField<any, any>

package/src/template/components/DeprecationReason.tsx

@@ -1,7 +1,7 @@
 import type { GrafaidOld } from '#lib/grafaid-old/index'
 import { Text } from '@radix-ui/themes'
 import type { FC } from 'react'
-import { Markdown } from './Markdown.tsx'
+import { Markdown } from './Markdown.jsx'
 
 export const DeprecationReason: FC<{ data: GrafaidOld.GraphQLField }> = ({ data }) => {
   if (!data.deprecationReason) return null

package/src/template/components/Description.tsx

@@ -1,6 +1,6 @@
 import { Text } from '@radix-ui/themes'
 import type { FC } from 'react'
-import { Markdown } from './Markdown.tsx'
+import { Markdown } from './Markdown.jsx'
 // import type { Grafaid } from '#lib/grafaid'
 import type { GrafaidOld } from '#lib/grafaid-old/index'
 import type { GraphQLNamedType } from 'graphql'

package/src/template/components/Field.tsx

@@ -2,10 +2,10 @@ import { GrafaidOld } from '#lib/grafaid-old/index'
 import type { BoxProps } from '@radix-ui/themes'
 import { Box, Text } from '@radix-ui/themes'
 import type { FC } from 'react'
-import { ArgumentListAnnotation } from './ArgumentListAnnotation.tsx'
-import { DeprecationReason } from './DeprecationReason.tsx'
-import { Description } from './Description.tsx'
-import { TypeAnnotation } from './TypeAnnotation.tsx'
+import { ArgumentListAnnotation } from './ArgumentListAnnotation.jsx'
+import { DeprecationReason } from './DeprecationReason.jsx'
+import { Description } from './Description.jsx'
+import { TypeAnnotation } from './TypeAnnotation.jsx'
 
 export type Props = BoxProps & {
   data: GrafaidOld.GraphQLField

package/src/template/components/FieldList.tsx

@@ -1,7 +1,7 @@
 import { Grafaid } from '#lib/grafaid/index'
 import { Box } from '@radix-ui/themes'
 import type { FC } from 'react'
-import { Field } from './Field.tsx'
+import { Field } from './Field.jsx'
 
 export interface Props {
   data: Grafaid.Schema.TypesLike.Named

package/src/template/components/FieldListSection.tsx

@@ -2,7 +2,7 @@ import { Grafaid } from '#lib/grafaid/index'
 import { Box, Heading } from '@radix-ui/themes'
 import type { GraphQLNamedType } from 'graphql'
 import type { FC } from 'react'
-import { FieldList } from './FieldList.tsx'
+import { FieldList } from './FieldList.jsx'
 
 export interface Props {
   data: GraphQLNamedType

package/src/template/components/Link.tsx

@@ -2,10 +2,9 @@ import type { FC } from 'react'
 import type { LinkProps as LinkPropsReactRouter } from 'react-router'
 import { Link as LinkReactRouter, useLocation } from 'react-router'
 // todo: #lib/kit-temp does not work as import
-import { ObjPartition } from '../../lib/kit-temp.ts'
-import { useClientOnly } from '../hooks/useClientOnly.ts'
-import type { LinkPropsRadix } from './RadixLink.tsx'
-import { LinkRadix } from './RadixLink.tsx'
+import { ObjPartition } from '../../lib/kit-temp.js'
+import type { LinkPropsRadix } from './RadixLink.jsx'
+import { LinkRadix } from './RadixLink.jsx'
 
 const reactRouterPropKeys = [
   'discover',
@@ -23,25 +22,18 @@ const reactRouterPropKeys = [
 export const Link: FC<LinkPropsReactRouter & Omit<LinkPropsRadix, 'asChild'>> = props => {
   const location = useLocation()
   const toPathExp = typeof props.to === 'string' ? props.to : props.to.pathname || ''
-
-  const active = useClientOnly(
-    () => getPathActiveReport(toPathExp, location.pathname),
-    { is: false, isDirect: false, isDescendant: false },
-  )
+  const active = getPathActiveReport(toPathExp, location.pathname)
 
   const { picked: reactRouterProps, omitted: radixProps } = ObjPartition(props, reactRouterPropKeys)
 
-  // Only add data attributes if they're true
-  const linkRadixProps = {
-    ...radixProps,
-    asChild: true,
-    ...(active.is && { 'data-active': true }),
-    ...(active.isDirect && { 'data-active-direct': true }),
-    ...(active.isDescendant && { 'data-active-descendant': true }),
-  }
-
   return (
-    <LinkRadix {...linkRadixProps}>
+    <LinkRadix
+      asChild
+      {...radixProps}
+      data-active={active.is || undefined}
+      data-active-direct={active.isDirect || undefined}
+      data-active-descendant={active.isdescendant || undefined}
+    >
       <LinkReactRouter {...reactRouterProps} />
     </LinkRadix>
   )
@@ -50,7 +42,7 @@ export const Link: FC<LinkPropsReactRouter & Omit<LinkPropsRadix, 'asChild'>> =
 export interface PathActiveReport {
   is: boolean
   isDirect: boolean
-  isDescendant: boolean
+  isdescendant: boolean
 }
 
 export const getPathActiveReport = (
@@ -62,13 +54,13 @@ export const getPathActiveReport = (
   const normalizedCurrentPath = currentPathExp.startsWith('/') ? currentPathExp.slice(1) : currentPathExp
 
   const isDirect = normalizedCurrentPath === normalizedPath
-  const isDescendant = normalizedCurrentPath.startsWith(normalizedPath + '/')
+  const isdescendant = normalizedCurrentPath.startsWith(normalizedPath + '/')
     && normalizedCurrentPath !== normalizedPath
-  const is = isDirect || isDescendant
+  const is = isDirect || isdescendant
 
   return {
     is,
     isDirect,
-    isDescendant,
+    isdescendant,
   }
 }

package/src/template/components/NamedType.tsx

@@ -1,8 +1,8 @@
 import { Box, Heading, Text } from '@radix-ui/themes'
 import { type GraphQLNamedType } from 'graphql'
 import type { FC } from 'react'
-import { FieldListSection } from './FieldListSection.tsx'
-import { Markdown } from './Markdown.tsx'
+import { FieldListSection } from './FieldListSection.jsx'
+import { Markdown } from './Markdown.jsx'
 
 export interface Props {
   data: GraphQLNamedType

package/src/template/components/TypeAnnotation.tsx

@@ -2,7 +2,7 @@ import { Text } from '@radix-ui/themes'
 import type { GraphQLType } from 'graphql'
 import { isInputObjectType, isListType, isNamedType, isNonNullType, isScalarType } from 'graphql'
 import type { FC } from 'react'
-import { Link } from './Link.tsx'
+import { Link } from './Link.jsx'
 
 export interface Props {
   type: GraphQLType // Can be either GraphQLInputType or GraphQLOutputType

package/src/template/components/TypeFieldsLinkList.tsx

@@ -1,7 +1,7 @@
 import { Box, Flex, Heading } from '@radix-ui/themes'
 import type { GraphQLInterfaceType, GraphQLObjectType } from 'graphql'
 import type { FC } from 'react'
-import { Link } from './Link.tsx'
+import { Link } from './Link.jsx'
 
 export interface Props {
   type: GraphQLObjectType | GraphQLInterfaceType