@opentiny/vue-renderless 3.6.0 → 3.6.1-alpha.2

package/tree-menu/vue.js

@@ -1,26 +1,51 @@
-import { initData, setMenuKey, filterNode, watchFilterText, nodeDragStart, nodeDragEnter, nodeDragOver, nodeDragEnd, nodeDrop, nodeExpand, nodeCollapse, nodeClick, checkChange, check, currentChange, getTitle } from './index';
-export var api = ['state', 't', 'initData', 'setMenuKey', 'filterNode', 'nodeDragStart', 'nodeDragEnter', 'nodeDragOver', 'nodeDragEnd', 'nodeDrop', 'nodeExpand', 'nodeCollapse', 'nodeClick', 'checkChange', 'check', 'currentChange', 'getTitle'];
-export var renderless = function renderless(props, _ref, _ref2) {
-  var watch = _ref.watch,
-    reactive = _ref.reactive,
-    onMounted = _ref.onMounted;
-  var t = _ref2.t,
-    service = _ref2.service,
-    refs = _ref2.refs,
-    emit = _ref2.emit;
-  service = service || {
-    base: {}
-  };
-  service = {
-    getMenuDataSync: props.getMenuDataSync || service.base.getMenuDataSync
-  };
-  var state = reactive({
+import "../chunk-PKUHTIDK.js";
+import {
+  initData,
+  setMenuKey,
+  filterNode,
+  watchFilterText,
+  nodeDragStart,
+  nodeDragEnter,
+  nodeDragOver,
+  nodeDragEnd,
+  nodeDrop,
+  nodeExpand,
+  nodeCollapse,
+  nodeClick,
+  checkChange,
+  check,
+  currentChange,
+  getTitle
+} from "./index";
+const api = [
+  "state",
+  "t",
+  "initData",
+  "setMenuKey",
+  "filterNode",
+  "nodeDragStart",
+  "nodeDragEnter",
+  "nodeDragOver",
+  "nodeDragEnd",
+  "nodeDrop",
+  "nodeExpand",
+  "nodeCollapse",
+  "nodeClick",
+  "checkChange",
+  "check",
+  "currentChange",
+  "getTitle"
+];
+const renderless = (props, { watch, reactive, onMounted }, { t, service, refs, emit }) => {
+  service = service || { base: {} };
+  service = { getMenuDataSync: props.getMenuDataSync || service.base.getMenuDataSync };
+  const state = reactive({
     data: [],
-    filterText: ''
+    filterText: ""
   });
   Object.assign(api, {
-    t: t,
-    state: state,
+    t,
+    state,
     check: check(emit),
     filterNode: filterNode(),
     nodeDrop: nodeDrop(emit),
@@ -36,25 +61,18 @@ export var renderless = function renderless(props, _ref, _ref2) {
     watchFilterText: watchFilterText(refs),
     getTitle: getTitle(props),
     setMenuKey: setMenuKey(api),
-    initData: initData({
-      state: state,
-      props: props,
-      service: service,
-      api: api
-    })
-  });
-  watch(function () {
-    return props.data;
-  }, function (value) {
-    return state.data = value;
-  }, {
-    immediate: true
-  });
-  watch(function () {
-    return state.filterText;
-  }, api.watchFilterText, {
-    deep: true
+    initData: initData({ state, props, service, api })
   });
+  watch(
+    () => props.data,
+    (value) => state.data = value,
+    { immediate: true }
+  );
+  watch(() => state.filterText, api.watchFilterText, { deep: true });
   onMounted(api.initData);
   return api;
-};
+};
+export {
+  api,
+  renderless
+};

package/tree-node/index.js

@@ -1,49 +1,33 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import { getNodeKey as getTreeNodeKey } from '@opentiny/vue-renderless/common/deps/tree-model/util';
-export var watchIndeterminate = function watchIndeterminate(_ref) {
-  var api = _ref.api,
-    props = _ref.props;
-  return function (value) {
-    return api.handleSelectChange(props.node.checked, value);
-  };
-};
-export var watchChecked = function watchChecked(_ref2) {
-  var api = _ref2.api,
-    props = _ref2.props;
-  return function (value) {
-    return api.handleSelectChange(value, props.node.indeterminate);
-  };
-};
-export var watchExpanded = function watchExpanded(_ref3) {
-  var state = _ref3.state;
-  return function (value) {
-    state.expanded = value;
-    if (value) {
-      state.childNodeRendered = true;
-    }
-  };
-};
-export var getNodeKey = function getNodeKey(state) {
-  return function (node) {
-    return getTreeNodeKey(state.tree.nodeKey, node.data);
-  };
+import {
+  __spreadValues
+} from "../chunk-PKUHTIDK.js";
+import { getNodeKey as getTreeNodeKey } from "@opentiny/vue-renderless/common/deps/tree-model/util";
+const watchIndeterminate = ({ api, props }) => (value) => api.handleSelectChange(props.node.checked, value);
+const watchChecked = ({ api, props }) => (value) => api.handleSelectChange(value, props.node.indeterminate);
+const watchExpanded = ({ state }) => (value) => {
+  state.expanded = value;
+  if (value) {
+    state.childNodeRendered = true;
+  }
 };
-var getVisibleNodes = function getVisibleNodes(treeNode, tree) {
+const getNodeKey = (state) => (node) => getTreeNodeKey(state.tree.nodeKey, node.data);
+const getVisibleNodes = (treeNode, tree) => {
   if (treeNode.visible) {
-    var childNodes = treeNode.childNodes;
-    Object.assign(tree, {
-      checked: treeNode.checked,
-      expanded: treeNode.expanded,
-      level: treeNode.level,
-      isLeaf: treeNode.isLeaf
-    }, treeNode.data, {
-      children: []
-    });
-    childNodes.forEach(function (node) {
+    const childNodes = treeNode.childNodes;
+    Object.assign(
+      tree,
+      {
+        checked: treeNode.checked,
+        expanded: treeNode.expanded,
+        level: treeNode.level,
+        isLeaf: treeNode.isLeaf
+      },
+      treeNode.data,
+      { children: [] }
+    );
+    childNodes.forEach((node) => {
       if (node.visible) {
-        var child = {};
+        const child = {};
         getVisibleNodes(node, child);
         tree.children.push(child);
       }
@@ -53,223 +37,171 @@ var getVisibleNodes = function getVisibleNodes(treeNode, tree) {
     }
   }
 };
-export var handleSelectChange = function handleSelectChange(_ref4) {
-  var props = _ref4.props,
-    state = _ref4.state;
-  return function (checked, indeterminate) {
-    state.tree.state.store.setCurrentNode(props.node);
-    if (state.oldChecked !== checked && state.oldIndeterminate !== indeterminate) {
-      var treeNodes = {};
-      getVisibleNodes(props.node, treeNodes);
-      state.tree.$emit('check-change', treeNodes, checked, indeterminate);
-    }
-    state.oldChecked = checked;
-    state.indeterminate = indeterminate;
-  };
-};
-export var handleClick = function handleClick(_ref5) {
-  var api = _ref5.api,
-    vm = _ref5.vm,
-    props = _ref5.props,
-    state = _ref5.state,
-    refs = _ref5.refs;
-  return function (e) {
-    var store = state.tree.state.store;
-    state.tree.clearCurrentStore(props.node);
-    store.setCurrentNode(props.node);
-    !props.node.disabled && state.tree.$emit('current-change', store.currentNode ? store.currentNode.data : null, store.currentNode);
-    state.tree.currentNode = vm;
-    if (state.tree.checkOnClickNode && !props.node.disabled) {
-      e.target.checked = !props.node.checked;
-      api.handleCheckChange(null, e);
-    }
-    var isCheck = props.showCheckbox ? refs.checkbox && !refs.checkbox.$el.contains(e.target) : true;
-    state.tree.expandOnClickNode ? isCheck && api.handleExpandClick(isCheck) : !props.node.disabled && state.tree.$emit('node-click', props.node.data, props.node, vm);
-  };
+const handleSelectChange = ({ props, state }) => (checked, indeterminate) => {
+  state.tree.state.store.setCurrentNode(props.node);
+  if (state.oldChecked !== checked && state.oldIndeterminate !== indeterminate) {
+    const treeNodes = {};
+    getVisibleNodes(props.node, treeNodes);
+    state.tree.$emit("check-change", treeNodes, checked, indeterminate);
+  }
+  state.oldChecked = checked;
+  state.indeterminate = indeterminate;
+};
+const handleClick = ({ api, vm, props, state, refs }) => (e) => {
+  const store = state.tree.state.store;
+  state.tree.clearCurrentStore(props.node);
+  store.setCurrentNode(props.node);
+  !props.node.disabled && state.tree.$emit("current-change", store.currentNode ? store.currentNode.data : null, store.currentNode);
+  state.tree.currentNode = vm;
+  if (state.tree.checkOnClickNode && !props.node.disabled) {
+    e.target.checked = !props.node.checked;
+    api.handleCheckChange(null, e);
+  }
+  const isCheck = props.showCheckbox ? refs.checkbox && !refs.checkbox.$el.contains(e.target) : true;
+  state.tree.expandOnClickNode ? isCheck && api.handleExpandClick(isCheck) : !props.node.disabled && state.tree.$emit("node-click", props.node.data, props.node, vm);
 };
-export var closeMenu = function closeMenu(state) {
-  return function () {
-    state.showMenu = false;
-  };
+const closeMenu = (state) => () => {
+  state.showMenu = false;
 };
-export var handleContextMenu = function handleContextMenu(_ref6) {
-  var treeRoot = _ref6.treeRoot,
-    vm = _ref6.vm,
-    props = _ref6.props,
-    state = _ref6.state,
-    nextTick = _ref6.nextTick;
-  return function (event) {
-    var listeners = treeRoot.vm.$listeners;
-    var refs = vm.$refs;
-    if (treeRoot.showContextmenu || listeners['node-contextmenu']) {
-      event.stopPropagation();
-      event.preventDefault();
-    }
-    state.tree.$parent.$emit('node-contextmenu', event, props.node.data, props.node, vm);
-    if (!treeRoot.showContextmenu) {
-      return;
-    }
-    state.showMenu = true;
-    state.tree.$parent.menuInstance = vm;
-    nextTick(function () {
-      var menuWidth = refs.menuContext.offsetWidth;
-      var treeWidth = state.tree.$parent.$el.offsetWidth;
-      if (event.clientY > -10) {
-        state.menuposition.top = "".concat(refs.node.offsetTop + refs.node.childNodes[0].offsetHeight / 2, "px");
-      }
-      if (event.clientX > -10) {
-        if (menuWidth > treeWidth) {
-          state.menuposition.left = 0;
-        } else {
-          state.menuposition.left = event.offsetX + menuWidth > treeWidth ? "".concat(treeWidth - menuWidth, "px") : "".concat(event.offsetX, "px");
-        }
+const handleContextMenu = ({ treeRoot, vm, props, state, nextTick }) => (event) => {
+  const listeners = treeRoot.vm.$listeners;
+  const refs = vm.$refs;
+  if (treeRoot.showContextmenu || listeners["node-contextmenu"]) {
+    event.stopPropagation();
+    event.preventDefault();
+  }
+  state.tree.$parent.$emit("node-contextmenu", event, props.node.data, props.node, vm);
+  if (!treeRoot.showContextmenu) {
+    return;
+  }
+  state.showMenu = true;
+  state.tree.$parent.menuInstance = vm;
+  nextTick(() => {
+    const menuWidth = refs.menuContext.offsetWidth;
+    const treeWidth = state.tree.$parent.$el.offsetWidth;
+    if (event.clientY > -10) {
+      state.menuposition.top = `${refs.node.offsetTop + refs.node.childNodes[0].offsetHeight / 2}px`;
+    }
+    if (event.clientX > -10) {
+      if (menuWidth > treeWidth) {
+        state.menuposition.left = 0;
+      } else {
+        state.menuposition.left = event.offsetX + menuWidth > treeWidth ? `${treeWidth - menuWidth}px` : `${event.offsetX}px`;
       }
-    });
-  };
-};
-export var handleExpandIconClick = function handleExpandIconClick(_ref7) {
-  var api = _ref7.api,
-    state = _ref7.state;
-  return function (event, node) {
-    if (!node.isLeaf) {
-      state.tree.iconTriggerClickNode ? api.handleExpandClick(true) : api.handleExpandClick(false);
-      event.stopPropagation();
     }
-  };
+  });
 };
-export var handleExpandClick = function handleExpandClick(_ref8) {
-  var emit = _ref8.emit,
-    vm = _ref8.vm,
-    props = _ref8.props,
-    state = _ref8.state;
-  return function (nodeClickFlag) {
-    if (nodeClickFlag) {
-      state.tree.$parent.$emit('node-click', props.node.data, props.node, vm);
-    }
-    if (props.node.isLeaf) {
-      return;
-    }
-    if (state.expanded) {
-      state.tree.$parent.$emit('node-collapse', props.node.data, props.node, vm);
-      props.node.collapse();
-    } else {
-      props.node.expand();
-      emit('node-expand', props.node.data, props.node, vm);
-    }
-  };
+const handleExpandIconClick = ({ api, state }) => (event, node) => {
+  if (!node.isLeaf) {
+    state.tree.iconTriggerClickNode ? api.handleExpandClick(true) : api.handleExpandClick(false);
+    event.stopPropagation();
+  }
 };
-export var handleCheckChange = function handleCheckChange(_ref9) {
-  var nextTick = _ref9.nextTick,
-    props = _ref9.props,
-    state = _ref9.state;
-  return function (value) {
-    var event = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    if (event.type === 'click' || event.type === 'mousedown') {
-      props.node.setChecked(event.target.checked, !state.tree.checkStrictly);
-      return;
-    }
-    !state.tree.checkOnClickNode && props.node.setChecked(event.target.checked, !state.tree.checkStrictly);
-    nextTick(function () {
-      var store = state.tree.state.store;
-      state.tree.$emit('check', props.node.data, {
-        checkedNodes: store.getCheckedNodes(),
-        checkedKeys: store.getCheckedKeys(),
-        halfCheckedNodes: store.getHalfCheckedNodes(),
-        halfCheckedKeys: store.getHalfCheckedKeys()
-      });
-    });
-  };
+const handleExpandClick = ({ emit, vm, props, state }) => (nodeClickFlag) => {
+  if (nodeClickFlag) {
+    state.tree.$parent.$emit("node-click", props.node.data, props.node, vm);
+  }
+  if (props.node.isLeaf) {
+    return;
+  }
+  if (state.expanded) {
+    state.tree.$parent.$emit("node-collapse", props.node.data, props.node, vm);
+    props.node.collapse();
+  } else {
+    props.node.expand();
+    emit("node-expand", props.node.data, props.node, vm);
+  }
 };
-export var handleContentClick = function handleContentClick(_ref10) {
-  var nextTick = _ref10.nextTick,
-    props = _ref10.props,
-    state = _ref10.state,
-    emit = _ref10.emit;
-  return function (currentNode, currentRadio) {
-    if (props.showRadio) {
-      if (!currentNode.disabled && currentRadio.value !== currentNode.id) {
-        emit('radio-change', currentNode.id);
-        nextTick(function () {
-          var param = _objectSpread({}, currentNode.data);
-          state.tree.$emit('check-change', param);
-        });
-      }
+const handleCheckChange = ({ nextTick, props, state }) => (value, event = {}) => {
+  if (event.type === "click" || event.type === "mousedown") {
+    props.node.setChecked(event.target.checked, !state.tree.checkStrictly);
+    return;
+  }
+  !state.tree.checkOnClickNode && props.node.setChecked(event.target.checked, !state.tree.checkStrictly);
+  nextTick(() => {
+    const store = state.tree.state.store;
+    state.tree.$emit("check", props.node.data, {
+      checkedNodes: store.getCheckedNodes(),
+      checkedKeys: store.getCheckedKeys(),
+      halfCheckedNodes: store.getHalfCheckedNodes(),
+      halfCheckedKeys: store.getHalfCheckedKeys()
+    });
+  });
+};
+const handleContentClick = ({ nextTick, props, state, emit }) => (currentNode, currentRadio) => {
+  if (props.showRadio) {
+    if (!currentNode.disabled && currentRadio.value !== currentNode.id) {
+      emit("radio-change", currentNode.id);
+      nextTick(() => {
+        const param = __spreadValues({}, currentNode.data);
+        state.tree.$emit("check-change", param);
+      });
     }
-  };
-};
-export var handleChildNodeExpand = function handleChildNodeExpand(state) {
-  return function (nodeData, node, instance) {
-    state.tree.$emit('node-expand', nodeData, node, instance);
-  };
+  }
 };
-export var handleDragStart = function handleDragStart(_ref11) {
-  var state = _ref11.state,
-    vm = _ref11.vm;
-  return function (event) {
-    if (!state.tree.draggable) {
-      return;
-    }
-    state.tree.state.emitter.emit('tree-node-drag-start', event, vm);
-  };
+const handleChildNodeExpand = (state) => (nodeData, node, instance) => {
+  state.tree.$emit("node-expand", nodeData, node, instance);
 };
-export var handleDragOver = function handleDragOver(_ref12) {
-  var state = _ref12.state,
-    vm = _ref12.vm;
-  return function (event) {
-    if (!state.tree.draggable) {
-      return;
-    }
-    state.tree.state.emitter.emit('tree-node-drag-over', event, vm);
-    event.preventDefault();
-  };
+const handleDragStart = ({ state, vm }) => (event) => {
+  if (!state.tree.draggable) {
+    return;
+  }
+  state.tree.state.emitter.emit("tree-node-drag-start", event, vm);
 };
-export var handleDrop = function handleDrop() {
-  return function (event) {
-    return event.preventDefault();
-  };
+const handleDragOver = ({ state, vm }) => (event) => {
+  if (!state.tree.draggable) {
+    return;
+  }
+  state.tree.state.emitter.emit("tree-node-drag-over", event, vm);
+  event.preventDefault();
 };
-export var handleDragEnd = function handleDragEnd(_ref13) {
-  var state = _ref13.state,
-    vm = _ref13.vm;
-  return function (event) {
-    if (!state.tree.draggable) {
-      return;
-    }
-    state.tree.state.emitter.emit('tree-node-drag-end', event, vm);
-  };
+const handleDrop = () => (event) => event.preventDefault();
+const handleDragEnd = ({ state, vm }) => (event) => {
+  if (!state.tree.draggable) {
+    return;
+  }
+  state.tree.state.emitter.emit("tree-node-drag-end", event, vm);
+};
+const created = ({ props, state }) => (fn) => {
+  const tree = state.tree;
+  const property = tree.props || {};
+  const childrenKey = property.children || "children";
+  fn(childrenKey);
+  if (props.node.expanded) {
+    state.expanded = true;
+    state.childNodeRendered = true;
+  }
 };
-export var created = function created(_ref14) {
-  var props = _ref14.props,
-    state = _ref14.state;
-  return function (fn) {
-    var tree = state.tree;
-    var property = tree.props || {};
-    var childrenKey = property.children || 'children';
-    fn(childrenKey);
-    if (props.node.expanded) {
-      state.expanded = true;
-      state.childNodeRendered = true;
-    }
-  };
+const onSiblingToggleExpand = ({ state, props }) => ({ isExpand, sibling }) => {
+  if (state.tree.accordion && isExpand && props.node && sibling && props.node.id !== sibling.id) {
+    props.node.collapse();
+  }
 };
-export var onSiblingToggleExpand = function onSiblingToggleExpand(_ref15) {
-  var state = _ref15.state,
-    props = _ref15.props;
-  return function (_ref16) {
-    var isExpand = _ref16.isExpand,
-      sibling = _ref16.sibling;
-    if (state.tree.accordion && isExpand && props.node && sibling && props.node.id !== sibling.id) {
-      props.node.collapse();
-    }
-  };
+const watchExpandedChange = ({ state, props }) => (value) => {
+  state.parentEmitter.emit("sibling-node-toggle-expand", {
+    isExpand: value,
+    sibling: props.node
+  });
+};
+export {
+  closeMenu,
+  created,
+  getNodeKey,
+  handleCheckChange,
+  handleChildNodeExpand,
+  handleClick,
+  handleContentClick,
+  handleContextMenu,
+  handleDragEnd,
+  handleDragOver,
+  handleDragStart,
+  handleDrop,
+  handleExpandClick,
+  handleExpandIconClick,
+  handleSelectChange,
+  onSiblingToggleExpand,
+  watchChecked,
+  watchExpanded,
+  watchExpandedChange,
+  watchIndeterminate
 };
-export var watchExpandedChange = function watchExpandedChange(_ref17) {
-  var state = _ref17.state,
-    props = _ref17.props;
-  return function (value) {
-    state.parentEmitter.emit('sibling-node-toggle-expand', {
-      isExpand: value,
-      sibling: props.node
-    });
-  };
-};