import { ElementIDUtils } from "@sankhyalabs/core";
import { h } from "@stencil/core";
export const TreeItem = (props) => {
  const { node, selectedId, itemClick, iconClick, iconResolver, tooltipResolver, itemsList, itemDoubleClick } = props;
  if (!node.visible) {
    return;
  }
  const treeItem = node.item;
  const level = props.level || 1;
  const disabled = node.isDisabled();
  const expanded = !disabled && treeItem.expanded;
  const expandable = node.isExpandable();
  const available = !disabled && !node.isPlaceHolder;
  if (available) {
    itemsList.push(treeItem);
  }
  function handleIconClick(event) {
    event.stopPropagation();
    if (available) {
      iconClick(treeItem);
    }
  }
  function handleIconDoubleClick(event) {
    event.stopPropagation();
  }
  return (h("ul", { class: level === 1 ? "first-level" : undefined }, h("li", Object.assign({ title: tooltipResolver(treeItem, !disabled, level), class: `tree-item ${treeItem.id !== selectedId ? "tree-item-error" : ""}`, onClick: () => available && itemClick(treeItem), onDblClick: () => available && itemDoubleClick(treeItem) }, {
    disabled,
    selected: treeItem.id === selectedId,
    [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(`ezTreeItem_${treeItem.id}`)
  }), h("div", { class: "item-label-container" }, h("div", { class: "item-icon-box" }, expandable &&
    h("ez-icon", { id: treeItem.id, class: "item-icon", size: "small", iconName: iconResolver(treeItem, expanded, level), onClick: (event) => handleIconClick(event), onDblClick: (event) => handleIconDoubleClick(event) })), h("label", { class: `item-label ${treeItem.bold ? "item-label--bold" : ""}` }, treeItem.label)), getBadgeElement(treeItem.id, treeItem.badge, treeItem.id === selectedId)), expanded
    && node.getChildren().map(child => h(TreeItem, { selectedId: selectedId, node: child, itemClick: itemClick, iconClick: iconClick, level: level + 1, iconResolver: iconResolver, tooltipResolver: tooltipResolver, itemsList: itemsList, itemDoubleClick: itemDoubleClick }))));
};
function getBadgeElement(itemId, badge, isSelectedItem) {
  if (badge == undefined) {
    return;
  }
  if (typeof badge === "string") {
    return h("div", { class: `tree-item-badge ${isSelectedItem ? null : badge}` }, badge === "error" &&
      h("ez-icon", { id: `${itemId}-badge-error`, class: "tree-item-badge-error-icon", size: "x-small", style: { color: 'white' }, iconName: "alert-circle" }));
  }
  if (badge.type === "text") {
    return h("div", { id: `${itemId}-badge-text`, class: "tree-item-badge-text" }, badge.text);
  }
  return h("div", null, h("ez-icon", { id: `${itemId}-badge-icon`, class: "tree-item-badge-icon", style: { "--ez-icon--color": `var(--ez-tree__badge--icon-color--${badge.iconColor || "default"})` }, iconName: badge.iconName }));
}
