feat: SDA-810 Adds customizability to Chromatograms#79
Open
sdee-tetra wants to merge 28 commits into
Open
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
changed the title
sdee-tetra
changed the title
Add \`color?: string\` to PeakAnnotation. When set it overrides the series-derived color for the annotation label, arrow, border, and boundary markers. Series-color remains the default when omitted, so existing consumers are unaffected. Motivated by the SST data app's pass/fail (green/red/grey) peak coloring, which today is implemented as a custom Plotly overlay. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Add PeakAnnotation.regionOverlay (with optional regionOverlayWidth) to paint a thickened colored segment along the underlying trace between the peak's startX and endX. Honors peak.color from the per-peak color override; falls back to the series color. This is the first-class equivalent of the ad-hoc Plotly overlay used by the SST runner's ChromatogramPanel, which marks integrated regions green/red/grey by pass/fail. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Add stackingOrder ("first-on-bottom" | "first-on-top", default
"first-on-bottom") to control which end of the stack series[0] lands
on. Annotations and numeric-yAnchor range annotations follow the
chosen direction so they stay pinned to their trace.
The default preserves existing behavior. The new "first-on-top"
direction matches the convention used by the SST Injection-Viewer
panel and lets consumers keep annotations in source order.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
…into chromatagram-enhancements
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
54321jenn-ts
approved these changes
May 20, 2026
Contributor
54321jenn-ts
left a comment
54321jenn-ts
left a comment
There was a problem hiding this comment.
@sdee-tetra LGTM.
Note: this will show up in the storybook under "StackedChromatogramChart" but the other version shows up under "ChromatogramChart", so there's a chance that a user may miss this enhancement if they are just browsing for it in the storybook without knowing to search for it. Maybe there's a way you can make it where it'll show up along with the other similar chart type. Not worth holding up this PR, but worth considering.
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
sdee-tetra
temporarily deployed
to
artifactory-prod
GitHub Actions
Inactive
Coverage Report
File Coverage
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
blee-tetrascience
requested changes
May 29, 2026
Collaborator
blee-tetrascience
left a comment
blee-tetrascience
left a comment
There was a problem hiding this comment.
Requesting changes for Zephyr metadata and lint policy. The diff adds concrete Zephyr IDs, and I do not see a sync action commit on this branch. Please clear the added IDs to empty strings and let the sync action fill them.
| // fields don't change — consumers should memoize selectionAppearance if needed). | ||
| const resolvedAppearance = useMemo( | ||
| () => resolveSelectionAppearance(selectionAppearance), | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps |
Collaborator
There was a problem hiding this comment.
Repo guidance says not to add lint disable comments. Please make the memo dependency shape lint clean, for example by normalizing the selected appearance fields before the memo or by depending on the full object and requiring callers to memoize it.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
https://tetrascience.atlassian.net/browse/SDA-810
This is what using ChromatogramChart and StackedChromatogram chart instead of using Plotly directly would look like: https://github.com/tetrascience/ts-data-app-system-suitability-testing/compare/chromatogram-encapsulation
Type of Change
Checklist
yarn lintpassesyarn buildpassesyarn test:allpassesTesting
Verification
Screenshots