Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Calcite-Tree: drag-and-drop #2210

Open
bpatterson88 opened this issue May 25, 2021 · 10 comments
Open

Calcite-Tree: drag-and-drop #2210

bpatterson88 opened this issue May 25, 2021 · 10 comments
Labels
0 - new New issues that need assignment. c-tree Issues that pertain to the calcite-tree and related components design Issues that need design consultation prior to development. enhancement Issues tied to a new feature or request. estimate - design - lg Large design effort; 10-20 days of design work p - low Issue is non core or affecting less that 10% of people using the library research Issues that require more in-depth research or multiple team members to resolve or make decision. spike complete Issues that have a research spike completed and dev work can proceed
Milestone
Freezer

Comments

@bpatterson88
Copy link
Contributor

bpatterson88 commented May 25, 2021 •
edited
Loading

Description

As part of supporting responsive layouts in Dashboards, we are introducing a new UI surface for manipulating elements. This surface is essentially an expandable/collapsable tree structure that acts as an entry point for a number of editing workflows. The best component for this use case is calcite-tree, but it needs several enhancements to fully meet our needs.

Acceptance Criteria

  • Icons for each calcite tree item
  • N actions per calcite tree item. The current design only requires 1 action, but being able to insert an arbitrary number would be convenient. This includes 'parent' items as well as 'child' items.
  • Highlight-style hover state.
  • Rearrange and group items with drag-and-drop

Highlight style hover state
Screen Shot 2021-05-25 at 4 39 31 PM

Expandable menu example
Screen Shot 2021-05-25 at 4 40 04 PM

Drag-and-drop example
Screen Shot 2021-05-25 at 4 39 38 PM

Relevant Info

Comprehensive designs can be found here, especially on the Layout Tree and Drag-and-Drop pages: https://www.figma.com/file/zmHT65VqXpldbZy4cvjZlw/?node-id=213%3A21129

Which Component

calcite-tree

Example Use Case
@bpatterson88 bpatterson88 added enhancement Issues tied to a new feature or request. 0 - new New issues that need assignment. labels May 25, 2021
@benelan benelan added the needs triage Planning workflow - pending design/dev review. label Sep 27, 2021
@caripizza caripizza mentioned this issue Sep 28, 2021
Closed
@caripizza caripizza mentioned this issue Oct 13, 2021
Closed
@benelan benelan self-assigned this Oct 13, 2021
@benelan benelan removed their assignment Dec 29, 2021
@macandcheese macandcheese added the design Issues that need design consultation prior to development. label Jun 29, 2022
@brittneytewks
Copy link

Needs to be re-scoped

@brittneytewks brittneytewks added the p - low Issue is non core or affecting less that 10% of people using the library label Feb 22, 2023
@brittneytewks brittneytewks removed the needs triage Planning workflow - pending design/dev review. label Feb 22, 2023
@geospatialem geospatialem added 1 - assigned Issues that are assigned to a sprint and a team member. needs triage Planning workflow - pending design/dev review. and removed 0 - new New issues that need assignment. labels Mar 3, 2023
@geospatialem geospatialem added research Issues that require more in-depth research or multiple team members to resolve or make decision. c-tree Issues that pertain to the calcite-tree and related components labels Mar 20, 2023
@brittneytewks brittneytewks removed the needs triage Planning workflow - pending design/dev review. label Mar 22, 2023
@geospatialem
Copy link
Member

geospatialem commented Apr 24, 2023 •
edited
Loading

Reallocating to the May June release for design considerations.

@ashetland
Copy link

Based on current Tree behaviors, I think this can be rescoped to improving hover states and adding drag-and-drop.

@ashetland
Copy link

Hover states are covered in issue #6930. Drag-and-drop is this only thing left to address from this issue.

@geospatialem geospatialem removed this from the 2023 June patch priorities milestone May 25, 2023
@driskull
Copy link
Member

We should consider what the bounds of calcite-tree and calcite-list are. If we add drag and drop sorting support to tree, at what point would tree and list differentiate? They are starting to overlap in functionality and UI.

Currently, calcite-list uses a tree-grid role and does sorting and nesting as well as having the actions at the end.

cc @jcfranco

@brittneytewks brittneytewks added the figma changes Issues that require additions or updates to the Figma UI Kit where no `design` label exists label Sep 11, 2023
@brittneytewks brittneytewks added the estimate - design - lg Large design effort; 10-20 days of design work label Nov 6, 2023
@jcfranco
Copy link
Member

I agree w/ @driskull about defining the bounds of both components since they are getting pretty similar. From the design-perspective, are there any guidelines that could help keep them distinct?

Also, can we reach out to the Dashboards team about this request and whether list is a viable replacement?

@ashetland ashetland added the spike Issues that need quick investigations for time estimations, prioritization, or a quick assessment. label Nov 15, 2023
@driskull driskull removed their assignment Nov 29, 2023
@brittneytewks brittneytewks removed the figma changes Issues that require additions or updates to the Figma UI Kit where no `design` label exists label Dec 12, 2023
@geospatialem
Copy link
Member

Moving to the Freezer milestone as currently tree is intended for navigating architecture and list can be used to fit the above use case when sorting is required.

@geospatialem geospatialem added the spike complete Issues that have a research spike completed and dev work can proceed label Feb 12, 2024
@github-actions github-actions bot added 0 - new New issues that need assignment. needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. and removed spike Issues that need quick investigations for time estimations, prioritization, or a quick assessment. 1 - assigned Issues that are assigned to a sprint and a team member. labels Feb 12, 2024
@github-actions github-actions bot removed this from the Freezer milestone Feb 12, 2024
@github-actions GitHub Actions
Copy link
Contributor

cc @geospatialem, @brittneytewks

@geospatialem geospatialem added this to the Freezer milestone Feb 12, 2024
@geospatialem geospatialem removed the needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. label Feb 12, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
0 - new New issues that need assignment. c-tree Issues that pertain to the calcite-tree and related components design Issues that need design consultation prior to development. enhancement Issues tied to a new feature or request. estimate - design - lg Large design effort; 10-20 days of design work p - low Issue is non core or affecting less that 10% of people using the library research Issues that require more in-depth research or multiple team members to resolve or make decision. spike complete Issues that have a research spike completed and dev work can proceed
Projects
None yet
Milestone
Freezer
Development

No branches or pull requests
10 participants
@jcfranco @driskull @alisonailea @macandcheese @geospatialem @benelan @bpatterson88 @ashetland @brittneytewks @jacqueskeet