Skip to content

Commit decc33d

Browse files
driskullbenelan
authored andcommitted
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?
1 parent bb017ed commit decc33d

File tree

1 file changed

+13
-10
lines changed
  • packages/calcite-components/src/components/list-item

1 file changed

+13
-10
lines changed

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

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -392,16 +392,19 @@ export class ListItem
392392
const { el, open, openable, parentListEl } = this;
393393
const dir = getElementDir(el);
394394

395-
return openable ? (
396-
<td class={CSS.openContainer} key="open-container" onClick={this.toggleOpen}>
397-
<calcite-icon
398-
icon={open ? ICONS.open : dir === "rtl" ? ICONS.closedRTL : ICONS.closedLTR}
399-
scale="s"
400-
/>
401-
</td>
402-
) : parentListEl?.openable ? (
403-
<td class={CSS.openContainer} key="open-container" onClick={this.itemClicked}>
404-
<calcite-icon icon={ICONS.blank} scale="s" />
395+
const icon = openable
396+
? open
397+
? ICONS.open
398+
: dir === "rtl"
399+
? ICONS.closedRTL
400+
: ICONS.closedLTR
401+
: ICONS.blank;
402+
403+
const clickHandler = openable ? this.toggleOpen : this.itemClicked;
404+
405+
return openable || parentListEl?.openable ? (
406+
<td class={CSS.openContainer} key="open-container" onClick={clickHandler}>
407+
<calcite-icon icon={icon} key={icon} scale="s" />
405408
</td>
406409
) : null;
407410
}

0 commit comments

Comments
 (0)