@trail-ui/react/dist/chunk-YGWBI4J5.mjs

import {
  useFocusHandler
} from "./chunk-F5W73ZFA.mjs";
import {
  useTableContext
} from "./chunk-A4IWBDSQ.mjs";

// src/editable-table/editable-components/links.tsx
import { flexRender } from "@tanstack/react-table";
import { useEffect, useRef } from "react";
import { jsx } from "react/jsx-runtime";
function EditableLink(props) {
  var _a;
  const cellRef = useRef(null);
  const { tableRef } = useTableContext();
  const { isCurrentCellFocused, focusCurrentCell } = useFocusHandler({
    cellType: "dataCell" /* dataCell */,
    columnIndex: props.cell.column.getIndex(),
    groupId: null,
    rowId: props.cell.row.id,
    rowIndex: props.cell.row.index
  });
  useEffect(() => {
    if (cellRef.current) {
      const link = cellRef.current.getElementsByTagName("a")[0];
      if (link) {
        link.onclick = focusCurrentCell;
      }
    }
  }, []);
  useEffect(() => {
    var _a2, _b;
    if ((_a2 = tableRef.current) == null ? void 0 : _a2.contains(document.activeElement)) {
      const link = (_b = cellRef.current) == null ? void 0 : _b.getElementsByTagName("a")[0];
      if (link) {
        if (isCurrentCellFocused) {
          link.focus();
          link.tabIndex = 0;
        } else {
          link.tabIndex = -1;
        }
      }
    }
  }, [isCurrentCellFocused]);
  return /* @__PURE__ */ jsx(
    "div",
    {
      ref: cellRef,
      id: ((_a = props.cell.column.columnDef) == null ? void 0 : _a.columnType) === "th" ? `${props.cell.row.id}-id` : "",
      className: "td-content px-2 py-0.5 outline-purple-600",
      children: flexRender(props.cell.column.columnDef.cell, {
        ...props.cell.getContext()
      })
    }
  );
}

export {
  EditableLink
};