OVERSCANUI KIT
no button at all a worn bezel with weight channels do not converge zero depth instrumented, full of smoke a field of real characters a camera looking out additive, so no shadow hairlines, no new shader no raster, so no scanlines

ov-log

src/ov-log.js

A STILL OF demo/instrument.html

Attributes

attribute
first-out
lines
source

Properties

None that can be set. See the read-only properties below.

READ-ONLY PROPERTIES

cap

Events

None.

Using it

import 'overscan'
import 'overscan/overscan.css'

<ov-log
  id="doc-log"
  lines="5"
  style="inline-size:100%"
>
</ov-log>
<script type="module">
  /* Six lines into a five-line log, pushed once, so the still shows the log's
     own refusal ("1 not kept") rather than a log that happens to fit. Pushed,
     not fed: a finite feed started before the log subscribed would lose lines. */
  const LINES = ['core temp 318.4 K', 'aux bus online', 'calibration overdue',
    'sector 4 pressure 0.914', 'vent cycle complete', 'PRESSURE LOSS / SECTOR 4'];
  customElements.whenDefined('ov-log').then(() => {
    const log = document.getElementById('doc-log');
    for (const line of LINES) log.push(line);
  });
</script>

The CSS is a separate import in every framework. A single element can be imported on its own instead of the whole kit: import 'overscan/src/ov-chart.js'

A reading is set as a PROPERTY, never an attribute. An attribute is a string, so an array cannot survive one and a null arrives as the word "null", which the protocol would read as a value rather than a dropout.

Every ov: event is bound with addEventListener. The colon has no declarative spelling in Svelte 5, where the on: directive is gone and "onov:commit" is not an identifier, nor in JSX. Vue can bind it.

The wrapper applies attributes ITSELF and hands the framework nothing but a ref. All three frameworks set a prop as a property when the name exists on the element, and this kit has 77 getter-only properties across 43 elements. Assigning one throws, and in React it does not degrade: the whole tree fails to render. 13 elements have a getter-only name that is also a real attribute (at, bearing, digits, duration, floor, fov, fresh, hold, lat, lon, period, pitch, range, ring, rings, span, step, sweep, sweeps, traces, value), which are the ones a reader would naturally pass in markup.