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.

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

Add "slack" width constraint modes #865

Merged
merged 28 commits into from
Feb 10, 2021

Conversation

ahmacleod
Copy link
Contributor

@ahmacleod ahmacleod commented Feb 4, 2021

Adds two width constraint modes: eq-container-slack, gte-container-slack. These build on their non-"slack" counterparts by allocating excess container whitespace into an additional column that vanishes when it is no longer needed. This resembles behavior in applications like Excel and Google sheets.

BONUS ADDITION: initialFillMode parameter that is used exclusively in slack modes to perform the initial column layout. Values and default are the same as fillMode. In eq-container-slack mode, fillMode and initialFillMode can be set to different values. The former is used for enforcing the width constraint, while the latter is used only for initial sizing. See docs & tests for examples.

Which constraint modes use which fill modes:

Advantages:

  • More closely resembles resize behavior in applications like Excel, Google Sheets
  • Frees the rightmost column; e.g. if table has two columns and the right column is right-aligned, this makes it possible to bring the right column values to the left for easier comparison.
  • Preserves the width of the rightmost column

Notes:

  • The slack column cannot be reordered or manually resized
  • There is no slack counterpart for lte-container or none
  • fillMode has no effect in gte-container-slack mode, but does still apply when enlarging columns beyond the container size in eq-container-slack mode
  • resizeMode can be fluid, but standard (shown below) provides a more consistent UX
  • initialFillMode should be used with slack modes if a "responsive" initial layout is desired

eq-container-slack

20210204 eq-container-slack

gte-container-slack

20210204 gte-container-slack

@ahmacleod ahmacleod marked this pull request as draft February 4, 2021 22:22
@ahmacleod ahmacleod changed the title [WIP] Add "slack" width constraint modes Add "slack" width constraint modes Feb 4, 2021
@ahmacleod ahmacleod force-pushed the alex.macleod.temp/expand-table-beyond-max-width branch from 4a38a16 to 9496542 Compare February 8, 2021 21:06
@ahmacleod ahmacleod marked this pull request as ready for review February 8, 2021 21:18
@ahmacleod ahmacleod force-pushed the alex.macleod.temp/expand-table-beyond-max-width branch from 877dcd4 to d4f7500 Compare February 8, 2021 21:56
Copy link
Contributor

@twokul twokul left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Noted a few things. LGTM otherwise! 🎉

addon/-private/column-tree.js Outdated Show resolved Hide resolved
addon/-private/column-tree.js Outdated Show resolved Hide resolved
addon/components/ember-thead/component.js Outdated Show resolved Hide resolved
@ahmacleod ahmacleod force-pushed the alex.macleod.temp/expand-table-beyond-max-width branch from 11d530f to 5272398 Compare February 9, 2021 21:24
@ahmacleod
Copy link
Contributor Author

Refactored to get rid of isInitialRun entirely. We now have performInitialLayout() and ensureWidthConstraint(). No funny business.

Copy link
Contributor

@twokul twokul left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code has changed since my last review. Noted a few things ✍️

.github/workflows/ci.yml Outdated Show resolved Hide resolved
addon/-private/column-tree.js Outdated Show resolved Hide resolved
addon/-private/column-tree.js Show resolved Hide resolved
addon/-private/column-tree.js Show resolved Hide resolved
config/ember-try.js Outdated Show resolved Hide resolved
@ahmacleod ahmacleod merged commit a598a5c into 3.0-beta Feb 10, 2021
@ahmacleod ahmacleod deleted the alex.macleod.temp/expand-table-beyond-max-width branch February 10, 2021 17:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants