diff --git a/app/assets/javascripts/select-kit/addon/components/select-kit.js b/app/assets/javascripts/select-kit/addon/components/select-kit.js index 42d719788fc..56b91d03a89 100644 --- a/app/assets/javascripts/select-kit/addon/components/select-kit.js +++ b/app/assets/javascripts/select-kit/addon/components/select-kit.js @@ -776,10 +776,10 @@ export default Component.extend( if (!this.popper) { const anchor = document.querySelector( - `[data-select-kit-id=${this.selectKit.uniqueID}-header]` + `#${this.selectKit.uniqueID}-header` ); const popper = document.querySelector( - `[data-select-kit-id=${this.selectKit.uniqueID}-body]` + `#${this.selectKit.uniqueID}-body` ); const inModal = $(this.element).parents("#discourse-modal").length; @@ -954,15 +954,11 @@ export default Component.extend( }, getFilterInput() { - return document.querySelector( - `[data-select-kit-id=${this.selectKit.uniqueID}-filter] input` - ); + return document.querySelector(`#${this.selectKit.uniqueID}-filter input`); }, getHeader() { - return document.querySelector( - `[data-select-kit-id=${this.selectKit.uniqueID}-header]` - ); + return document.querySelector(`#${this.selectKit.uniqueID}-header`); }, handleDeprecations() { diff --git a/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-body.js b/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-body.js index bab5cdb7af5..5ef8061fd8e 100644 --- a/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-body.js +++ b/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-body.js @@ -6,11 +6,8 @@ import layout from "select-kit/templates/components/select-kit/select-kit-body"; export default Component.extend({ layout, classNames: ["select-kit-body"], - attributeBindings: ["role", "selectKitId:data-select-kit-id"], + attributeBindings: ["role"], classNameBindings: ["emptyBody:empty-body"], - selectKitId: computed("selectKit.uniqueID", function () { - return `${this.selectKit.uniqueID}-body`; - }), emptyBody: computed("selectKit.{filter,hasNoContent}", function () { return !this.selectKit.filter && this.selectKit.hasNoContent; }), @@ -50,7 +47,7 @@ export default Component.extend({ } const headerElement = document.querySelector( - `[data-select-kit-id=${this.selectKit.uniqueID}-header]` + `#${this.selectKit.uniqueID}-header` ); if (headerElement && headerElement.contains(event.target)) { diff --git a/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-filter.js b/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-filter.js index 9135a95fff2..853b468e109 100644 --- a/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-filter.js +++ b/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-filter.js @@ -11,10 +11,7 @@ export default Component.extend(UtilsMixin, { layout, classNames: ["select-kit-filter"], classNameBindings: ["isExpanded:is-expanded"], - attributeBindings: ["role", "selectKitId:data-select-kit-id"], - selectKitId: computed("selectKit.uniqueID", function () { - return `${this.selectKit.uniqueID}-filter`; - }), + attributeBindings: ["role"], role: "searchbox", diff --git a/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-header.js b/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-header.js index 595e59bbb36..3592630a83d 100644 --- a/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-header.js +++ b/app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-header.js @@ -28,7 +28,6 @@ export default Component.extend(UtilsMixin, { "ariaOwns:aria-owns", "ariaHasPopup:aria-haspopup", "ariaIsExpanded:aria-expanded", - "selectKitId:data-select-kit-id", "roleButton:role", "selectedValue:data-value", "selectedNames:data-name", @@ -63,10 +62,6 @@ export default Component.extend(UtilsMixin, { return icon.concat(icons).filter(Boolean); }), - selectKitId: computed("selectKit.uniqueID", function () { - return `${this.selectKit.uniqueID}-header`; - }), - ariaIsExpanded: computed("selectKit.isExpanded", function () { return this.selectKit.isExpanded ? "true" : "false"; }), @@ -74,7 +69,7 @@ export default Component.extend(UtilsMixin, { ariaHasPopup: "menu", ariaOwns: computed("selectKit.uniqueID", function () { - return `[data-select-kit-id=${this.selectKit.uniqueID}-body]`; + return `${this.selectKit.uniqueID}-body`; }), roleButton: "button", @@ -178,7 +173,7 @@ export default Component.extend(UtilsMixin, { _focusFilterInput() { const filterContainer = document.querySelector( - `[data-select-kit-id=${this.selectKit.uniqueID}-filter]` + `#${this.selectKit.uniqueID}-filter` ); if (filterContainer) { diff --git a/app/assets/javascripts/select-kit/addon/templates/components/email-group-user-chooser-header.hbs b/app/assets/javascripts/select-kit/addon/templates/components/email-group-user-chooser-header.hbs index 4d5f6a2f684..6225633023e 100644 --- a/app/assets/javascripts/select-kit/addon/templates/components/email-group-user-chooser-header.hbs +++ b/app/assets/javascripts/select-kit/addon/templates/components/email-group-user-chooser-header.hbs @@ -16,6 +16,7 @@
{{component selectKit.options.filterComponent selectKit=selectKit + id=(concat selectKit.uniqueID "-filter") }}
{{/unless}} diff --git a/app/assets/javascripts/select-kit/addon/templates/components/multi-select.hbs b/app/assets/javascripts/select-kit/addon/templates/components/multi-select.hbs index 5c7b93adf0c..8672c07becf 100644 --- a/app/assets/javascripts/select-kit/addon/templates/components/multi-select.hbs +++ b/app/assets/javascripts/select-kit/addon/templates/components/multi-select.hbs @@ -4,9 +4,10 @@ value=value selectedContent=selectedContent selectKit=selectKit + id=(concat selectKit.uniqueID "-header") }} - {{#select-kit/select-kit-body selectKit=selectKit}} + {{#select-kit/select-kit-body selectKit=selectKit id=(concat selectKit.uniqueID "-body")}} {{#if selectKit.isLoading}} {{loading-spinner size="small"}} diff --git a/app/assets/javascripts/select-kit/addon/templates/components/multi-select/multi-select-header.hbs b/app/assets/javascripts/select-kit/addon/templates/components/multi-select/multi-select-header.hbs index 67b7191840b..0b3792d56b9 100644 --- a/app/assets/javascripts/select-kit/addon/templates/components/multi-select/multi-select-header.hbs +++ b/app/assets/javascripts/select-kit/addon/templates/components/multi-select/multi-select-header.hbs @@ -11,6 +11,7 @@
{{component selectKit.options.filterComponent selectKit=selectKit + id=(concat selectKit.uniqueID "-filter") }}
{{/unless}} diff --git a/app/assets/javascripts/select-kit/addon/templates/components/single-select.hbs b/app/assets/javascripts/select-kit/addon/templates/components/single-select.hbs index 7fac16c9f52..78f88ef5dae 100644 --- a/app/assets/javascripts/select-kit/addon/templates/components/single-select.hbs +++ b/app/assets/javascripts/select-kit/addon/templates/components/single-select.hbs @@ -4,10 +4,11 @@ value=value selectedContent=selectedContent selectKit=selectKit + id=(concat selectKit.uniqueID "-header") }} - {{#select-kit/select-kit-body selectKit=selectKit}} - {{component selectKit.options.filterComponent selectKit=selectKit}} + {{#select-kit/select-kit-body selectKit=selectKit id=(concat selectKit.uniqueID "-body")}} + {{component selectKit.options.filterComponent selectKit=selectKit id=(concat selectKit.uniqueID "-filter")}} {{#if selectKit.isLoading}}