bug/74385: Inline work package chip has no visual highlight when selected

[ihordubas99]

Ticket

https://community.openproject.org/projects/communicator-stream/work_packages/74385

What are you trying to accomplish?

Add a visual selection highlight to inline work package chips when they are included in an editor text selection

Screenshots

What approach did you choose and why?

Subscribed to editor.onSelectionChange inside the chip component and used range.intersectsNode to check whether the chip's DOM node falls within the current browser selection. When it does, the existing selected styled-component prop is activated, reusing the already-defined focus outline and shadow styles.

Merge checklist

• Added/updated tests
• Added/updated documentation in Lookbook (patterns, previews, etc)
• Tested major browsers (Chrome, Firefox, Edge, ...)

[judithroth]

Funny again. This one works in the vite test project, but not in OpenProject. I'v rebuilt it several times to be sure. Can you reproduce this?

[ihordubas99]

@judithroth It's a bit strange that it doesn't work on your end - everything works fine for me. Here's how I do a full rebuild:

op-blocknote-extension:
First, I recommend removing node_modules, then:

npm i
npm run build
npm pack

After that, copy the generated op-blocknote-extensions-0.0.25.tgz and place it into the frontend folder of the openproject project.

openproject:
First, remove node_modules from the frontend, then:

cd frontend
npm i op-blocknote-extensions-0.0.25.tgz
npm i
cd ..
bin/dev

Is this how you're doing it?