List Selector by zsarnett · Pull Request #12099 · home-assistant/frontend

zsarnett · 2022-03-22T21:25:48Z

Breaking change

Proposed change

Type of change

Dependency upgrade
Bugfix (non-breaking change which fixes an issue)
New feature (thank you!)
Breaking change (fix/feature causing existing functionality to break)
Code quality improvements to existing code or addition of tests

Example configuration

Additional information

This PR fixes or closes issue: fixes #
This PR is related to issue or discussion:
Link to documentation pull request:

Checklist

The code change is tested and works locally.
There is no commented out code in this PR.
Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

Documentation added/updated for www.home-assistant.io

src/components/ha-selector/ha-selector-select.ts

balloob · 2022-03-22T22:34:00Z

src/components/ha-selector/ha-selector-select.ts

+    ev.stopPropagation();
+    const newValue = ev.detail.value;
+
+    if (this.disabled || newValue === "") {


You need to validate that the new value is an allowed value if custom value is not set.

You need to empty the combobox after picking an option

Actually, should it be a combobox or just a dropdown ?

Combo box allows for select and custom values

If custom value is not set then it will only allow allowed values

I tried to empty the combobox but couldn't figure it out haha

SEtting the value didn't seem to work

balloob · 2022-03-22T22:34:36Z

src/components/ha-selector/ha-selector-select.ts

+    ha-select {
+      width: 100%;
+    }
+    mwc-formfield {


Suggested change

ha-select {

width: 100%;

}

mwc-formfield {

ha-select,

mwc-formfield {

balloob · 2022-03-22T22:35:24Z

src/components/ha-selector/ha-selector-select.ts

+          )}
+        </ha-chip-set>
+        <ha-combo-box
+          allowCustomValue=${ifDefined(this.selector.select.custom_value)}


Suggested change

allowCustomValue=${ifDefined(this.selector.select.custom_value)}

.allowCustomValue=${this.selector.select.custom_value === true}

src/components/ha-selector/ha-selector-select.ts

zsarnett · 2022-03-29T18:15:16Z

src/components/ha-selector/ha-selector-select.ts

+    // Trying to reset the value... Not working currently
+    this._filter = "";
+    this.comboBox.value = "";
+    this.requestUpdate();


I cannot find a way to clear the value of the combo box. I feel like its trivial but I am looking past it

balloob · 2022-03-30T05:24:44Z

https://deploy-preview-12099--home-assistant-gallery.netlify.app/#components/ha-selector

Things I noticed:

Select (Custom) data is not being updated on the element in the other column. Data is shown correctly in the data dump.
Dark mode is not working anymore on right column?
Select Multiple allows selecting same option twice
Removing an selected option from Select Multiple doesn't remove the option in the other column. Picking an option will reflect current value correctly
Chips don't wrap correctly

gallery/src/pages/components/ha-selector.ts

src/components/ha-selector/ha-selector-select.ts

balloob · 2022-03-30T05:37:18Z

src/components/ha-selector/ha-selector-select.ts

+          .label=${this.label}
+          .disabled=${this.disabled}
+          .value=${this._filter}
+          .items=${options}


filter out picked options.

src/components/ha-selector/ha-selector-select.ts

balloob · 2022-03-30T05:41:48Z

src/components/ha-selector/ha-selector-select.ts

+
+    // Trying to reset the value... Not working currently
+    this._filter = "";
+    this.comboBox.value = "";


I know it's just experimenting to get it working, but we should never manipulate values that are being set by Lit.

src/components/ha-selector/ha-selector-select.ts

@Changed

* Add a docs icon to the config flow dialog * Use same help icon everywhere * Fix quickbar overlaying, fix click handling (#11900) * Supervisor mobile click accessibility (#11915) * Convert objects to string in config flow error (#11908) * Fix datepicker triangle (#11920) * Always show tab labels (#11919) * Remove zwave and ozw panels (#11911) Remove zwave and ozw panels * Convert lovelace config dialogs to ha-form (#11910) * Guard setting up config flow for an unsupported domain (#11937) * Show triggered vars on click (#11924) * Allow marking YAML editor as read only (#11960) * Convert inputs (#11907) * Convert inputs * Update dialog-thingtalk.ts * imports * Remove some additional old zwave code (#11941) * Correct media upload error + add file name (#11949) Co-authored-by: Bram Kragten <mail@bramkragten.nl> * Fix humidifier more info mode dropdown (#11964) * Make min width of select configurable (#11965) * Fix for Statistics Editor (#11942) Co-authored-by: Bram Kragten <mail@bramkragten.nl> * A11y expansion panel (#11967) * Convert file upload to mdc (#11906) * Add location selector, convert zone editor (#11902) * Add systemd_resolved unsupported reason (#11971) * replace default switch icon to make it stand out against a power entity which uses the same mdiFlash home-assistant/core#67620 (comment) suggest the Outline version, so create a subtle difference with the on/off icons. * Allow selecting multiple entities (#11986) * Fix theme setting (#11977) * Update Style of Design Page (#11982) * change icon to mimic physical device and follow comments * Use entities-picker in entity selector (#11990) * #11971 Change order of alarm panel buttons (#11998) * Fix zwave_js 'add/remove device' disabled bug (#12000) * Fix zwave_js 'add/remove device' disabled bug * revert extra change * Fix zwave_js set config dropdown default value (#11974) Co-authored-by: Paulus Schoutsen <paulus@home-assistant.io> * Fix changing cost number in energy settings (#12009) * Fix Dashboard Editing (#12011) * Fix For Selecting Device Class (#12010) * Fix: Allow for deleting Input_select options (#12007) * Script ID update with Alias (#12008) * HAWS 6.1 (#12016) * Bumped version to 20220301.1 * Bumped version to 20220301.2 * Bumped version to 20220312.0 * Add shade to device class overrides (#11874) * Fix: Changing Blueprint Automation Name (#12036) * Fix @Changed where using ev.detail (#12043) * Add all cover device classes (#12042) * Rename Lovelace Dashboard to just Dashboard (#12044) Co-authored-by: Zack Barett <zackbarett@hey.com> * Add Color Temp Selector (#12041) * Utilize Hide Hidden Entities * Reviews * add to demo * Add `Brand` folder and `Our story` page (#11978) Co-authored-by: Zack Barett <zackbarett@hey.com> * Add HA to public folder and show in markdown * Update Translations * Disabled by * remove 1 * Add Description of chosen * Add icons and buttons * Add Color RGB Selector (#12039) * Add Date Selector * Add ha-form context (#12062) * test condition (#11925) * Revamp URL form (#12060) * Add support for menu data entry flow option (#12055) * Add translation * add to basic editor and update advanced style * clean up * Entity Status * Add Devices Picker (#12056) * Remvoe redunency * Bumped version to 20220316.0 * Bump HAWS to 7.0.0 (#12067) * Create new Logo page * Add files via upload * Ignore diagnostics not found exceptions (#12066) * Bump HAWS to 7.0.1 * Update lock * Add Date Time Selector (#12070) * Add radio Form Logic to Select Selector (#12063) * Bumped version to 20220317.0 (#12074) * Update gallery/src/pages/brand/logo.markdown Co-authored-by: Zack Barett <zackbarett@hey.com> * Update gallery/src/pages/brand/logo.markdown Co-authored-by: Zack Barett <zackbarett@hey.com> * Update logo.markdown * Fetch history with `no_attributes` for entities that do not need them (#12082) * Update required version of MDI to 6.6.95 * Upload release assets (#11566) Co-authored-by: Joakim Sørensen <hi@ludeeus.dev> * Update styles for hui-editor Update the background-color and text-color of the app-toolbar in hui-editor to match the styles of hui-root while in edit-mode. Previously, these properties were set using undefined css variables that could not be changed via themes (--dark-background-color and --dark-text-color). * Fix gas energy graph units if stats added by external source (#11892) * Change Netlify preview URL (#12095) * Update src/dialogs/config-flow/dialog-data-entry-flow.ts * Stack Action Inputs in the Button Editor (#12076) * Stack Action Inputs in the Button Editor * update style * Update for other editors * Add support for update entities (#12059) * Add support for update entities * Apply suggestions from code review Co-authored-by: Zack Barett <zackbarett@hey.com> * Add to gallery * implement xx% * Adjustments for skipped * Add progress bar * Add UPDATE_SUPPORT_INSTALL * Allow skipping without install support * Add version to service call if supported * Adjust changelog link * Use Installing * adjustments * Use unavailable Co-authored-by: Zack Barett <zackbarett@hey.com> * Add support for integration type (#12077) * Update When entity can change enabled or hidden (#12096) * Add entity include and exclude to selector (#12078) Co-authored-by: Paulus Schoutsen <balloob@gmail.com> * change from hidden to not shown (#12097) * Add statistic adjust dialog (#12101) Co-authored-by: Zack Barett <zackbarett@hey.com> * Fix Duration Selector Default (#12098) * Fix Duration Default * USe initial form data function * Bumped version to 20220322.0 (#12102) * Create user types page and rename the category (#12089) Co-authored-by: Zack Barett <zackbarett@hey.com> Co-authored-by: Paulus Schoutsen <balloob@gmail.com> * Remove `setup.py` (#11593) * Fix selecting 0 with number selector * Update lock file with MDI updates * Use update entities for showing updates on configuration panel (#12100) Co-authored-by: Paulus Schoutsen <balloob@gmail.com> * Fix loading traces for automation with custom id (#12112) * Only show docs link when showing a form * Exclude restored automations from dashboard (#12113) * Support descriptions in flow menu steps (#12108) Co-authored-by: Paulus Schoutsen <balloob@gmail.com> * Sort selectors (#12120) * Update type for backend (#12122) * Fix issue where theme select does not appear when user's theme is deleted (#12104) * Fix possibility to enable entity disabled by integration (#12121) Co-authored-by: Zack Barett <zackbarett@hey.com> * Allow rendering helper text from strings.json (#12119) * Allow rendering helper text from strings.json * Persistent helpers * Update src/components/ha-base-time-input.ts Co-authored-by: Zack Barett <zackbarett@hey.com> * Update src/components/ha-base-time-input.ts Co-authored-by: Zack Barett <zackbarett@hey.com> * Add Day to duration selector (#12125) * Add variables to automation trigger type * Fix z-index map, always set icon for location selector (#12137) * Make padding on settings row content consistent (#12139) * Add Area Multiple Selector option (#12138) * break theme picker out of lovelace (#12140) * Allow binary sensor device class updates (#12124) * Add selector initial values (#12142) * Add badge to configuration sidebar to indicate pending updates (#12146) * Bumped version to 20220329.0 (#12152) * Add entity source API (#12149) * Update adjust statistic dialog (#12118) * Update text for adjust statistic dialog * Change everything * Import type * Max show 5 * Revert back the API change * Hide adjust button if no sum * Adjustments * Update src/panels/developer-tools/statistics/developer-tools-statistics.ts * Render optional Co-authored-by: Zack <zackbarett@hey.com> * Fetch release notes for update entities that provides it (#12148) * Fetch release notes for update entities that provides it * lint * Add support for new timer properties (#11940) * Fix theme settings on design page (#12154) * Allow ha-alert to be used in our markdown render (#12153) * Allow device_tracker entities to use state_color (#12127) * Automation description text overflow (#12040) Co-authored-by: Bram Kragten <mail@bramkragten.nl> * Update Pickers and selectors with required (#12151) * Update Pickers and selectors with required * Use native * for device and entity * Add support for my links to create a helper config entry (#12155) * Use brand icon instead of domain icon for helpers (#12157) * Import components that are allowed to be defined in markdown (#12158) * Add options to selectors gallery (#12156) * Add helpers to list when searching in add integration (#12159) * List Selector (#12099) Co-authored-by: Bram Kragten <mail@bramkragten.nl> * Add shuffle and repeat-mode of media_player to UI (#12052) Co-authored-by: Paulus Schoutsen <balloob@gmail.com> * Add panel to Backup integration (#11671) Co-authored-by: Zack Barett <zackbarett@hey.com> Co-authored-by: Paulus Schoutsen <balloob@gmail.com> * Fix for Mobile View of Entities Table (#12160) * Allow Sensor Units to be updated via Entity Registry (#12143) * Add switch as x to entity settings (#12161) Co-authored-by: Zack <zackbarett@hey.com> * Bumped version to 20220330.0 (#12164) Co-authored-by: Paulus Schoutsen <balloob@gmail.com> Co-authored-by: Bram Kragten <mail@bramkragten.nl> Co-authored-by: Steve Repsher <steverep@users.noreply.github.com> Co-authored-by: Robin Wittebol <robinwittebol@live.nl> Co-authored-by: Raman Gupta <7243222+raman325@users.noreply.github.com> Co-authored-by: Philip Allgaier <philip.allgaier@gmx.de> Co-authored-by: Joakim Sørensen <ludeeus@ludeeus.dev> Co-authored-by: Marius <33354141+Mariusthvdb@users.noreply.github.com> Co-authored-by: Emil Stjerneman <emil@stjerneman.com> Co-authored-by: Charles Garwood <cgarwood@gmail.com> Co-authored-by: Paulus Schoutsen <paulus@home-assistant.io> Co-authored-by: jpearl <jpearl@users.noreply.github.com> Co-authored-by: Matthias de Baat <matthias.debaat@nabucasa.com> Co-authored-by: Matthias de Baat <hello@matthiasdebaat.com> Co-authored-by: J. Nick Koston <nick@koston.org> Co-authored-by: Michael Irigoyen <michael@irigoyen.dev> Co-authored-by: Marc Mueller <30130371+cdce8p@users.noreply.github.com> Co-authored-by: Joakim Sørensen <hi@ludeeus.dev> Co-authored-by: Nick Iacullo <duckycrayfish@gmail.com> Co-authored-by: Pawel <pszafer@gmail.com> Co-authored-by: Erik <erik@montnemery.com> Co-authored-by: Brynley McDonald <brynley+github@zephire.nz> Co-authored-by: blair <1585872+blairun@users.noreply.github.com> Co-authored-by: NachtaktiverHalbaffe <57433516+NachtaktiverHalbaffe@users.noreply.github.com>

homeassistant added the cla-signed label Mar 22, 2022

balloob reviewed Mar 22, 2022

View reviewed changes

src/components/ha-selector/ha-selector-select.ts Show resolved Hide resolved

balloob reviewed Mar 22, 2022

View reviewed changes

src/components/ha-selector/ha-selector-select.ts Show resolved Hide resolved

zsarnett marked this pull request as draft March 24, 2022 13:29

zsarnett force-pushed the list-selector branch from 6b69393 to 33114da Compare March 29, 2022 14:41

zsarnett marked this pull request as ready for review March 29, 2022 18:14

zsarnett commented Mar 29, 2022

View reviewed changes

balloob added the needs design preview PRs with this label will trigger a GitHub action to generate a gallery preview label Mar 30, 2022

balloob reviewed Mar 30, 2022

View reviewed changes

gallery/src/pages/components/ha-selector.ts Outdated Show resolved Hide resolved

balloob reviewed Mar 30, 2022

View reviewed changes

src/components/ha-selector/ha-selector-select.ts Show resolved Hide resolved

balloob reviewed Mar 30, 2022

View reviewed changes

src/components/ha-selector/ha-selector-select.ts Outdated Show resolved Hide resolved

balloob reviewed Mar 30, 2022

View reviewed changes

src/components/ha-selector/ha-selector-select.ts Show resolved Hide resolved

zsarnett and others added 10 commits March 30, 2022 10:19

List Selector

46a03b9

Fix merge

021f391

Choose value from list

ab2b0f2

Add Checkbox and modes

5ae9b11

Add new modes and types

2589a43

start fixing reviews

23bdf43

fix

5a5246b

Update ha-selector-select.ts

462b901

Reviews

047a71b

required

e243cf2

zsarnett force-pushed the list-selector branch from a115d36 to e243cf2 Compare March 30, 2022 15:21

balloob approved these changes Mar 30, 2022

View reviewed changes

balloob merged commit 9444228 into dev Mar 30, 2022

balloob deleted the list-selector branch March 30, 2022 16:14

This was referenced Mar 31, 2022

Add support for new select selector properties home-assistant/core#68952

Merged

Update docs for select selector home-assistant/home-assistant.io#22207

Merged

github-actions bot locked and limited conversation to collaborators Mar 31, 2022

	allowCustomValue=${ifDefined(this.selector.select.custom_value)}
	.allowCustomValue=${this.selector.select.custom_value === true}

Conversation

zsarnett commented Mar 22, 2022

Breaking change

Proposed change

Type of change

Example configuration

Additional information

Checklist

Uh oh!

Uh oh!

balloob Mar 22, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

balloob Mar 22, 2022

Choose a reason for hiding this comment

Uh oh!

zsarnett Mar 22, 2022

Choose a reason for hiding this comment

Uh oh!

zsarnett Mar 22, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

balloob Mar 22, 2022

Choose a reason for hiding this comment

Uh oh!

balloob Mar 22, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

zsarnett Mar 29, 2022

Choose a reason for hiding this comment

Uh oh!

balloob commented Mar 30, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

balloob Mar 30, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

balloob Mar 30, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

balloob Mar 22, 2022 •

edited

Loading

zsarnett Mar 22, 2022 •

edited

Loading

balloob Mar 22, 2022 •

edited

Loading

balloob commented Mar 30, 2022 •

edited

Loading