import { jsxs as a, jsx as r } from "react/jsx-runtime";
import { Classes as o } from "../../constants/selectors.js";
import { FileIcon as l } from "../../icons/index.js";
import { cn as i } from "../../utils/cn.js";
import { useTreeLevel as n } from "./use-tree-level.js";
import { calculatePaddingLeft as s } from "./utils.js";
const x = ({ name: e }) => {
  const { level: t } = n();
  return /* @__PURE__ */ a(
    "div",
    {
      "aria-level": t,
      "aria-selected": !1,
      className: i(
        "flex cursor-default items-center gap-1.5 rounded-lg py-1 pr-1.5 pl-[calc(var(--padding-left)*1px)] text-stone-700 -outline-offset-1 hover:bg-stone-100 dark:text-stone-400 dark:hover:bg-stone-900",
        o.TreeFile
      ),
      "data-component-part": "tree-file",
      role: "treeitem",
      style: { "--padding-left": s(t) },
      tabIndex: -1,
      children: [
        /* @__PURE__ */ r(
          l,
          {
            "aria-hidden": "true",
            className: "size-4 shrink-0 select-none",
            "data-component-part": "tree-file-icon"
          }
        ),
        /* @__PURE__ */ r(
          "span",
          {
            className: "truncate font-medium text-sm leading-5 -tracking-[0.1px]",
            "data-component-part": "tree-file-title",
            title: e,
            children: e
          }
        )
      ]
    }
  );
};
export {
  x as TreeFile
};
