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

import {
  useFocusHandler
} from "./chunk-SSX6C2M6.mjs";

// src/editable-table/editable-components/checkbox.tsx
import { flexRender } from "@tanstack/react-table";
import { useEffect, useRef } from "react";
import { jsx } from "react/jsx-runtime";
function EditableCheckBox(props) {
  var _a;
  const cellRef = useRef(null);
  const { isCurrentCellFocused, focusCurrentCell, tableRef } = useFocusHandler(
    props.cell,
    false
  );
  const metaData = props.cell.column.columnDef.meta;
  const onKeyDown = (e) => {
    const tableWrapper = document.querySelector(".editable-table");
    const activeElement = document.activeElement;
    if (activeElement && activeElement.tagName === "INPUT" && !(tableWrapper == null ? void 0 : tableWrapper.contains(activeElement)) || e.key === "Tab") {
      return;
    }
  };
  useEffect(() => {
    var _a2, _b;
    if (isCurrentCellFocused && ((_a2 = tableRef.current) == null ? void 0 : _a2.contains(document.activeElement))) {
      (_b = cellRef.current) == null ? void 0 : _b.focus();
    }
  }, [isCurrentCellFocused]);
  return /* @__PURE__ */ jsx(
    "div",
    {
      ...metaData.label ? { "aria-label": metaData.label(props.cell.row.original) } : { "aria-labelledby": (_a = props.rowHeaderId) != null ? _a : "" },
      role: "checkbox",
      "aria-checked": props.cell.row.getIsSelected(),
      ref: cellRef,
      className: "td-content flex h-[18px] w-[18px] items-center justify-center p-[10px] outline-purple-600",
      onClick: (e) => {
        var _a2;
        if (e.target.tagName.toLowerCase() === "input") {
          focusCurrentCell();
          return;
        }
        const checkbox = (_a2 = cellRef.current) == null ? void 0 : _a2.querySelector('input[type="checkbox"]');
        checkbox == null ? void 0 : checkbox.click();
        focusCurrentCell();
      },
      onKeyDown: (e) => {
        var _a2;
        if (e.key === "Enter" || e.key === " ") {
          e.preventDefault();
          const checkbox = (_a2 = cellRef.current) == null ? void 0 : _a2.querySelector('input[type="checkbox"]');
          if (checkbox) {
            checkbox.click();
          }
        }
        onKeyDown(e);
      },
      onFocus: focusCurrentCell,
      tabIndex: isCurrentCellFocused ? 0 : -1,
      children: flexRender(props.cell.column.columnDef.cell, {
        ...props.cell.getContext(),
        tabIndex: -1
      })
    }
  );
}

export {
  EditableCheckBox
};