import { r as reactExports, j as jsxRuntimeExports, M as Modal, t as twMerge, z as isValidName, I as Icon, P as PowerhouseButton, e as usePHModal, A as useDocumentModelModuleById, B as useSelectedDriveSafe, D as useSelectedFolder, E as useParentFolderForSelectedNode, i as closePHModal, F as addDocument, x as setSelectedNode } from "./index-DEuI3Aoa.js";
import { F as FormInput } from "./form-input-DucXwitU.js";
const buttonStyles = "min-h-[48px] min-w-[142px] text-base font-semibold py-3 px-6 rounded-xl outline-none active:opacity-75 hover:scale-105 transform transition-all";
const CLOSE_ANIMATION_DURATION = 300;
function CreateDocumentModal$1(props) {
  const { onOpenChange, onContinue, overlayProps, contentProps, ...restProps } = props;
  const [nodeName, setNodeName] = reactExports.useState("");
  const [isValid, setIsValid] = reactExports.useState(false);
  const handleCancel = () => {
    onOpenChange?.(false);
    setTimeout(() => setNodeName(""), CLOSE_ANIMATION_DURATION);
  };
  const handleCreate = reactExports.useCallback(() => {
    if (!isValid) {
      return;
    }
    onContinue(nodeName);
    setTimeout(() => setNodeName(""), CLOSE_ANIMATION_DURATION);
  }, [isValid, nodeName, onContinue]);
  return jsxRuntimeExports.jsx(Modal, { contentProps: {
    ...contentProps,
    className: twMerge("rounded-3xl", contentProps?.className)
  }, onOpenChange, overlayProps: {
    ...overlayProps,
    className: overlayProps?.className
  }, ...restProps, children: jsxRuntimeExports.jsxs("form", { name: "create-document", className: "w-[400px] p-6 text-slate-300", children: [jsxRuntimeExports.jsx("div", { className: "border-b border-slate-50 pb-2 text-2xl font-bold text-gray-800", children: "Create a new document" }), jsxRuntimeExports.jsxs("div", { className: "my-6", children: [!isValid && nodeName && jsxRuntimeExports.jsx("div", { className: "mb-2 text-red-500", children: "Document name must be valid URL characters." }), jsxRuntimeExports.jsx(FormInput, { icon: jsxRuntimeExports.jsx(Icon, { name: "BrickGlobe" }), onChange: (e) => {
    const name = e.target.value;
    setNodeName(name);
    setIsValid(isValidName(name));
  }, placeholder: "Document name", required: true, value: nodeName })] }), jsxRuntimeExports.jsxs("div", { className: "mt-8 flex justify-between gap-3", children: [jsxRuntimeExports.jsx("button", { className: twMerge(buttonStyles, "flex-1 bg-slate-50 text-slate-800"), onClick: handleCancel, children: "Cancel" }), jsxRuntimeExports.jsx(PowerhouseButton, { className: twMerge(buttonStyles, "flex-1 bg-gray-800 text-gray-50"), onClick: handleCreate, disabled: !isValid, children: "Create" })] })] }) });
}
const CreateDocumentModal = () => {
  const phModal = usePHModal();
  const open = phModal?.type === "createDocument";
  const documentType = open ? phModal.documentType : void 0;
  const documentModel = useDocumentModelModuleById(documentType);
  const [selectedDrive] = useSelectedDriveSafe();
  const selectedFolder = useSelectedFolder();
  const parentFolder = useParentFolderForSelectedNode();
  const onCreateDocument = async (documentName) => {
    closePHModal();
    if (!selectedDrive || !documentModel) return;
    const node = await addDocument(
      selectedDrive.header.id,
      documentName || `New ${documentModel.documentModel.global.name}`,
      documentModel.documentModel.global.id,
      selectedFolder?.id ?? parentFolder?.id
    );
    setSelectedNode(node);
  };
  return /* @__PURE__ */ jsxRuntimeExports.jsx(
    CreateDocumentModal$1,
    {
      open,
      onContinue: onCreateDocument,
      onOpenChange: (status) => {
        if (!status) return closePHModal();
      }
    }
  );
};
export {
  CreateDocumentModal
};
//# sourceMappingURL=CreateDocumentModal-B7jTEi8C.js.map
