@xen-orchestra/web-core 0.35.0 → 0.36.0

package/lib/packages/table/define-columns.ts

@@ -1,62 +1,116 @@
-import type { TableCellVNode } from '.'
-import { reactive, computed } from 'vue'
-
-export function defineColumns<
-  TSource,
-  TColumns extends Record<
-    string,
-    | {
-        header: (arg: THeaderArg) => TableCellVNode
-        body: (source: TSource, arg: TBodyArg) => TableCellVNode
-      }
-    | undefined
-  >,
-  TColumnName extends Extract<keyof TColumns, string>,
-  THeaderArg = undefined,
-  TBodyArg = undefined,
->(
-  config: TColumns &
-    Record<
-      string,
-      | {
-          header: (arg: THeaderArg) => TableCellVNode
-          body: (source: TSource, arg: TBodyArg) => TableCellVNode
-        }
-      | undefined
-    >
+import type { AreAllPropertiesOptional, Columns } from '@core/packages/table/types.ts'
+import { objectOmit } from '@vueuse/shared'
+import { computed, defineComponent, Fragment, h, ref, type Component, type Ref, type VNode } from 'vue'
+
+export function defineColumns<TSetupArgs extends any[], TColumns extends Columns>(
+  setup: (...args: TSetupArgs) => TColumns
 ) {
-  const columnNames = Object.keys(config).filter(key => config[key] !== undefined) as TColumnName[]
+  function useColumns<
+    THeadRenderers extends {
+      [K in keyof TColumns as [] extends Parameters<TColumns[K]['renderHead']> ? K : never]?: (
+        renderer: TColumns[K]['renderHead']
+      ) => VNode
+    } & {
+      [K in keyof TColumns as [] extends Parameters<TColumns[K]['renderHead']> ? never : K]: (
+        renderer: TColumns[K]['renderHead']
+      ) => VNode
+    },
+    TBodyRenderers extends {
+      [K in keyof TColumns]: (renderer: TColumns[K]['renderBody']) => VNode
+    },
+    THeadItem,
+    TBodyItem,
+    TExcludedId extends keyof TColumns = never,
+  >(
+    config: {
+      exclude?: TExcludedId[]
+      body: (item: TBodyItem) => Omit<TBodyRenderers, TExcludedId>
+    } & (AreAllPropertiesOptional<Omit<THeadRenderers, TExcludedId>> extends true
+      ? { head?: (item: THeadItem) => Omit<THeadRenderers, TExcludedId> }
+      : { head: (item: THeadItem) => Omit<THeadRenderers, TExcludedId> }),
+    ...args: TSetupArgs
+  ) {
+    type $TAvailableColumns = Omit<TColumns, TExcludedId>
+    type $TAvailableColumnId = keyof $TAvailableColumns
 
-  const hiddenColumnNames = reactive(new Set()) as Set<TColumnName>
+    const allColumns = setup(...args)
 
-  const visibleColumnNames = computed(() => columnNames.filter(name => !hiddenColumnNames.has(name)))
+    const availableColumns = objectOmit(allColumns, config.exclude ?? []) as $TAvailableColumns
 
-  const visibleColumns = computed(() => visibleColumnNames.value.map(name => config[name]!))
+    const hiddenColumnIds = ref(new Set()) as Ref<Set<$TAvailableColumnId>>
 
-  const visibleColumnsCount = computed(() => visibleColumnNames.value.length)
+    const visibleColumnIds = computed(
+      () =>
+        Object.keys(availableColumns).filter(
+          id => !hiddenColumnIds.value.has(id as $TAvailableColumnId)
+        ) as $TAvailableColumnId[]
+    )
 
-  type GetHeaderCells = THeaderArg extends undefined
-    ? (arg?: THeaderArg) => TableCellVNode[]
-    : (arg: THeaderArg) => TableCellVNode[]
+    const colspan = computed(() => visibleColumnIds.value.length)
 
-  type GetBodyCells = TBodyArg extends undefined
-    ? (source: TSource, arg?: TBodyArg) => TableCellVNode[]
-    : (source: TSource, arg: TBodyArg) => TableCellVNode[]
+    function toggle(columnId: $TAvailableColumnId, visible: boolean = hiddenColumnIds.value.has(columnId)) {
+      if (visible) {
+        hiddenColumnIds.value.delete(columnId)
+      } else {
+        hiddenColumnIds.value.add(columnId)
+      }
+    }
 
-  return {
-    getHeaderCells: ((arg?: THeaderArg) =>
-      visibleColumns.value.map(column => column.header(arg as THeaderArg))) as GetHeaderCells,
+    const HeadCells = defineComponent({
+      props: {
+        item: {
+          type: Object as () => THeadItem,
+          required: false,
+        },
+      },
+      setup(props) {
+        const headCellRenderers = config.head?.(props.item as THeadItem) ?? ({} as THeadRenderers)
 
-    getBodyCells: ((source: TSource, arg?: TBodyArg) =>
-      visibleColumns.value.map(column => column.body(source, arg as TBodyArg))) as GetBodyCells,
+        return () =>
+          visibleColumnIds.value.map(columnId => {
+            const { renderHead } = availableColumns[columnId]
 
-    toggleColumn: (name: TColumnName, forcedValue = !hiddenColumnNames.has(name)) => {
-      if (forcedValue) {
-        hiddenColumnNames.add(name)
-      } else {
-        hiddenColumnNames.delete(name)
-      }
-    },
-    visibleColumnsCount,
+            const headCellRenderer = headCellRenderers[columnId as keyof typeof headCellRenderers]
+
+            return h(Fragment, { key: columnId }, [headCellRenderer ? headCellRenderer(renderHead) : renderHead()])
+          })
+      },
+    })
+
+    const BodyCells = defineComponent({
+      props: {
+        item: {
+          type: Object as () => TBodyItem,
+          required: true,
+        },
+      },
+      setup(props) {
+        const bodyCellRenderers = config.body(props.item as TBodyItem) ?? ({} as TBodyRenderers)
+
+        return () =>
+          visibleColumnIds.value.map(columnId => {
+            const { renderBody } = availableColumns[columnId]
+
+            const bodyCellRenderer = bodyCellRenderers[columnId as keyof typeof bodyCellRenderers]
+
+            return h(Fragment, { key: columnId }, [bodyCellRenderer ? bodyCellRenderer(renderBody) : renderBody()])
+          })
+      },
+    })
+
+    return {
+      HeadCells: HeadCells as Component<
+        [THeadItem] extends [undefined]
+          ? Record<string, never>
+          : undefined extends THeadItem
+            ? { item?: THeadItem }
+            : { item: THeadItem }
+      >,
+      BodyCells: BodyCells as Component<{ item: TBodyItem }>,
+      toggle,
+      colspan,
+    }
   }
+
+  return useColumns
 }

package/lib/packages/table/index.ts

@@ -1,11 +1,3 @@
-export * from './apply-extensions'
-export * from './define-renderer/define-table-cell-renderer'
-export * from './define-renderer/define-table-row-renderer'
-export * from './define-columns'
-export * from './define-table/define-multi-source-table'
-export * from './define-table/define-table'
-export * from './define-renderer/define-table-renderer'
-export * from './define-renderer/define-table-section-renderer'
-export * from './define-table/define-typed-table'
-export * from './transform-sources'
-export * from './types'
+export { defineColumn } from './define-column.ts'
+export { defineColumns } from './define-columns.ts'
+export type { ColumnRenderer, Columns } from './types.ts'

package/lib/packages/table/types.ts

@@ -0,0 +1,10 @@
+import { type VNode } from 'vue'
+
+export type ColumnRenderer<THeadArgs extends any[], TBodyArgs extends any[]> = {
+  renderHead: (...args: THeadArgs) => VNode
+  renderBody: (...args: TBodyArgs) => VNode
+}
+
+export type Columns = Record<string, ColumnRenderer<any, any>>
+
+export type AreAllPropertiesOptional<T> = Record<string, never> extends T ? true : false

package/lib/{composables/tree.composable.md → packages/tree/README.md}

@@ -50,12 +50,13 @@ This option allows you to customize the label of the selected nodes.
 ## `LeafDefinition`
 
 ```ts
-new LeafDefinition(data)
-new LeafDefinition(data, options)
+new LeafDefinition(treeId, data)
+new LeafDefinition(treeId, data, options)
 ```
 
 |                         |       Required       | Type                                                 | Default                                 |                                                                                        |
 | ----------------------- | :------------------: | ---------------------------------------------------- | --------------------------------------- | -------------------------------------------------------------------------------------- |
+| `treeId`                |          ✓           | `string`                                             |                                         | identifier for tree this node belongs to                                               |
 | `data`                  |          ✓           | `TData`                                              |                                         | data to be stored in the node                                                          |
 | `options.discriminator` |                      | `string`                                             | `undefined`                             | discriminator for the node when you mix different data types (see Discriminator below) |
 | `options.predicate`     |                      | `(node: TreeNode) => boolean \| undefined`           | `undefined`                             | filter function (see Filtering below)                                                  |
@@ -66,7 +67,7 @@ new LeafDefinition(data, options)
 ### Example
 
 ```ts
-const definition = new LeafDefinition({ id: 1, label: 'John Doe', age: 30 })
+const definition = new LeafDefinition('users', { id: 1, label: 'John Doe', age: 30 })
 ```
 
 ## `BranchDefinition`
@@ -74,8 +75,8 @@ const definition = new LeafDefinition({ id: 1, label: 'John Doe', age: 30 })
 A `BranchDefinition` is very similar to a `LeafDefinition`, but it contains a collection of children definitions.
 
 ```ts
-new BranchDefinition(data, children)
-new BranchDefinition(data, options, children)
+new BranchDefinition(treeId, data, children)
+new BranchDefinition(treeId, data, options, children)
 ```
 
 |                            |     | Type                   | Default |                                                                  |
@@ -86,9 +87,9 @@ new BranchDefinition(data, options, children)
 ### Example
 
 ```ts
-const definition = new BranchDefinition({ id: 'smithes', name: 'The Smithes' }, [
-  new LeafDefinition({ id: 'jd-1', name: 'John Smith', age: 30 }),
-  new LeafDefinition({ id: 'jd-2', name: 'Jane Smith', age: 28 }),
+const definition = new BranchDefinition('users', { id: 'smithes', name: 'The Smithes' }, [
+  new LeafDefinition('users', { id: 'jd-1', name: 'John Smith', age: 30 }),
+  new LeafDefinition('users', { id: 'jd-2', name: 'Jane Smith', age: 28 }),
 ])
 ```
 
@@ -101,8 +102,8 @@ mix different types of nodes at the same collection depth.
 
 ```ts
 const definitions = [
-  new LeafDefinition({ id: 'jd-1', label: 'John Doe', age: 30 }),
-  new LeafDefinition({ id: 'rx-1', label: 'Rex', breed: 'Golden Retriever' }),
+  new LeafDefinition('family', { id: 'jd-1', label: 'John Doe', age: 30 }),
+  new LeafDefinition('family', { id: 'rx-1', label: 'Rex', breed: 'Golden Retriever' }),
 ]
 
 const { nodes } = useTree(definitions)
@@ -116,8 +117,8 @@ nodes.value.forEach(node => {
 
 ```ts
 const definitions = [
-  new LeafDefinition({ id: 'jd-1', label: 'John Doe', age: 30 }, { discriminator: 'person' }),
-  new LeafDefinition({ id: 'rx-1', label: 'Rex', breed: 'Golden Retriever' }, { discriminator: 'animal' }),
+  new LeafDefinition('family', { id: 'jd-1', label: 'John Doe', age: 30 }, { discriminator: 'person' }),
+  new LeafDefinition('family', { id: 'rx-1', label: 'Rex', breed: 'Golden Retriever' }, { discriminator: 'animal' }),
 ]
 
 const { nodes } = useTree(definitions)
@@ -138,8 +139,8 @@ the `isBranch` property will serve the same purpose.
 
 ```ts
 const definitions = [
-  new LeafDefinition({ id: 'jd-1', label: 'John Doe', age: 30 }),
-  new BranchDefinition({ id: 'dogs', label: 'Dogs', legs: 4 }, [
+  new LeafDefinition('family', { id: 'jd-1', label: 'John Doe', age: 30 }),
+  new BranchDefinition('family', { id: 'dogs', label: 'Dogs', legs: 4 }, [
     /* ... */
   ]),
 ]
@@ -254,7 +255,9 @@ const families = [
 You can use the `defineTree` helper this way:
 
 ```ts
-const definitions = defineTree(families, family => defineTree(family.members, member => defineTree(member.animals)))
+const definitions = defineTree('family', families, family =>
+  defineTree('member', family.members, member => defineTree('animal', member.animals))
+)
 ```
 
 This is the equivalent of the following code:
@@ -263,12 +266,14 @@ This is the equivalent of the following code:
 const definitions = families.map(
   family =>
     new BranchDefinition(
+      'family',
       family,
       family.members.map(
         member =>
           new BranchDefinition(
+            'member',
             member,
-            member.animals.map(animal => new LeafDefinition(animal))
+            member.animals.map('animal', animal => new LeafDefinition(animal))
           )
       )
     )
@@ -287,12 +292,12 @@ const entries = [
   { uuid: 'jd-2', name: 'Jane Doe' },
 ]
 
-const definitionsA = defineTree(entries, {
+const definitionsA = defineTree('user', entries, {
   getId: 'uuid',
   getLabel: 'name',
 })
 
-const definitionsB = defineTree(entries, {
+const definitionsB = defineTree('user', entries, {
   getId: entry => entry.uuid,
   getLabel: entry => entry.name,
 })
@@ -394,8 +399,8 @@ Here are the rules to determine whether a node is visible or not.
 </template>
 
 <script lang="ts" setup>
-  const familyDefinitions = defineTree(families, ({ members }) =>
-    defineTree(members, ({ animals }) => defineTree(animals))
+  const familyDefinitions = defineTree('family', families, ({ members }) =>
+    defineTree('member', members, ({ animals }) => defineTree('animal', animals))
   )
 
   const { nodes } = useTree(familyDefinitions)
@@ -448,7 +453,7 @@ Here are the rules to determine whether a node is visible or not.
 </template>
 
 <script lang="ts" setup>
-  const definitions = defineTree(families, ({ members }) => defineTree(members))
+  const definitions = defineTree('family', families, ({ members }) => defineTree('member', members))
 
   const { nodes } = useTree(definitions, { allowMultiSelect: true })
 </script>
@@ -517,8 +522,8 @@ Here are the rules to determine whether a node is visible or not.
     return !filterValue ? undefined : label.toLocaleLowerCase().includes(filterValue)
   }
 
-  const definitions = defineTree(families, { predicate }, ({ members }) =>
-    defineTree(members, { predicate }, ({ animals }) => defineTree(animals, { predicate }))
+  const definitions = defineTree('family', families, { predicate }, ({ members }) =>
+    defineTree('member', members, { predicate }, ({ animals }) => defineTree('animal', animals, { predicate }))
   )
 
   const { nodes } = useTree(definitions, { expand: false })

package/lib/{composables → packages}/tree/branch-definition.ts

@@ -1,5 +1,5 @@
-import { TreeNodeDefinitionBase } from '@core/composables/tree/tree-node-definition-base'
-import type { TreeNodeDefinition, TreeNodeOptions } from '@core/composables/tree/types'
+import { TreeNodeDefinitionBase } from '@core/packages/tree/tree-node-definition-base'
+import type { TreeNodeDefinition, TreeNodeOptions } from '@core/packages/tree/types'
 
 export class BranchDefinition<
   TData extends object = any,
@@ -9,8 +9,13 @@ export class BranchDefinition<
   readonly isBranch = true
   children: TChildDefinition[]
 
-  constructor(data: TData, options: TreeNodeOptions<TData, TDiscriminator>, children: TChildDefinition[]) {
-    super(data, options)
+  constructor(
+    treeId: string,
+    data: TData,
+    options: TreeNodeOptions<TData, TDiscriminator>,
+    children: TChildDefinition[]
+  ) {
+    super(treeId, data, options)
 
     this.children = children
   }

package/lib/{composables → packages}/tree/branch.ts

@@ -1,11 +1,5 @@
-import { TreeNodeBase } from '@core/composables/tree/tree-node-base'
-import type {
-  BranchStatuses,
-  ChildTreeGetter,
-  TreeContext,
-  TreeNode,
-  TreeNodeOptions,
-} from '@core/composables/tree/types'
+import { TreeNodeBase } from '@core/packages/tree/tree-node-base'
+import type { BranchStatuses, ChildTreeGetter, TreeContext, TreeNode, TreeNodeOptions } from '@core/packages/tree/types'
 
 export class Branch<
   TData extends object = any,
@@ -16,6 +10,7 @@ export class Branch<
   readonly rawChildren: TChildNode[]
 
   constructor(
+    treeId: string,
     data: TData,
     parent: Branch | undefined,
     context: TreeContext,
@@ -23,7 +18,7 @@ export class Branch<
     options: TreeNodeOptions<TData, TDiscriminator> | undefined,
     getChildTree: ChildTreeGetter<TData, TChildNode, TDiscriminator>
   ) {
-    super(data, parent, context, depth, options)
+    super(treeId, data, parent, context, depth, options)
     this.rawChildren = getChildTree(this)
   }
 
@@ -48,7 +43,7 @@ export class Branch<
   }
 
   get isExcluded() {
-    if (this.parent?.isExpanded === false) {
+    if (this.parent?.isCollapsed === true) {
       return true
     }
 
@@ -59,8 +54,8 @@ export class Branch<
     return this.failsFilterDownwards
   }
 
-  get isExpanded() {
-    return this.context.expandedIds.has(this.id) || this.passesFilterDownwards || this.passesFilterUpwards
+  get isCollapsed() {
+    return this.context.collapsedIds.has(this.id)
   }
 
   get areChildrenFullySelected(): boolean {
@@ -92,7 +87,7 @@ export class Branch<
       matches: this.passesFilter === true,
       'selected-partial': this.context.allowMultiSelect && this.areChildrenPartiallySelected,
       'selected-full': this.context.allowMultiSelect && this.areChildrenFullySelected,
-      expanded: this.isExpanded,
+      collapsed: this.isCollapsed,
     }
   }
 
@@ -101,21 +96,21 @@ export class Branch<
     return this.areChildrenFullySelected ? 'all' : this.areChildrenPartiallySelected ? 'some' : 'none'
   }
 
-  toggleExpand(forcedValue?: boolean, recursive?: boolean) {
-    const nextExpanded = forcedValue ?? !this.isExpanded
+  toggleCollapse(forcedValue?: boolean, recursive?: boolean) {
+    const nextCollapsed = forcedValue ?? !this.isCollapsed
 
-    if (nextExpanded) {
-      this.context.expandedIds.add(this.id)
+    if (nextCollapsed) {
+      this.context.collapsedIds.add(this.id)
     } else {
-      this.context.expandedIds.delete(this.id)
+      this.context.collapsedIds.delete(this.id)
     }
 
-    const shouldPropagate = recursive ?? !nextExpanded
+    const shouldPropagate = recursive ?? nextCollapsed
 
     if (shouldPropagate) {
       this.rawChildren.forEach(child => {
         if (child.isBranch) {
-          child.toggleExpand(nextExpanded, recursive)
+          child.toggleCollapse(nextCollapsed, recursive)
         }
       })
     }

package/lib/{composables → packages}/tree/build-nodes.ts

@@ -1,6 +1,6 @@
-import { Branch } from '@core/composables/tree/branch'
-import { Leaf } from '@core/composables/tree/leaf'
-import type { DefinitionToTreeNode, TreeContext, TreeNode, TreeNodeDefinition } from '@core/composables/tree/types'
+import { Branch } from '@core/packages/tree/branch'
+import { Leaf } from '@core/packages/tree/leaf'
+import type { DefinitionToTreeNode, TreeContext, TreeNode, TreeNodeDefinition } from '@core/packages/tree/types'
 
 export function buildNodes<TDefinition extends TreeNodeDefinition, TTreeNode extends DefinitionToTreeNode<TDefinition>>(
   definitions: TDefinition[],
@@ -9,10 +9,10 @@ export function buildNodes<TDefinition extends TreeNodeDefinition, TTreeNode ext
   function create(definitions: TreeNodeDefinition[], parent: Branch | undefined, depth: number): TreeNode[] {
     return definitions.map(definition =>
       definition.isBranch
-        ? new Branch(definition.data, parent, context, depth, definition.options, thisBranch =>
+        ? new Branch(definition.treeId, definition.data, parent, context, depth, definition.options, thisBranch =>
             create(definition.children, thisBranch, depth + 1)
           )
-        : new Leaf(definition.data, parent, context, depth, definition.options)
+        : new Leaf(definition.treeId, definition.data, parent, context, depth, definition.options)
     )
   }
 

package/lib/{composables → packages}/tree/define-branch.ts

@@ -1,17 +1,21 @@
-import { BranchDefinition } from '@core/composables/tree/branch-definition'
-import type { Identifiable, Labeled, TreeNodeDefinition, TreeNodeOptions } from '@core/composables/tree/types'
+import { BranchDefinition } from '@core/packages/tree/branch-definition'
+import type { Identifiable, Labeled, TreeNodeDefinition, TreeNodeOptions } from '@core/packages/tree/types'
 
 export function defineBranch<
   TData extends Identifiable & Labeled,
   TChildDefinition extends TreeNodeDefinition,
   const TDiscriminator,
->(data: TData, children: TChildDefinition[]): BranchDefinition<TData, TChildDefinition, TDiscriminator>
+>(treeId: string, data: TData, children: TChildDefinition[]): BranchDefinition<TData, TChildDefinition, TDiscriminator>
+
 export function defineBranch<TData extends object, TChildDefinition extends TreeNodeDefinition, const TDiscriminator>(
+  treeId: string,
   data: TData,
   options: TreeNodeOptions<TData, TDiscriminator>,
   children: TChildDefinition[]
 ): BranchDefinition<TData, TChildDefinition, TDiscriminator>
+
 export function defineBranch<TData extends object, TChildDefinition extends TreeNodeDefinition, const TDiscriminator>(
+  treeId: string,
   data: TData,
   optionsOrChildren: TreeNodeOptions<TData, TDiscriminator> | TChildDefinition[],
   childrenOrNone?: TChildDefinition[]
@@ -19,5 +23,5 @@ export function defineBranch<TData extends object, TChildDefinition extends Tree
   const options = Array.isArray(optionsOrChildren) ? ({} as TreeNodeOptions<TData, TDiscriminator>) : optionsOrChildren
   const children = Array.isArray(optionsOrChildren) ? optionsOrChildren : childrenOrNone!
 
-  return new BranchDefinition(data, options, children)
+  return new BranchDefinition(treeId, data, options, children)
 }

package/lib/{composables → packages}/tree/define-leaf.ts

@@ -1,16 +1,21 @@
-import { LeafDefinition } from '@core/composables/tree/leaf-definition'
-import type { Identifiable, Labeled, TreeNodeOptions } from '@core/composables/tree/types'
+import { LeafDefinition } from '@core/packages/tree/leaf-definition'
+import type { Identifiable, Labeled, TreeNodeOptions } from '@core/packages/tree/types'
 
 export function defineLeaf<TData extends Identifiable & Labeled, const TDiscriminator>(
+  treeId: string,
   data: TData
 ): LeafDefinition<TData, TDiscriminator>
+
 export function defineLeaf<TData extends object, const TDiscriminator>(
+  treeId: string,
   data: TData,
   options: TreeNodeOptions<TData, TDiscriminator>
 ): LeafDefinition<TData, TDiscriminator>
+
 export function defineLeaf<TData extends object, const TDiscriminator>(
+  treeId: string,
   data: TData,
   options?: TreeNodeOptions<TData, TDiscriminator>
 ): LeafDefinition<TData, TDiscriminator> {
-  return new LeafDefinition(data, options ?? ({} as TreeNodeOptions<TData, TDiscriminator>))
+  return new LeafDefinition(treeId, data, options ?? ({} as TreeNodeOptions<TData, TDiscriminator>))
 }

package/lib/{composables → packages}/tree/define-tree.ts

@@ -1,20 +1,22 @@
-import { BranchDefinition } from '@core/composables/tree/branch-definition'
-import { LeafDefinition } from '@core/composables/tree/leaf-definition'
+import { BranchDefinition } from '@core/packages/tree/branch-definition'
+import { LeafDefinition } from '@core/packages/tree/leaf-definition'
 import type {
   ChildTreeDefinitionGetter,
   Identifiable,
   Labeled,
   TreeNodeDefinition,
   TreeNodeOptions,
-} from '@core/composables/tree/types'
+} from '@core/packages/tree/types'
 
 // Overload 1: Leaf with no options
 export function defineTree<TData extends Identifiable & Labeled, const TDiscriminator = any>(
+  treeId: string,
   entries: TData[]
 ): LeafDefinition<TData, TDiscriminator>[]
 
 // Overload 2: Leaf with options
 export function defineTree<TData extends object, const TDiscriminator = any>(
+  treeId: string,
   entries: TData[],
   options: TreeNodeOptions<TData, TDiscriminator>
 ): LeafDefinition<TData, TDiscriminator>[]
@@ -25,6 +27,7 @@ export function defineTree<
   TChildDefinition extends TreeNodeDefinition,
   const TDiscriminator = any,
 >(
+  treeId: string,
   entries: TData[],
   getChildTree: ChildTreeDefinitionGetter<TData, TChildDefinition>
 ): BranchDefinition<TData, TChildDefinition, TDiscriminator>[]
@@ -35,6 +38,7 @@ export function defineTree<
   TChildDefinition extends TreeNodeDefinition = TreeNodeDefinition,
   const TDiscriminator = any,
 >(
+  treeId: string,
   entries: TData[],
   options: TreeNodeOptions<TData, TDiscriminator>,
   getChildTree: ChildTreeDefinitionGetter<TData, TChildDefinition>
@@ -46,6 +50,7 @@ export function defineTree<
   TChildDefinition extends TreeNodeDefinition = TreeNodeDefinition,
   const TDiscriminator = any,
 >(
+  treeId: string,
   entries: TData[],
   optionsOrGetChildTree?: TreeNodeOptions<TData, TDiscriminator> | ChildTreeDefinitionGetter<TData, TChildDefinition>,
   getChildTreeOrNone?: ChildTreeDefinitionGetter<TData, TChildDefinition>
@@ -58,8 +63,8 @@ export function defineTree<
   const getChildTree = typeof optionsOrGetChildTree === 'function' ? optionsOrGetChildTree : getChildTreeOrNone
 
   if (getChildTree !== undefined) {
-    return entries.map(data => new BranchDefinition(data, options, getChildTree(data)))
+    return entries.map(data => new BranchDefinition(treeId, data, options, getChildTree(data)))
   }
 
-  return entries.map(data => new LeafDefinition(data, options))
+  return entries.map(data => new LeafDefinition(treeId, data, options))
 }

package/lib/{composables → packages}/tree/leaf-definition.ts

@@ -1,4 +1,4 @@
-import { TreeNodeDefinitionBase } from '@core/composables/tree/tree-node-definition-base'
+import { TreeNodeDefinitionBase } from '@core/packages/tree/tree-node-definition-base'
 
 export class LeafDefinition<TData extends object = any, const TDiscriminator = any> extends TreeNodeDefinitionBase<
   TData,

package/lib/{composables → packages}/tree/leaf.ts

@@ -1,5 +1,5 @@
-import { TreeNodeBase } from '@core/composables/tree/tree-node-base'
-import type { LeafStatuses } from '@core/composables/tree/types'
+import { TreeNodeBase } from '@core/packages/tree/tree-node-base'
+import type { LeafStatuses } from '@core/packages/tree/types'
 
 export class Leaf<TData extends object = any, const TDiscriminator = any> extends TreeNodeBase<TData, TDiscriminator> {
   readonly isBranch = false
@@ -13,7 +13,7 @@ export class Leaf<TData extends object = any, const TDiscriminator = any> extend
   }
 
   get isExcluded() {
-    if (this.parent?.isExpanded === false) {
+    if (this.parent?.isCollapsed === true) {
       return true
     }