From af8cf348feb8e6bb4bda4a277b06a0f41ff890d9 Mon Sep 17 00:00:00 2001
From: Josh Kingsley <josh@joshkingsley.me>
Date: Sun, 26 Oct 2025 19:41:01 +0200
Subject: feat(web): show selected subdivisions

---
 web/src/components/toolbar/index.ts | 53 ++++++++++++++++++++++++++++++++++++-
 1 file changed, 52 insertions(+), 1 deletion(-)

(limited to 'web/src/components/toolbar')

diff --git a/web/src/components/toolbar/index.ts b/web/src/components/toolbar/index.ts
index d844a69..e672a48 100644
--- a/web/src/components/toolbar/index.ts
+++ b/web/src/components/toolbar/index.ts
@@ -1,8 +1,59 @@
 import h, { CreateElement } from "../../html";
+import { ActiveCellSelection, RangeSelection } from "../../selection";
+import { RenderedGrid } from "../grid/renderGrid";
 import "./index.css";
 
+function getSelectedSubdivisionsCount(): number | undefined {
+  const selection = window.notive.selection;
+
+  if (!selection) return;
+
+  if (selection instanceof ActiveCellSelection) {
+    return 1;
+  }
+
+  if (!(selection instanceof RangeSelection)) return;
+
+  const grid = window.notive.getGrid(selection.gridId);
+
+  if (!grid) return;
+
+  const selectedCells = selection.getSelectedCells(grid);
+
+  return Math.min(...selectedCells.map((cells) => cells.length));
+}
+
 class NotiveToolbarElement extends HTMLElement {
+  #subdivisionsInputEl: HTMLInputElement = h.input({
+    title: "Subdivisions",
+    placeholder: "-",
+    disabled: true,
+  });
+
   connectedCallback() {
+    this.#render();
+
+    window.addEventListener("ntv:selection-changed", () => {
+      if (window.notive.pendingSelection) {
+        this.#subdivisionsInputEl.disabled = true;
+        this.#subdivisionsInputEl.value = "";
+        return;
+      }
+
+      const subdivisionsCount = getSelectedSubdivisionsCount();
+
+      if (!subdivisionsCount) {
+        this.#subdivisionsInputEl.disabled = true;
+        this.#subdivisionsInputEl.value = "";
+        return;
+      }
+
+      this.#subdivisionsInputEl.disabled = false;
+      this.#subdivisionsInputEl.value = subdivisionsCount.toString();
+    });
+  }
+
+  #render() {
     this.append(
       h.section(
         h.button({ dataset: { variant: "menu" } }, "File"),
@@ -11,7 +62,7 @@ class NotiveToolbarElement extends HTMLElement {
       ),
       h.section(
         h.button({ dataset: { variant: "icon" } }, "-"),
-        h.input({ type: "text", value: "1" }),
+        this.#subdivisionsInputEl,
         h.button({ dataset: { variant: "icon" } }, "+"),
       ),
     );
-- 
cgit v1.2.3