@difizen/ai-flow/es/components/AIBasic/PromptEditor/index.js

Scalable, out-of-the-box, agent-oriented flow

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
import { CodeNode } from '@lexical/code';
import { LexicalComposer } from '@lexical/react/LexicalComposer';
import { ContentEditable } from '@lexical/react/LexicalContentEditable';
import LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary';
import { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';
import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
import { $getRoot, TextNode } from 'lexical';
import React, { memo } from 'react';
import ComponentPickerBlock from "./plugins/component-picker-block/index";
import { CustomTextNode } from "./plugins/custom-text/node";
import OnBlurBlock from "./plugins/on-blur-or-focus-block";
import Placeholder from "./plugins/placeholder";
import UpdateBlock from "./plugins/update-block";
import VariableBlock from "./plugins/variable-block/index";
import VariableValueBlock from "./plugins/variable-value-block/index";
import { VariableValueBlockNode } from "./plugins/variable-value-block/node";
import { textToEditorState } from "./utils";
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var PromptEditorRaw = function PromptEditorRaw(_ref) {
  var instanceId = _ref.instanceId,
    compact = _ref.compact,
    className = _ref.className,
    placeholder = _ref.placeholder,
    placeholderClassName = _ref.placeholderClassName,
    style = _ref.style,
    value = _ref.value,
    _ref$editable = _ref.editable,
    editable = _ref$editable === void 0 ? true : _ref$editable,
    onChange = _ref.onChange,
    onBlur = _ref.onBlur,
    onFocus = _ref.onFocus,
    variableBlock = _ref.variableBlock,
    externalToolBlock = _ref.externalToolBlock;
  var initialConfig = {
    namespace: 'prompt-editor',
    nodes: [CodeNode, CustomTextNode, {
      replace: TextNode,
      with: function _with(node) {
        return new CustomTextNode(node.__text);
      }
    }, VariableValueBlockNode],
    editorState: textToEditorState(value || ''),
    onError: function onError(error) {
      throw error;
    }
  };
  var handleEditorChange = function handleEditorChange(editorState) {
    var text = editorState.read(function () {
      return $getRoot().getChildren().map(function (p) {
        return p.getTextContent();
      }).join('\n');
    });
    if (onChange) {
      onChange(text);
    }
  };
  return /*#__PURE__*/_jsx(LexicalComposer, {
    initialConfig: _objectSpread(_objectSpread({}, initialConfig), {}, {
      editable: editable
    }),
    children: /*#__PURE__*/_jsxs("div", {
      className: "relative h-full nodrag nowheel",
      children: [/*#__PURE__*/_jsx(RichTextPlugin, {
        contentEditable: /*#__PURE__*/_jsx(ContentEditable, {
          className: "".concat(className || '', " outline-none ").concat(compact ? 'leading-5 text-[13px]' : 'leading-6 text-sm', " text-gray-700 p-3"),
          style: style || {}
        }),
        placeholder: /*#__PURE__*/_jsx(Placeholder, {
          value: placeholder,
          className: placeholderClassName,
          compact: compact
        }),
        ErrorBoundary: LexicalErrorBoundary
      }), /*#__PURE__*/_jsx(ComponentPickerBlock, {
        triggerString: "/",
        variableBlock: variableBlock,
        externalToolBlock: externalToolBlock
      }), /*#__PURE__*/_jsx(ComponentPickerBlock, {
        triggerString: "{",
        variableBlock: variableBlock,
        externalToolBlock: externalToolBlock
      }), ((variableBlock === null || variableBlock === void 0 ? void 0 : variableBlock.show) || (externalToolBlock === null || externalToolBlock === void 0 ? void 0 : externalToolBlock.show)) && /*#__PURE__*/_jsxs(_Fragment, {
        children: [/*#__PURE__*/_jsx(VariableBlock, {}), /*#__PURE__*/_jsx(VariableValueBlock, {})]
      }), /*#__PURE__*/_jsx(OnChangePlugin, {
        onChange: handleEditorChange
      }), /*#__PURE__*/_jsx(OnBlurBlock, {
        onBlur: onBlur,
        onFocus: onFocus
      }), /*#__PURE__*/_jsx(UpdateBlock, {
        instanceId: instanceId
      })]
    })
  });
};
export var PromptEditor = /*#__PURE__*/memo(PromptEditorRaw);
export * from "./types";