Repository navigation
Releases: tsquare-js/react
Releases · tsquare-js/react
Release list
v0.4.0
- Needs tsquare 0.13.2 or later (it was 0.12.1). Boards get tsquare's renderer fixes from 0.12.3 to 0.13.2.
- A board's image size and its viewer's screen chips are exact on boards with notes: they come from tsquare's
measureBoardLayout, which measures notes as drawn.boardLayout's estimate could be a line or more off for a note that wraps differently than its length suggests, so the image was scaled into a slightly wrong box and the chips zoomed to the wrong place.
v0.3.1
- Works with tsquare 0.13 as well as 0.12 (from 0.12.1). An app that installs tsquare 0.13 now shares one copy with this package instead of getting a second one. Nothing else changed; the tests pass on both 0.12.1 and 0.13.0.
v0.3.0
- The editor and playground are imported from
@tsquare-js/react/editor, their own entry point, because they bundle CodeMirror (about 125 KB compressed): apps that import only@tsquare-js/react(boards, viewer, react-markdown) don't get it. <WireframeEditor>: tsquare's code editor (the playground's): highlighting, autocomplete, problems underlined about 300 ms after typing stops, Enter keeping the indentation, a whole pasted model reply trimmed to its code block, long lines wrapped (continuing 4 spaces past their indentation).value/defaultValue,onChange,onProblems,autocomplete,lineNumbers,lineWrapping,ariaLabel; arefgetsgetText,setText,focusandgoToLine. Built ontsquare/editor(tsquare 0.12), with CodeMirror bundled inside it.<WireframePlayground>: the editor and the viewer side by side on one text, half and half (stacked below 900px, orlayout="row"/"column"). While someone types, the board redraws every 200 ms or so and problems wait; after a pause they're underlined in the editor and counted in a note on the board.- The viewer stops when it unmounts (tsquare's new
destroy()): no listeners, resize watching or board image left behind. - Styles for the editor (its colors from the
--tsquare-*theme; highlighting from--tsquare-syntax-*) and the playground;--tsquare-editor-height,--tsquare-playground-height. - Docs: Editor and Playground pages; the overview's table and Styling cover them.
- Needs tsquare 0.12.1 or later.
v0.2.0
<WireframeViewer>: the board to explore: zoom (buttons, pinch, Ctrl/Cmd + scroll), pan, double-click to fit, and a chip per screen that zooms to it.chipsandzoomControlsturn each part off.<Wireframe expandable>: a button (and selecting the board) opens it full size in the viewer, in a native dialog.onProblems: called with the problems ({ line, message }) when the complete text has some, and with[]once fixed; never mid-stream. WithshowProblems={false}the app handles them, for example by sending them back to the model with tsquare'srepairPrompt. In react-markdown,createTsquareComponents({ onProblems })also gets each block's text.createTsquareComponents(options):expandable,showProblemsandonProblemsfor every board in react-markdown.- Styles:
import "@tsquare-js/react/styles.css". Colors, fonts and corners come from--tsquare-*CSS variables; light and dark follow the page's color scheme or adark/lightclass ordata-theme; every rule is wrapped in:where(), so the app's CSS wins without!important. The components no longer use inline styles, except the board image'smax-width: 100%; height: auto. - The board image is a
data:URL instead of ablob:URL: nothing to release when it goes away. - Docs in
docs/(also on tsquare.dev/docs/react), every example typechecked by the tests, every prop checked to be documented.