Skip to content

Conversation

@jewls618
Copy link

@jewls618 jewls618 commented Feb 2, 2026

Jira ticket: CP-12003

Description

Adds functionality where clicking on a field in the document preview causes the left-hand sidebar to scroll to that field and highlight it, similar to the existing eDoc builder behavior.

Changes

  • Add new event to emits array
  • Add click handler to field area container
  • Update Page component to emit field-clicked event
  • Update Document component to handle field-clicked
  • Add new method scrollFieldIntoSidebar

Demo

https://www.loom.com/share/9bf7ecf8522d4cc6aea504978f8ced8f

Copy link
Collaborator

@bernardodsanderson bernardodsanderson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great!

Nit: When I clicked on the fields, the left side highlights move the fields a bit because of the added border. One thing you can do about that is to use padding/margin/size to negate the border size. Not a huge deal either way!

Comment on lines 1727 to 1728
scrollToArea (area) {
const documentRef = this.documentRefs.find((a) => a.document.uuid === area.attachment_uuid)
const documentRef = this.documentRefs.find((a) => a.document.uuid === area.attachment_uuid)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: this indentation is different from the next lines in scrollToArea.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, good catch. Updated!

// Wait for submitter switch to complete
this.$nextTick(() => {
// Scroll field into view in sidebar
this.$refs.fields.scrollFieldIntoView(field)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not sure if needed, but we could have a null check on here (this.$refs.fields) before calling the scrolling, just to make sure it won't break anything.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add a sanity null check!

@jewls618 jewls618 merged commit de93f04 into main Feb 2, 2026
5 checks passed
@jewls618 jewls618 deleted the CP-12003-scoll-and-highlight branch February 2, 2026 18:23
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants