@capillaryjs/capillary-viz 1.0.0-alpha.1
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.
- package/CHANGELOG.md +147 -0
- package/LICENSE +55 -0
- package/NOTICE +2 -0
- package/README.md +324 -0
- package/dist/block.d.ts +77 -0
- package/dist/block.d.ts.map +1 -0
- package/dist/components/BlockGraph.d.ts +24 -0
- package/dist/components/BlockGraph.d.ts.map +1 -0
- package/dist/components/CategoryHidePanel.d.ts +20 -0
- package/dist/components/CategoryHidePanel.d.ts.map +1 -0
- package/dist/components/CollapsibleOptionGroup.d.ts +18 -0
- package/dist/components/CollapsibleOptionGroup.d.ts.map +1 -0
- package/dist/components/LineGraph.d.ts +46 -0
- package/dist/components/LineGraph.d.ts.map +1 -0
- package/dist/components/SplitSelectionPanel.d.ts +30 -0
- package/dist/components/SplitSelectionPanel.d.ts.map +1 -0
- package/dist/dates.d.ts +7 -0
- package/dist/dates.d.ts.map +1 -0
- package/dist/grouping.d.ts +93 -0
- package/dist/grouping.d.ts.map +1 -0
- package/dist/index.d.ts +12 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +3426 -0
- package/dist/index.js.map +1 -0
- package/dist/lineChart.d.ts +67 -0
- package/dist/lineChart.d.ts.map +1 -0
- package/dist/series.d.ts +31 -0
- package/dist/series.d.ts.map +1 -0
- package/dist/splits.d.ts +43 -0
- package/dist/splits.d.ts.map +1 -0
- package/package.json +76 -0
- package/styles/structural.css +1095 -0
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
# Capillary Viz changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to `@capillaryjs/capillary-viz` are documented
|
|
4
|
+
here. The format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/)
|
|
5
|
+
and Semantic Versioning.
|
|
6
|
+
|
|
7
|
+
## Unreleased
|
|
8
|
+
|
|
9
|
+
## 1.0.0-alpha.1 - 2026-09-14
|
|
10
|
+
|
|
11
|
+
### Changed
|
|
12
|
+
|
|
13
|
+
- Renamed the package from `@sylwellsoftware/fray-visualization` to
|
|
14
|
+
`@capillaryjs/capillary-viz`, including its public Capillary UI integration
|
|
15
|
+
symbols and `cap-*` custom-element/CSS surface. Existing released entries
|
|
16
|
+
below retain their historical names.
|
|
17
|
+
|
|
18
|
+
## 0.12.0 - 2026-09-13
|
|
19
|
+
|
|
20
|
+
### Changed
|
|
21
|
+
|
|
22
|
+
- `CollapsibleOptionGroup` now consumes `OptionGroupHeaderEnd` declarative
|
|
23
|
+
region children, matching Fray's parent-specific content-region contract.
|
|
24
|
+
|
|
25
|
+
- Component chrome text is now non-selectable: `user-select: none` covers
|
|
26
|
+
`BlockGraph`, `LineGraph`, `CategoryHidePanel`, and `SplitSelectionPanel`
|
|
27
|
+
hosts plus the `CollapsibleOptionGroup` collapse toggle.
|
|
28
|
+
|
|
29
|
+
## 0.11.1 - 2026-09-08
|
|
30
|
+
|
|
31
|
+
### Fixed
|
|
32
|
+
|
|
33
|
+
- Corrected category and split-selection panel layout so their option content
|
|
34
|
+
can size and flex correctly.
|
|
35
|
+
|
|
36
|
+
- Published npm packages now include this changelog alongside their release
|
|
37
|
+
history.
|
|
38
|
+
|
|
39
|
+
## 0.11.0 - 2026-09-08
|
|
40
|
+
|
|
41
|
+
### Added
|
|
42
|
+
|
|
43
|
+
- `CollapsibleOptionGroup` component extending `OptionGroup` with an
|
|
44
|
+
expand/collapse toggle button in the legend, supporting an optional
|
|
45
|
+
`collapsed` prop to start collapsed.
|
|
46
|
+
|
|
47
|
+
### Changed
|
|
48
|
+
|
|
49
|
+
- `CategoryHidePanel` now uses `CollapsibleOptionGroup` instead of `OptionGroup`
|
|
50
|
+
for each criterion, giving each criterion group an expand/collapse toggle.
|
|
51
|
+
|
|
52
|
+
## 0.10.0 - 2026-09-08
|
|
53
|
+
|
|
54
|
+
### Changed
|
|
55
|
+
|
|
56
|
+
- `SplitSelectionPanel` now extends `Component` instead of `GroupPanel` and
|
|
57
|
+
renders two inner `GroupPanel` children — one for split presets and one for
|
|
58
|
+
the ordered enablement list — matching the two-panel layout shown in the
|
|
59
|
+
style lab. The `presetsLabel` prop customizes the presets panel header.
|
|
60
|
+
Preset buttons are now stacked vertically (full-width, stretched) instead of
|
|
61
|
+
flex-wrapped. The default `description` is now empty. The host element no
|
|
62
|
+
longer carries `role="group"`; each inner `GroupPanel` provides its own
|
|
63
|
+
labeled group semantics.
|
|
64
|
+
- `CategoryHidePanel` now extends `OptionsPanel` instead of `GroupPanel` and
|
|
65
|
+
renders each criterion as an `OptionGroup` with a `headerEnd` visible-count
|
|
66
|
+
slot, replacing the previous `details`/`summary` disclosure structure.
|
|
67
|
+
- Replaced all explicit `h()` calls in `BlockGraph`, `CategoryHidePanel`,
|
|
68
|
+
`LineGraph`, and `SplitSelectionPanel` with equivalent TSX syntax, using the
|
|
69
|
+
new `FrayHostElementTagNameMap` intrinsic element types from Fray.
|
|
70
|
+
- Reduced the criterion-group gap in `CategoryHidePanel` from `1.5em` to
|
|
71
|
+
`1em` for a denser, more compact panel layout.
|
|
72
|
+
|
|
73
|
+
## 0.9.1 - 2026-09-07
|
|
74
|
+
|
|
75
|
+
### Changed
|
|
76
|
+
|
|
77
|
+
- Expanded the package guide to document every public model, component,
|
|
78
|
+
calculation helper, ownership rule, keyboard interaction, and styling seam.
|
|
79
|
+
- Restored the framework overview's explanation of how the optional
|
|
80
|
+
visualization layer fits the direct Glue-to-Fray application model.
|
|
81
|
+
|
|
82
|
+
## 0.9.0 - 2026-09-07
|
|
83
|
+
|
|
84
|
+
### Changed
|
|
85
|
+
|
|
86
|
+
- Every `BlockGraph` block now opts into Fray's reusable `colored` trait. Its
|
|
87
|
+
model-supplied `--c1`/`--c2`/`--c3` triplet drives the shared gradient, and
|
|
88
|
+
the existing BlockGraph shadow token delegates to the shared colored shadow.
|
|
89
|
+
The former block pseudo-element overlay was removed so it cannot cover that
|
|
90
|
+
shadow. Block labels now keep the criterion and category value on one line
|
|
91
|
+
without imposing a minimum height, and hover emphasis applies only to the
|
|
92
|
+
deepest block beneath the pointer rather than its ancestor blocks.
|
|
93
|
+
- Tightened `SplitSelectionPanel` rows and drag handles while giving each row
|
|
94
|
+
the shared button background treatment.
|
|
95
|
+
- `CategoryHidePanel` and `SplitSelectionPanel` now share Fray's `GroupPanel`
|
|
96
|
+
structure: a bordered control group with a normal chromed Header presented
|
|
97
|
+
vertically at the left. Category criterion summaries remain horizontal.
|
|
98
|
+
|
|
99
|
+
## 0.8.0 - 2026-09-06
|
|
100
|
+
|
|
101
|
+
### Changed
|
|
102
|
+
|
|
103
|
+
- Regenerated structural CSS against Fray's fixed one-hyphen component-host
|
|
104
|
+
contract.
|
|
105
|
+
- `CategoryHidePanel`, `SplitSelectionPanel`, `BlockGraph`, and `LineGraph`
|
|
106
|
+
now render fixed Fray hosts and owned custom parts. Obsolete trait classes,
|
|
107
|
+
structural `data-*` selectors, and redundant visualization diagnostics were
|
|
108
|
+
removed; native/ARIA state and private SVG classes now drive presentation.
|
|
109
|
+
- `BlockGraph` composes Fray's `Button` for its clear action and always renders
|
|
110
|
+
a flat model-supplied `c2` category color; it bakes every category's
|
|
111
|
+
`c1`/`c2`/`c3` triplet and inline base paint into its blocks. Fray themes may
|
|
112
|
+
add ornamental block chrome through explicit BlockGraph tokens. Category
|
|
113
|
+
color triples map in their declared dark, base, light order;
|
|
114
|
+
CategoryHidePanel shows the matching muted-on-hidden gradient swatch. Nested
|
|
115
|
+
child mosaics retain a configurable inset that exposes their parent layer,
|
|
116
|
+
while overlaid labels consume no proportional layout area.
|
|
117
|
+
- `LineGraph` accepts static values as well as readable sources for shapes,
|
|
118
|
+
stacked, smooth, and range inputs.
|
|
119
|
+
- `CategoryHidePanel` retains its natural height inside flex-column owners,
|
|
120
|
+
clips each disclosure to its own bounds, and targets the fixed
|
|
121
|
+
`fray-checkbox` host so open category groups cannot paint over following
|
|
122
|
+
controls under compact Shiny sizing.
|
|
123
|
+
- Enabled strict TypeScript compiler checking.
|
|
124
|
+
|
|
125
|
+
## 0.7.0 - 2026-09-04
|
|
126
|
+
|
|
127
|
+
- No public visualization API changes; version synchronized with the framework
|
|
128
|
+
release.
|
|
129
|
+
|
|
130
|
+
## 0.6.0 - 2026-09-04
|
|
131
|
+
|
|
132
|
+
### Changed
|
|
133
|
+
|
|
134
|
+
- Visualization surfaces participate in the prefix-free Fray theme/color trait
|
|
135
|
+
migration.
|
|
136
|
+
|
|
137
|
+
## 0.5.0 - 2026-09-03
|
|
138
|
+
|
|
139
|
+
### Added
|
|
140
|
+
|
|
141
|
+
- Initial package with reactive static/dynamic grouping criteria, blacklist
|
|
142
|
+
filters, explicit split/block selection models, accessible controls, and
|
|
143
|
+
deterministic cleanup.
|
|
144
|
+
- Strict proportional `BlockGraph` layouts that surface unmatched and
|
|
145
|
+
multiple-match diagnostics.
|
|
146
|
+
- Civil-date `SeriesBuilder` and responsive `LineGraph` line/stacked-area
|
|
147
|
+
rendering with pointer and keyboard readout.
|
package/LICENSE
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
Apache License
|
|
2
|
+
|
|
3
|
+
Version 2.0, January 2004
|
|
4
|
+
|
|
5
|
+
http://www.apache.org/licenses/
|
|
6
|
+
|
|
7
|
+
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
|
8
|
+
|
|
9
|
+
1. Definitions.
|
|
10
|
+
|
|
11
|
+
"License" shall mean the terms and conditions for use, reproduction, and distribution as defined by Sections 1 through 9 of this document.
|
|
12
|
+
|
|
13
|
+
"Licensor" shall mean the copyright owner or entity authorized by the copyright owner that is granting the License.
|
|
14
|
+
|
|
15
|
+
"Legal Entity" shall mean the union of the acting entity and all other entities that control, are controlled by, or are under common control with that entity. For the purposes of this definition, "control" means (i) the power, direct or indirect, to cause the direction or management of such entity, whether by contract or otherwise, or (ii) ownership of fifty percent (50%) or more of the outstanding shares, or (iii) beneficial ownership of such entity.
|
|
16
|
+
|
|
17
|
+
"You" (or "Your") shall mean an individual or Legal Entity exercising permissions granted by this License.
|
|
18
|
+
|
|
19
|
+
"Source" form shall mean the preferred form for making modifications, including but not limited to software source code, documentation source, and configuration files.
|
|
20
|
+
|
|
21
|
+
"Object" form shall mean any form resulting from mechanical transformation or translation of a Source form, including but not limited to compiled object code, generated documentation, and conversions to other media types.
|
|
22
|
+
|
|
23
|
+
"Work" shall mean the work of authorship, whether in Source or Object form, made available under the License, as indicated by a copyright notice that is included in or attached to the work (an example is provided in the Appendix below).
|
|
24
|
+
|
|
25
|
+
"Derivative Works" shall mean any work, whether in Source or Object form, that is based on (or derived from) the Work and for which the editorial revisions, annotations, elaborations, or other modifications represent, as a whole, an original work of authorship. For the purposes of this License, Derivative Works shall not include works that remain separable from, or merely link (or bind by name) to the interfaces of, the Work and Derivative Works thereof.
|
|
26
|
+
|
|
27
|
+
"Contribution" shall mean any work of authorship, including the original version of the Work and any modifications or additions to that Work or Derivative Works thereof, that is intentionally submitted to Licensor for inclusion in the Work by the copyright owner or by an individual or Legal Entity authorized to submit on behalf of the copyright owner. For the purposes of this definition, "submitted" means any form of electronic, verbal, or written communication sent to the Licensor or its representatives, including but not limited to communication on electronic mailing lists, source code control systems, and issue tracking systems that are managed by, or on behalf of, the Licensor for the purpose of discussing and improving the Work, but excluding communication that is conspicuously marked or otherwise designated in writing by the copyright owner as "Not a Contribution."
|
|
28
|
+
|
|
29
|
+
"Contributor" shall mean Licensor and any individual or Legal Entity on behalf of whom a Contribution has been received by Licensor and subsequently incorporated within the Work.
|
|
30
|
+
|
|
31
|
+
2. Grant of Copyright License. Subject to the terms and conditions of this License, each Contributor hereby grants to You a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable copyright license to reproduce, prepare Derivative Works of, publicly display, publicly perform, sublicense, and distribute the Work and such Derivative Works in Source or Object form.
|
|
32
|
+
|
|
33
|
+
3. Grant of Patent License. Subject to the terms and conditions of this License, each Contributor hereby grants to You a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable (except as stated in this section) patent license to make, have made, use, offer to sell, sell, import, and otherwise transfer the Work, where such license applies only to those patent claims licensable by such Contributor that are necessarily infringed by their Contribution(s) alone or by combination of their Contribution(s) with the Work to which such Contribution(s) was submitted. If You institute patent litigation against any entity (including a cross-claim or counterclaim in a lawsuit) alleging that the Work or a Contribution incorporated within the Work constitutes direct or contributory patent infringement, then any patent licenses granted to You under this License for that Work shall terminate as of the date such litigation is filed.
|
|
34
|
+
|
|
35
|
+
4. Redistribution. You may reproduce and distribute copies of the Work or Derivative Works thereof in any medium, with or without modifications, and in Source or Object form, provided that You meet the following conditions:
|
|
36
|
+
|
|
37
|
+
You must give any other recipients of the Work or Derivative Works a copy of this License; and
|
|
38
|
+
|
|
39
|
+
You must cause any modified files to carry prominent notices stating that You changed the files; and
|
|
40
|
+
|
|
41
|
+
You must retain, in the Source form of any Derivative Works that You distribute, all copyright, patent, trademark, and attribution notices from the Source form of the Work, excluding those notices that do not pertain to any part of the Derivative Works; and
|
|
42
|
+
|
|
43
|
+
If the Work includes a "NOTICE" text file as part of its distribution, then any Derivative Works that You distribute must include a readable copy of the attribution notices contained within such NOTICE file, excluding those notices that do not pertain to any part of the Derivative Works, in at least one of the following places: within a NOTICE text file distributed as part of the Derivative Works; within the Source form or documentation, if provided along with the Derivative Works; or, within a display generated by the Derivative Works, if and wherever such third-party notices normally appear. The contents of the NOTICE file are for informational purposes only and do not modify the License. You may add Your own attribution notices within Derivative Works that You distribute, alongside or as an addendum to the NOTICE text from the Work, provided that such additional attribution notices cannot be construed as modifying the License. You may add Your own copyright statement to Your modifications and may provide additional or different license terms and conditions for use, reproduction, or distribution of Your modifications, or for any such Derivative Works as a whole, provided Your use, reproduction, and distribution of the Work otherwise complies with the conditions stated in this License.
|
|
44
|
+
|
|
45
|
+
5. Submission of Contributions. Unless You explicitly state otherwise, any Contribution intentionally submitted for inclusion in the Work by You to the Licensor shall be under the terms and conditions of this License, without any additional terms or conditions. Notwithstanding the above, nothing herein shall supersede or modify the terms of any separate license agreement you may have executed with Licensor regarding such Contributions.
|
|
46
|
+
|
|
47
|
+
6. Trademarks. This License does not grant permission to use the trade names, trademarks, service marks, or product names of the Licensor, except as required for reasonable and customary use in describing the origin of the Work and reproducing the content of the NOTICE file.
|
|
48
|
+
|
|
49
|
+
7. Disclaimer of Warranty. Unless required by applicable law or agreed to in writing, Licensor provides the Work (and each Contributor provides its Contributions) on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied, including, without limitation, any warranties or conditions of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A PARTICULAR PURPOSE. You are solely responsible for determining the appropriateness of using or redistributing the Work and assume any risks associated with Your exercise of permissions under this License.
|
|
50
|
+
|
|
51
|
+
8. Limitation of Liability. In no event and under no legal theory, whether in tort (including negligence), contract, or otherwise, unless required by applicable law (such as deliberate and grossly negligent acts) or agreed to in writing, shall any Contributor be liable to You for damages, including any direct, indirect, special, incidental, or consequential damages of any character arising as a result of this License or out of the use or inability to use the Work (including but not limited to damages for loss of goodwill, work stoppage, computer failure or malfunction, or any and all other commercial damages or losses), even if such Contributor has been advised of the possibility of such damages.
|
|
52
|
+
|
|
53
|
+
9. Accepting Warranty or Additional Liability. While redistributing the Work or Derivative Works thereof, You may choose to offer, and charge a fee for, acceptance of support, warranty, indemnity, or other liability obligations and/or rights consistent with this License. However, in accepting such obligations, You may act only on Your own behalf and on Your sole responsibility, not on behalf of any other Contributor, and only if You agree to indemnify, defend, and hold each Contributor harmless for any liability incurred by, or claims asserted against, such Contributor by reason of your accepting any such warranty or additional liability.
|
|
54
|
+
|
|
55
|
+
END OF TERMS AND CONDITIONS
|
package/NOTICE
ADDED
package/README.md
ADDED
|
@@ -0,0 +1,324 @@
|
|
|
1
|
+
# Capillary Viz
|
|
2
|
+
|
|
3
|
+
`@capillaryjs/capillary-viz` provides domain-neutral analytical models
|
|
4
|
+
and accessible Capillary UI components: stable-key categories, category visibility,
|
|
5
|
+
ordered recursive splits, proportional block diagrams, civil-date history
|
|
6
|
+
series, and responsive charts.
|
|
7
|
+
|
|
8
|
+
The package is ESM-only and currently follows 0.x compatibility rules. Install
|
|
9
|
+
it with its Capillary and Capillary UI peers:
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
pnpm add @capillaryjs/capillary @capillaryjs/capillary-ui \
|
|
13
|
+
@capillaryjs/capillary-viz
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
Import Capillary UI's normal presentation files and either collect component styles or
|
|
17
|
+
load the complete visualization structural asset:
|
|
18
|
+
|
|
19
|
+
```ts
|
|
20
|
+
import '@capillaryjs/capillary-ui/themes/base.css'
|
|
21
|
+
import '@capillaryjs/capillary-ui/styles/structural.css'
|
|
22
|
+
import '@capillaryjs/capillary-viz/styles/structural.css'
|
|
23
|
+
import '@capillaryjs/capillary-ui/colors/iceblue/colors.css'
|
|
24
|
+
import '@capillaryjs/capillary-ui/themes/minimal/theme.css'
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
With dependency collection, declare `BlockGraph`, `CategoryHidePanel`,
|
|
28
|
+
`SplitSelectionPanel`, or `LineGraph` in the owning component's
|
|
29
|
+
`static dependencies` instead.
|
|
30
|
+
|
|
31
|
+
## Ownership model
|
|
32
|
+
|
|
33
|
+
Applications supply items, stable keys, domain predicates, labels, semantic
|
|
34
|
+
colors, split presets, and dates. This package coordinates those declarations
|
|
35
|
+
and presents them; it does not fetch, persist, or infer domain policy.
|
|
36
|
+
|
|
37
|
+
Models and derived emitters are caller-owned. Dispose them at the composition
|
|
38
|
+
boundary that created them. Components observe passed models but never dispose
|
|
39
|
+
them.
|
|
40
|
+
|
|
41
|
+
```text
|
|
42
|
+
application items and domain declarations
|
|
43
|
+
│
|
|
44
|
+
▼
|
|
45
|
+
GroupingCriterion / SplitSelectionModel / BlockSelectionModel / SeriesBuilder
|
|
46
|
+
│ caller-owned emitters and models
|
|
47
|
+
▼
|
|
48
|
+
CategoryHidePanel / SplitSelectionPanel / BlockGraph / LineGraph
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## Categories and visibility
|
|
52
|
+
|
|
53
|
+
A `Category<T>` has a stable `key`, visible `label`, predicate, and ordered
|
|
54
|
+
`[dark, base, light]` CSS colors. Optional `hiddenByDefault` applies only the
|
|
55
|
+
first time that key appears.
|
|
56
|
+
|
|
57
|
+
Use `staticCriterion()` for a fixed category vocabulary:
|
|
58
|
+
|
|
59
|
+
```tsx
|
|
60
|
+
interface Finding {
|
|
61
|
+
severity: 'critical' | 'high' | 'medium'
|
|
62
|
+
projectId: string
|
|
63
|
+
detected: CivilDate
|
|
64
|
+
resolved?: CivilDate
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
const severity = staticCriterion<Finding>({
|
|
68
|
+
key: 'severity',
|
|
69
|
+
label: 'Severity',
|
|
70
|
+
categories: [
|
|
71
|
+
{
|
|
72
|
+
key: 'critical',
|
|
73
|
+
label: 'Critical',
|
|
74
|
+
predicate: (finding) => finding.severity === 'critical',
|
|
75
|
+
colors: ['#6b0000', '#c62828', '#ffcdd2'],
|
|
76
|
+
},
|
|
77
|
+
{
|
|
78
|
+
key: 'high',
|
|
79
|
+
label: 'High',
|
|
80
|
+
predicate: (finding) => finding.severity === 'high',
|
|
81
|
+
colors: ['#8a3b00', '#ef6c00', '#ffe0b2'],
|
|
82
|
+
},
|
|
83
|
+
{
|
|
84
|
+
key: 'medium',
|
|
85
|
+
label: 'Medium',
|
|
86
|
+
predicate: (finding) => finding.severity === 'medium',
|
|
87
|
+
colors: ['#725400', '#f9a825', '#fff9c4'],
|
|
88
|
+
},
|
|
89
|
+
],
|
|
90
|
+
})
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
Use `derivedCriterion()` when categories come from current item values. It
|
|
94
|
+
extracts one or more keys per item, drops empty categories, sorts populated
|
|
95
|
+
categories deterministically, and preserves hidden state when a key disappears
|
|
96
|
+
and later returns:
|
|
97
|
+
|
|
98
|
+
```tsx
|
|
99
|
+
const projects = derivedCriterion({
|
|
100
|
+
key: 'project',
|
|
101
|
+
label: 'Project',
|
|
102
|
+
source$: findings,
|
|
103
|
+
extractKeys: (finding: Finding) => finding.projectId,
|
|
104
|
+
describe: (projectId) => ({
|
|
105
|
+
label: projectId,
|
|
106
|
+
colors: ['#263238', '#607d8b', '#cfd8dc'],
|
|
107
|
+
}),
|
|
108
|
+
})
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
`GroupingCriterion` exposes:
|
|
112
|
+
|
|
113
|
+
- `categories$`, `hidden$`, and `visibleCategories$`;
|
|
114
|
+
- `visibility(categoryKey)` for a writable `'hidden' | 'visible'` adapter;
|
|
115
|
+
- `setAllVisible()` and `pruneHidden()` commands;
|
|
116
|
+
- `allowResorting`, used by recursive block layout;
|
|
117
|
+
- `dispose()`.
|
|
118
|
+
|
|
119
|
+
`deriveCategories()` is the pure dynamic-category calculation.
|
|
120
|
+
`filterByHidden(items$, criteria)` creates a blacklist-style derived item
|
|
121
|
+
collection, and `categoryCounts(items$, criterion)` reports unfiltered live
|
|
122
|
+
counts. The caller owns and disposes both derived emitters.
|
|
123
|
+
|
|
124
|
+
## Ordered splits and block selection
|
|
125
|
+
|
|
126
|
+
`createSplitSelection(criteria, options)` returns a `SplitSelectionModel`.
|
|
127
|
+
Its `order$` contains every criterion, while `activeSplits$` contains the
|
|
128
|
+
currently enabled subset in recursive split order. Optional presets name exact
|
|
129
|
+
active/inactive arrangements.
|
|
130
|
+
|
|
131
|
+
```tsx
|
|
132
|
+
const splits = createSplitSelection(
|
|
133
|
+
[severity, projects],
|
|
134
|
+
{
|
|
135
|
+
active: ['severity', 'project'],
|
|
136
|
+
presets: [
|
|
137
|
+
{key: 'severity-first', label: 'Severity first', active: ['severity', 'project']},
|
|
138
|
+
{key: 'project-only', label: 'Project only', active: ['project'], inactive: ['severity']},
|
|
139
|
+
],
|
|
140
|
+
},
|
|
141
|
+
)
|
|
142
|
+
|
|
143
|
+
const blocks = createBlockSelection(findings, splits.activeSplits$, {
|
|
144
|
+
rootLabel: 'All findings',
|
|
145
|
+
readabilityThreshold: 0.02,
|
|
146
|
+
})
|
|
147
|
+
```
|
|
148
|
+
|
|
149
|
+
The split model exposes `activeState()`, `isActive()`, `toggle()`, `move()`,
|
|
150
|
+
`moveBy()`, `setSplits()`, `applyPreset()`, and `dispose()`.
|
|
151
|
+
|
|
152
|
+
`BlockSelectionModel` owns a reactive strict-partition layout and rebuild-safe
|
|
153
|
+
selection:
|
|
154
|
+
|
|
155
|
+
- `layout$` contains the root block, child blocks, and partition issues;
|
|
156
|
+
- `selectedPath$` is the stable criterion/category path;
|
|
157
|
+
- `selectedBlock$` re-resolves that path after every rebuild;
|
|
158
|
+
- `selectedItems$` exposes the selected subset;
|
|
159
|
+
- `select()`, `clear()`, and `dispose()` manage selection and lifetime.
|
|
160
|
+
|
|
161
|
+
Every active criterion must assign every item under each parent to exactly one
|
|
162
|
+
category. Zero matches and multiple matches make the layout invalid and are
|
|
163
|
+
reported as `BlockPartitionIssue` entries; the model does not silently guess.
|
|
164
|
+
|
|
165
|
+
For non-reactive use, `buildBlockLayout()` performs the pure calculation,
|
|
166
|
+
`criterionSnapshot()` converts a criterion to a split snapshot, and
|
|
167
|
+
`findBlock()` resolves a path.
|
|
168
|
+
|
|
169
|
+
## Component reference
|
|
170
|
+
|
|
171
|
+
### CollapsibleOptionGroup
|
|
172
|
+
|
|
173
|
+
`CollapsibleOptionGroup` extends Capillary UI's `OptionGroup` with disclosure behavior.
|
|
174
|
+
Its ordinary children are the ordered option content. Supply optional trailing
|
|
175
|
+
legend content with Capillary UI's parent-specific `OptionGroupHeaderEnd` marker:
|
|
176
|
+
|
|
177
|
+
```tsx
|
|
178
|
+
<CollapsibleOptionGroup label="Severity">
|
|
179
|
+
<OptionGroupHeaderEnd>
|
|
180
|
+
<small>4 visible</small>
|
|
181
|
+
</OptionGroupHeaderEnd>
|
|
182
|
+
<Checkbox label="Critical" value="critical" />
|
|
183
|
+
<Checkbox label="High" value="high" />
|
|
184
|
+
</CollapsibleOptionGroup>
|
|
185
|
+
```
|
|
186
|
+
|
|
187
|
+
`collapsed` configures only the initial disclosure state. The marker is a
|
|
188
|
+
direct-child declaration consumed by the option group; it does not render an
|
|
189
|
+
extra component host.
|
|
190
|
+
|
|
191
|
+
### CategoryHidePanel
|
|
192
|
+
|
|
193
|
+
`CategoryHidePanel<T>` renders collapsible criterion groups, per-category
|
|
194
|
+
visibility checkboxes, color swatches, and counts against the unfiltered item
|
|
195
|
+
source.
|
|
196
|
+
|
|
197
|
+
| Prop | Meaning |
|
|
198
|
+
| --- | --- |
|
|
199
|
+
| `items$` | Required readable source used for live counts |
|
|
200
|
+
| `criteria` | Required criterion list |
|
|
201
|
+
| `label` | GroupBox heading; defaults to “Show or hide categories” |
|
|
202
|
+
| `description` | Introductory help text |
|
|
203
|
+
| `initiallyOpen` | Initial disclosure policy per criterion |
|
|
204
|
+
|
|
205
|
+
The outer surface inherits Capillary UI's `GroupBox` contract: a labelled group with
|
|
206
|
+
a vertical chromed header. Criterion summaries remain horizontal disclosure
|
|
207
|
+
headers above their options.
|
|
208
|
+
|
|
209
|
+
### SplitSelectionPanel
|
|
210
|
+
|
|
211
|
+
`SplitSelectionPanel<T>` enables criteria, applies presets, and changes their
|
|
212
|
+
recursive order.
|
|
213
|
+
|
|
214
|
+
| Prop | Meaning |
|
|
215
|
+
| --- | --- |
|
|
216
|
+
| `model` | Required caller-owned `SplitSelectionModel` |
|
|
217
|
+
| `label` | GroupBox heading |
|
|
218
|
+
| `description` | Introductory help text |
|
|
219
|
+
|
|
220
|
+
Pointer dragging reorders entries. From a drag handle,
|
|
221
|
+
`Alt+ArrowUp`/`Alt+ArrowDown` provides the keyboard equivalent and announces
|
|
222
|
+
the new position. Preset buttons expose their active state with
|
|
223
|
+
`aria-pressed`.
|
|
224
|
+
|
|
225
|
+
### BlockGraph
|
|
226
|
+
|
|
227
|
+
`BlockGraph<T>` renders a nested proportional mosaic from a
|
|
228
|
+
`BlockSelectionModel`.
|
|
229
|
+
|
|
230
|
+
| Prop | Meaning |
|
|
231
|
+
| --- | --- |
|
|
232
|
+
| `model` | Required caller-owned block selection model |
|
|
233
|
+
| `label` | Accessible graph name and visible heading |
|
|
234
|
+
| `description` | Visible explanation of the area encoding |
|
|
235
|
+
| `emptyMessage` | Message for an empty valid layout |
|
|
236
|
+
|
|
237
|
+
The graph exposes an ARIA tree, keyboard selection, a current-path readout,
|
|
238
|
+
clear-selection action, loading/error states, and explicit partition
|
|
239
|
+
diagnostics. Each block applies Capillary UI's `colored` trait using the category's
|
|
240
|
+
`--c1`, `--c2`, and `--c3` values. Nested mosaics are inset by
|
|
241
|
+
`--viz-block-graph-child-inset` (default `1.6em`) so parent surfaces remain
|
|
242
|
+
visible. Labels overlay their surfaces and keep criterion and category on one
|
|
243
|
+
line without distorting area ratios. Hover emphasis targets only the deepest
|
|
244
|
+
block under the pointer.
|
|
245
|
+
|
|
246
|
+
### LineGraph
|
|
247
|
+
|
|
248
|
+
`LineGraph` renders responsive SVG history as individual lines or stacked
|
|
249
|
+
areas.
|
|
250
|
+
|
|
251
|
+
| Prop | Meaning |
|
|
252
|
+
| --- | --- |
|
|
253
|
+
| `shapes$` | Static `HistoryShape[]` or readable source |
|
|
254
|
+
| `stacked$` | Static boolean or readable source |
|
|
255
|
+
| `smooth$` | Static boolean or readable source |
|
|
256
|
+
| `range$` | Static or readable `{minX?, maxX?, minY?}` |
|
|
257
|
+
| `label`, `emptyMessage` | Accessible heading and empty state |
|
|
258
|
+
| `formatDate`, `formatValue` | Optional readout formatters |
|
|
259
|
+
|
|
260
|
+
Pointer movement updates the readout. Arrow keys move by one day, Shift+Arrow
|
|
261
|
+
by one week, Home/End jump to the range bounds, and Escape clears a pinned
|
|
262
|
+
cursor. Readable inputs propagate loading/error state; static values are
|
|
263
|
+
wrapped in component-owned ready sources.
|
|
264
|
+
|
|
265
|
+
## Civil dates and history series
|
|
266
|
+
|
|
267
|
+
`CivilDate` is a strict `YYYY-MM-DD` string interpreted with UTC-day arithmetic,
|
|
268
|
+
so calculations do not move across daylight-saving boundaries. The date module
|
|
269
|
+
exports validation/day conversion, comparison, addition, and current-date
|
|
270
|
+
helpers.
|
|
271
|
+
|
|
272
|
+
`SeriesBuilder` converts dated category deltas into ordinary or cumulative
|
|
273
|
+
`HistoryShape` arrays:
|
|
274
|
+
|
|
275
|
+
```ts
|
|
276
|
+
const history = new SeriesBuilder(severity.categories$.get())
|
|
277
|
+
for (const finding of currentFindings) {
|
|
278
|
+
history.addOne(finding.detected, finding.severity)
|
|
279
|
+
if (finding.resolved != null) history.removeOne(finding.resolved, finding.severity)
|
|
280
|
+
}
|
|
281
|
+
|
|
282
|
+
const cumulativeShapes = history.buildCumulative()
|
|
283
|
+
```
|
|
284
|
+
|
|
285
|
+
An ordinary series reports date deltas. A cumulative series carries values
|
|
286
|
+
forward and includes a pre-range anchor when earlier activity affects the
|
|
287
|
+
visible period.
|
|
288
|
+
|
|
289
|
+
For custom renderers, `buildLineChartModel()` computes normalized chart data
|
|
290
|
+
without a DOM. `linePath()`, `areaPath()`, `valueAtDate()`, and
|
|
291
|
+
`buildIntegerTicks()` expose the same pure calculations used by `LineGraph`.
|
|
292
|
+
|
|
293
|
+
## Complete export groups
|
|
294
|
+
|
|
295
|
+
| Module area | Public exports |
|
|
296
|
+
| --- | --- |
|
|
297
|
+
| Grouping | `Category`, `CategoryColors`, `GroupingCriterion`, `staticCriterion`, `derivedCriterion`, `deriveCategories`, `filterByHidden`, `categoryCounts`, `categoryColorVariables`, `setsEqual` and related option/state types |
|
|
298
|
+
| Splits | `SplitSelectionModel`, `SplitPreset`, `createSplitSelection` |
|
|
299
|
+
| Blocks | `BlockSelectionModel`, `createBlockSelection`, `buildBlockLayout`, `criterionSnapshot`, `findBlock` and block path/layout/issue types |
|
|
300
|
+
| History | `SeriesBuilder`, `HistoryShape`, `SeriesCategory` |
|
|
301
|
+
| Dates | `CivilDate`, `civilDateToDay`, `dayToCivilDate`, `addCivilDays`, `todayCivilDate`, `compareCivilDates` |
|
|
302
|
+
| Charts | `buildLineChartModel`, `linePath`, `areaPath`, `valueAtDate`, `buildIntegerTicks` and chart model types |
|
|
303
|
+
| Components | `CategoryHidePanel`, `SplitSelectionPanel`, `BlockGraph`, `LineGraph` and their props |
|
|
304
|
+
|
|
305
|
+
## Styling and accessibility
|
|
306
|
+
|
|
307
|
+
Visualization components use fixed Capillary UI hosts:
|
|
308
|
+
`cap-categoryhidepanel`, `cap-splitselectionpanel`, `cap-blockgraph`, and
|
|
309
|
+
`cap-linegraph`. Structural CSS remains owned by component classes. Themes
|
|
310
|
+
provide values, not component selectors.
|
|
311
|
+
|
|
312
|
+
Category triples populate both the established `--c1`/`--c2`/`--c3` inputs
|
|
313
|
+
and the descriptive `--colored-dark`/`--colored-base`/`--colored-light`
|
|
314
|
+
aliases. Capillary UI's base trait supplies the gradient; themes may add treatment such
|
|
315
|
+
as Shiny's shared colored shadow. Series use the base color for paths and
|
|
316
|
+
legend swatches.
|
|
317
|
+
|
|
318
|
+
The components expose names, statuses, keyboard equivalents, and forced-color
|
|
319
|
+
fallbacks, but applications remain responsible for meaningful domain labels,
|
|
320
|
+
contrast in supplied category colors, and manual assistive-technology review.
|
|
321
|
+
|
|
322
|
+
See the [Capillary UI guide](../capillary-ui/README.md), the repository
|
|
323
|
+
[API surface](../../docs/API_SURFACE.md), and this package's
|
|
324
|
+
[release history](CHANGELOG.md).
|
package/dist/block.d.ts
ADDED
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import { Emitter } from '@capillaryjs/capillary';
|
|
2
|
+
import type { ReadableEmitter } from '@capillaryjs/capillary';
|
|
3
|
+
import type { Category, CategoryColors } from './grouping.js';
|
|
4
|
+
import { GroupingCriterion } from './grouping.js';
|
|
5
|
+
export type BlockOrientation = 'horizontal' | 'vertical';
|
|
6
|
+
export interface BlockPathSegment {
|
|
7
|
+
readonly criterionKey: string;
|
|
8
|
+
readonly categoryKey: string;
|
|
9
|
+
}
|
|
10
|
+
export type BlockPath = readonly BlockPathSegment[];
|
|
11
|
+
export interface BlockSplit<TItem> {
|
|
12
|
+
readonly key: string;
|
|
13
|
+
readonly label: string;
|
|
14
|
+
readonly categories: readonly Category<TItem>[];
|
|
15
|
+
readonly allowResorting: boolean;
|
|
16
|
+
}
|
|
17
|
+
export interface BlockNode<TItem> {
|
|
18
|
+
readonly key: string;
|
|
19
|
+
readonly path: BlockPath;
|
|
20
|
+
readonly criterionKey: string | null;
|
|
21
|
+
readonly criterionLabel: string | null;
|
|
22
|
+
readonly categoryKey: string | null;
|
|
23
|
+
readonly label: string;
|
|
24
|
+
readonly colors: CategoryColors | null;
|
|
25
|
+
readonly colorKey: string | null;
|
|
26
|
+
readonly count: number;
|
|
27
|
+
readonly share: number;
|
|
28
|
+
readonly totalShare: number;
|
|
29
|
+
readonly depth: number;
|
|
30
|
+
readonly items: readonly TItem[];
|
|
31
|
+
readonly children: readonly BlockNode<TItem>[];
|
|
32
|
+
readonly childOrientation: BlockOrientation;
|
|
33
|
+
readonly childrenSuppressed: boolean;
|
|
34
|
+
}
|
|
35
|
+
export interface BlockPartitionIssue<TItem> {
|
|
36
|
+
readonly kind: 'unmatched' | 'multiple-matches';
|
|
37
|
+
readonly criterionKey: string;
|
|
38
|
+
readonly criterionLabel: string;
|
|
39
|
+
readonly parentPath: BlockPath;
|
|
40
|
+
readonly item: TItem;
|
|
41
|
+
readonly itemIndex: number;
|
|
42
|
+
readonly matchedCategoryKeys: readonly string[];
|
|
43
|
+
}
|
|
44
|
+
export interface BlockLayoutResult<TItem> {
|
|
45
|
+
readonly valid: boolean;
|
|
46
|
+
readonly root: BlockNode<TItem>;
|
|
47
|
+
readonly issues: readonly BlockPartitionIssue<TItem>[];
|
|
48
|
+
}
|
|
49
|
+
export interface BlockLayoutOptions {
|
|
50
|
+
readonly rootLabel?: string;
|
|
51
|
+
readonly readabilityThreshold?: number;
|
|
52
|
+
}
|
|
53
|
+
/** Build a true recursive partition. Invalid zero/multiple matches are reported. */
|
|
54
|
+
export declare function buildBlockLayout<TItem>(items: readonly TItem[], splits: readonly BlockSplit<TItem>[], options?: BlockLayoutOptions): BlockLayoutResult<TItem>;
|
|
55
|
+
export declare function criterionSnapshot<TItem>(criterion: GroupingCriterion<TItem>): BlockSplit<TItem>;
|
|
56
|
+
export declare function findBlock<TItem>(root: BlockNode<TItem>, path: BlockPath | null): BlockNode<TItem> | null;
|
|
57
|
+
/** Reactive layout and rebuild-safe selected subset shared by graph and application. */
|
|
58
|
+
export declare class BlockSelectionModel<TItem> {
|
|
59
|
+
readonly options: BlockLayoutOptions;
|
|
60
|
+
readonly layout$: ReadableEmitter<BlockLayoutResult<TItem>, readonly unknown[]>;
|
|
61
|
+
readonly selectedPath$: Emitter<BlockPath | null>;
|
|
62
|
+
readonly selectedBlock$: ReadableEmitter<BlockNode<TItem> | null>;
|
|
63
|
+
readonly selectedItems$: ReadableEmitter<readonly TItem[]>;
|
|
64
|
+
private readonly layoutEmitter;
|
|
65
|
+
private readonly selectedBlockEmitter;
|
|
66
|
+
private readonly selectedItemsEmitter;
|
|
67
|
+
private readonly releases;
|
|
68
|
+
private disposed;
|
|
69
|
+
constructor(items$: ReadableEmitter<readonly TItem[]>, splits$: ReadableEmitter<readonly GroupingCriterion<TItem>[]>, options?: BlockLayoutOptions);
|
|
70
|
+
select(path: BlockPath, eventOrCause?: unknown): boolean;
|
|
71
|
+
clear(eventOrCause?: unknown): boolean;
|
|
72
|
+
dispose(): void;
|
|
73
|
+
private reconcileSelection;
|
|
74
|
+
private assertActive;
|
|
75
|
+
}
|
|
76
|
+
export declare function createBlockSelection<TItem>(items$: ReadableEmitter<readonly TItem[]>, splits$: ReadableEmitter<readonly GroupingCriterion<TItem>[]>, options?: BlockLayoutOptions): BlockSelectionModel<TItem>;
|
|
77
|
+
//# sourceMappingURL=block.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"block.d.ts","sourceRoot":"","sources":["../src/block.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { Button, Component } from '@capillaryjs/capillary-ui';
|
|
2
|
+
import type { ComponentProps, CapillaryUiChild } from '@capillaryjs/capillary-ui';
|
|
3
|
+
import type { BlockNode } from '../block.js';
|
|
4
|
+
import { BlockSelectionModel } from '../block.js';
|
|
5
|
+
export interface BlockGraphProps<TItem> extends ComponentProps {
|
|
6
|
+
readonly model: BlockSelectionModel<TItem>;
|
|
7
|
+
readonly label?: string;
|
|
8
|
+
readonly description?: string;
|
|
9
|
+
readonly emptyMessage?: string;
|
|
10
|
+
}
|
|
11
|
+
/** Accessible nested proportional mosaic backed by an explicit selection model. */
|
|
12
|
+
export declare class BlockGraph<TItem = unknown> extends Component<BlockGraphProps<TItem>> {
|
|
13
|
+
static liveProps: readonly string[];
|
|
14
|
+
render(): CapillaryUiChild;
|
|
15
|
+
static hostName: string;
|
|
16
|
+
static dependencies: (typeof Button)[];
|
|
17
|
+
static css: string;
|
|
18
|
+
private renderBlock;
|
|
19
|
+
private renderPartitionError;
|
|
20
|
+
private blockKeyDown;
|
|
21
|
+
private focusBlock;
|
|
22
|
+
}
|
|
23
|
+
export declare function flattenBlocks<TItem>(nodes: readonly BlockNode<TItem>[]): BlockNode<TItem>[];
|
|
24
|
+
//# sourceMappingURL=BlockGraph.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BlockGraph.d.ts","sourceRoot":"","sources":["../../src/components/BlockGraph.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAE,SAAS,EAAM,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAC,cAAc,EAAE,gBAAgB,EAAC,MAAM,2BAA2B,CAAA;AAE/E,OAAO,KAAK,EAAC,SAAS,EAAY,MAAM,aAAa,CAAA;AACrD,OAAO,EAAC,mBAAmB,EAAY,MAAM,aAAa,CAAA;AAS1D,MAAM,WAAW,eAAe,CAAC,KAAK,CAAE,SAAQ,cAAc;IAC1D,QAAQ,CAAC,KAAK,EAAE,mBAAmB,CAAC,KAAK,CAAC,CAAA;IAC1C,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;CACjC;AAED,mFAAmF;AACnF,qBAAa,UAAU,CAAC,KAAK,GAAG,OAAO,CAAE,SAAQ,SAAS,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;IAC9E,OAAgB,SAAS,EAAE,SAAS,MAAM,EAAE,CAAK;IACjD,MAAM,IAAI,gBAAgB;IAmE1B,OAAgB,QAAQ,SAAgB;IACxC,OAAgB,YAAY,oBAAW;IAEvC,MAAM,CAAC,GAAG,SAkKT;IAED,OAAO,CAAC,WAAW;IAiDnB,OAAO,CAAC,oBAAoB;IAa5B,OAAO,CAAC,YAAY;IA8BpB,OAAO,CAAC,UAAU;CASrB;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,SAAS,CAAC,KAAK,CAAC,EAAE,GAAG,SAAS,CAAC,KAAK,CAAC,EAAE,CAE3F"}
|