sveltekit-ui 1.1.15 → 1.1.17

package/dist/Components/ChartInput/DisplayNav/Klines/index.svelte

@@ -1,150 +0,0 @@
-<script>
-  let { data, shown_start_x, shown_end_x, shown_low_y, shown_high_y, period_x } = $props()
-
-  let kline_width_pd = $state(null)
-  let shown_normalized_klines = $state([])
-
-  if (data && shown_start_x && shown_end_x && shown_low_y && shown_high_y && period_x) {
-    update_shown()
-  }
-
-  // could import this from create_chart_manager
-  function get_kline_details(o, l, h, c) {
-    let res = {}
-    const is_closed_higher = c > o ? 1 : 0
-    const kline_height = h - l
-    const kline_box_height = Math.abs(c - o)
-    let kline_top_wick_height = h - o
-    let kline_bottom_wick_height = c - l
-    if (is_closed_higher) {
-      kline_top_wick_height = h - c
-      kline_bottom_wick_height = o - l
-    }
-    const kline_box_height_pd = kline_box_height / kline_height
-    const kline_top_wick_height_pd = kline_top_wick_height / kline_height
-    const kline_bottom_wick_height_pd = kline_bottom_wick_height / kline_height
-    const kline_close_height_pd = (c - l) / kline_height
-    res["is_closed_higher"] = is_closed_higher
-    res["kline_height"] = kline_height
-    res["kline_box_height"] = kline_box_height
-    res["kline_top_wick_height"] = kline_top_wick_height
-    res["kline_bottom_wick_height"] = kline_bottom_wick_height
-    res["kline_box_height_pd"] = kline_box_height_pd
-    res["kline_top_wick_height_pd"] = kline_top_wick_height_pd
-    res["kline_bottom_wick_height_pd"] = kline_bottom_wick_height_pd
-    res["kline_close_height_pd"] = kline_close_height_pd
-    return res
-  }
-
-  function update_shown() {
-    const shown_x_range = shown_end_x - shown_start_x
-    const shown_y_range = shown_high_y - shown_low_y
-    kline_width_pd = (period_x * 0.8) / shown_x_range
-    let normalized_klines_in_range_loc = []
-    console.log("shown_low_y", shown_low_y, shown_high_y)
-    for (let kline of data) {
-      if (shown_start_x <= kline.x && kline.x < shown_end_x) {
-        if (kline.h > shown_high_y) {
-          console.log("too high", kline)
-        }
-        if (kline.l < shown_low_y) {
-          console.log("too low", kline)
-        }
-        const norm_o = (kline.o - shown_low_y) / shown_y_range
-        const norm_h = (kline.h - shown_low_y) / shown_y_range
-        const norm_l = (kline.l - shown_low_y) / shown_y_range
-        const norm_c = (kline.c - shown_low_y) / shown_y_range
-        const norm_details = get_kline_details(norm_o, norm_h, norm_l, norm_c)
-        normalized_klines_in_range_loc = [
-          ...normalized_klines_in_range_loc,
-          {
-            x: (kline.x - shown_start_x) / shown_x_range,
-            o: norm_o,
-            h: norm_h,
-            l: norm_l,
-            c: norm_c,
-            ...norm_details,
-          },
-        ]
-      }
-    }
-    shown_normalized_klines = normalized_klines_in_range_loc
-    console.log("shown_normalized_klines", shown_normalized_klines)
-  }
-</script>
-
-{#each shown_normalized_klines as kline}
-  <div
-    class="kline_container"
-    style="
-    height: {kline.kline_height * 100}%; 
-    width: {kline_width_pd * 100}%;
-    left: {kline.x * 100}%; 
-    bottom: {kline.l * 100}%;"
-  >
-    <div class="kline">
-      <div
-        class="kline_part wick top_wick"
-        class:inc={kline.is_closed_higher}
-        class:dec={!kline.is_closed_higher}
-        style="
-          height: {kline.kline_top_wick_height_pd * 100}%; 
-          top: 0;
-        "
-      ></div>
-      <div
-        class="kline_part box"
-        class:inc={kline.is_closed_higher}
-        class:dec={!kline.is_closed_higher}
-        style="min-height: 2px; top: {kline.kline_top_wick_height_pd *
-          100}%; bottom: {kline.kline_bottom_wick_height_pd * 100}%;"
-      ></div>
-      <div
-        class="kline_part wick bottom_wick"
-        class:inc={kline.is_closed_higher}
-        class:dec={!kline.is_closed_higher}
-        style="height: {kline.kline_bottom_wick_height_pd * 100}%; bottom: 0;"
-      ></div>
-    </div>
-  </div>
-{/each}
-
-<style>
-  .kline_container {
-    position: absolute;
-  }
-  .kline {
-    position: relative;
-    height: 100%;
-  }
-  .kline_part {
-    position: absolute;
-  }
-  .wick {
-    left: 50%;
-    transform: translateX(-50%);
-    width: 2px;
-  }
-  .top_wick {
-    border-top-left-radius: 1px;
-    border-top-right-radius: 1px;
-  }
-  .bottom_wick {
-    border-bottom-left-radius: 1px;
-    border-bottom-right-radius: 1px;
-  }
-  .box {
-    width: 100%;
-    border-radius: 0.2rem;
-  }
-  .inc {
-    background: var(--green-buy);
-  }
-  .dec {
-    background: var(--red-sell);
-  }
-  /* .dec_box {
-    border: 1px solid var(--red-sell);
-    box-sizing: border-box;
-  } */
-</style>

package/dist/Components/ChartInput/DisplayNav/Lines/index.svelte

@@ -1,45 +0,0 @@
-<script>
-  let { data, shown_start_x, shown_end_x, shown_low_y, shown_high_y } = $props()
-
-  if (data && shown_start_x && shown_end_x && shown_low_y && shown_high_y) {
-    prep_lines()
-  }
-
-  let svg_lines = $state([])
-  function prep_lines() {
-    console.log("linedata", data)
-    const shown_x_range = shown_end_x - shown_start_x
-    const shown_y_range = shown_high_y - shown_low_y
-    let svg_lines_loc = []
-    for (let t of data) {
-      const y1 = t.m * shown_start_x + t.b
-      const y2 = t.m * shown_end_x + t.b
-      const norm_y1 = (y1 - shown_low_y) / shown_y_range
-      const norm_y2 = (y2 - shown_low_y) / shown_y_range
-      svg_lines_loc = [
-        ...svg_lines_loc,
-        {
-          x1: 0,
-          y1: 1 - norm_y1,
-          x2: 1,
-          y2: 1 - norm_y2,
-          // score: t.score,
-          // cs: Math.floor(t.score * 255)
-        },
-      ]
-    }
-    svg_lines = svg_lines_loc
-    console.log("svg_lines", svg_lines)
-  }
-</script>
-
-<div class="lines">
-  <svg width="100%" height="100%" viewBox="0 0 100 100" preserveAspectRatio="none">
-    {#each svg_lines as svg_line}
-      <path
-        d="M{svg_line.x1 * 100} {svg_line.y1 * 100} L{svg_line.x2 * 100} {svg_line.y2 * 100}"
-        style="stroke-width:.2;stroke:rgb(240,240,240)"
-      />
-    {/each}
-  </svg>
-</div>

package/dist/Components/ChartInput/DisplayNav/index.svelte

@@ -1,297 +0,0 @@
-<script>
-  // import Lines from "./Lines/index.svelte"
-  import Klines from "./Klines/index.svelte"
-
-  let { manager } = $props()
-
-  const y_axis_width = 1
-  const x_axis_height = 0.5
-
-  let is_hovered = $state(false)
-
-  function calc_z_height(shared_y_axis_i, dataset_i) {
-    let z_steps = 0
-    for (let i = 0; i < shared_y_axis_i; i++) {
-      z_steps +=
-        manager?.chart_prepped.frames?.[manager?.path_breadcrumbs_manager?.val?.[0]]?.shared_y_axiss[i].datasets
-          .length + 2
-    }
-    z_steps += dataset_i
-    return z_steps * 2
-  }
-
-  let hovered_y_axis = $state(-1)
-
-  let hovered_dataset_index = $state(-1)
-
-  function set_hovered_dataset_index(input) {
-    hovered_dataset_index = input
-  }
-</script>
-
-<div class="container">
-  {#if manager?.path_breadcrumbs_manager?.val?.length >= 0}
-    <div class="item">
-      <div class="grid" style="--y_axis_width: {y_axis_width}rem; --x_axis_height: {x_axis_height}rem;">
-        {#if manager?.chart_prepped && manager?.chart_prepped.frames && manager?.chart_prepped.frames.length > 0}
-          {#each manager?.chart_prepped.frames as frame, i}
-            {#each frame.shared_y_axiss as shared_y_axis}
-              <div
-                role="button"
-                tabindex="0"
-                class="part_container"
-                style="grid-area: {1 + i} / 1 / {2 + i} / 2; width: 100%; aspect-ratio: {frame?.aspect_ratio};"
-                onpointerenter={() => (is_hovered = true)}
-                onpointerleave={() => (is_hovered = false)}
-                onclick={() => manager?.path_breadcrumbs_manager.set_val([i])}
-                onkeypress={() => manager?.path_breadcrumbs_manager.set_val([i])}
-              >
-                <div
-                  class="part_inner base_tint"
-                  class:hover_tint={is_hovered ||
-                    (manager?.path_breadcrumbs_manager?.val &&
-                      manager?.path_breadcrumbs_manager?.val.length > 0 &&
-                      manager?.path_breadcrumbs_manager?.val?.[0] === i)}
-                >
-                  {#each shared_y_axis.datasets as dataset}
-                    {#if dataset.type === "klines"}
-                      <!-- <Klines /> -->
-                      klines
-                    {:else if dataset.type === "lines"}
-                      <!-- <LinesDataset /> -->
-                      lines
-                    {/if}
-                  {/each}
-                </div>
-              </div>
-              <div
-                role="button"
-                tabindex="0"
-                onpointerenter={() => (is_hovered = true)}
-                onpointerleave={() => (is_hovered = false)}
-                onclick={() =>
-                  manager?.path_breadcrumbs_manager.set_val([
-                    manager?.path_breadcrumbs_manager?.val?.[0],
-                    manager?.path_breadcrumbs_manager?.val?.[1],
-                    i,
-                  ])}
-                onkeypress={() =>
-                  manager?.path_breadcrumbs_manager.set_val([
-                    manager?.path_breadcrumbs_manager?.val?.[0],
-                    manager?.path_breadcrumbs_manager?.val?.[1],
-                    i,
-                  ])}
-                class="part_container"
-                style="grid-area: {1 + i} / 2 / {2 + i} / 3;"
-              >
-                <div
-                  class="part_inner base_tint"
-                  class:hover_tint={is_hovered ||
-                    (manager?.path_breadcrumbs_manager?.val &&
-                      manager?.path_breadcrumbs_manager?.val.length > 0 &&
-                      manager?.path_breadcrumbs_manager?.val?.[0] === i)}
-                ></div>
-              </div>
-            {/each}
-          {/each}
-          <div
-            class="x_axis"
-            style="grid-area: {manager?.chart_prepped.frames.length + 1} / 1 / {manager?.chart_prepped.frames.length +
-              2} / 2; height: {x_axis_height}rem;"
-          ></div>
-        {/if}
-      </div>
-    </div>
-  {/if}
-  {#if manager?.path_breadcrumbs_manager?.val.length >= 1 && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]}
-    <div class="item">
-      <div class="scene_frame">
-        <div class="frame_container_frame">
-          {#if Array.isArray(manager?.chart_prepped.frames?.[manager?.path_breadcrumbs_manager?.val?.[0]]?.shared_y_axiss)}
-            {#each manager?.chart_prepped.frames?.[manager?.path_breadcrumbs_manager?.val?.[0]]?.shared_y_axiss as shared_y_axis, shared_y_axis_i}
-              <div
-                role="button"
-                tabindex="0"
-                class="cards_container"
-                onpointerenter={() => (hovered_y_axis = shared_y_axis_i)}
-                onpointerleave={() => (hovered_y_axis = -1)}
-                onclick={() =>
-                  manager?.path_breadcrumbs_manager.set_val([
-                    manager?.path_breadcrumbs_manager?.val?.[0],
-                    shared_y_axis_i,
-                  ])}
-                onkeypress={() =>
-                  manager?.path_breadcrumbs_manager.set_val([
-                    manager?.path_breadcrumbs_manager?.val?.[0],
-                    shared_y_axis_i,
-                  ])}
-              >
-                {#each shared_y_axis.datasets as dataset, dataset_i}
-                  <div class="card_base" style="transform: translateZ({calc_z_height(shared_y_axis_i, dataset_i)}rem);">
-                    <div
-                      class="base_tint part_inner"
-                      class:hover_tint={hovered_y_axis === shared_y_axis_i ||
-                        (manager?.path_breadcrumbs_manager?.val &&
-                          manager?.path_breadcrumbs_manager?.val.length > 1 &&
-                          manager?.path_breadcrumbs_manager?.val?.[1] === shared_y_axis_i)}
-                      style="aspect-ratio: {manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val?.[0]]
-                        ?.aspect_ratio}; min-width: calc(100% - {y_axis_width}rem);"
-                    >
-                      {#if dataset.type === "klines"}
-                        klines
-                      {:else if dataset.type === "lines"}
-                        lines
-                      {:else}
-                        other
-                      {/if}
-                    </div>
-                    <div
-                      class="y_axis part_inner"
-                      class:base_tint={dataset_i === 0}
-                      class:hover_tint={dataset_i === 0 &&
-                        (hovered_y_axis === shared_y_axis_i ||
-                          (manager?.path_breadcrumbs_manager?.val &&
-                            manager?.path_breadcrumbs_manager?.val.length > 1 &&
-                            manager?.path_breadcrumbs_manager?.val?.[1] === shared_y_axis_i))}
-                      style="min-width: {y_axis_width}rem; max-width: {y_axis_width}rem;"
-                    ></div>
-                  </div>
-                {/each}
-              </div>
-            {/each}
-          {/if}
-        </div>
-      </div>
-    </div>
-  {/if}
-  {#if manager?.path_breadcrumbs_manager?.val.length >= 2 && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val?.[0]]}
-    <div class="item">
-      <div class="scene">
-        <div class="frame_container">
-          <div class="cards_container">
-            {#if Array.isArray(manager?.chart_prepped?.frames?.[manager?.path_breadcrumbs_manager?.val?.[0]]?.shared_y_axiss?.[manager?.path_breadcrumbs_manager?.val?.[1]]?.datasets)}
-              {#each manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val?.[0]].shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]].datasets as dataset, i}
-                <div
-                  role="button"
-                  tabindex="0"
-                  class="card_base"
-                  style="transform: translateZ({i * 3}rem) translateY({i * 3}rem);"
-                  onpointerenter={() => set_hovered_dataset_index(i)}
-                  onpointerleave={() => set_hovered_dataset_index(-1)}
-                  onclick={() =>
-                    manager?.path_breadcrumbs_manager.set_val([
-                      manager?.path_breadcrumbs_manager?.val?.[0],
-                      manager?.path_breadcrumbs_manager?.val?.[1],
-                      i,
-                    ])}
-                  onkeypress={() =>
-                    manager?.path_breadcrumbs_manager.set_val([
-                      manager?.path_breadcrumbs_manager?.val?.[0],
-                      manager?.path_breadcrumbs_manager?.val?.[1],
-                      i,
-                    ])}
-                >
-                  <div
-                    class="base_tint part_inner"
-                    class:hover_tint={hovered_dataset_index === i ||
-                      (manager?.path_breadcrumbs_manager?.val.length === 3 &&
-                        i === manager?.path_breadcrumbs_manager?.val?.[2])}
-                    style="aspect-ratio: {manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val?.[0]]
-                      ?.aspect_ratio}; min-width: calc(100% - {y_axis_width}rem);"
-                  >
-                    {#if dataset.type === "klines"}
-                      klines
-                    {:else if dataset.type === "lines"}
-                      lines
-                    {:else}
-                      other
-                    {/if}
-                  </div>
-                  <div
-                    class="y_axis part_inner"
-                    class:base_tint={i === 0}
-                    style="min-width: {y_axis_width}rem; max-width: {y_axis_width}rem;"
-                  ></div>
-                </div>
-              {/each}
-            {/if}
-          </div>
-        </div>
-      </div>
-    </div>
-  {/if}
-</div>
-
-<style>
-  .container {
-    display: flex;
-  }
-  .item {
-    width: 12rem;
-    margin: 1rem;
-  }
-  .scene {
-    min-width: 100%;
-    min-height: 20rem;
-    border: 1px solid #ccc;
-    perspective: 14rem;
-    cursor: pointer;
-  }
-  .frame_container {
-    transform-style: preserve-3d;
-    transform: rotate3d(-1, -0.2, 0, 30deg);
-    transition: transform 1s;
-    /* min-height: 10rem; */
-    display: block;
-  }
-  .cards_container {
-    position: relative;
-    transform-style: preserve-3d;
-    transition: transform 1s;
-  }
-  .card_base {
-    position: absolute;
-    left: 10%;
-    right: 10%;
-    display: flex;
-    flex: 1;
-  }
-  .part_inner {
-    display: flex;
-    flex: 1;
-    margin: 0.1rem;
-    border-radius: 0.1rem;
-  }
-  .base_tint {
-    background: #cccccc50;
-  }
-  .hover_tint {
-    background: #614dff50;
-  }
-  .grid {
-    display: grid;
-    grid-template-columns: auto var(--y_axis_width);
-    grid-template-rows: auto;
-  }
-  .x_axis {
-    margin: 0.1rem;
-    border-radius: 0.1rem;
-    background: #cccccc50;
-  }
-  .part_container {
-    display: flex;
-  }
-  .scene_frame {
-    min-width: 100%;
-    min-height: 20rem;
-    border: 1px solid #ccc;
-    perspective: 140rem;
-  }
-  .frame_container_frame {
-    transform-style: preserve-3d;
-    transform: rotate3d(-1, -0.2, 0, 40deg);
-    transition: transform 1s;
-    /* min-height: 10rem; */
-    display: block;
-  }
-</style>

package/dist/Components/ChartInput/EditPanel/index.svelte

@@ -1,155 +0,0 @@
-<script>
-  import Dropdown from "../../Dropdown/index.svelte"
-  import TextInput from "../../TextInput/index.svelte"
-  import ColorInput from "../../ColorInput/index.svelte"
-  import Button from "../../Button/index.svelte"
-  import Slider from "../../Slider/index.svelte"
-
-  let { manager } = $props()
-</script>
-
-{#if Array.isArray(manager?.path_breadcrumbs_manager?.val)}
-  {#if manager?.path_breadcrumbs_manager?.val.length === 0 && manager?.chart_prepped}
-    <h2>Chart</h2>
-    <p>{manager?.chart_prepped?.id}</p>
-    <Dropdown manager={manager?.chart_prepped?.x_axis_type_dropdown_manager} />
-    <TextInput manager={manager?.chart_prepped?.x_axis_title_text_input_manager} />
-    {#if Array.isArray(manager?.chart_prepped?.frames)}
-      {#each manager?.chart_prepped?.frames as frame, i}
-        <div class="frame_container">
-          <p>frame: {i}</p>
-          <Button manager={frame?.frame_shift_to_back_button_manager} />
-          <Button manager={frame?.frame_remove_button_manager} />
-          <Button manager={frame?.frame_select_path_button_manager} />
-        </div>
-      {/each}
-    {/if}
-    <Button manager={manager?.chart_prepped?.frame_add_button_manager} />
-  {:else if manager?.path_breadcrumbs_manager?.val.length === 1 && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]}
-    <h2>Frame</h2>
-    <Slider
-      manager={manager?.chart_prepped.frames[manager?.path_breadcrumbs_manager?.val[0]]
-        ?.chart_frame_aspect_ratio_slider_manager}
-    />
-    <h3>Shared Y Axiss</h3>
-    {#if Array.isArray(manager?.chart_prepped?.frames?.[manager?.path_breadcrumbs_manager?.val?.[0]]?.shared_y_axiss)}
-      {#each manager?.chart_prepped.frames[manager?.path_breadcrumbs_manager?.val[0]].shared_y_axiss as shared_y_axis, i}
-        <div class="sub_parts_container">
-          <p>shared_y_axis: {i}</p>
-          <Button manager={shared_y_axis?.shift_to_back_button_manager} />
-          <Button manager={shared_y_axis?.remove_button_manager} />
-          <Button manager={shared_y_axis?.select_path_button_manager} />
-        </div>
-      {/each}
-    {/if}
-    <Button
-      manager={manager?.chart_prepped.frames[manager?.path_breadcrumbs_manager?.val[0]]
-        ?.add_shared_y_axis_button_manager}
-    />
-  {:else if manager?.path_breadcrumbs_manager?.val.length === 2 && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]}
-    <h2>Shared Y Axis</h2>
-    <Slider
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.top_padding_pd_slider_manager}
-    />
-    <Slider
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.bottom_padding_pd_slider_manager}
-    />
-    <Dropdown
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.y_axis_type_dropdown_manager}
-    />
-    <TextInput
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.y_axis_title_text_input_manager}
-    />
-    <Button
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.add_dataset_button_manager}
-    />
-    {#if Array.isArray(manager?.chart_prepped?.frames?.[manager?.path_breadcrumbs_manager?.val?.[0]]?.shared_y_axiss?.[manager?.path_breadcrumbs_manager?.val[1]].datasets)}
-      {#each manager?.chart_prepped?.frames?.[manager?.path_breadcrumbs_manager?.val?.[0]]?.shared_y_axiss?.[manager?.path_breadcrumbs_manager?.val[1]].datasets as dataset, i}
-        <div class="sub_parts_container">
-          <p>Dataset {i}</p>
-          <Button manager={dataset?.shift_to_back_button_manager} />
-          <Button manager={dataset?.remove_button_manager} />
-          <Button manager={dataset?.select_path_button_manager} />
-        </div>
-      {/each}
-    {/if}
-  {:else if manager?.path_breadcrumbs_manager?.val.length === 3 && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]}
-    <h2>Dataset</h2>
-    <TextInput
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.name_text_input_manager}
-    />
-    <Dropdown
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.dataset_type_dropdown_manager}
-    />
-    <Dropdown
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.dataset_id_dropdown_manager}
-    />
-    <p class="label">Dataset Colors</p>
-    {#if Array.isArray(manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.colors) && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.colors.length > 0}
-      {#each manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.colors_input as color_input}
-        <div style="display: flex; gap: 1rem;">
-          <Button manager={color_input?.remove_button_manager} />
-          <ColorInput manager={color_input?.color_input_manager} />
-        </div>
-      {/each}
-    {:else}
-      <p>No Colors</p>
-    {/if}
-    <Button
-      manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-        manager?.path_breadcrumbs_manager?.val[1]
-      ]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.add_dataset_color_button_manager}
-    />
-    {#if Array.isArray(manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.keys_input) && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.keys_input.length > 0 && manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.dataset_id}
-      {#if manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]].type == "klines"}
-        <Dropdown
-          manager={manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[
-            manager?.path_breadcrumbs_manager?.val[1]
-          ]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.dataset_period_dropdown_manager}
-        />
-      {/if}
-      {#each manager?.chart_prepped?.frames[manager?.path_breadcrumbs_manager?.val[0]]?.shared_y_axiss[manager?.path_breadcrumbs_manager?.val[1]]?.datasets[manager?.path_breadcrumbs_manager?.val[2]]?.keys_input as key_input}
-        <Dropdown manager={key_input?.key_dropdown_manager} />
-      {/each}
-    {/if}
-  {/if}
-{/if}
-
-<style>
-  .frame_container {
-    display: flex;
-    flex-direction: column;
-    text-align: left;
-    margin: 0.2rem;
-    border: 1px solid var(--contrast-2);
-    box-sizing: border-box;
-    border-radius: 0.5rem;
-    padding: 0.5rem;
-  }
-  .sub_parts_container {
-    display: flex;
-    flex-direction: column;
-    text-align: left;
-    margin: 0.2rem;
-    border: 1px solid var(--contrast-2);
-    box-sizing: border-box;
-    border-radius: 0.5rem;
-    padding: 0.5rem;
-  }
-</style>

package/dist/Components/ChartInput/index.svelte

@@ -1,21 +0,0 @@
-<script>
-  import Button from "../Button/index.svelte"
-  import Popover from "../Popover/index.svelte"
-  import Breadcrumbs from "../Breadcrumbs/index.svelte"
-  import DisplayNav from "./DisplayNav/index.svelte"
-  import EditPanel from "./EditPanel/index.svelte"
-
-  let { manager } = $props()
-</script>
-
-<Button manager={manager?.chart_builder_popover_button_manager} />
-<Popover manager={manager?.chart_builder_popover_manager}>
-  {#snippet content()}
-    <Breadcrumbs manager={manager?.path_breadcrumbs_manager} />
-    <DisplayNav {manager} />
-    <EditPanel {manager} />
-  {/snippet}
-  {#snippet footer()}
-    <Button manager={manager?.finish_button_manager} />
-  {/snippet}
-</Popover>