fix(list-item): fix rendering of open icon. (#8207)

**Related Issue:** N/A

## Summary

@jcfranco I'm running into an issue where once I drag a list-item that
has children, the caret icon disappears.

![Nov-17-2023
14-02-24](https://github.com/Esri/calcite-design-system/assets/1231455/b1791d67-bb7c-4484-83a7-436b5a289bc2)

![Screenshot 2023-11-17 at 2 03
41 PM](https://github.com/Esri/calcite-design-system/assets/1231455/3227db11-febc-417a-8be2-a6954b891cab)

I can't reproduce it with just calcite. Do you think this might fix it?

packages/calcite-components/src/components/list-item/list-item.tsx

@@ -392,16 +392,19 @@ export class ListItem
     const { el, open, openable, parentListEl } = this;
     const dir = getElementDir(el);
 
-    return openable ? (
-      <td class={CSS.openContainer} key="open-container" onClick={this.toggleOpen}>
-        <calcite-icon
-          icon={open ? ICONS.open : dir === "rtl" ? ICONS.closedRTL : ICONS.closedLTR}
-          scale="s"
-        />
-      </td>
-    ) : parentListEl?.openable ? (
-      <td class={CSS.openContainer} key="open-container" onClick={this.itemClicked}>
-        <calcite-icon icon={ICONS.blank} scale="s" />
+    const icon = openable
+      ? open
+        ? ICONS.open
+        : dir === "rtl"
+        ? ICONS.closedRTL
+        : ICONS.closedLTR
+      : ICONS.blank;
+
+    const clickHandler = openable ? this.toggleOpen : this.itemClicked;
+
+    return openable || parentListEl?.openable ? (
+      <td class={CSS.openContainer} key="open-container" onClick={clickHandler}>
+        <calcite-icon icon={icon} key={icon} scale="s" />
       </td>
     ) : null;
   }