gladly-plot 0.0.4 → 0.0.6

package/src/data/Data.js

@@ -0,0 +1,270 @@
+import { ArrayColumn, TextureColumn } from './ColumnData.js'
+
+function domainsEqual(a, b) {
+  if (a === b) return true
+  if (a == null || b == null) return a === b
+  return a[0] === b[0] && a[1] === b[1]
+}
+
+// Runtime wrapper for a ComputedData instance. Manages live texture references
+// and tracks which axes were accessed so it can recompute when they change.
+export class ComputedDataNode {
+  constructor(computedData, params) {
+    this._computedData = computedData
+    this._params = params
+    this._liveRefs = {}   // { colName: { texture } }
+    this._meta = null
+    this._accessedAxes = new Set()
+    this._cachedDomains = {}
+    this._regl = null
+    this._dataGroup = null
+    this._version = 0
+  }
+
+  columns() {
+    return this._computedData.columns(this._params)
+  }
+
+  getData(col) {
+    const ref = this._liveRefs[col]
+    if (!ref) return null
+    const node = this
+    let lastVersion = this._version
+    return new TextureColumn(ref, {
+      domain: this._meta?.domains?.[col] ?? null,
+      quantityKind: this._meta?.quantityKinds?.[col] ?? null,
+      length: ref.texture ? (ref.texture._dataLength ?? ref.texture.width) : null,
+      shape: this._meta?.shapes?.[col] ?? null,
+      refreshFn: async (plot) => {
+        await node.refreshIfNeeded(plot)
+        if (node._version !== lastVersion) {
+          lastVersion = node._version
+          return true
+        }
+        return false
+      }
+    })
+  }
+
+  getQuantityKind(col) {
+    return this._meta?.quantityKinds?.[col] ?? null
+  }
+
+  getDomain(col) {
+    return this._meta?.domains?.[col] ?? null
+  }
+
+  async _initialize(regl, dataGroup, plot) {
+    this._regl = regl
+    this._dataGroup = dataGroup
+
+    const getAxisDomain = (axisId) => {
+      this._accessedAxes.add(axisId)
+      return plot ? plot.getAxisDomain(axisId) : null
+    }
+
+    const result = await this._computedData.compute(regl, this._params, dataGroup, getAxisDomain)
+    this._meta = result._meta ?? null
+
+    for (const [key, val] of Object.entries(result)) {
+      if (key === '_meta') continue
+      this._liveRefs[key] = { texture: val }
+    }
+
+    for (const axisId of this._accessedAxes) {
+      this._cachedDomains[axisId] = plot ? plot.getAxisDomain(axisId) : null
+    }
+  }
+
+  async refreshIfNeeded(plot) {
+    if (this._accessedAxes.size === 0) return
+
+    let needsRecompute = false
+    for (const axisId of this._accessedAxes) {
+      if (!domainsEqual(plot.getAxisDomain(axisId), this._cachedDomains[axisId])) {
+        needsRecompute = true
+        break
+      }
+    }
+    if (!needsRecompute) return
+
+    const newAccessedAxes = new Set()
+    const newCachedDomains = {}
+    const getAxisDomain = (axisId) => {
+      newAccessedAxes.add(axisId)
+      return plot ? plot.getAxisDomain(axisId) : null
+    }
+
+    const result = await this._computedData.compute(this._regl, this._params, this._dataGroup, getAxisDomain)
+    this._meta = result._meta ?? null
+
+    for (const [key, val] of Object.entries(result)) {
+      if (key === '_meta') continue
+      if (this._liveRefs[key]) {
+        this._liveRefs[key].texture = val
+      } else {
+        this._liveRefs[key] = { texture: val }
+      }
+    }
+
+    this._accessedAxes = newAccessedAxes
+    for (const axisId of newAccessedAxes) {
+      newCachedDomains[axisId] = plot ? plot.getAxisDomain(axisId) : null
+    }
+    this._cachedDomains = newCachedDomains
+    this._version++
+  }
+}
+
+export class DataGroup {
+  constructor(raw) {
+    this._children = {}
+    for (const [key, value] of Object.entries(raw)) {
+      this._children[key] = Data.wrap(value)
+    }
+  }
+
+  listData() {
+    const result = {}
+    for (const [key, child] of Object.entries(this._children)) {
+      if (child instanceof Data) result[key] = child
+    }
+    return result
+  }
+
+  subgroups() {
+    const result = {}
+    for (const [key, child] of Object.entries(this._children)) {
+      if (child instanceof DataGroup) result[key] = child
+    }
+    return result
+  }
+
+  columns() {
+    const cols = []
+    for (const [key, child] of Object.entries(this._children)) {
+      for (const col of child.columns()) {
+        cols.push(`${key}.${col}`)
+      }
+    }
+    return cols
+  }
+
+  _resolve(col) {
+    const dotIdx = col.indexOf('.')
+    if (dotIdx === -1) return null
+    const prefix = col.slice(0, dotIdx)
+    const rest = col.slice(dotIdx + 1)
+    const child = this._children[prefix]
+    if (!child) return null
+    return { child, rest }
+  }
+
+  getData(col) {
+    const r = this._resolve(col)
+    return r ? r.child.getData(r.rest) : undefined
+  }
+
+  getQuantityKind(col) {
+    const r = this._resolve(col)
+    return r ? r.child.getQuantityKind(r.rest) : undefined
+  }
+
+  getDomain(col) {
+    const r = this._resolve(col)
+    return r ? r.child.getDomain(r.rest) : undefined
+  }
+}
+
+export function normalizeData(data) {
+  if (data == null) return null
+  const wrapped = Data.wrap(data)
+  return (wrapped instanceof DataGroup) ? wrapped : new DataGroup({ input: wrapped })
+}
+
+export class Data {
+  constructor(raw) {
+    raw = raw ?? {}
+    if (raw.data != null && typeof raw.data === 'object' && !(raw.data instanceof Float32Array)) {
+      this._columnar = true
+      this._data = raw.data
+      this._quantityKinds = raw.quantity_kinds ?? {}
+      this._rawDomains = raw.domains ?? {}
+    } else {
+      this._columnar = false
+      this._raw = raw
+    }
+  }
+
+  static wrap(data) {
+    if (data != null && typeof data.columns === 'function' && typeof data.getData === 'function') {
+      return data
+    }
+
+    if (data != null && typeof data === 'object') {
+      const isColumnar = data.data != null && typeof data.data === 'object' && !(data.data instanceof Float32Array)
+
+      if (!isColumnar) {
+        const vals = Object.values(data)
+        if (vals.length > 0) {
+          const isRawFormat = vals.every(v =>
+            v instanceof Float32Array ||
+            (v && typeof v === 'object' && v.data instanceof Float32Array)
+          )
+          if (!isRawFormat) {
+            return new DataGroup(data)
+          }
+        }
+      }
+    }
+
+    return new Data(data)
+  }
+
+  _entry(col) {
+    if (this._columnar) {
+      const rawDomain = this._rawDomains[col]
+      let domain
+      if (Array.isArray(rawDomain)) {
+        domain = [rawDomain[0], rawDomain[1]]
+      } else if (rawDomain && typeof rawDomain === 'object') {
+        domain = [rawDomain.min, rawDomain.max]
+      }
+      return { data: this._data[col], quantityKind: this._quantityKinds[col], domain }
+    }
+
+    const v = this._raw[col]
+    if (v instanceof Float32Array) {
+      return { data: v, quantityKind: undefined, domain: undefined }
+    }
+    if (v && typeof v === 'object') {
+      let domain
+      if (Array.isArray(v.domain)) {
+        domain = [v.domain[0], v.domain[1]]
+      } else if (v.domain && typeof v.domain === 'object') {
+        domain = [v.domain.min, v.domain.max]
+      }
+      return { data: v.data, quantityKind: v.quantity_kind, domain }
+    }
+    return { data: undefined, quantityKind: undefined, domain: undefined }
+  }
+
+  columns() {
+    return this._columnar ? Object.keys(this._data) : Object.keys(this._raw)
+  }
+
+  // Returns ArrayColumn (with domain + quantityKind) or null if column not found.
+  getData(col) {
+    const entry = this._entry(col)
+    if (!entry.data) return null
+    return new ArrayColumn(entry.data, { domain: entry.domain ?? null, quantityKind: entry.quantityKind ?? null })
+  }
+
+  getQuantityKind(col) {
+    return this._entry(col).quantityKind
+  }
+
+  getDomain(col) {
+    return this._entry(col).domain
+  }
+}

package/src/{Colorbar.js → floats/Colorbar.js}

@@ -1,6 +1,9 @@
-import { Plot } from "./Plot.js"
-import { linkAxes } from "./AxisLink.js"
-import "./ColorbarLayer.js"
+import { Plot } from "../core/Plot.js"
+import { getScaleTypeFloat } from "../axes/AxisQuantityKindRegistry.js"
+import { linkAxes } from "../axes/AxisLink.js"
+import "../layers/ColorbarLayer.js"
+
+const DRAG_BAR_HEIGHT = 12
 
 const DEFAULT_MARGINS = {
   horizontal: { top: 5, right: 40, bottom: 45, left: 40 },
@@ -34,7 +37,7 @@ export class Colorbar extends Plot {
 
   _getScaleTypeFloat(quantityKind) {
     if (quantityKind === this._colorAxisName && this._targetPlot) {
-      return this._targetPlot._getScaleTypeFloat(quantityKind)
+      return getScaleTypeFloat(quantityKind, this._targetPlot.currentConfig?.axes)
     }
     return super._getScaleTypeFloat(quantityKind)
   }
@@ -50,7 +53,7 @@ export class Colorbar extends Plot {
       }
       const colorscale = this._targetPlot.colorAxisRegistry?.getColorscale(this._colorAxisName)
       if (colorscale) this.colorAxisRegistry.ensureColorAxis(this._colorAxisName, colorscale)
-      const scaleType = this._targetPlot._getScaleTypeFloat(this._colorAxisName) > 0.5 ? "log" : "linear"
+      const scaleType = getScaleTypeFloat(this._colorAxisName, this._targetPlot.currentConfig?.axes) > 0.5 ? "log" : "linear"
       this.axisRegistry.setScaleType(this._spatialAxis, scaleType)
     }
     super.render()
@@ -62,3 +65,14 @@ export class Colorbar extends Plot {
     super.destroy()
   }
 }
+
+// Register the colorbar float factory so Plot._syncFloats can create colorbar floats.
+Plot.registerFloatFactory('colorbar', {
+  factory: (parentPlot, container, opts) =>
+    new Colorbar(container, parentPlot, opts.axisName, { orientation: opts.orientation }),
+  defaultSize: (opts) => {
+    const h = opts.orientation === 'horizontal' ? 70 + DRAG_BAR_HEIGHT : 220 + DRAG_BAR_HEIGHT
+    const w = opts.orientation === 'horizontal' ? 220 : 70
+    return { width: w, height: h }
+  }
+})

package/src/floats/Colorbar2d.js

@@ -0,0 +1,77 @@
+import { Plot } from "../core/Plot.js"
+import { getScaleTypeFloat } from "../axes/AxisQuantityKindRegistry.js"
+import { linkAxes } from "../axes/AxisLink.js"
+import "../layers/ColorbarLayer2d.js"
+
+const DRAG_BAR_HEIGHT = 12
+
+// Margins leave room for tick labels on both spatial axes.
+const DEFAULT_MARGIN = { top: 10, right: 50, bottom: 45, left: 55 }
+
+export class Colorbar2d extends Plot {
+  constructor(container, targetPlot, xAxis, yAxis, { margin } = {}) {
+    super(container, { margin: margin ?? DEFAULT_MARGIN })
+
+    this._targetPlot = targetPlot
+    this._xAxis = xAxis
+    this._yAxis = yAxis
+
+    this.update({
+      data: {},
+      config: {
+        layers: [{ colorbar2d: { xAxis, yAxis } }]
+      }
+    })
+
+    // Link the colorbar's spatial axes to the target's color axes so zoom/pan propagates.
+    this._xLink = linkAxes(this.axes["xaxis_bottom"], targetPlot.axes[xAxis])
+    this._yLink = linkAxes(this.axes["yaxis_left"],   targetPlot.axes[yAxis])
+
+    // Re-render (with sync) whenever the target plot renders.
+    this._syncCallback = () => this.render()
+    targetPlot._renderCallbacks.add(this._syncCallback)
+  }
+
+  _getScaleTypeFloat(quantityKind) {
+    if ((quantityKind === this._xAxis || quantityKind === this._yAxis) && this._targetPlot) {
+      return getScaleTypeFloat(quantityKind, this._targetPlot.currentConfig?.axes)
+    }
+    return super._getScaleTypeFloat(quantityKind)
+  }
+
+  render() {
+    // Sync range, colorscale, and scale type for both color axes from the target plot.
+    if (this.colorAxisRegistry && this.axisRegistry && this._targetPlot) {
+      for (const [colorAxisName, spatialAxisId] of [
+        [this._xAxis, "xaxis_bottom"],
+        [this._yAxis, "yaxis_left"]
+      ]) {
+        const range = this._targetPlot.getAxisDomain(colorAxisName)
+        if (range) {
+          this.setAxisDomain(spatialAxisId, range)
+          this.setAxisDomain(colorAxisName, range)
+        }
+        const colorscale = this._targetPlot.colorAxisRegistry?.getColorscale(colorAxisName)
+        if (colorscale) this.colorAxisRegistry.ensureColorAxis(colorAxisName, colorscale)
+        const scaleType = getScaleTypeFloat(colorAxisName, this._targetPlot.currentConfig?.axes) > 0.5 ? "log" : "linear"
+        this.axisRegistry.setScaleType(spatialAxisId, scaleType)
+      }
+    }
+    super.render()
+  }
+
+  destroy() {
+    this._xLink.unlink()
+    this._yLink.unlink()
+    this._targetPlot._renderCallbacks.delete(this._syncCallback)
+    super.destroy()
+  }
+}
+
+// Register the colorbar2d float factory so Plot._syncFloats can create 2D colorbar floats.
+// Default size is square since both axes carry equal weight.
+Plot.registerFloatFactory('colorbar2d', {
+  factory: (parentPlot, container, opts) =>
+    new Colorbar2d(container, parentPlot, opts.xAxis, opts.yAxis),
+  defaultSize: () => ({ width: 250, height: 250 + DRAG_BAR_HEIGHT })
+})

package/src/{Filterbar.js → floats/Filterbar.js}

@@ -1,6 +1,9 @@
-import { Plot } from "./Plot.js"
-import { linkAxes } from "./AxisLink.js"
-import "./FilterbarLayer.js"
+import { Plot } from "../core/Plot.js"
+import { getScaleTypeFloat } from "../axes/AxisQuantityKindRegistry.js"
+import { linkAxes } from "../axes/AxisLink.js"
+import "../layers/FilterbarLayer.js"
+
+const DRAG_BAR_HEIGHT = 12
 
 const DEFAULT_MARGINS = {
   horizontal: { top: 5, right: 40, bottom: 45, left: 40 },
@@ -124,7 +127,7 @@ export class Filterbar extends Plot {
           if (this._maxInput) this._maxInput.checked = range.max === null
         }
       }
-      const scaleType = this._targetPlot._getScaleTypeFloat(this._filterAxisName) > 0.5 ? "log" : "linear"
+      const scaleType = getScaleTypeFloat(this._filterAxisName, this._targetPlot.currentConfig?.axes) > 0.5 ? "log" : "linear"
       this.axisRegistry.setScaleType(this._spatialAxis, scaleType)
     }
     super.render()
@@ -136,3 +139,14 @@ export class Filterbar extends Plot {
     super.destroy()
   }
 }
+
+// Register the filterbar float factory so Plot._syncFloats can create filterbar floats.
+Plot.registerFloatFactory('filterbar', {
+  factory: (parentPlot, container, opts) =>
+    new Filterbar(container, parentPlot, opts.axisName, { orientation: opts.orientation }),
+  defaultSize: (opts) => {
+    const h = opts.orientation === 'horizontal' ? 70 + DRAG_BAR_HEIGHT : 220 + DRAG_BAR_HEIGHT
+    const w = opts.orientation === 'horizontal' ? 220 : 80
+    return { width: w, height: h }
+  }
+})

package/src/{FilterbarFloat.js → floats/Float.js}

@@ -1,36 +1,24 @@
-import { Filterbar } from "./Filterbar.js"
-import { Plot } from "./Plot.js"
-
 const DRAG_BAR_HEIGHT = 12
 const MIN_WIDTH  = 80
-const MIN_HEIGHT = DRAG_BAR_HEIGHT + 40
-
-const DEFAULT_SIZE = {
-  horizontal: { width: 220, height: 70 + DRAG_BAR_HEIGHT },
-  vertical:   { width: 80,  height: 220 + DRAG_BAR_HEIGHT }
-}
+const MIN_HEIGHT = DRAG_BAR_HEIGHT + 30
 
-export class FilterbarFloat {
-  constructor(parentPlot, filterAxisName, {
-    orientation = "horizontal",
+// Generic draggable, resizable floating container that wraps any Plot-like widget.
+// factory(container) must return an object with a destroy() method.
+export class Float {
+  constructor(parentPlot, factory, {
     x = 10,
-    y = 100,
-    width,
-    height,
-    margin
+    y = 10,
+    width = 220,
+    height = 82
   } = {}) {
-    const defaults = DEFAULT_SIZE[orientation]
-    const w = width  ?? defaults.width
-    const h = height ?? defaults.height
-
     // Outer floating container
     this._el = document.createElement('div')
     Object.assign(this._el.style, {
       position:     'absolute',
       left:         x + 'px',
       top:          y + 'px',
-      width:        w + 'px',
-      height:       h + 'px',
+      width:        width + 'px',
+      height:       height + 'px',
       zIndex:       '10',
       boxSizing:    'border-box',
       background:   'rgba(255,255,255,0.88)',
@@ -40,6 +28,7 @@ export class FilterbarFloat {
       overflow:     'hidden'
     })
 
+    // Ensure parent is positioned so our absolute child is contained within it
     const parentEl = parentPlot.container
     if (getComputedStyle(parentEl).position === 'static') {
       parentEl.style.position = 'relative'
@@ -76,18 +65,18 @@ export class FilterbarFloat {
     })
     this._el.appendChild(this._resizeHandle)
 
-    // Sub-container for the filterbar — sits below the drag bar
-    this._filterbarEl = document.createElement('div')
-    Object.assign(this._filterbarEl.style, {
+    // Content area — sits below the drag bar, fills the rest of the float
+    this._contentEl = document.createElement('div')
+    Object.assign(this._contentEl.style, {
       position: 'absolute',
       top:      DRAG_BAR_HEIGHT + 'px',
       left:     '0',
       right:    '0',
       bottom:   '0'
     })
-    this._el.appendChild(this._filterbarEl)
+    this._el.appendChild(this._contentEl)
 
-    this._filterbar = new Filterbar(this._filterbarEl, parentPlot, filterAxisName, { orientation, margin })
+    this._widget = factory(this._contentEl)
 
     this._setupInteraction()
   }
@@ -139,19 +128,73 @@ export class FilterbarFloat {
     document.addEventListener('mousemove', onMouseMove)
     document.addEventListener('mouseup',   onMouseUp)
 
+    // Touch support
+    const onDragBarTouchStart = (e) => {
+      if (e.touches.length !== 1) return
+      e.preventDefault()
+      const t = e.touches[0]
+      mode      = 'drag'
+      startX    = t.clientX
+      startY    = t.clientY
+      startLeft = parseInt(this._el.style.left, 10)
+      startTop  = parseInt(this._el.style.top,  10)
+      this._dragBar.style.cursor = 'grabbing'
+    }
+
+    const onResizeTouchStart = (e) => {
+      if (e.touches.length !== 1) return
+      e.preventDefault()
+      e.stopPropagation()
+      const t = e.touches[0]
+      mode   = 'resize'
+      startX = t.clientX
+      startY = t.clientY
+      startW = this._el.offsetWidth
+      startH = this._el.offsetHeight
+    }
+
+    const onTouchMove = (e) => {
+      if (!mode || e.touches.length !== 1) return
+      e.preventDefault()
+      const t  = e.touches[0]
+      const dx = t.clientX - startX
+      const dy = t.clientY - startY
+      if (mode === 'drag') {
+        this._el.style.left = (startLeft + dx) + 'px'
+        this._el.style.top  = (startTop  + dy) + 'px'
+      } else {
+        this._el.style.width  = Math.max(MIN_WIDTH,  startW + dx) + 'px'
+        this._el.style.height = Math.max(MIN_HEIGHT, startH + dy) + 'px'
+      }
+    }
+
+    const onTouchEnd = () => {
+      if (mode === 'drag') this._dragBar.style.cursor = 'grab'
+      mode = null
+    }
+
+    this._dragBar.addEventListener('touchstart',     onDragBarTouchStart, { passive: false })
+    this._resizeHandle.addEventListener('touchstart', onResizeTouchStart,  { passive: false })
+    document.addEventListener('touchmove',   onTouchMove, { passive: false })
+    document.addEventListener('touchend',    onTouchEnd)
+    document.addEventListener('touchcancel', onTouchEnd)
+
     this._cleanupInteraction = () => {
       this._dragBar.removeEventListener('mousedown', onDragBarMouseDown)
       this._resizeHandle.removeEventListener('mousedown', onResizeMouseDown)
       document.removeEventListener('mousemove', onMouseMove)
       document.removeEventListener('mouseup',   onMouseUp)
+      this._dragBar.removeEventListener('touchstart',     onDragBarTouchStart)
+      this._resizeHandle.removeEventListener('touchstart', onResizeTouchStart)
+      document.removeEventListener('touchmove',   onTouchMove)
+      document.removeEventListener('touchend',    onTouchEnd)
+      document.removeEventListener('touchcancel', onTouchEnd)
     }
   }
 
   destroy() {
     this._cleanupInteraction()
-    this._filterbar.destroy()
+    this._widget.destroy()
     this._el.remove()
   }
 }
-
-Plot._FilterbarFloatClass = FilterbarFloat

package/src/{EpsgUtils.js → geo/EpsgUtils.js}

@@ -1,6 +1,6 @@
 import proj4 from 'proj4'
 import { byEpsg } from 'projnames'
-import { registerAxisQuantityKind } from './AxisQuantityKindRegistry.js'
+import { registerAxisQuantityKind } from '../axes/AxisQuantityKindRegistry.js'
 
 /**
  * Parse an EPSG CRS string or number to a plain integer code.

package/src/index.js

@@ -1,24 +1,49 @@
-export { LayerType } from "./LayerType.js"
-export { Layer } from "./Layer.js"
-export { Data } from "./Data.js"
-export { AxisRegistry, AXES } from "./AxisRegistry.js"
-export { ColorAxisRegistry } from "./ColorAxisRegistry.js"
-export { FilterAxisRegistry, buildFilterGlsl } from "./FilterAxisRegistry.js"
-export { Plot } from "./Plot.js"
-export { scatterLayerType } from "./ScatterLayer.js"
-export { registerLayerType, getLayerType, getRegisteredLayerTypes } from "./LayerTypeRegistry.js"
-export { registerAxisQuantityKind, getAxisQuantityKind, getRegisteredAxisQuantityKinds } from "./AxisQuantityKindRegistry.js"
-export { registerColorscale, getRegisteredColorscales, getColorscaleIndex, buildColorGlsl } from "./ColorscaleRegistry.js"
-export { Axis } from "./Axis.js"
-export { linkAxes } from "./AxisLink.js"
-export { Colorbar } from "./Colorbar.js"
-export { colorbarLayerType } from "./ColorbarLayer.js"
-export { Float } from "./Float.js"
-export { Filterbar } from "./Filterbar.js"
-export { filterbarLayerType } from "./FilterbarLayer.js"
-export { FilterbarFloat } from "./FilterbarFloat.js"
-export { tileLayerType, TileLayerType } from "./TileLayer.js"
-export { registerEpsgDef, parseCrsCode, crsToQkX, crsToQkY, qkToEpsgCode, reproject } from "./EpsgUtils.js"
+export { LayerType } from "./core/LayerType.js"
+export { Layer } from "./core/Layer.js"
+export { Data, DataGroup } from "./data/Data.js"
+export { AxisRegistry, AXES, AXES_2D, AXIS_GEOMETRY, axisEndpoints, axisPosAtN } from "./axes/AxisRegistry.js"
+export { Camera } from "./axes/Camera.js"
+export { TickLabelAtlas } from "./axes/TickLabelAtlas.js"
+export { ColorAxisRegistry } from "./axes/ColorAxisRegistry.js"
+export { FilterAxisRegistry, buildFilterGlsl } from "./axes/FilterAxisRegistry.js"
+export { Plot } from "./core/Plot.js"
+export { PlotGroup } from "./core/PlotGroup.js"
+export { ComputePipeline, ComputeOutput } from "./core/ComputePipeline.js"
+export { pointsLayerType } from "./layers/PointsLayer.js"
+export { linesLayerType } from "./layers/LinesLayer.js"
+export { registerLayerType, getLayerType, getRegisteredLayerTypes } from "./core/LayerTypeRegistry.js"
+export { registerAxisQuantityKind, getAxisQuantityKind, getRegisteredAxisQuantityKinds } from "./axes/AxisQuantityKindRegistry.js"
+export { registerColorscale, register2DColorscale, getRegisteredColorscales, getRegistered2DColorscales, getColorscaleIndex, get2DColorscaleIndex, buildColorGlsl } from "./colorscales/ColorscaleRegistry.js"
+export { Axis } from "./axes/Axis.js"
+export { linkAxes } from "./axes/AxisLink.js"
+export { Colorbar } from "./floats/Colorbar.js"
+export { colorbarLayerType } from "./layers/ColorbarLayer.js"
+export { Colorbar2d } from "./floats/Colorbar2d.js"
+export { colorbar2dLayerType } from "./layers/ColorbarLayer2d.js"
+export { Float } from "./floats/Float.js"
+export { Filterbar } from "./floats/Filterbar.js"
+export { filterbarLayerType } from "./layers/FilterbarLayer.js"
+export { tileLayerType, TileLayerType } from "./layers/TileLayer.js"
+export { barsLayerType } from "./layers/BarsLayer.js"
+export { registerEpsgDef, parseCrsCode, crsToQkX, crsToQkY, qkToEpsgCode, reproject } from "./geo/EpsgUtils.js"
+export { Computation, TextureComputation, GlslComputation, ComputedData } from "./data/Computation.js"
+export { EXPRESSION_REF, computationSchema, buildTransformSchema, registerTextureComputation, registerGlslComputation, registerComputedData, getComputedData } from "./compute/ComputationRegistry.js"
+export { ComputedDataNode } from "./data/Data.js"
 
 // Register all matplotlib colorscales (side-effect import)
-import "./MatplotlibColorscales.js"
+import "./colorscales/MatplotlibColorscales.js"
+import "./colorscales/BivariateColorscales.js"
+
+// Register all compute texture computations (side-effect imports)
+import "./compute/filter.js"
+import "./compute/kde.js"
+import "./compute/fft.js"
+import "./compute/conv.js"
+import "./compute/hist.js"
+import "./compute/axisFilter.js"
+import "./compute/elementwise.js"
+import "./compute/util.js"
+import "./compute/scatter2dInterpolate.js"
+
+// Register BarsLayer (side-effect import)
+import "./layers/BarsLayer.js"