From 23d4d0014d1eafa9aad08df2e7442824fca15fae Mon Sep 17 00:00:00 2001
From: Danny Moerkerke <danny.moerkerke@ing.com>
Date: Tue, 3 May 2022 11:39:36 +0200
Subject: [PATCH 1/2] fix: fixes issue 1483

replaced `getElementById` with `querySelector` so correct element  is also selected when size = inline
---
 docs/components/select-rich/use-cases.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/components/select-rich/use-cases.md b/docs/components/select-rich/use-cases.md
index 6118a2578..2008a13d0 100644
--- a/docs/components/select-rich/use-cases.md
+++ b/docs/components/select-rich/use-cases.md
@@ -188,7 +188,7 @@ export const checkedIndexAndValue = ({ shadowRoot }) => html`
       aria-labelledby="label-richSelectCheckedInput"
       type="number"
       @change=${e => {
-        const selectEl = shadowRoot.getElementById('checkedRichSelect');
+        const selectEl = shadowRoot.querySelector('#checkedRichSelect');
         selectEl.checkedIndex = e.target.value;
       }}
     />
@@ -196,7 +196,7 @@ export const checkedIndexAndValue = ({ shadowRoot }) => html`
   <button
     class="log-button"
     @click=${() => {
-      const selectEl = shadowRoot.getElementById('checkedRichSelect');
+      const selectEl = shadowRoot.querySelector('#checkedRichSelect');
       console.log(`checkedIndex: ${selectEl.checkedIndex}`);
       console.log(`checkedValue: ${selectEl.checkedValue}`);
     }}

From 466471cbe9156aa47b807f80ea59c86286e2dd78 Mon Sep 17 00:00:00 2001
From: Danny Moerkerke <danny.moerkerke@ing.com>
Date: Mon, 16 May 2022 12:11:59 +0200
Subject: [PATCH 2/2] fix: replaced `checkedValue` with `modelValue`

---
 docs/components/select-rich/use-cases.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/components/select-rich/use-cases.md b/docs/components/select-rich/use-cases.md
index 2008a13d0..7f64fc5fa 100644
--- a/docs/components/select-rich/use-cases.md
+++ b/docs/components/select-rich/use-cases.md
@@ -198,7 +198,7 @@ export const checkedIndexAndValue = ({ shadowRoot }) => html`
     @click=${() => {
       const selectEl = shadowRoot.querySelector('#checkedRichSelect');
       console.log(`checkedIndex: ${selectEl.checkedIndex}`);
-      console.log(`checkedValue: ${selectEl.checkedValue}`);
+      console.log(`modelValue: ${selectEl.modelValue}`);
     }}
   >
     Console log checked index and value