From 2be0495ce2ff75b39b02b3a0022be23fdd2acc9d Mon Sep 17 00:00:00 2001
From: JC Franco <jfranco@esri.com>
Date: Fri, 1 Dec 2023 16:16:08 -0800
Subject: [PATCH] chore(dropdown): update demo page to use selected vs active

---
 .../src/demos/dropdown.html                   | 100 +++++++++---------
 1 file changed, 50 insertions(+), 50 deletions(-)

diff --git a/packages/calcite-components/src/demos/dropdown.html b/packages/calcite-components/src/demos/dropdown.html
index 2f44f37f8ea..3c077ca178f 100644
--- a/packages/calcite-components/src/demos/dropdown.html
+++ b/packages/calcite-components/src/demos/dropdown.html
@@ -59,7 +59,7 @@
           <calcite-dropdown scale="s" width="s">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -70,7 +70,7 @@
           <calcite-dropdown scale="m" width="s">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -81,7 +81,7 @@
           <calcite-dropdown scale="l" width="s">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -97,7 +97,7 @@
           <calcite-dropdown scale="s" width="m">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -108,7 +108,7 @@
           <calcite-dropdown scale="m" width="m">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -119,7 +119,7 @@
           <calcite-dropdown scale="l" width="m">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -135,7 +135,7 @@
           <calcite-dropdown scale="s" width="l">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -146,7 +146,7 @@
           <calcite-dropdown scale="m" width="l">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -157,7 +157,7 @@
           <calcite-dropdown scale="l" width="l">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -175,7 +175,7 @@
           <calcite-dropdown scale="s">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -186,7 +186,7 @@
           <calcite-dropdown scale="m">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -197,7 +197,7 @@
           <calcite-dropdown scale="l">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -213,7 +213,7 @@
           <calcite-dropdown scale="s" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -224,7 +224,7 @@
           <calcite-dropdown scale="m" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -235,7 +235,7 @@
           <calcite-dropdown scale="l" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -251,7 +251,7 @@
           <calcite-dropdown scale="s" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -262,7 +262,7 @@
           <calcite-dropdown scale="m" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -273,7 +273,7 @@
           <calcite-dropdown scale="l" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-start="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-start="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-start="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -289,7 +289,7 @@
           <calcite-dropdown scale="s" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -300,7 +300,7 @@
           <calcite-dropdown scale="m" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -311,7 +311,7 @@
           <calcite-dropdown scale="l" selection-mode="multiple">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -329,7 +329,7 @@
           <calcite-dropdown scale="s" selection-mode="none">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale S</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -340,7 +340,7 @@
           <calcite-dropdown scale="m" selection-mode="none">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale M</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -351,7 +351,7 @@
           <calcite-dropdown scale="l" selection-mode="none">
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger">Scale L</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -455,7 +455,7 @@
               <calcite-dropdown-item id="item-22">22</calcite-dropdown-item>
               <calcite-dropdown-item id="item-23">23</calcite-dropdown-item>
               <calcite-dropdown-item id="item-24">24</calcite-dropdown-item>
-              <calcite-dropdown-item id="item-25" active>25</calcite-dropdown-item>
+              <calcite-dropdown-item id="item-25" selected>25</calcite-dropdown-item>
             </calcite-dropdown-group>
           </calcite-dropdown>
         </div>
@@ -488,7 +488,7 @@
               <calcite-dropdown-item id="item-22">22</calcite-dropdown-item>
               <calcite-dropdown-item id="item-23">23</calcite-dropdown-item>
               <calcite-dropdown-item id="item-24">24</calcite-dropdown-item>
-              <calcite-dropdown-item id="item-25" active>25</calcite-dropdown-item>
+              <calcite-dropdown-item id="item-25" selected>25</calcite-dropdown-item>
             </calcite-dropdown-group>
           </calcite-dropdown>
         </div>
@@ -521,7 +521,7 @@
               <calcite-dropdown-item id="item-22">22</calcite-dropdown-item>
               <calcite-dropdown-item id="item-23">23</calcite-dropdown-item>
               <calcite-dropdown-item id="item-24">24</calcite-dropdown-item>
-              <calcite-dropdown-item id="item-25" active>25</calcite-dropdown-item>
+              <calcite-dropdown-item id="item-25" selected>25</calcite-dropdown-item>
             </calcite-dropdown-group>
           </calcite-dropdown>
         </div>
@@ -538,12 +538,12 @@
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger"> two groups </calcite-button>
             <calcite-dropdown-group group-title="Sort by">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active> Date modified </calcite-dropdown-item>
+              <calcite-dropdown-item selected> Date modified </calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group group-title="Sort Direction">
               <calcite-dropdown-item>Least recent</calcite-dropdown-item>
-              <calcite-dropdown-item active>Most recent</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Most recent</calcite-dropdown-item>
             </calcite-dropdown-group>
           </calcite-dropdown>
         </div>
@@ -553,16 +553,16 @@
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger"> three groups </calcite-button>
             <calcite-dropdown-group group-title="Sort by">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group group-title="Sort Direction">
-              <calcite-dropdown-item active>Least recent</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Least recent</calcite-dropdown-item>
               <calcite-dropdown-item>Most recent</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group group-title="Price">
               <calcite-dropdown-item>Less</calcite-dropdown-item>
-              <calcite-dropdown-item active>More</calcite-dropdown-item>
+              <calcite-dropdown-item selected>More</calcite-dropdown-item>
             </calcite-dropdown-group>
           </calcite-dropdown>
         </div>
@@ -573,7 +573,7 @@
               hover, top aligned
             </calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item active>List</calcite-dropdown-item>
+              <calcite-dropdown-item selected>List</calcite-dropdown-item>
               <calcite-dropdown-item>Grid</calcite-dropdown-item>
               <calcite-dropdown-item>Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -585,7 +585,7 @@
             <calcite-button icon-end="hamburger" appearance="outline" slot="trigger"> center aligned </calcite-button>
             <calcite-dropdown-group>
               <calcite-dropdown-item>Mint</calcite-dropdown-item>
-              <calcite-dropdown-item active>Chocolate</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Chocolate</calcite-dropdown-item>
               <calcite-dropdown-item>Banana</calcite-dropdown-item>
               <calcite-dropdown-item>Vanilla</calcite-dropdown-item>
               <calcite-dropdown-item>Strawberry</calcite-dropdown-item>
@@ -603,7 +603,7 @@
             <calcite-button icon-end="handle-vertical" appearance="outline" slot="trigger"> Click me</calcite-button>
             <calcite-dropdown-group group-title="Not Links">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="none" group-title="Link">
@@ -619,7 +619,7 @@
             <calcite-button icon-end="handle-vertical" appearance="outline" slot="trigger"> Click me</calcite-button>
             <calcite-dropdown-group group-title="Not Links">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="none" group-title="Link">
@@ -635,7 +635,7 @@
             <calcite-button icon-end="handle-vertical" appearance="outline" slot="trigger"> Click me</calcite-button>
             <calcite-dropdown-group group-title="Not Links">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="none" group-title="Link">
@@ -675,7 +675,7 @@
           <calcite-dropdown disabled>
             <calcite-button icon-end="handle-vertical" appearance="outline" slot="trigger">Disabled</calcite-button>
             <calcite-dropdown-group group-title="View">
-              <calcite-dropdown-item icon-end="list-bullet" active>List</calcite-dropdown-item>
+              <calcite-dropdown-item icon-end="list-bullet" selected>List</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="grid">Grid</calcite-dropdown-item>
               <calcite-dropdown-item icon-end="table">Table</calcite-dropdown-item>
             </calcite-dropdown-group>
@@ -694,13 +694,13 @@
             <calcite-button slot="trigger">Button Trigger</calcite-button>
             <calcite-dropdown-group selection-mode="single" group-title="Selection Mode: Single">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="multiple" group-title="Selection Mode: Multi">
-              <calcite-dropdown-item active>Maps</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Maps</calcite-dropdown-item>
               <calcite-dropdown-item>Layers</calcite-dropdown-item>
-              <calcite-dropdown-item active>Data</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Data</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="none" group-title="Selection Mode: None">
               <calcite-dropdown-item>Mountain</calcite-dropdown-item>
@@ -713,13 +713,13 @@
             <calcite-action slot="trigger" text-enabled text="Action Trigger"></calcite-action>
             <calcite-dropdown-group selection-mode="single" group-title="Selection Mode: Single">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="multiple" group-title="Selection Mode: Multi">
-              <calcite-dropdown-item active>Maps</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Maps</calcite-dropdown-item>
               <calcite-dropdown-item>Layers</calcite-dropdown-item>
-              <calcite-dropdown-item active>Data</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Data</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="none" group-title="Selection Mode: None">
               <calcite-dropdown-item>Mountain</calcite-dropdown-item>
@@ -732,13 +732,13 @@
             <calcite-link slot="trigger" appearance="solid">Link Trigger</calcite-link>
             <calcite-dropdown-group selection-mode="single" group-title="Selection Mode: Single">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="multiple" group-title="Selection Mode: Multi">
-              <calcite-dropdown-item active>Maps</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Maps</calcite-dropdown-item>
               <calcite-dropdown-item>Layers</calcite-dropdown-item>
-              <calcite-dropdown-item active>Data</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Data</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="none" group-title="Selection Mode: None">
               <calcite-dropdown-item>Mountain</calcite-dropdown-item>
@@ -751,13 +751,13 @@
             <div slot="trigger" appearance="solid" tabindex="0">Div Trigger</div>
             <calcite-dropdown-group selection-mode="single" group-title="Selection Mode: Single">
               <calcite-dropdown-item>Relevance</calcite-dropdown-item>
-              <calcite-dropdown-item active>Date modified</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Date modified</calcite-dropdown-item>
               <calcite-dropdown-item>Title</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="multiple" group-title="Selection Mode: Multi">
-              <calcite-dropdown-item active>Maps</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Maps</calcite-dropdown-item>
               <calcite-dropdown-item>Layers</calcite-dropdown-item>
-              <calcite-dropdown-item active>Data</calcite-dropdown-item>
+              <calcite-dropdown-item selected>Data</calcite-dropdown-item>
             </calcite-dropdown-group>
             <calcite-dropdown-group selection-mode="none" group-title="Selection Mode: None">
               <calcite-dropdown-item>Mountain</calcite-dropdown-item>