@opentiny/vue-renderless/rich-text/vue.js

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

import "../chunk-G2ADBYYC.js";
import {
  initContent,
  initQuill,
  setToolbarTips,
  setPlaceholder,
  getFileUploadUrl,
  selectionChange,
  textChange,
  mounted,
  beforeUnmount,
  maxLength,
  handlePaste,
  isDisplayOnly,
  handleClick
} from "./index";
const api = [
  "state",
  "initContent",
  "initQuill",
  "setToolbarTips",
  "setPlaceholder",
  "selectionChange",
  "textChange",
  "handlePaste"
];
const initState = ({ reactive, props, computed, api: api2 }) => {
  const state = reactive({
    innerOptions: {},
    innerContent: "",
    fileUploadUrl: props.fileUpload && props.fileUpload.url || "",
    content: props.modelValue || props.content,
    maxLength: computed(() => api2.maxLength()),
    pasteCanceled: false,
    isDisplayOnly: computed(() => api2.isDisplayOnly())
  });
  return state;
};
const initApi = (args) => {
  let { api: api2, props, state, emit, service, nextTick, t, vm, i18n, watch, constants, parent } = args;
  let { Quill, ImageDrop, ImageUpload, FileUpload, Modal } = args;
  Object.assign(api2, {
    state,
    initContent: initContent({ state, props, nextTick }),
    initQuill: initQuill({ service, emit, props, api: api2, state, vm, ImageDrop, FileUpload, ImageUpload, Quill }),
    setToolbarTips: setToolbarTips({ t, vm }),
    setPlaceholder: setPlaceholder({ state, props }),
    getFileUploadUrl: getFileUploadUrl({ service }),
    selectionChange: selectionChange({ emit, state }),
    textChange: textChange({ emit, vm, state, Modal, t }),
    mounted: mounted({ api: api2, props, state, i18n, watch }),
    beforeUnmount: beforeUnmount({ api: api2, state }),
    maxLength: maxLength({ props, constants }),
    handlePaste: handlePaste({ state }),
    isDisplayOnly: isDisplayOnly({ state, props, parent, nextTick }),
    handleClick: handleClick({ state, Quill })
  });
};
const initWatch = ({ watch, props, api: api2, state }) => {
  watch(
    () => props.modelValue,
    (val) => {
      state.content = val;
      api2.initContent();
    }
  );
  watch(
    () => props.content,
    (val) => {
      state.content = val;
      api2.initContent();
    }
  );
  watch(
    () => props.disabled,
    (param) => {
      if (state.quill) {
        state.quill.enable(!param);
      }
    }
  );
  watch(
    () => props.options.placeholder,
    () => {
      api2.setPlaceholder();
    }
  );
};
const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, computed, inject }, { service, emit, t, nextTick, vm, i18n, constants, parent }, { Quill, ImageDrop, ImageUpload, FileUpload, Modal }) => {
  parent.auiForm = parent.auiForm || inject("form", null);
  const api2 = {};
  const state = initState({ reactive, props, computed, api: api2, parent });
  const args = { api: api2, props, state, emit, service, nextTick, t, vm, i18n, watch, constants, parent };
  Object.assign(args, { Quill, ImageDrop, ImageUpload, FileUpload, Modal });
  initApi(args);
  initWatch({ watch, props, api: api2, state });
  onMounted(api2.mounted);
  onBeforeUnmount(api2.beforeUnmount);
  return api2;
};
export {
  api,
  renderless
};