Skip to content

Commit

Permalink
fix(list-item): fix rendering of open icon. (#8207)
Browse files Browse the repository at this point in the history
**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?
  • Loading branch information
driskull authored and benelan committed Nov 26, 2023
1 parent bb017ed commit decc33d
Showing 1 changed file with 13 additions and 10 deletions.
23 changes: 13 additions & 10 deletions packages/calcite-components/src/components/list-item/list-item.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}
Expand Down

0 comments on commit decc33d

Please sign in to comment.