import { jsxs as f, jsx as c } from "react/jsx-runtime";
import { setNodes as x } from "@udecode/slate";
import { findNodePath as u } from "@udecode/slate-react";
import { useId as C } from "react";
import { merge as l } from "../../../../utilities/merge.es.js";
import { MarkupElement as E } from "../MarkupElement.es.js";
import { justifyClassNames as k } from "../helper.es.js";
import { ELEMENT_CHECK_ITEM as b } from "./id.es.js";
import { useRichTextEditorContext as N } from "../../context/RichTextEditorContext.es.js";
const y = (e, t) => e[t.children[0].textStyle], S = "tw-flex tw-flex-row tw-pb-2 tw-gap-1.5 tw-items-start", g = "focus:tw-outline-none tw-w-auto tw-min-w-[10px]", L = (e) => {
  const { attributes: t, children: s, nodeProps: m, element: o, editor: n, style: a } = e, r = o.checked, d = o.align ?? "left", { styles: h } = N(), i = C();
  return /* @__PURE__ */ f("div", { ...t, style: a, className: l([S, k[d]]), children: [
    /* @__PURE__ */ c(
      "div",
      {
        contentEditable: !1,
        className: "tw-flex tw-items-center tw-justify-center tw-select-none tw-h-[1lh]",
        children: /* @__PURE__ */ c(
          "input",
          {
            "aria-labelledby": i,
            "data-test-id": "checkbox-input",
            className: "tw-w-4 tw-h-4 tw-m-0",
            type: "checkbox",
            checked: !!r,
            onChange: (p) => {
              const w = u(n, o);
              x(n, { checked: p.target.checked }, { at: w });
            },
            ...m
          }
        )
      }
    ),
    /* @__PURE__ */ c(
      "span",
      {
        id: i,
        style: y(h, o),
        className: l([g, r && "!tw-line-through"]),
        children: s
      }
    )
  ] });
};
class v extends E {
  constructor(t = b, s = L) {
    super(t, s);
  }
}
export {
  S as CHECKBOX_DIV_CLASSES,
  g as CHECKBOX_SPAN_CLASSES,
  v as CheckboxListElement,
  L as CheckboxListElementNode
};
//# sourceMappingURL=CheckboxListElement.es.js.map
