@trdrs/quickcharts 5.1.1 → 5.3.0

package/CHANGELOG.md

@@ -2,6 +2,26 @@
 
 ## Unreleased
 
+## 5.3.0
+
+The built-in palettes carry a deeper dark end of the grey ramp: the dark chrome and canvas are `#000000`, dialogs and menus `#131313`, the hover fill `#1a1a1a`, the pressed fill `#2b2b2b`, menu rules `#464646` and the quiet edges `#555555`, and the light inks that stood at `#0f0f0f` are `#000000`. The light secondary ink, the ink of search rows, lists and toolbar labels, is `#000000`, and the light tooltip is `#1a1a1a`.
+
+Every dialog rounds its corners on the new `chrome.radiusDialog` role, `12px` in both built-in palettes, the symbol search and the chart settings among them. Menus and panels keep `chrome.radiusLarge`.
+
+A press outside the chart settings dialog closes it as Cancel does, putting back what the session previewed; the dialog still stands over the chart without dimming it.
+
+A switch of theme mode hands the colors a viewer chose that follow the mode (the canvas background, the grid, the watermark and the scale text and lines) back to the new mode's look, and keeps every other leaf the viewer chose. Saved chart content states the mode those colors were chosen in as `settingsMode`, so a chart opened in the other mode takes that mode's look for them; content without it keeps its colors in either mode.
+
+The indicator picker opens on the symbol search's field with no title band. Under the field, a host that declares `IndicatorPickerSource.kinds` gets a row of filters (All, Indicators, then its kinds), and `IndicatorPickerItem.kind` places a row in one. The rail is a 230px column of sections, Favorites under Personal and the shipped definitions as Technicals under Built-in, each collection a 40px row with a 28px mark. The list's headings scroll with its 32px rows of star, name, author, count and actions; the shipped catalog shows the star, the name and the actions, a row adds without a plus of its own, and an unstarred row shows its star under the pointer. The catalog gains `picker.technicals`, `picker.kindFilter`, `picker.allKinds` and `picker.indicators` in every built-in language.
+
+## 5.2.0
+
+The chart's right-click menu ends on Settings…, which opens the chart settings dialog, wherever the chart draws its settings door in the top bar.
+
+The symbol search and compare dialogs open on their field with no title band, in a box rounded 20px. Every row is one 56px layout in each mode: a 36px mark, the ticker at 16px over its description at 12px with the market's kind as a small tag after it, and the source as a 24px mark at the row's end that names it in its tooltip. The pointer and the keyboard's row wear one rounded plate.
+
+`SymbolRow.ticker` is the ticker a viewer reads a row's market by, where the feed writes one apart from its symbol; `symbolNames` and the search rows read it, and a row without it reads the symbol's own ticker.
+
 ## 5.1.1
 
 Range presets reconcile overlapping history pages with streamed bars and preserve a newer navigation while a page is pending.

package/README.md

@@ -337,6 +337,16 @@ symbolNames({ symbol: 'NASDAQ:AAPL', name: 'Apple Inc', exchange: 'NASDAQ', type
 symbolNames('HYPERLIQUID:ETH').mark // 'ETH', before the symbol resolves
 ```
 
+One exchange prefix comes off a symbol on its own. Where your feed writes a symbol that says more,
+give the row the `ticker` a viewer reads it by, as `SymbolInfo.ticker` states it for the charted
+symbol; the row keeps its `symbol` as the market's identity:
+
+```ts
+import { symbolNames } from '@trdrs/quickcharts'
+
+symbolNames({ symbol: 'EXCH:BOOK:NVDA', ticker: 'NVDA', name: 'NVIDIA Corp', exchange: 'EXCH', type: 'stock' }).mark // 'NVDA'
+```
+
 `@trdrs/quickcharts/symbols` carries the same rule on its own, `symbolNames` and `bareTicker`, with
 nothing that names a window, a document or a DOM type, so a view of your own with no DOM, a native
 search list among them, names a market exactly as the chart does. `bareTicker` is the ticker inside
@@ -1595,13 +1605,18 @@ part in each through `contributeCapture` (see Extensions).
 The Indicators button and `commands.execute('chart.indicators.open')` open the same picker.
 Pass `{ collection: 'saved' }` as the command argument to open a declared host collection directly.
 An unknown collection falls back to the shipped catalog. Reopening an already open picker keeps its current selection and query.
-It lists the 23 shipped definitions, with search and Favorites. Add creates a new instance on the
-currently active chart and keeps the picker open. Favorites use your `ChartStorage` port.
+The picker opens on the same search field as the symbol search. Beside its list stands a rail of
+collections: Favorites under Personal, and the 23 shipped definitions as Technicals under Built-in.
+Pressing a definition's row adds a new instance to the currently active chart and keeps the picker
+open. Favorites use your `ChartStorage` port. The list reads as a table of each row's star, name,
+author, favorite count and actions; the shipped catalog shows the star, the name and the actions.
+Escape and a press outside the box close the picker.
 
 Supply `ChartWidgetOptions.indicatorPicker` to include additional localized collections and rows
 in that picker. You supply data and opaque actions, not DOM, indicator definitions, or a renderer.
 Built-in annotations can add favorite state, counts and actions; they cannot replace a definition,
-its name, or Add. Without a source, the picker has only shipped built-ins and Favorites.
+its name, or Add, and their counts show wherever the list is a table (Favorites, and your table
+collections). Without a source, the picker has only shipped built-ins and Favorites.
 
 ```ts
 import type { IndicatorPickerSource } from '@trdrs/quickcharts'
@@ -1633,9 +1648,36 @@ service limits; the picker lists what it answers.
 Collection ids `builtin` and `favorites`, and action ids `add` and `favorite`, are reserved.
 Item ids cannot collide with shipped definition ids or these reserved ids. Duplicate ids,
 malformed rows and missing primary actions refuse the response; the shipped catalog remains usable.
-An item has up to two actions; a built-in annotation has at most one beside Add. Collections can
-name a localized navigation group and use `layout: 'list'` for name/secondary-action rows.
-An absent count stays blank. Omit `favorite` to omit that action on a contributed item.
+An item has up to two actions; a built-in annotation has at most one. Collections can name a
+localized navigation group and use `layout: 'list'` for name/secondary-action rows. The rail lists
+your collections after Favorites, in your order: each run of one group stands under that group's
+heading, a collection without a group stays in the section above it, and a group labelled as the
+chart's own Personal joins Favorites in its section. An absent count stays blank. Omit `favorite`
+to omit that action on a contributed item.
+
+Declare `kinds` when your rows come in kinds beside indicators. The picker then shows a row of
+filters under its field: All, the chart's own Indicators, and each of your kinds in order. An item
+names its kind with `kind`; an item that names none, and every shipped definition, is an
+indicator. The kind id `indicator` is reserved, and an item of a kind you did not declare refuses
+the response.
+
+```ts
+import type { IndicatorPickerSource } from '@trdrs/quickcharts'
+
+const withTemplates: IndicatorPickerSource = {
+  collections: [{ id: 'saved', label: 'Saved', group: 'Personal', layout: 'list' }],
+  kinds: [{ id: 'template', label: 'Templates' }],
+  async list({ collection }) {
+    return {
+      kind: 'ok',
+      items: collection === 'saved'
+        ? [{ id: 'ribbon', title: 'Ribbon', kind: 'template', primaryAction: 'apply', actions: [{ id: 'apply', label: 'Apply' }] }]
+        : [],
+    }
+  },
+  async act() { return { kind: 'ok', close: true } },
+}
+```
 
 A favorite action receives the requested next boolean. Successful actions refresh the current
 collection unless they return `close: true`. Refusals and exceptions keep the picker open with
@@ -2123,20 +2165,21 @@ among the others `THEME_ROLES` lists:
 
 | Role | Light | Dark | What it paints |
 |---|---|---|---|
-| `overlay.surface` | `#ffffff` | `#1f1f1f` | The ground of a dialog, menu or popover. |
-| `overlay.separator` | `#ebebeb` | `#4a4a4a` | The rule under a dialog header and over its footer, and between menu groups. |
+| `overlay.surface` | `#ffffff` | `#131313` | The ground of a dialog, menu or popover. |
+| `chrome.radiusDialog` | `12px` | `12px` | The corners of a dialog. A menu or panel rounds on `chrome.radiusLarge`, `6px`. |
+| `overlay.separator` | `#ebebeb` | `#464646` | The rule under a dialog header and over its footer, and between menu groups. |
 | `overlay.scrim` | `rgba(156, 156, 156, 0.5)` | `rgba(0, 0, 0, 0.5)` | The veil behind a modal dialog. |
-| `text.primary` | `#0f0f0f` | `#dbdbdb` | The ink of rows, labels and values. |
+| `text.primary` | `#000000` | `#dbdbdb` | The ink of rows, labels and values. |
 | `text.muted` | `#6a6a6a` | `#9b9b9b` | A section title, a hint, a placeholder. |
 | `chrome.caret` | `#707070` | `#8c8c8c` | The chevron of a select and the arrow that opens a flyout. |
 | `text.link` | `#2962ff` | `#5b9cf6` | A text link. |
-| `state.hover` | `#f2f2f2` | `#2e2e2e` | The fill under the pointer. |
-| `state.pressed` | `#ebebeb` | `#3d3d3d` | The fill while the pointer is down. |
-| `control.outline` | `#2e2e2e` | `#ffffff` | The edge and the words of an outlined button at rest, such as a dialog's Cancel. |
+| `state.hover` | `#f2f2f2` | `#1a1a1a` | The fill under the pointer. |
+| `state.pressed` | `#ebebeb` | `#2b2b2b` | The fill while the pointer is down. |
+| `control.outline` | `#1a1a1a` | `#ffffff` | The edge and the words of an outlined button at rest, such as a dialog's Cancel. |
 | `control.onInk` | `#ffffff` | `#000000` | A mark cut from the emphasis fill: a chosen thickness, line style or line end. |
-| `control.neutral` | `#f2f2f2` | `#2e2e2e` | The quiet fill: a dialog's shortcut chip, the band over a calendar's columns, a chosen month or year. |
-| `control.neutralHover` | `#ebebeb` | `#3d3d3d` | The quiet fill under the pointer. |
-| `control.neutralPressed` | `#dbdbdb` | `#4a4a4a` | The quiet fill while the pointer is down. |
+| `control.neutral` | `#f2f2f2` | `#1a1a1a` | The quiet fill: a dialog's shortcut chip, the band over a calendar's columns, a chosen month or year. |
+| `control.neutralHover` | `#ebebeb` | `#2b2b2b` | The quiet fill under the pointer. |
+| `control.neutralPressed` | `#dbdbdb` | `#464646` | The quiet fill while the pointer is down. |
 | `control.neutralInk` | `#000000` | `#ffffff` | The words on the quiet fill, and what a quiet control's words and mark brighten to under the pointer, such as a calendar's day. |
 | `status.positive` | `#078671` | `#089981` | A gain or a success. |
 | `status.negative` | `#df323f` | `#f34452` | A loss or a failure. |
@@ -2158,11 +2201,11 @@ is one box: 34px tall, a 1px edge with an 8px corner around a clear ground, and
 
 | Role | Light | Dark | What it paints |
 |---|---|---|---|
-| `control.fieldEdge` | `#dbdbdb` | `#575757` | The edge of a field at rest. |
+| `control.fieldEdge` | `#dbdbdb` | `#555555` | The edge of a field at rest. |
 | `control.fieldEdgeHover` | `#a8a8a8` | `#707070` | The edge of a field under the pointer. |
 | `control.selectEdgeHover` | `#a8a8a8` | `#808080` | The edge of a list button under the pointer, such as a select on a drawing's settings page. |
 | `control.fieldInvalid` | `#f23645` | `#f23645` | The edge and the focus ring of a field holding a value it refuses. |
-| `control.fieldFill` | `#f2f2f2` | `#2e2e2e` | The ground of a field that is read-only or disabled. |
+| `control.fieldFill` | `#f2f2f2` | `#1a1a1a` | The ground of a field that is read-only or disabled. |
 
 Focus draws a 2px ring over the edge, the edge itself and the pixel inside it, so the ring follows
 the corner and a dialog that scrolls never clips it. Only a value the chart refuses turns the edge
@@ -2317,6 +2360,11 @@ A saved chart carries the settings a viewer chose and no others, so a chart nobo
 whatever theme the host gives it on the next load, and one whose owner picked candle colors opens in
 those colors on any theme.
 
+The colors whose factory value differs between light and dark (the canvas background, the grid, the
+watermark and the scale text and lines) follow the mode. A switch of mode hands the viewer's choices
+of them back to the new mode's look, and keeps every other leaf. A saved chart states the mode they
+were chosen in (`settingsMode`), so a chart opened in the other mode takes that mode's look for them.
+
 ## Chart settings
 
 `chart.settings()` answers the effective tree; `chart.applySettings(partial)` layers a partial over

package/dist/{ar-TG26ZCCE.js → ar-BBRV6CC4.js}

@@ -1135,7 +1135,11 @@ var picker = {
   "picker.collections": "\u0645\u062C\u0645\u0648\u0639\u0627\u062A \u0627\u0644\u0645\u0624\u0634\u0631\u0627\u062A",
   "picker.personal": "\u0634\u062E\u0635\u064A\u0629",
   "picker.builtin": "\u0645\u0636\u0645\u0651\u0646\u0629",
+  "picker.technicals": "\u0627\u0644\u0645\u0624\u0634\u0631\u0627\u062A \u0627\u0644\u0641\u0646\u064A\u0629",
   "picker.favorites": "\u0627\u0644\u0645\u0641\u0636\u0644\u0629",
+  "picker.kindFilter": "\u0627\u0644\u0646\u0648\u0639",
+  "picker.allKinds": "\u0627\u0644\u0643\u0644",
+  "picker.indicators": "\u0627\u0644\u0645\u0624\u0634\u0631\u0627\u062A",
   "picker.thousands": " K",
   "picker.name": "\u0627\u0644\u0627\u0633\u0645",
   "picker.author": "\u0627\u0644\u0645\u0624\u0644\u0641",
@@ -1319,4 +1323,4 @@ var ar_default = dict;
 export {
   ar_default as default
 };
-//# sourceMappingURL=ar-TG26ZCCE.js.map
+//# sourceMappingURL=ar-BBRV6CC4.js.map