search

pnp / sp-dev-fx-webparts

SharePoint Framework web part, Teams tab, personal app, app page samples
http://aka.ms/spfx-webparts
MIT License
2.05k stars 3.86k forks source link

Replicate Edit, Order/Arrange/Move, and Delete as done in QuickLinks WebPart #2229

Open brianpmccullough opened 2 years ago

brianpmccullough commented 2 years ago

Sample description

Replicate Edit, Order/Arrange/Move, and Delete as done in QuickLinks WebPart including accessibility behaviors of Left/Right arrows for selection of card and Ctrl + Left/Right Arrows for movement of card.

image001

SPFx version

1.13.1

Are you willing to help?

Yes

ghost commented 2 years ago

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

PooLP commented 2 years ago

i have this => https://github.com/PooLP/spfx-react-drag-drop-inline-edit-sample it's a POC to reproduce the UX of quick links, but i don't have accessibility behaviors. i have make this for test "getDetailsPaneConfiguration" to open another property pane, but it's not documented by MS.

Tanddant commented 1 year ago

I hadn't seen @PooLP already answered your question, but I've submitted a PR that mostly solves this one - you can freely update it to support keyboard shoutcuts, for inspiration take a look under keycodes in the react-sortable-hoc docs

Instead of using the getDetailsPaneConfiguration I'm forcing a rerender of the propertypane, I really couldn't find a pretty way that's documented to do this, yet another reason MS should open source some of their webparts

PooLP commented 1 year ago

I think we should use dnd kit for that, much more complete and maintained. For MS and real open Source for SPFx, good luck :D

Tanddant commented 1 year ago

DnD kit is probably the better way to go, I just went for something I knew to be working 😊

Well if we don't push for it, it won't happen