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

feat(input-time-zone): add max-items support #7705

Merged
merged 3 commits into from
Sep 16, 2023

Conversation

jcfranco
Copy link
Member

@jcfranco jcfranco commented Sep 8, 2023

Related Issue: #7738

Summary

Adds maxItems prop to allow users to define the max items to show before displaying a scrollbar.

Note: this delegates max-items behavior to the internal combobox.

@github-actions github-actions bot added the enhancement Issues tied to a new feature or request. label Sep 8, 2023
@@ -301,6 +304,7 @@ export class InputTimeZone
disabled={this.disabled}
label={this.messages.chooseTimeZone}
lang={this.effectiveLocale}
maxItems={this.maxItems}
Copy link
Contributor

Choose a reason for hiding this comment

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

how will this prop be used? What happens when more items exist than the max allowed items? Will items simply not render or will the customer receive some kind of warning/alert that they have exceeded the max items? Will this be included in a separate PR?

Copy link
Member Author

Choose a reason for hiding this comment

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

Good questions. To summarize, this prop basically defines the amount of items displayed before a scrollbar is displayed.

@jcfranco jcfranco marked this pull request as ready for review September 14, 2023 07:51
@jcfranco jcfranco requested a review from a team as a code owner September 14, 2023 07:51
@@ -80,6 +80,9 @@ export class InputTimeZone
*/
@Prop({ reflect: true }) form: string;

/** Specifies the maximum number of input time zone options to display before displaying a scrollbar. */
Copy link
Member

Choose a reason for hiding this comment

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

WDYT about the following for doc consistency?:

Specifies the component's maximum number of options to display before displaying a scrollbar.

Copy link
Member

@driskull driskull left a comment

Choose a reason for hiding this comment

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

This looks good 👍

Do we know what the purpose of maxItems is? Why are users limiting the items displayed? If this is about being more responsive maybe we can solve the problem without them having to limit items.

@jcfranco
Copy link
Member Author

Do we know what the purpose of maxItems is? Why are users limiting the items displayed? If this is about being more responsive maybe we can solve the problem without them having to limit items.

It was introduced to address #431.

@jcfranco jcfranco added the pr ready for visual snapshots Adding this label will run visual snapshot testing. label Sep 14, 2023
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Sep 14, 2023
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Sep 15, 2023
@jcfranco jcfranco merged commit c698c27 into main Sep 16, 2023
14 checks passed
@jcfranco jcfranco deleted the jcfranco/7430-add-max-items-to-input-time-zone branch September 16, 2023 09:32
geospatialem pushed a commit that referenced this pull request Oct 3, 2023
🤖 I have created a release *beep* *boop*
---


<details><summary>@esri/calcite-components: 1.9.0</summary>

##
[1.9.0](https://github.com/Esri/calcite-design-system/compare/@esri/[email protected]...@esri/[email protected])
(2023-10-03)


### Features

* **action-group:** Add css custom properties to define gap and padding
when layout is "grid"
([#7763](#7763))
([b9bd0de](b9bd0de))
* **action-menu:** Add appearance property to configure trigger
appearance
([#7867](#7867))
([36ceaf1](36ceaf1))
* **alert:** Make component responsive
([#7755](#7755))
([66222b5](66222b5))
* **block, input-time-picker, notice:** Adds `open`, `close`,
`beforeOpen`, and `beforeClose` events for consistent event handling
([#7494](#7494))
([04ce758](04ce758))
* **checkbox:** Add WCAG AA recommended minimum 24px square hotspot
optimized for touch users
([#7773](#7773))
([f13e2c4](f13e2c4))
* **flow, flow-item:** Allow calciteFlowItemBack event to be cancelled
([#7855](#7855))
([b74b4df](b74b4df))
* **input-date-picker, input-time-picker:** Add status property
([#7915](#7915))
([4d53346](4d53346))
* **input-time-zone:** Add max-items support
([#7705](#7705))
([c698c27](c698c27))
* **input-time-zone:** Add time zone offset and name mode
([#7913](#7913))
([80bd6ae](80bd6ae))
* **list:** Add newIndex and oldIndex event details to
calciteListOrderChange event
([#7874](#7874))
([0d5cc20](0d5cc20))
* **pagination:** Enable responsive layout
([#7722](#7722))
([933a910](933a910))
* **panel, flow-item:** Add support for collapsing content
([#7857](#7857))
([855754d](855754d))


### Bug Fixes

* **action-bar:** Improve overflowing horizontal actions.
([#7877](#7877))
([52f2d2a](52f2d2a))
* **action-bar:** Overflow actions when overflowActionsDisabled is set
to false
([#7873](#7873))
([3dcceb0](3dcceb0))
* **action-menu:** Update active selection to not use the action's
active property
([#7911](#7911))
([50f85f1](50f85f1))
* **alert:** Regression fix to restore `calciteAlertBeforeOpen` and
`calciteAlertOpen` event emitting
([#7767](#7767))
([6bbae35](6bbae35))
* **button:** Provides context for AT users when used as reference
element for collapsible content
([#7658](#7658))
([50cb3a6](50cb3a6))
* **combobox:** Clears input value on blur
([#7721](#7721))
([e04cc4e](e04cc4e))
* **combobox:** Fix filtering to avoid showing unrelated items
([#7704](#7704))
([b6d32f3](b6d32f3))
* **dropdown-group:** Set selectionMode on slotted dropdown-item
children
([#7897](#7897))
([aa0731a](aa0731a))
* **dropdown:** Support dispatching enter key event on dropdown trigger
([#7752](#7752))
([ba92463](ba92463))
* **select:** Allow setting an option value to an empty string
([#7769](#7769))
([adca6ec](adca6ec))
* **stepper:** Improves AT Users experience with screen readers
([#7691](#7691))
([071dec7](071dec7))
* **tab-nav:** Update indicator position when tab icon changes
([#7768](#7768))
([cb877b3](cb877b3))
* **table:** Fix selection display in RTL
([#7907](#7907))
([b4c8508](b4c8508))
* **tree:** Avoid modifying selected items for "none" selection-mode
([#7904](#7904))
([0bd4a12](0bd4a12))
* **tree:** Fix tree keyboard selection issue
([#7908](#7908))
([53d6c12](53d6c12))
* **tree:** Update tree selection per design spec
([#7852](#7852))
([06b3594](06b3594))
</details>

<details><summary>@esri/calcite-components-react: 1.9.0</summary>

##
[1.9.0](https://github.com/Esri/calcite-design-system/compare/@esri/[email protected]...@esri/[email protected])
(2023-10-03)


### Miscellaneous Chores

* **@esri/calcite-components-react:** Synchronize undefined versions


### Dependencies

* The following workspace dependencies were updated
  * dependencies
    * @esri/calcite-components bumped from ^1.9.0-next.18 to ^1.9.0
</details>

---
This PR was generated with [Release
Please](https://github.com/googleapis/release-please). See
[documentation](https://github.com/googleapis/release-please#release-please).

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement Issues tied to a new feature or request. pr ready for visual snapshots Adding this label will run visual snapshot testing.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants