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

Split button width appears to size relative to content instead of container #7692

Closed
2 of 3 tasks
nwhittaker opened this issue Sep 6, 2023 · 8 comments
Closed
2 of 3 tasks

Split button width appears to size relative to content instead of container #7692

nwhittaker opened this issue Sep 6, 2023 · 8 comments
Assignees
@geospatialem
Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Field Apps Issues logged by ArcGIS Field Apps team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. calcite-components Issues specific to the @esri/calcite-components package. estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - medium Issue is non core or affecting less that 60% of people using the library spike complete Issues that have a research spike completed and dev work can proceed
Milestone
2023 November Pri...

Comments

@nwhittaker
Copy link
Contributor

nwhittaker commented Sep 6, 2023 •
edited
Loading

Check existing issues

Actual Behavior

Given a split button with a width of full, the button does not grow to fill the width of its container:

Screenshot 2023-09-06 at 5 43 14 PM

Additionally, a width of half appears to size the button to half the width of its content, truncating its text content.

Expected Behavior

Given a split button with a width of full, the button grows to fill the width of its container:

Screenshot 2023-09-06 at 5 43 34 PM

A width of half should size the button to half the width of its container.

Reproduction Sample

https://developers.arcgis.com/calcite-design-system/components/split-button/

Reproduction Steps

  1. Visit the split button's doc page and set the width attribute to full or half in the Sample area.
  2. Visit the regular button's doc page and compare its behavior when setting the width attribute.

Reproduction Version

1.7.0

Relevant Info

No response

Regression?

No response

Priority impact

p4 - not time sensitive

Impact

No response

Calcite package

  • @esri/calcite-components
  • @esri/calcite-components-react

Esri team

ArcGIS Field Apps
@nwhittaker nwhittaker added bug Bug reports for broken functionality. Issues should include a reproduction of the bug. 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels Sep 6, 2023
@github-actions github-actions bot added calcite-components Issues specific to the @esri/calcite-components package. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive ArcGIS Field Apps Issues logged by ArcGIS Field Apps team members. labels Sep 6, 2023
@geospatialem geospatialem added breaking change Issues and pull requests with code changes that are not backwards compatible. spike Issues that need quick investigations for time estimations, prioritization, or a quick assessment. p - medium Issue is non core or affecting less that 60% of people using the library and removed breaking change Issues and pull requests with code changes that are not backwards compatible. labels Sep 18, 2023
@geospatialem
Copy link
Member

Spike to determine the working instance with button, and where split-button may need additional effort for consistency. An estimate and next steps will be provided, with implementation in a future milestone.

@geospatialem geospatialem removed the needs triage Planning workflow - pending design/dev review. label Sep 18, 2023
@geospatialem
Copy link
Member

Spike efforts might have similar groupings/relationships to #5903.

Consider tackling as a research effort in coordination.

@geospatialem geospatialem mentioned this issue Oct 23, 2023
Closed
@jcfranco jcfranco self-assigned this Nov 6, 2023
@jcfranco jcfranco added 2 - in development Issues that are actively being worked on. and removed 0 - new New issues that need assignment. labels Nov 6, 2023
@jcfranco jcfranco mentioned this issue Nov 6, 2023
Merged
@jcfranco jcfranco added the estimate - 2 Small fix or update, may require updates to tests. label Nov 6, 2023
@jcfranco
Copy link
Member

jcfranco commented Nov 7, 2023

After digging a bit, it looks like width styles were being applied internally and not on the host, so it would not affect how it was laid out. This is a low effort fix and feasible for the current milestone. While #5903 may have an impact on the component, I think it's a separate matter.

@jcfranco jcfranco added spike complete Issues that have a research spike completed and dev work can proceed and removed spike Issues that need quick investigations for time estimations, prioritization, or a quick assessment. labels Nov 7, 2023
@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. labels Nov 7, 2023
@github-actions github-actions bot removed this from the 2023 November Priorities milestone Nov 7, 2023
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Nov 7, 2023

cc @geospatialem, @brittneytewks

@jcfranco
Copy link
Member

jcfranco commented Nov 7, 2023

@geospatialem Sidebar, it looks like the brand new spike action isn't clearing all labels prior to assigning 0 - new.

@jcfranco jcfranco added this to the 2023 November Priorities milestone Nov 7, 2023
@jcfranco jcfranco removed the 0 - new New issues that need assignment. label Nov 7, 2023
@jcfranco jcfranco self-assigned this Nov 7, 2023
@jcfranco jcfranco removed the needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. label Nov 7, 2023
@geospatialem
Copy link
Member

geospatialem commented Nov 7, 2023 •
edited
Loading

@geospatialem Sidebar, it looks like the brand new spike action isn't clearing all labels prior to assigning 0 - new.

Ah, yes, this looks like its because it was set to 2 - in development. @jcfranco Is that a current pattern we should account for, in addition to 1 - assigned? I can update the script to account for both scenarios.

@geospatialem geospatialem mentioned this issue Nov 7, 2023
Merged
geospatialem added a commit that referenced this issue Nov 7, 2023
@geospatialem
ci: update spike complete automation to try removing dev lifecycle la…
76dca36 
…bel (#8136)

**Related Issue:** n/a

## Summary
Tries to remove the `2 - in development` lifecycle label, if present on
the issue when completing a spike to properly clear all the labels. cc:
@jcfranco

Refer to
#7692 (comment)
and
#7692 (comment)
for additional context.
jcfranco added a commit that referenced this issue Nov 7, 2023
@jcfranco
fix(split-button): fix width layout (#8133)
051f332 
**Related Issue:** #7692

## Summary

This fixes an issue where styles related to `width` were being applied
internally and had no impact on the component.
@jcfranco jcfranco added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 2 - in development Issues that are actively being worked on. labels Nov 7, 2023
@github-actions github-actions bot assigned geospatialem and unassigned jcfranco Nov 7, 2023
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Nov 7, 2023

Installed and assigned for verification.

jcfranco pushed a commit that referenced this issue Nov 9, 2023
@geospatialem @jcfranco
ci: update spike complete automation to try removing dev lifecycle la…
9f12fac 
…bel (#8136)

**Related Issue:** n/a

## Summary
Tries to remove the `2 - in development` lifecycle label, if present on
the issue when completing a spike to properly clear all the labels. cc:
@jcfranco

Refer to
#7692 (comment)
and
#7692 (comment)
for additional context.
jcfranco added a commit that referenced this issue Nov 9, 2023
@jcfranco
fix(split-button): fix width layout (#8133)
a531782 
**Related Issue:** #7692

## Summary

This fixes an issue where styles related to `width` were being applied
internally and had no impact on the component.
@geospatialem geospatialem added 4 - verified Issues that have been released and confirmed resolved. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels Nov 16, 2023
@geospatialem
Copy link
Member

Verified in 1.11.0-next.3 with https://codepen.io/geospatialem/pen/GRzOzQJ using the width set as "full" and "half".

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@geospatialem geospatialem

Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Field Apps Issues logged by ArcGIS Field Apps team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. calcite-components Issues specific to the @esri/calcite-components package. estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - medium Issue is non core or affecting less that 60% of people using the library spike complete Issues that have a research spike completed and dev work can proceed
Projects
None yet
Milestone
2023 November Priorities
Development

No branches or pull requests
3 participants
@jcfranco @nwhittaker @geospatialem