@xen-orchestra/web-core 0.31.1 → 0.33.0

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

@@ -0,0 +1,62 @@
+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
+    >
+) {
+  const columnNames = Object.keys(config).filter(key => config[key] !== undefined) as TColumnName[]
+
+  const hiddenColumnNames = reactive(new Set()) as Set<TColumnName>
+
+  const visibleColumnNames = computed(() => columnNames.filter(name => !hiddenColumnNames.has(name)))
+
+  const visibleColumns = computed(() => visibleColumnNames.value.map(name => config[name]!))
+
+  const visibleColumnsCount = computed(() => visibleColumnNames.value.length)
+
+  type GetHeaderCells = THeaderArg extends undefined
+    ? (arg?: THeaderArg) => TableCellVNode[]
+    : (arg: THeaderArg) => TableCellVNode[]
+
+  type GetBodyCells = TBodyArg extends undefined
+    ? (source: TSource, arg?: TBodyArg) => TableCellVNode[]
+    : (source: TSource, arg: TBodyArg) => TableCellVNode[]
+
+  return {
+    getHeaderCells: ((arg?: THeaderArg) =>
+      visibleColumns.value.map(column => column.header(arg as THeaderArg))) as GetHeaderCells,
+
+    getBodyCells: ((source: TSource, arg?: TBodyArg) =>
+      visibleColumns.value.map(column => column.body(source, arg as TBodyArg))) as GetBodyCells,
+
+    toggleColumn: (name: TColumnName, forcedValue = !hiddenColumnNames.has(name)) => {
+      if (forcedValue) {
+        hiddenColumnNames.add(name)
+      } else {
+        hiddenColumnNames.delete(name)
+      }
+    },
+    visibleColumnsCount,
+  }
+}

package/lib/packages/table/define-renderer/define-table-cell-renderer.ts

@@ -0,0 +1,27 @@
+import { type VNode, defineAsyncComponent, h } from 'vue'
+import {
+  type TableCellRenderer,
+  type TableCellVNode,
+  type Extensions,
+  applyExtensions,
+  type ComponentLoader,
+  type PropsOverride,
+} from '..'
+
+export function defineTableCellRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+>(config: {
+  component: ComponentLoader<TComponentProps>
+  props?: (config: TPropsConfig) => PropsOverride<TComponentProps>
+  extensions?: TExtensions
+}): TableCellRenderer<TComponentProps, TExtensions, TPropsConfig> {
+  const component = defineAsyncComponent(config.component)
+
+  return function RenderCell(renderConfig) {
+    const extension = applyExtensions(config, renderConfig)
+
+    return h(component, extension.props) satisfies VNode as TableCellVNode
+  }
+}

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

@@ -0,0 +1,47 @@
+import { type VNode, defineAsyncComponent, h } from 'vue'
+import {
+  applyExtensions,
+  type ComponentLoader,
+  type PropsOverride,
+  type Extensions,
+  type TableRenderer,
+  type TableVNode,
+} from '..'
+
+export function defineTableRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+>(config: {
+  component: ComponentLoader<TComponentProps>
+  props?: (config: TPropsConfig) => PropsOverride<TComponentProps>
+  extensions?: TExtensions
+}): TableRenderer<TComponentProps, TExtensions, TPropsConfig> {
+  const component = defineAsyncComponent(config.component)
+
+  return function RenderTable(renderConfig) {
+    const { thead, tbody } = renderConfig
+
+    const renderThead =
+      typeof thead === 'function'
+        ? thead
+        : 'cells' in thead && thead.cells
+          ? () => h('thead', {}, h('tr', {}, { default: () => thead.cells() }))
+          : 'rows' in thead && thead.rows
+            ? () => h('thead', {}, { default: () => thead.rows() })
+            : () => undefined
+
+    const renderTbody =
+      typeof tbody === 'function'
+        ? tbody
+        : 'rows' in tbody && tbody.rows
+          ? () => h('tbody', {}, { default: () => tbody.rows() })
+          : () => undefined
+
+    const extension = applyExtensions(config, renderConfig)
+
+    return h(component, extension.props, () => {
+      return [renderThead(), renderTbody()]
+    }) satisfies VNode as TableVNode
+  }
+}

package/lib/packages/table/define-renderer/define-table-row-renderer.ts

@@ -0,0 +1,29 @@
+import { type VNode, defineAsyncComponent, h } from 'vue'
+import {
+  applyExtensions,
+  type TableRowRenderer,
+  type TableRowVNode,
+  type Extensions,
+  type ComponentLoader,
+  type PropsOverride,
+} from '..'
+
+export function defineRowRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+>(config: {
+  component: ComponentLoader<TComponentProps>
+  props?: (config: TPropsConfig) => PropsOverride<TComponentProps>
+  extensions?: TExtensions
+}): TableRowRenderer<TComponentProps, TExtensions, TPropsConfig> {
+  const component = defineAsyncComponent(config.component)
+
+  return function RenderRow(renderConfig): TableRowVNode {
+    const extension = applyExtensions(config, renderConfig)
+
+    return h(component, extension.props, {
+      default: () => renderConfig.cells(),
+    }) satisfies VNode as TableRowVNode
+  }
+}

package/lib/packages/table/define-renderer/define-table-section-renderer.ts

@@ -0,0 +1,29 @@
+import { type VNode, defineAsyncComponent, h } from 'vue'
+import {
+  applyExtensions,
+  type TableSectionRenderer,
+  type TableSectionVNode,
+  type Extensions,
+  type ComponentLoader,
+  type PropsOverride,
+} from '..'
+
+export function defineSectionRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+>(config: {
+  component: ComponentLoader<TComponentProps>
+  props?: (config: TPropsConfig) => PropsOverride<TComponentProps>
+  extensions?: TExtensions
+}): TableSectionRenderer<TComponentProps, TExtensions, TPropsConfig> {
+  const component = defineAsyncComponent(config.component)
+
+  return function RenderSection(renderConfig): TableSectionVNode {
+    const extension = applyExtensions(config, renderConfig)
+
+    return h(component, extension.props, {
+      default: () => renderConfig.rows(),
+    }) satisfies VNode as TableSectionVNode
+  }
+}

package/lib/packages/table/define-table/define-multi-source-table.ts

@@ -0,0 +1,39 @@
+import { type MaybeRefOrGetter } from 'vue'
+import { type Sources, type TransformProperty, transformSources } from '..'
+
+export function defineMultiSourceTable<
+  TSources extends Record<string, Sources>,
+  TConfig extends Record<string, unknown> = Record<string, unknown>,
+>(setup: (sources: TSources, config: TConfig) => any) {
+  return function useTable<
+    TUseSources extends {
+      [K in keyof TSources]: any
+    },
+    TTransforms extends {
+      [K in keyof TSources]: TSources[K] extends Sources<infer T>
+        ? TransformProperty<T, TUseSources[K], K & string>[K & string]
+        : never
+    },
+  >(
+    sources: {
+      [K in keyof TUseSources]: MaybeRefOrGetter<TUseSources[K][]>
+    },
+    config: TConfig &
+      (Record<keyof TTransforms, undefined> extends TTransforms
+        ? { transform?: Partial<TTransforms> }
+        : {
+            transform: { [K in keyof TTransforms as undefined extends TTransforms[K] ? K : never]?: TTransforms[K] } & {
+              [K in keyof TTransforms as undefined extends TTransforms[K] ? never : K]: TTransforms[K]
+            }
+          })
+  ) {
+    const transformedSources = Object.fromEntries(
+      Object.entries(sources).map(([key, value]) => [
+        key,
+        transformSources(value, (config.transform as any)?.[key as any]),
+      ])
+    )
+
+    return setup(transformedSources as TSources, config)
+  }
+}

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

@@ -0,0 +1,13 @@
+import { type MaybeRefOrGetter } from 'vue'
+import { type Sources, type TableVNode, type TransformProperty, transformSources } from '..'
+
+export function defineTable<TSource, TConfig extends Record<string, unknown> = Record<string, unknown>>(
+  setup: (sources: Sources<TSource>, config: TConfig) => () => TableVNode
+) {
+  return function useTable<TUseSource>(
+    sources: MaybeRefOrGetter<TUseSource[]>,
+    config: TConfig & TransformProperty<TSource, TUseSource>
+  ) {
+    return setup(transformSources<TSource>(sources, config?.transform), config)
+  }
+}

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

@@ -0,0 +1,18 @@
+import { type MaybeRefOrGetter } from 'vue'
+import { type Sources, type TransformProperty, transformSources } from '..'
+
+export function defineTypedTable<
+  TTypedSource extends { type: string; data: Sources },
+  TConfig extends Record<string, unknown> = Record<string, unknown>,
+>(setup: (typedSource: TTypedSource, config: TConfig) => any) {
+  return function useTable<
+    TUseSource,
+    const TType extends TTypedSource['type'],
+    TSource extends TTypedSource extends { type: TType; data: Sources<infer TSource> } ? TSource : never,
+  >(type: TType, sources: MaybeRefOrGetter<TUseSource[]>, config: TConfig & TransformProperty<TSource, TUseSource>) {
+    return setup(
+      { type, data: transformSources<TSource>(sources, config.transform) } as unknown as TTypedSource,
+      config
+    )
+  }
+}

package/lib/packages/table/index.ts

@@ -0,0 +1,11 @@
+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'

package/lib/packages/table/transform-sources.ts

@@ -0,0 +1,13 @@
+import { useArrayMap } from '@vueuse/shared'
+import { type MaybeRefOrGetter, type ComputedRef, computed, toValue } from 'vue'
+
+export function transformSources<TSource>(
+  sources: MaybeRefOrGetter<any[]>,
+  transformer?: (source: any, index: number) => any
+) {
+  return transformer
+    ? (useArrayMap(sources, (source, index) => ({ ...source, ...transformer!(source, index) })) as ComputedRef<
+        TSource[]
+      >)
+    : (computed(() => toValue(sources)) as unknown as ComputedRef<TSource[]>)
+}

package/lib/packages/table/types/extensions.ts

@@ -0,0 +1,16 @@
+import type { PropsOverride, Renderer } from '.'
+
+export type Extension<
+  TConfig extends Record<string, any> = Record<string, any>,
+  TComponentProps extends Record<string, any> = Record<string, any>,
+> = (config: TConfig) => { props: PropsOverride<TComponentProps> }
+
+export type Extensions<TComponentProps extends Record<string, any>> = Record<string, Extension<any, TComponentProps>>
+
+export type ExtensionConfig<
+  TRenderer extends Renderer<any, any, any>,
+  TExtensionName extends keyof $Extensions,
+  $Extensions extends Record<string, any> = TRenderer extends Renderer<any, infer TExtensions, any>
+    ? { [K in keyof TExtensions]: Parameters<TExtensions[K]>[0] }
+    : never,
+> = $Extensions[TExtensionName]

package/lib/packages/table/types/index.ts

@@ -0,0 +1,47 @@
+import type { Extensions, TableRenderer, TableCellRenderer, TableRowRenderer, TableSectionRenderer } from '.'
+import type { ComputedRef } from 'vue'
+
+export * from './table-cell'
+export * from './table-row'
+export * from './extensions'
+export * from './table'
+export * from './table-section'
+
+export type ComponentLoader<TProps> = () => Promise<{
+  default: abstract new () => {
+    $props: TProps
+  }
+}>
+
+export type PropsOverride<TComponentProps> = Partial<TComponentProps> & Record<string, any>
+
+export type Renderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+> =
+  | TableRenderer<TComponentProps, TExtensions, TPropsConfig>
+  | TableSectionRenderer<TComponentProps, TExtensions, TPropsConfig>
+  | TableRowRenderer<TComponentProps, TExtensions, TPropsConfig>
+  | TableCellRenderer<TComponentProps, TExtensions, TPropsConfig>
+
+export type Sources<T = any> = ComputedRef<T[]>
+
+export type TransformProperty<
+  TSource,
+  TUseSource,
+  TPropertyName extends string = 'transform',
+> = TUseSource extends TSource
+  ? { [K in TPropertyName]?: (source: TUseSource, index: number) => Partial<TSource> }
+  : {
+      [K in TPropertyName]: (
+        source: TUseSource,
+        index: number
+      ) => Partial<TSource> & {
+        [K in keyof TSource as K extends keyof TUseSource
+          ? TUseSource[K] extends TSource[K]
+            ? never
+            : K
+          : K]: TSource[K]
+      }
+    }

package/lib/packages/table/types/table-cell.ts

@@ -0,0 +1,18 @@
+import type { Branded } from '@core/types/utility.type'
+import type { PropsOverride, Extensions } from '.'
+import type { VNode } from 'vue'
+
+export type TableCellVNode = Branded<'CellVNode', VNode>
+
+export type TableCellVNodes = TableCellVNode | TableCellVNodes[]
+
+export type TableCellRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+> = (
+  renderConfig: {
+    extensions?: { [K in keyof TExtensions]?: Parameters<TExtensions[K]>[0] }
+    props?: PropsOverride<TComponentProps>
+  } & TPropsConfig
+) => TableCellVNode

package/lib/packages/table/types/table-row.ts

@@ -0,0 +1,20 @@
+import type { Branded } from '@core/types/utility.type'
+import type { PropsOverride, Extensions, TableCellVNodes } from '.'
+import type { VNode } from 'vue'
+
+export type TableRowVNode = Branded<'RowVNode', VNode>
+
+export type TableRowVNodes = TableRowVNode | TableRowVNodes[]
+
+export type TableRowRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+> = (
+  renderConfig: {
+    extensions?: { [K in keyof TExtensions]?: Parameters<TExtensions[K]>[0] }
+    key: string | number
+    props?: PropsOverride<TComponentProps>
+    cells: () => TableCellVNodes
+  } & TPropsConfig
+) => TableRowVNode

package/lib/packages/table/types/table-section.ts

@@ -0,0 +1,19 @@
+import type { Branded } from '@core/types/utility.type'
+import type { PropsOverride, Extensions, TableRowVNodes } from '.'
+import type { VNode } from 'vue'
+
+export type TableSectionVNode = Branded<'SectionVNode', VNode>
+
+export type TableSectionVNodes = TableSectionVNode | TableSectionVNodes[]
+
+export type TableSectionRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+> = (
+  renderConfig: {
+    extensions?: { [K in keyof TExtensions]?: Parameters<TExtensions[K]>[0] }
+    rows: () => TableRowVNodes
+    props?: PropsOverride<TComponentProps>
+  } & TPropsConfig
+) => TableSectionVNode

package/lib/packages/table/types/table.ts

@@ -0,0 +1,28 @@
+import type { Branded } from '@core/types/utility.type'
+import type {
+  TableCellVNodes,
+  PropsOverride,
+  TableRowVNodes,
+  TableSectionVNode,
+  TableSectionVNodes,
+  Extensions,
+} from '.'
+import type { VNode } from 'vue'
+
+export type TableVNode = Branded<'TableVNode', VNode>
+
+export type TableRenderer<
+  TComponentProps extends Record<string, any>,
+  TExtensions extends Extensions<TComponentProps>,
+  TPropsConfig extends Record<string, any>,
+> = (
+  renderConfig: {
+    extensions?: { [K in keyof TExtensions]?: Parameters<TExtensions[K]>[0] }
+    props?: PropsOverride<TComponentProps>
+    thead:
+      | (() => TableSectionVNode)
+      | { rows: () => TableRowVNodes; cells?: never }
+      | { rows?: never; cells: () => TableCellVNodes }
+    tbody: (() => TableSectionVNodes) | { rows: () => TableRowVNodes }
+  } & TPropsConfig
+) => TableVNode

package/lib/packages/threshold/use-threshold.ts

@@ -1,13 +1,14 @@
 import type { ThresholdConfig, ThresholdResult } from '@core/packages/threshold/type.ts'
-import { computed, type ComputedRef, type MaybeRefOrGetter, toValue } from 'vue'
+import { toComputed } from '@core/utils/to-computed.util'
+import { computed, type ComputedRef, type MaybeRefOrGetter } from 'vue'
 
 export function useThreshold<TPayload>(
   rawCurrentValue: MaybeRefOrGetter<number>,
   rawConfig: MaybeRefOrGetter<ThresholdConfig<TPayload>>
 ): ComputedRef<ThresholdResult<TPayload>> {
-  const currentValue = computed(() => toValue(rawCurrentValue))
+  const currentValue = toComputed(rawCurrentValue)
 
-  const config = computed(() => toValue(rawConfig))
+  const config = toComputed(rawConfig)
 
   return computed(
     () =>

package/lib/types/vue-virtual-scroller.d.ts

@@ -0,0 +1,101 @@
+declare module 'vue-virtual-scroller' {
+  import { type ObjectEmitsOptions, type PublicProps, type SetupContext, type SlotsType, type VNode } from 'vue'
+
+  interface RecycleScrollerProps<T> {
+    items: readonly T[]
+    direction?: 'vertical' | 'horizontal'
+    itemSize?: number | null
+    gridItems?: number
+    itemSecondarySize?: number
+    minItemSize?: number
+    sizeField?: string
+    typeField?: string
+    keyField?: keyof T
+    pageMode?: boolean
+    prerender?: number
+    buffer?: number
+    emitUpdate?: boolean
+    updateInterval?: number
+    listClass?: string
+    itemClass?: string
+    listTag?: string
+    itemTag?: string
+  }
+
+  interface DynamicScrollerProps<T> extends RecycleScrollerProps<T> {
+    minItemSize: number
+  }
+
+  interface RecycleScrollerEmitOptions extends ObjectEmitsOptions {
+    resize: () => void
+    visible: () => void
+    hidden: () => void
+    update: (startIndex: number, endIndex: number, visibleStartIndex: number, visibleEndIndex: number) => void
+    'scroll-start': () => void
+    'scroll-end': () => void
+  }
+
+  interface RecycleScrollerSlotProps<T> {
+    item: T
+    index: number
+    active: boolean
+  }
+
+  interface RecycleScrollerSlots<T> {
+    default(slotProps: RecycleScrollerSlotProps<T>): unknown
+    before(): unknown
+    empty(): unknown
+    after(): unknown
+  }
+
+  export interface RecycleScrollerInstance {
+    getScroll(): { start: number; end: number }
+    scrollToItem(index: number): void
+    scrollToPosition(position: number): void
+  }
+
+  export const RecycleScroller: <T>(
+    props: RecycleScrollerProps<T> & PublicProps,
+    ctx?: SetupContext<RecycleScrollerEmitOptions, SlotsType<RecycleScrollerSlots<T>>>,
+    expose?: (exposed: RecycleScrollerInstance) => void
+  ) => VNode & {
+    __ctx?: {
+      props: RecycleScrollerProps<T> & PublicProps
+      expose(exposed: RecycleScrollerInstance): void
+      slots: RecycleScrollerSlots<T>
+    }
+  }
+
+  export const DynamicScroller: <T>(
+    props: DynamicScrollerProps<T> & PublicProps,
+    ctx?: SetupContext<RecycleScrollerEmitOptions, SlotsType<RecycleScrollerSlots<T>>>,
+    expose?: (exposed: RecycleScrollerInstance) => void
+  ) => VNode & {
+    __ctx?: {
+      props: DynamicScrollerProps<T> & PublicProps
+      expose(exposed: RecycleScrollerInstance): void
+      slots: RecycleScrollerSlots<T>
+    }
+  }
+
+  interface DynamicScrollerItemProps<T> {
+    item: T
+    active: boolean
+    sizeDependencies?: unknown[]
+    watchData?: boolean
+    tag?: string
+    emitResize?: boolean
+    onResize?: () => void
+  }
+
+  interface DynamicScrollerItemEmitOptions extends ObjectEmitsOptions {
+    resize: () => void
+  }
+
+  export const DynamicScrollerItem: <T>(
+    props: DynamicScrollerItemProps<T> & PublicProps,
+    ctx?: SetupContext<DynamicScrollerItemEmitOptions>
+  ) => VNode
+
+  export function IdState(options?: { idProp?: (value: any) => unknown }): ComponentOptionsMixin
+}

package/lib/utils/injection-keys.util.ts

@@ -1,4 +1,5 @@
 import type { InputWrapperController } from '@core/components/input-wrapper/VtsInputWrapper.vue'
+import type { ModalAccent } from '@core/components/ui/modal/UiModal.vue'
 import type { ValueFormatter } from '@core/types/chart'
 import type { ComputedRef, InjectionKey, Ref } from 'vue'
 
@@ -21,3 +22,5 @@ export const IK_MENU_TELEPORTED = Symbol('IK_MENU_TELEPORTED') as InjectionKey<b
 export const IK_DISABLED = Symbol('IK_DISABLED') as InjectionKey<ComputedRef<boolean>>
 
 export const IK_INPUT_WRAPPER_CONTROLLER = Symbol('IK_INPUT_WRAPPER_CONTROLLER') as InjectionKey<InputWrapperController>
+
+export const IK_MODAL_ACCENT = Symbol('IK_MODAL_ACCENT') as InjectionKey<ComputedRef<ModalAccent>>

package/lib/utils/progress.util.ts

@@ -8,6 +8,7 @@ import type { ThresholdConfig } from '@core/packages/threshold/type.ts'
 import { formatSize } from '@core/utils/size.util.ts'
 import { computed, type ComputedRef, type MaybeRefOrGetter, type Reactive, toValue } from 'vue'
 import { useI18n } from 'vue-i18n'
+import { toComputed } from './to-computed.util'
 
 export function defaultProgressThresholds(tooltip?: string): ThresholdConfig<ProgressBarThresholdPayload> {
   return {
@@ -42,7 +43,7 @@ export function useProgressToLegend(
 ) {
   const { n } = useI18n()
 
-  const type = computed(() => toValue(rawType))
+  const type = toComputed(rawType)
 
   function toLegend(label: string, progress: Progress | Reactive<Progress>): ProgressBarLegend | undefined {
     switch (type.value) {

package/lib/utils/to-computed.util.ts

@@ -0,0 +1,15 @@
+import { computed, toValue, type ComputedRef, type MaybeRefOrGetter } from 'vue'
+
+export function toComputed<TValue>(value: MaybeRefOrGetter<TValue>): ComputedRef<TValue>
+
+export function toComputed<TValue>(
+  value: MaybeRefOrGetter<TValue | undefined>,
+  defaultValue: MaybeRefOrGetter<TValue>
+): ComputedRef<TValue>
+
+export function toComputed<TValue>(
+  value: MaybeRefOrGetter<TValue>,
+  defaultValue?: MaybeRefOrGetter<TValue>
+): ComputedRef<TValue | undefined> {
+  return computed(() => toValue(value) ?? toValue(defaultValue))
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@xen-orchestra/web-core",
   "type": "module",
-  "version": "0.31.1",
+  "version": "0.33.0",
   "private": false,
   "exports": {
     "./*": {
@@ -29,7 +29,8 @@
     "ndjson-readablestream": "^1.3.0",
     "placement.js": "^1.0.0-beta.5",
     "simple-icons": "^14.14.0",
-    "vue-echarts": "^6.6.8"
+    "vue-echarts": "^6.6.8",
+    "vue-virtual-scroller": "^2.0.0-beta.8"
   },
   "peerDependencies": {
     "pinia": "^3.0.1",