From 2b9e3ccf965983551ab2bdbe96988213284c02e6 Mon Sep 17 00:00:00 2001
From: Brent Schroeter <contact@brentsch.com>
Date: Tue, 8 Jul 2025 15:32:49 -0700
Subject: [PATCH] remove old ts modules

---
 components/src/grid-size-context.ts |   5 -
 components/src/lens-controls.ts.bak | 259 ----------------------------
 components/src/my-grid.ts           |  44 -----
 components/src/sel-item.ts          |  28 ---
 4 files changed, 336 deletions(-)
 delete mode 100644 components/src/grid-size-context.ts
 delete mode 100644 components/src/lens-controls.ts.bak
 delete mode 100644 components/src/my-grid.ts
 delete mode 100644 components/src/sel-item.ts

diff --git a/components/src/grid-size-context.ts b/components/src/grid-size-context.ts
deleted file mode 100644
index dda935f..0000000
--- a/components/src/grid-size-context.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { createContext } from "@lit/context";
-
-export const gridSizePxContext = createContext<number>(
-  Symbol("grid-size-px-context"),
-);
diff --git a/components/src/lens-controls.ts.bak b/components/src/lens-controls.ts.bak
deleted file mode 100644
index 8c923b0..0000000
--- a/components/src/lens-controls.ts.bak
+++ /dev/null
@@ -1,259 +0,0 @@
-import { css, html, LitElement } from "lit";
-import { classMap } from "lit/directives/class-map.js";
-import { createRef, ref } from "lit/directives/ref.js";
-import { customElement, property, state } from "lit/decorators.js";
-
-import { type Selection } from "./selections.ts";
-
-export { SelectionFilters } from "./selection-filters.ts";
-
-@customElement("lens-controls")
-export class LensControls extends LitElement {
-  @property({ attribute: true, type: Array })
-  selections: Selection[] = [];
-
-  @state()
-  private _isOpen = false;
-
-  private _controlPanelDialog = createRef<HTMLDivElement>();
-
-  static override styles = css`
-    :host {
-      --shadow: 0 0.5rem 0.5rem #3333;
-      --background: #fff;
-      --border-color: #ccc;
-      --border-radius: 0.5rem;
-    }
-
-    #container-positioner {
-      position: fixed;
-      bottom: 2rem;
-      display: flex;
-      justify-content: center;
-      align-items: flex-end;
-      overflow: visible;
-      width: 100%;
-      height: 0;
-    }
-
-    #container {
-      display: grid;
-      grid-template-columns: max-content max-content;
-      filter: drop-shadow(var(--shadow));
-    }
-
-    #tab-box {
-      height: 2rem;
-      display: flex;
-      align-items: center;
-      list-style-type: none;
-      padding: 0.5rem;
-      margin: 0;
-      border: solid 1px var(--border-color);
-      border-right: none;
-      border-top-left-radius: var(--border-radius);
-      border-bottom-left-radius: var(--border-radius);
-      background: var(--background);
-      grid-row: 2;
-
-      & button {
-        appearance: none;
-        background: none;
-        border: none;
-        font-size: inherit;
-        padding: 0.25rem 0.5rem;
-        border-radius: 0.25rem;
-        font-family: inherit;
-      }
-
-      & button.active {
-        background: #39f3;
-      }
-    }
-
-    #control-bar {
-      height: 3rem;
-      flex-shrink: 0;
-      border: solid 1px var(--border-color);
-      border-top-right-radius: var(--border-radius);
-      border-bottom-right-radius: var(--border-radius);
-      display: flex;
-      justify-content: stretch;
-      align-items: stretch;
-      overflow: hidden;
-      width: 40rem;
-      grid-row: 2;
-
-      & input {
-        appearance: none;
-        width: 100%;
-        border: none;
-        outline: none;
-        font-size: inherit;
-        font-family: "Funnel Sans";
-        padding: 0.5rem;
-      }
-
-      &.open {
-        border-top-right-radius: 0;
-      }
-    }
-
-    #control-panel-positioner {
-      grid-template-columns: subgrid;
-      grid-column: 2;
-      grid-row: 1;
-      position: relative;
-      overflow: visible;
-      /* Flexbox positioning is required for Safari */
-      display: flex;
-      align-items: flex-end;
-      anchor-name: --control-bar;
-    }
-
-    #control-panel-container:popover-open {
-      inset: unset;
-      border: solid 1px var(--border-color);
-      border-bottom: none;
-      border-top-left-radius: var(--border-radius);
-      border-top-right-radius: var(--border-radius);
-      margin: 0;
-      position: fixed;
-      display: block;
-      width: 40rem;
-      /* Anchor positioning is required for Chromium */
-      position-anchor: --control-bar;
-      position-area: top;
-      padding: 0;
-      background: var(--background);
-      box-shadow: var(--shadow);
-      /* Clip drop shadow */
-      clip-path: polygon(
-        -100% -100%,
-        200% -100%,
-        200% 200%,
-        100% 200%,
-        100% 100%,
-        -100% 100%
-      );
-    }
-
-    #control-panel {
-      padding: 1rem;
-      overflow: auto;
-      max-height: 8rem;
-    }
-
-    .selections {
-      display: grid;
-      grid-template-columns: max-content 1fr 1fr;
-    }
-
-    .selection {
-      display: grid;
-      grid-template-columns: subgrid;
-      justify-content: start;
-      align-items: center;
-      grid-gap: 1rem;
-      padding: 0.25rem 0;
-
-      & .visibility {
-        grid-column: 1;
-      }
-
-      & .selection-filters {
-        grid-column: 2;
-      }
-
-      & .conversions {
-        grid-column: 3;
-      }
-    }
-  `;
-
-  open(): void {
-    this._controlPanelDialog.value?.showPopover();
-  }
-
-  private _handleVisibilityInput(ev: InputEvent, selectionId: string): void {
-    this.selections = this.selections.map((
-      selection,
-    ) => (selection.id === selectionId
-      ? {
-        ...selection,
-        visible: (ev.target as HTMLInputElement).checked,
-      }
-      : selection)
-    );
-  }
-
-  private _handleSelectionFiltersChange(ev: Event, selectionId: string): void {
-    // TODO
-  }
-
-  protected override render() {
-    return html`
-      <div id="container-positioner">
-        <div id="container">
-          <ul id="tab-box">
-            <li>
-              <button type="button">Filters</button>
-            </li>
-            <li>
-              <button type="button" class="active">Columns</button>
-            </li>
-          </ul>
-          <div id="control-bar" class="${classMap({ open: this._isOpen })}">
-            <input
-              type="text"
-              id="control-bar-input"
-              placeholder="2 of 2 shown"
-              @click="${this.open}"
-              @keydown="${this.open}"
-            >
-          </div>
-          <div id="control-panel-positioner">
-            <div
-              id="control-panel-container"
-              popover="auto"
-              ${ref(
-        this._controlPanelDialog,
-      )}
-              @toggle="${(ev: ToggleEvent) => {
-        this._isOpen = ev.newState === "open";
-      }}"
-            >
-              <div id="control-panel">
-                <div id="selections">
-                  ${this.selections.map((selection) =>
-        html`
-          <div class="selection">
-            <div class="visibility">
-              <input
-                type="checkbox"
-                ?checked="${selection.visible}"
-                @input="${(ev: InputEvent) =>
-            this._handleVisibilityInput(ev, selection.id)}"
-              >
-            </div>
-            <div class="selection-filters">
-              <selection-filters
-                selection-id="${selection.id}"
-                filters="${JSON.stringify(selection.attr_filters)}"
-                @change="${(ev: Event) =>
-            this._handleSelectionFiltersChange(ev, selection.id)}"
-              ></selection-filters>
-            </div>
-            <div class="conversions"></div>
-          </div>
-        `
-      )}
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
diff --git a/components/src/my-grid.ts b/components/src/my-grid.ts
deleted file mode 100644
index 389f0ba..0000000
--- a/components/src/my-grid.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-import { provide } from "@lit/context";
-import { css, html, LitElement } from "lit";
-import { customElement, property } from "lit/decorators.js";
-
-import { gridSizePxContext } from "./grid-size-context.ts";
-
-@customElement("my-grid")
-export class MyGrid extends LitElement {
-  @provide({ context: gridSizePxContext })
-  @property({ attribute: "grid-size-px", type: Number })
-  gridSizePx = 32;
-
-  @property()
-  gridColor = "#ddd";
-
-  @property()
-  width = "100%";
-
-  @property()
-  height = "100%";
-
-  static override styles = css`
-    :host {
-      display: block;
-      position: relative;
-    }
-  `;
-
-  protected override render() {
-    return html`
-      <style>
-      :host {
-        /* Dotted grid CSS inspired by: https://stackoverflow.com/a/55364821 */
-        background-image: radial-gradient(circle at 1px 1px, ${this
-        .gridColor} 1px, transparent 0);
-        background-size: ${this.gridSizePx}px ${this.gridSizePx}px;
-        height: ${this.height};
-        width: ${this.width};
-      }
-      </style>
-      <slot></slot>
-    `;
-  }
-}
diff --git a/components/src/sel-item.ts b/components/src/sel-item.ts
deleted file mode 100644
index dedfd58..0000000
--- a/components/src/sel-item.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import { html, LitElement } from "lit";
-import { customElement, property } from "lit/decorators.js";
-
-@customElement("sel-item")
-export class SelItem extends LitElement {
-  @property({ attribute: "display-type", type: Object, reflect: true })
-  displayType?: unknown;
-
-  @property({ attribute: true, type: Boolean, reflect: true })
-  visible!: boolean;
-
-  @property({ attribute: true, type: String, reflect: true })
-  label?: string;
-
-  private _handleDelete() {
-    this.dispatchEvent(
-      new Event("sel-item-deleted", { bubbles: true, composed: true }),
-    );
-  }
-
-  protected override render() {
-    return html`
-      <div class="sel-item">
-        <button class="remove" @click="${this._handleDelete}">del</button>
-      </div>
-    `;
-  }
-}