@ponchia/ui 0.10.0 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- @layer bronto{.ui-citation,.ui-source-card,.ui-provenance{--src-tone: var(--text-dim)}.ui-src{--src-tone: var(--text-dim);align-items: center;background: var(--panel-soft);border: 1px solid color-mix(in srgb,var(--src-tone) 45%,var(--line));border-radius: var(--radius-pill);color: var(--text-soft);display: inline-flex;font-size: var(--text-2xs);gap: 0.35rem;padding: 0.08rem 0.55rem;vertical-align: baseline}.ui-src::before{background: var(--src-tone);border-radius: 50%;block-size: 0.45rem;content: '';flex: none;inline-size: 0.45rem;print-color-adjust: exact}.ui-src--verified{--src-tone: var(--success)}.ui-src--reviewed{--src-tone: var(--accent)}.ui-src--generated{--src-tone: var(--info)}.ui-src--unverified{--src-tone: var(--text-dim)}.ui-src--stale{--src-tone: var(--warning)}.ui-src--conflict{--src-tone: var(--danger)}.ui-citation{color: var(--accent-text);font-family: var(--mono);font-size: 0.72em;font-weight: 600;text-decoration: none;vertical-align: super}.ui-citation:hover{text-decoration: underline}.ui-citation--chip{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-pill);color: var(--text-soft);display: inline-flex;font-size: var(--text-2xs);gap: 0.35rem;padding: 0.08rem 0.55rem;vertical-align: baseline}.ui-citation--chip::before{background: var(--src-tone);border-radius: 50%;block-size: 0.45rem;content: '';inline-size: 0.45rem;print-color-adjust: exact}.ui-source-list{display: grid;gap: var(--space-sm);list-style: none;margin: 0;min-inline-size: 0;padding: 0}.ui-source-list__item{margin: 0;min-inline-size: 0}.ui-source-card{background: var(--panel-soft);border: 1px solid var(--line);border-inline-start: 2px solid var(--src-tone);border-radius: var(--radius-md);display: grid;gap: 0.3rem;min-inline-size: 0;padding: 0.75rem 0.9rem;print-color-adjust: exact}.ui-source-card:target,.ui-source-card.is-source-active{box-shadow: 0 0 0 3px color-mix(in srgb,var(--src-tone) 22%,transparent);outline: 2px solid var(--src-tone);outline-offset: 2px}.ui-source-card > *{min-inline-size: 0}.ui-source-card__title{color: var(--text);font-size: var(--text-sm);font-weight: 600;margin: 0;overflow-wrap: break-word}.ui-source-card__origin{color: var(--text-soft);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);overflow-wrap: anywhere}.ui-source-card__time{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);overflow-wrap: anywhere}.ui-source-card__excerpt{color: var(--text-soft);margin: 0;overflow-wrap: anywhere}.ui-source-card__actions{display: flex;flex-wrap: wrap;gap: 0.5rem;margin-block-start: 0.2rem}.ui-provenance{align-items: center;color: var(--text-dim);display: inline-flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.3rem 0.75rem;letter-spacing: var(--tracking-wide)}.ui-provenance__item{align-items: center;display: inline-flex;gap: 0.35rem}.ui-provenance__item::before{background: var(--src-tone);border-radius: 50%;block-size: 0.45rem;content: '';inline-size: 0.45rem;print-color-adjust: exact}@media (forced-colors: active){.ui-citation--chip::before,.ui-provenance__item::before,.ui-src::before{background: CanvasText}.ui-source-card{border-inline-start-color: CanvasText}}@media print{.ui-prose .ui-citation[href]::after,.ui-citation[href]::after{content: none}.ui-source-card,.ui-source-list__item{break-inside: avoid}}}
1
+ @layer bronto{.ui-citation,.ui-source-card,.ui-provenance{--src-tone: var(--text-dim)}.ui-src{--src-tone: var(--text-dim);align-items: center;background: var(--panel-soft);border: 1px solid color-mix(in srgb,var(--src-tone) 45%,var(--line));border-radius: var(--radius-pill);color: var(--text-soft);display: inline-flex;font-size: var(--text-2xs);gap: 0.35rem;padding: 0.08rem 0.55rem;vertical-align: baseline}.ui-src::before{background: var(--src-tone);border-radius: 50%;block-size: 0.45rem;content: '';flex: none;inline-size: 0.45rem;print-color-adjust: exact}.ui-src--verified{--src-tone: var(--success)}.ui-src--reviewed{--src-tone: var(--accent)}.ui-src--generated{--src-tone: var(--info)}.ui-src--unverified{--src-tone: var(--text-dim)}.ui-src--stale{--src-tone: var(--warning)}.ui-src--conflict{--src-tone: var(--danger)}.ui-citation{color: var(--accent-text);font-family: var(--mono);font-size: max(0.72em,var(--text-2xs));font-weight: 600;text-decoration: none;vertical-align: super}.ui-citation:hover{text-decoration: underline}.ui-citation--chip{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-pill);color: var(--text-soft);display: inline-flex;font-size: var(--text-2xs);gap: 0.35rem;padding: 0.08rem 0.55rem;vertical-align: baseline}.ui-citation--chip::before{background: var(--src-tone);border-radius: 50%;block-size: 0.45rem;content: '';inline-size: 0.45rem;print-color-adjust: exact}.ui-source-list{display: grid;gap: var(--space-sm);list-style: none;margin: 0;min-inline-size: 0;padding: 0}.ui-source-list__item{margin: 0;min-inline-size: 0}.ui-source-card{background: var(--panel-soft);border: 1px solid var(--line);border-inline-start: 2px solid var(--src-tone);border-radius: var(--radius-md);display: grid;gap: 0.3rem;min-inline-size: 0;padding: 0.75rem 0.9rem;print-color-adjust: exact}.ui-source-card:target,.ui-source-card.is-source-active{box-shadow: 0 0 0 3px color-mix(in srgb,var(--src-tone) 22%,transparent);outline: 2px solid var(--src-tone);outline-offset: 2px}.ui-source-card > *{min-inline-size: 0}.ui-source-card__title{color: var(--text);font-size: var(--text-sm);font-weight: 600;margin: 0;overflow-wrap: break-word}.ui-source-card__origin{color: var(--text-soft);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);overflow-wrap: anywhere}.ui-source-card__time{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);overflow-wrap: anywhere}.ui-source-card__excerpt{color: var(--text-soft);margin: 0;overflow-wrap: anywhere}.ui-source-card__actions{display: flex;flex-wrap: wrap;gap: 0.5rem;margin-block-start: 0.2rem}.ui-provenance{align-items: center;color: var(--text-dim);display: inline-flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.3rem 0.75rem;letter-spacing: var(--tracking-wide)}.ui-provenance__item{align-items: center;display: inline-flex;gap: 0.35rem}.ui-provenance__item::before{background: var(--src-tone);border-radius: 50%;block-size: 0.45rem;content: '';inline-size: 0.45rem;print-color-adjust: exact}@media (forced-colors: active){.ui-citation--chip::before,.ui-provenance__item::before,.ui-src::before{background: CanvasText}.ui-source-card{border-inline-start-color: CanvasText}}@media print{.ui-prose .ui-citation[href]::after,.ui-citation[href]::after{content: none}.ui-source-card,.ui-source-list__item{break-inside: avoid}}}
@@ -22,6 +22,11 @@ states; do not present missing observations as success.
22
22
 
23
23
  The complete specimen is [service.html](https://ponchia.github.io/bronto-ui/demo/service.html). On a phone,
24
24
  navigation wraps and the compact metrics leave room for the work queue.
25
+ The specimen owns deterministic loading, empty, error and stale scenarios,
26
+ search/environment filtering and a local sample-job dialog. Unknown observations
27
+ hide operational health claims; stale ones stay visibly qualified. Use Sync to
28
+ recover. These behaviors are sample host logic, not package state management.
29
+
25
30
  Check the main action, every navigation destination, and a long account name
26
31
  at 360px and with a coarse pointer. A data table may scroll in its own region.
27
32
 
@@ -69,8 +74,8 @@ Use the core stylesheet plus `report-kit.css` for a standalone HTML report.
69
74
  Use real asset URLs in HTML; package specifiers resolve only in build tools.
70
75
 
71
76
  ```html
72
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/bronto.css" />
73
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/report-kit.css" />
77
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/bronto.css" />
78
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/css/report-kit.css" />
74
79
  <article class="ui-report">
75
80
  <header class="ui-report__cover ui-report__cover--compact">
76
81
  <h1 class="ui-report__title">Keep the current configuration</h1>
@@ -108,3 +113,19 @@ look technical.
108
113
  Use one dominant action per local task. Separate navigation, action, severity,
109
114
  and evidence status semantically even when they share a color family. Test
110
115
  light and dark together, and keep keyboard focus and reduced motion visible.
116
+
117
+ ## Embedded evidence
118
+
119
+ Constrain the figure, decision grid or action list inside a wide page. Each
120
+ uses its own available width. A two-up comparison wraps intrinsically even
121
+ outside `ui-report`. Keep value columns readable and source links reachable;
122
+ page overflow is an incomplete test. The container regression suite checks
123
+ 280/320/480px parents and a wide layout.
124
+
125
+ Review long action status, legend names and citation markers. Keep chart
126
+ annotations in their `viewBox` or supply an equivalent narrow fallback. Print
127
+ uses document flow instead of size containment.
128
+
129
+ For an existing application, review explicit typography overrides with the
130
+ [0.11 migration recipe](migrations/0.10-to-0.11.md). A dependency pin does not
131
+ remove consumer CSS that overrides the shared layer.
@@ -0,0 +1,64 @@
1
+ # Discussions
2
+
3
+ Use the opt-in discussion leaf for readable thread lists, messages, quotations,
4
+ and composers in a host application:
5
+
6
+ ```css
7
+ @import '@ponchia/ui';
8
+ @import '@ponchia/ui/css/discussion.css';
9
+ ```
10
+
11
+ BrontoUI supplies the visual structure. The host owns storage, identity,
12
+ thread resolution, text anchoring, unread state, and posting behavior. This leaf
13
+ adds no JavaScript or editor dependency.
14
+
15
+ ## Thread structure
16
+
17
+ ```html
18
+ <section class="ui-discussion" aria-labelledby="thread-title">
19
+ <header class="ui-discussion__header">
20
+ <div>
21
+ <h2 id="thread-title">Discussion</h2>
22
+ <p>Release notes</p>
23
+ </div>
24
+ </header>
25
+ <p class="ui-discussion__state">Open · passage attached</p>
26
+ <blockquote class="ui-discussion__quote">The selected passage.</blockquote>
27
+ <ol class="ui-discussion__messages">
28
+ <li class="ui-discussion__message">
29
+ <p class="ui-discussion__meta"><strong>Reviewer</strong> · today</p>
30
+ <p>Can we clarify this sentence?</p>
31
+ </li>
32
+ </ol>
33
+ <form class="ui-discussion__composer">
34
+ <label for="reply">Reply</label>
35
+ <textarea id="reply" name="reply" rows="4"></textarea>
36
+ <div class="ui-discussion__actions">
37
+ <button class="ui-button" type="submit">Post reply</button>
38
+ </div>
39
+ </form>
40
+ </section>
41
+ ```
42
+
43
+ Wire the form to the host's posting mechanism. Keep the draft when posting
44
+ fails, disable duplicate submissions while a request is pending, and announce
45
+ success only after confirmation. Use native buttons for actions and real links
46
+ for navigation. A modal host must supply focus management and focus return.
47
+
48
+ ## Reading and recovery
49
+
50
+ The styles use sentence case and sans-serif prose, wrap long text, and allow
51
+ action rows to wrap in narrow panels. Keep secondary actions visually quiet
52
+ with `ui-button--ghost`; posting is normally the primary action. The quote
53
+ should remain visible when its anchor disappears, with a clear status and a
54
+ host-owned way to choose a new target. Anchor status and thread resolution
55
+ answer different questions and should be labelled separately.
56
+
57
+ `ui-discussion__list` and `ui-discussion__item` style a host-owned thread index.
58
+ Keep the list bounded and offer more results explicitly. If a canvas uses pins,
59
+ provide the same discussions in a keyboard-accessible list. Pins, positions,
60
+ and annotation geometry are outside this CSS leaf.
61
+
62
+ The [discussion specimen](https://ponchia.github.io/bronto-ui/demo/discussion.html) includes a narrow-container
63
+ example and a local reply/resolve demonstration. Its state lasts only until
64
+ the page reloads.
package/docs/figure.md CHANGED
@@ -61,7 +61,7 @@ when the same stage appears in a dashboard, doc page, or generated artifact.
61
61
  | --- | --- | --- |
62
62
  | `--figure-max-inline` | `.ui-figure__stage` | Maximum stage width, default `42rem`. |
63
63
  | `--figure-min-block` | `.ui-figure__stage` | Reserved stage height for late-rendered media. |
64
- | `--figure-key-width` | `.ui-figure__body--key-right` | Right key column width before mobile collapse. |
64
+ | `--figure-key-width` | `.ui-figure__body--key-right` | Right key column width before the figure container stacks. |
65
65
 
66
66
  ## Boundary
67
67
 
@@ -76,3 +76,12 @@ when the same stage appears in a dashboard, doc page, or generated artifact.
76
76
 
77
77
  - [Usage](usage.md#static-reports) shows report figure composition.
78
78
  - [Reference](reference.md) lists the generated figure and report classes.
79
+
80
+ ## Narrow containers
81
+
82
+ The figure establishes the named `bronto-figure` inline-size container. Its
83
+ right-hand key stacks below 44rem of figure width, even in a wide browser.
84
+ Print disables size containment and uses document flow. Keep annotation text
85
+ and strokes within the authored `viewBox`; container layout does not reposition
86
+ chart geometry. Verify a 280px parent with long legend names and a fallback
87
+ table, not just a narrow viewport.
@@ -0,0 +1,61 @@
1
+ # Upgrade from 0.10 to 0.11
2
+
3
+ 0.11 completes the readable composition direction. The structured visual
4
+ changes are in [`MIGRATIONS.json`](../../MIGRATIONS.json). JavaScript exports,
5
+ classes, and tokens remain available. If you are coming from 0.9, apply the
6
+ [0.10 migration](0.9-to-0.10.md) first, including the retired adapters/modal.
7
+
8
+ ## Review reusable layouts
9
+
10
+ Figures use their own inline-size container to stack a right-hand key below
11
+ 44rem. Decision grids and action lists stack their rows below 32rem of their
12
+ own width, including inside an otherwise wide report. Keep the documented
13
+ `ui-report__decision-grid` and `ui-report__actions` wrappers. Two-up comparisons
14
+ need no wrapper: they keep at most two columns, with a 16rem reading floor.
15
+
16
+ Test a 280px and 320px parent inside a 1440px browser. Check that charts have
17
+ useful drawing width, text columns remain readable, long labels wrap and all
18
+ sources are reachable. Zero page overflow alone does not prove those things.
19
+ Keep authored SVG labels and annotations inside the drawing's `viewBox`, or
20
+ provide a narrow fallback with the same information. Bronto does not own chart
21
+ geometry. Named size containment is disabled in print; review your PDF too.
22
+
23
+ ## Review typography overrides by role
24
+
25
+ Figure captions, legends, generated labels and command groups use sans and
26
+ sentence case. Technical log bodies and identifiers keep mono. Inline citation
27
+ markers have a 12px floor at a default 16px root. Do not globally replace `Doto`:
28
+ keep intentional hero/display and readout roles.
29
+
30
+ 1. Find explicit `font-family: var(--display)` and `var(--dot-font)` declarations
31
+ in your loaded consumer styles, plus old root-size and control-height rules.
32
+ 2. Classify each use: display identity, numeric readout, heading, instruction,
33
+ control label or metadata. Check grouped selectors individually.
34
+ 3. Remove overrides that recreate old generic styles. Use `var(--sans)` for
35
+ local explanatory headings and labels; keep intentional display roles.
36
+ 4. Inspect complete tasks, not just the homepage. Include setup, result,
37
+ filtering, error/retry, source details and an empty state where applicable.
38
+ 5. Compare long names and translated text at narrow, laptop, and desktop widths,
39
+ in both themes, with keyboard and touch input.
40
+
41
+ Consumer CSS outside a layer takes precedence over the package's `bronto` layer.
42
+ Updating the package alone cannot change those explicit overrides. A prepared
43
+ patch from an older application revision must be reintegrated and checked
44
+ against current source before it can count as migration evidence.
45
+
46
+ ## Verify the package and consumer together
47
+
48
+ Install the packed candidate into an isolated consumer checkout before changing
49
+ production pins. Record the exact package version, consumer revision and screens
50
+ checked. Update the dependency and registry lock file together after publication;
51
+ do not commit a task-local tarball path into a production lock file.
52
+
53
+ Use the [composition guide](../compositions.md) for the service's local state
54
+ scenarios, container boundaries and report reading/print checks. Existing package
55
+ checks remain necessary; real consumer tasks provide additional evidence.
56
+
57
+ ## Optional discussion UI
58
+
59
+ Import `@ponchia/ui/css/discussion.css` for thread lists, quotations, messages,
60
+ and composers. The new `ui-discussion` vocabulary is additive. It carries no
61
+ posting behavior, storage, or editor dependency; see [Discussions](../discussion.md).
@@ -222,6 +222,10 @@ semantic versioning contract for the surfaces listed here.
222
222
  | `./docs/adr/0005-productive-tools-and-editorial-reports.md` | `./docs/adr/0005-productive-tools-and-editorial-reports.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
223
223
  | `./docs/migrations/0.9-to-0.10.md` | `./docs/migrations/0.9-to-0.10.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
224
224
  | `./docs/adr/0006-trusted-publishing.md` | `./docs/adr/0006-trusted-publishing.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
225
+ | `./docs/migrations/0.10-to-0.11.md` | `./docs/migrations/0.10-to-0.11.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
226
+ | `./css/discussion.css` | `./dist/css/discussion.css` | Opt-in layered CSS leaf | Stable additive | Generated layered direct-import leaf. Opt-in and not included in dist/bronto.css. |
227
+ | `./css/unlayered/discussion.css` | `./css/discussion.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
228
+ | `./docs/discussion.md` | `./docs/discussion.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
225
229
 
226
230
  ## Shipped Files Allowlist
227
231
 
@@ -264,6 +268,7 @@ always includes `package.json`, `README.md`, `LICENSE`, and
264
268
  | `docs/vega.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
265
269
  | `docs/figure.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
266
270
  | `docs/annotations.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
271
+ | `docs/discussion.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
267
272
  | `docs/legends.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
268
273
  | `docs/marks.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
269
274
  | `docs/connectors.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
@@ -304,6 +309,7 @@ always includes `package.json`, `README.md`, `LICENSE`, and
304
309
  | `docs/adr/0005-productive-tools-and-editorial-reports.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
305
310
  | `docs/migrations/0.9-to-0.10.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
306
311
  | `docs/adr/0006-trusted-publishing.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
312
+ | `docs/migrations/0.10-to-0.11.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
307
313
 
308
314
  ## Artifact Provenance
309
315
 
@@ -316,7 +322,7 @@ result. The listed gates are part of `npm run check`.
316
322
  | Package manifest | `package.json` | docs/package-contract.md | `npm run package-contract:build` | check:fresh; check:exports; check:pack; check:consumer-surface; check:consumer-types; check:publint; check:attw | The complete export/file matrix in this document is generated from the manifest; packed tarball imports, concrete file resolution, and package-level type resolution are smoke-tested in clean consumers. |
317
323
  | Token model | `tokens/index.js` | css/tokens.css; tokens/index.json; tokens/tokens.dtcg.json; tokens/resolved.json; tokens/figma.variables.json; tokens/index.d.ts | `npm run tokens:css:build; tokens:build; dtcg:build; resolved:build; figma:variables:build; dts:build` | check:fresh; check:contrast | Token names/roles are public. Resolved and Figma handoff values are visual tuning before 1.0. |
318
324
  | Class registry | `classes/index.js plus css/*.css selectors` | classes/classes.json; classes/index.d.ts; classes/vscode.css-custom-data.json; docs/reference.md | `npm run classes:json:build; dts:build; vscode:build; reference:build` | check:fresh; check:classes; check:contract | The typed registry, JSON vocabulary, and generated reference stay aligned with real selectors. |
319
- | Authored CSS graph | `css/core.css plus css/*.css leaves` | dist/bronto.css; dist/css/*.css (47 layered outputs) | `npm run dist:build` | check:dist; check:exports; check:component-matrix | Default bundle and direct layered leaf imports are generated from authored CSS, size-gated, and coverage-owned as foundation or component leaves. |
325
+ | Authored CSS graph | `css/core.css plus css/*.css leaves` | dist/bronto.css; dist/css/*.css (48 layered outputs) | `npm run dist:build` | check:dist; check:exports; check:component-matrix | Default bundle and direct layered leaf imports are generated from authored CSS, size-gated, and coverage-owned as foundation or component leaves. |
320
326
  | JSDoc-authored public JS | `behaviors/; annotations/; connectors/; react/; solid/; qwik/; svelte/; vue/` | adjacent *.d.ts and *.d.ts.map files | `npm run dts:emit` | check:dts-emit; check:types; check:consumer-surface; check:consumer-types; check:behavior-matrix; check:attw; check:publint | Declarations are emitted from the shipped JS, package subpath imports are compiled from a packed clean consumer, and public behavior exports are docs/unit/browser owned. |
321
327
  | Glyph registry | `glyphs/glyphs.js` | glyphs/glyphs.d.ts | `npm run glyphs:build` | check:glyphs; check:unit | Glyph names and render options are public. The registry stays sorted and type-covered. |
322
328
  | Display colorways | `tokens/skins.js` | css/skins.css; tokens/skins.d.ts | `npm run skins:build` | check:skins; check:contrast | Skins are opt-in root-level choices and never part of dist/bronto.css. |
package/docs/reference.md CHANGED
@@ -9,7 +9,7 @@ rendering of every class is the kitchen-sink demo:
9
9
  **<https://ponchia.github.io/bronto-ui/>**. Theming knobs and the token
10
10
  contract: [docs/theming.md](theming.md).
11
11
 
12
- - 683 classes across 186 component groups
12
+ - 695 classes across 187 component groups
13
13
  - Import the typed registry: `import { cls, ui, cx } from '@ponchia/ui/classes'`
14
14
  - Validate markup as data (no JS/TS): `@ponchia/ui/classes.json` — the same
15
15
  vocabulary as language-neutral JSON (`groups`, `classes`, `states`,
@@ -487,6 +487,23 @@ each one matches a real selector in the stylesheet.
487
487
  | `cls.diffRowRemove` | `ui-diff__row--remove` | modifier |
488
488
  | `cls.diffSplit` | `ui-diff--split` | modifier |
489
489
 
490
+ ### `.ui-discussion`
491
+
492
+ | Registry key | Class | Kind |
493
+ | --- | --- | --- |
494
+ | `cls.discussion` | `ui-discussion` | base |
495
+ | `cls.discussionActions` | `ui-discussion__actions` | part |
496
+ | `cls.discussionComposer` | `ui-discussion__composer` | part |
497
+ | `cls.discussionHeader` | `ui-discussion__header` | part |
498
+ | `cls.discussionHint` | `ui-discussion__hint` | part |
499
+ | `cls.discussionItem` | `ui-discussion__item` | part |
500
+ | `cls.discussionList` | `ui-discussion__list` | part |
501
+ | `cls.discussionMessage` | `ui-discussion__message` | part |
502
+ | `cls.discussionMessages` | `ui-discussion__messages` | part |
503
+ | `cls.discussionMeta` | `ui-discussion__meta` | part |
504
+ | `cls.discussionQuote` | `ui-discussion__quote` | part |
505
+ | `cls.discussionState` | `ui-discussion__state` | part |
506
+
490
507
  ### `.ui-display`
491
508
 
492
509
  | Registry key | Class | Kind |
package/docs/reporting.md CHANGED
@@ -60,18 +60,18 @@ No install? Link the same files from a CDN. Pin the version — pre-1.0, breakin
60
60
  changes ship in the minor (see [stability.md](./stability.md)):
61
61
 
62
62
  ```html
63
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/bronto.css" />
64
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/report-kit.css" />
63
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/bronto.css" />
64
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/css/report-kit.css" />
65
65
  ```
66
66
 
67
67
  Leaf-by-leaf CDN imports use the same `dist/css/` paths:
68
68
 
69
69
  ```html
70
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/bronto.css" />
71
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/report.css" />
72
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/dataviz.css" />
73
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/annotations.css" />
74
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/legend.css" />
70
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/bronto.css" />
71
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/css/report.css" />
72
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/css/dataviz.css" />
73
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/css/annotations.css" />
74
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/css/legend.css" />
75
75
  ```
76
76
 
77
77
  The CDN serves the package's own `fonts/` next to the CSS, so font URLs resolve
@@ -885,7 +885,7 @@ or validation runtime.
885
885
 
886
886
  ```json
887
887
  {
888
- "$schema": "https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/schemas/report-claims.v1.schema.json",
888
+ "$schema": "https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/schemas/report-claims.v1.schema.json",
889
889
  "schemaVersion": "bronto-report-claims.v1",
890
890
  "report": { "title": "Decision readiness", "type": "decision" },
891
891
  "claims": [
package/docs/stability.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # Public API stability
2
2
 
3
3
  `@ponchia/ui` is pre-1.0. Breaking changes ship in the minor (`0.x.0`), and
4
- patches are non-breaking. In practical terms: **PATCH releases (`0.10.x`) are
4
+ patches are non-breaking. In practical terms: **PATCH releases (`0.11.x`) are
5
5
  non-breaking bug-fixes and additive changes — safe to upgrade without review;
6
6
  MINOR releases (`0.x.0`) may include breaking changes and consumers should
7
7
  review the CHANGELOG before upgrading.** Pin `~0.x` (tilde) to accept only
@@ -100,6 +100,7 @@ current public-surface matrix and the release policy above still applies.
100
100
  | Report kit roll-up (`css/report-kit.css`) | Stable additive | A convenience `@import` of the complete static-report vocabulary. The set of leaves it bundles may grow additively; each leaf also stays individually exported. Opt-in, not in the default bundle. |
101
101
  | Figure stage (`css/figure.css`, `.ui-figure*`) | Stable additive | Figure class names, overlay/key/fallback-data slots, and report composition hooks are public. Opt-in, not in the default bundle. Bronto owns the figure frame, not chart rendering, scales, or data mapping. |
102
102
  | Annotations (`@ponchia/ui/annotations`, `css/annotations.css`, `.ui-annotation*`) | Stable additive | SVG annotation class names, recipe option names, and helper function names are public. Helper internals and exact path-control heuristics may tune before 1.0. Opt-in, not in the default bundle. Rich placement, renderer, editing, and chart/diagram adapter APIs belong to the sibling `@ponchia/annotations` package; `@ponchia/ui` does not depend on it at runtime or through public declarations. |
103
+ | Discussions (`css/discussion.css`, `.ui-discussion*`) | Stable additive | Thread-list, message, quotation and composer class names are public. Opt-in, not in the default bundle. The host owns posting, persistence, identity, resolution, text anchors and focus management. |
103
104
  | Legends (`css/legend.css`, `.ui-legend*`, `@ponchia/ui/behaviors` `initLegend`) | Stable additive | Legend class names, recipe option names, and the `bronto:legend:toggle` event contract (`aria-pressed="true"` ⇒ shown) are public. Opt-in, not in the default bundle; swatch colours are gated to the `--chart-*` palette. |
104
105
  | Marks (`css/marks.css`, `.ui-mark*`, `.ui-bracket-note*`) | Stable additive | Text-mark and bracket-note class names and recipe option names are public. Opt-in, not in the default bundle. Uses semantic tones only. |
105
106
  | Connectors (`@ponchia/ui/connectors`, `css/connectors.css`, `.ui-connector*`, `initConnectors`) | Stable additive | Connector class names, the `data-bronto-connector` attribute contract, geometry helper function names, and recipe options are public. Helper internals/heuristics may tune before 1.0. Opt-in, not in the default bundle. |
package/llms.txt CHANGED
@@ -45,7 +45,7 @@ the path changes from source `css/` to built `dist/css/`:
45
45
  <!-- installed locally -->
46
46
  <link rel="stylesheet" href="./node_modules/@ponchia/ui/dist/css/<leaf>.css" />
47
47
  <!-- or from a CDN; pin the version (pre-1.0, breaking changes ship in the minor) -->
48
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/<leaf>.css" />
48
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.11.0/dist/css/<leaf>.css" />
49
49
  ```
50
50
 
51
51
  The flattened default bundle is `dist/bronto.css` (bundler shorthand
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "@ponchia/ui",
3
- "version": "0.10.0",
3
+ "version": "0.11.0",
4
4
  "type": "module",
5
- "description": "CSS-first identity and UI layer for services, tools, sites, and reports works in HTML, every framework, and PDF, no component runtime. Shared app shell, forms, tables, workflow chrome, plus opt-in analytical/report primitives. Monochrome with one rationed accent. Zero runtime dependencies.",
5
+ "description": "CSS-first identity and UI layer for services, tools, sites, and reports \u2014 works in HTML, every framework, and PDF, no component runtime. Shared app shell, forms, tables, workflow chrome, plus opt-in analytical/report primitives. Monochrome with one rationed accent. Zero runtime dependencies.",
6
6
  "keywords": [
7
7
  "css",
8
8
  "ui",
@@ -78,6 +78,7 @@
78
78
  "docs/vega.md",
79
79
  "docs/figure.md",
80
80
  "docs/annotations.md",
81
+ "docs/discussion.md",
81
82
  "docs/legends.md",
82
83
  "docs/marks.md",
83
84
  "docs/connectors.md",
@@ -117,7 +118,8 @@
117
118
  "docs/compositions.md",
118
119
  "docs/adr/0005-productive-tools-and-editorial-reports.md",
119
120
  "docs/migrations/0.9-to-0.10.md",
120
- "docs/adr/0006-trusted-publishing.md"
121
+ "docs/adr/0006-trusted-publishing.md",
122
+ "docs/migrations/0.10-to-0.11.md"
121
123
  ],
122
124
  "style": "./dist/bronto.css",
123
125
  "scripts": {
@@ -526,7 +528,11 @@
526
528
  "./docs/compositions.md": "./docs/compositions.md",
527
529
  "./docs/adr/0005-productive-tools-and-editorial-reports.md": "./docs/adr/0005-productive-tools-and-editorial-reports.md",
528
530
  "./docs/migrations/0.9-to-0.10.md": "./docs/migrations/0.9-to-0.10.md",
529
- "./docs/adr/0006-trusted-publishing.md": "./docs/adr/0006-trusted-publishing.md"
531
+ "./docs/adr/0006-trusted-publishing.md": "./docs/adr/0006-trusted-publishing.md",
532
+ "./docs/migrations/0.10-to-0.11.md": "./docs/migrations/0.10-to-0.11.md",
533
+ "./css/discussion.css": "./dist/css/discussion.css",
534
+ "./css/unlayered/discussion.css": "./css/discussion.css",
535
+ "./docs/discussion.md": "./docs/discussion.md"
530
536
  },
531
537
  "overrides": {
532
538
  "adm-zip": "0.6.0",