'use strict';
'use client';
import { jsxs, jsx } from 'react/jsx-runtime';
import { useRef, useEffect } from 'react';
import { createDebouncedEditorUpdate, initializeEditor } from './RichText.funcs.js';
import { cn } from '../../../fd-toolbox/lib/utils.js';
import { useEmptyRef } from '../../../fd-toolbox/hooks/use-empty-ref.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function RichText({
  value,
  onChange,
  placeholder,
  readOnly,
  className,
  debounceTime,
  onBlur,
  onFocus,
  onEditorCreated,
  defaultValue,
  label,
  invalid,
  id
}) {
  const quillRef = useEmptyRef();
  const quillEditorRef = useRef(void 0);
  const debouncedEditorUpdate = createDebouncedEditorUpdate(debounceTime ?? 300);
  useEffect(() => {
    if (quillEditorRef.current) {
      debouncedEditorUpdate(value, quillEditorRef.current);
    }
  }, [value, debouncedEditorUpdate]);
  useEffect(() => {
    initializeEditor(onChange, {
      current: quillEditorRef.current ?? void 0
    }, onEditorCreated, quillRef?.current ?? void 0, placeholder ?? "Start typing...", readOnly, value, defaultValue, id);
  }, [onChange, onEditorCreated, placeholder, readOnly, value, defaultValue, id, quillRef]);
  function onEditorContainerClick() {
    quillEditorRef.current?.focus();
  }
  __name(onEditorContainerClick, "onEditorContainerClick");
  return /* @__PURE__ */jsxs("div", {
    className: cn("relative cursor-text shadow-sm"),
    onClick: onEditorContainerClick,
    children: [/* @__PURE__ */jsx("div", {
      ref: quillRef,
      className: cn("border-border min-h-28 rounded-b-lg border", className),
      onBlur,
      onFocus
    }), label && /* @__PURE__ */jsx("label", {
      className: cn("bg-background text-muted-foreground absolute top-0 left-1 -translate-y-1/2 px-1 text-xs font-medium", invalid && "text-destructive"),
      children: label
    })]
  });
}
__name(RichText, "RichText");

export { RichText };
