ScholarWaterfall.svelte

<script lang="ts">
  import { createEventDispatcher, getContext } from "svelte"
  import type { Writable } from "svelte/store"

  import { session } from "$app/stores"
  import PictoFemme from "$lib/components/pictos/PictoFemme.svelte"
  import PictoEntreprise from "$lib/components/pictos/PictoEntreprise.svelte"
  import type { Decomposition, DecompositionByName } from "$lib/decompositions"
  import {
    iterDecompositionChildren,
    walkDecompositions,
  } from "$lib/decompositions"

  export let vectorIndex: number

  const adaptAmountsScale = getContext("adaptAmountsScale") as Writable<boolean>
  const decompositionByName = getContext(
    "decompositionByName",
  ) as Writable<DecompositionByName>
  const deltaFormatter = new Intl.NumberFormat("fr-FR", {
    currency: "EUR",
    maximumFractionDigits: 0,
    minimumFractionDigits: 0,
    signDisplay: "never",
    style: "currency",
  })
  const dispatch = createEventDispatcher()
  const firstDeltaFormatter = new Intl.NumberFormat("fr-FR", {
    currency: "EUR",
    maximumFractionDigits: 0,
    minimumFractionDigits: 0,
    style: "currency",
  })
  const showNulls = getContext("showNulls") as Writable<boolean>
  let waterfallWidth = 100

  $: rootDecompositionName = $session.rootDecompositionName

  $: nodes = [
    ...walkVisibleDecomposition(
      $decompositionByName,
      rootDecompositionName,
      $showNulls,
    ),
  ]

  $: [valueMin, valueMax] = computeXDomain(
    $decompositionByName,
    rootDecompositionName,
    vectorIndex,
    $adaptAmountsScale,
  )

  $: widthMax = waterfallWidth - 1

  function computeXDomain(
    decompositionByName: DecompositionByName,
    name: string,
    vectorIndex: number,
    adaptAmountsScale: boolean,
  ): [number, number] {
    let valueMin = undefined
    let valueMax = undefined
    for (const node of walkDecompositions(
      decompositionByName,
      name,
      false,
      false,
    )) {
      if (adaptAmountsScale) {