Add Sortable Component (Based on sortable.js)#209
Open
russkyc wants to merge 7 commits intoblazorblueprintui:developfrom
Open
Add Sortable Component (Based on sortable.js)#209russkyc wants to merge 7 commits intoblazorblueprintui:developfrom
russkyc wants to merge 7 commits intoblazorblueprintui:developfrom
Conversation
Merge changes from upstream
…layout, and comprehensive demo - Extract BbSortable code to BbSortable.razor.cs (partial class) - Add @namespace BlazorBlueprint.Components to BbSortable.razor - Rename T→TItem and SortableItemTemplate→ItemTemplate - Fix ForceFallback bug (param was defined but never passed to JS init()) - Add OnAdd EventCallback + OnAddJS [JSInvokable] for clean cross-list tracking - Add WAI-ARIA: role=list, aria-label, sr-only live region announcements - Add Layout (SortableLayout.List/Grid), Class, AriaLabel, AdditionalAttributes params - Add SortableLayout enum (List, Grid) - Update sortable.js: add onAdd handler, forceFallback now correctly wired from .NET - Create SortableDemo.razor: basic list, handle, multiple lists, grid, kanban - Create CodeExamples/Components/Sortable/{basic,handle,multiple-lists,grid,kanban}.txt - Add Sortable to DemoSidebar.razor navigation (between Spinner and Split Button) - Add Sortable card to Pages/Components/Index.razor - Update API surface baseline to include BbSortable and SortableLayout Co-authored-by: russkyc <32549126+russkyc@users.noreply.github.com>
Co-authored-by: russkyc <32549126+russkyc@users.noreply.github.com>
…-component-demo feat(sortable): refactor BbSortable, add WAI-ARIA, OnAdd event, grid layout, and comprehensive demo
Contributor
Author
|
Hi @mathewtaylor , this is a basic implementation of the sortable component. This would cater to both sorting and drag and drop. Here are some previews: compressO-basic-list.mp4compressO-connected-lists.mp4compressO-grid.mp4compressO-kanban.mp4Some quirks:
I don't know if this is the best route because of the quirks, but it could be a starting point. I can't seem to get the quirks ironed out even with copilot. |
russkyc
changed the title
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
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.
Description
Adds a new
BbSortable<TItem>component to BlazorBlueprint.Components, providing drag-and-drop sortable lists and grids powered by Sortable.js. Includes a newSortableLayoutenum (List/Grid), JS interop module (wwwroot/js/sortable.js) with a bundled Sortable.js library, component styling, and a full demo page with multiple examples (basic list, drag handle, connected lists, grid layout, and Kanban-style board). Updates the demo components index and sidebar navigation, and updates the Components API surface snapshot baseline.Type of Change
Testing Checklist
Related Issues
None