bkui-vue 2.1.0-dev-beta.10 → 2.1.0-dev-beta.12

package/lib/popover/index.js

@@ -410,10 +410,6 @@ const oppositeSideMap = {
   bottom: 'top',
   top: 'bottom'
 };
-const oppositeAlignmentMap = {
-  start: 'end',
-  end: 'start'
-};
 function clamp(start, value, end) {
   return floating_ui_utils_max(start, floating_ui_utils_min(value, end));
 }
@@ -432,9 +428,9 @@ function floating_ui_utils_getOppositeAxis(axis) {
 function getAxisLength(axis) {
   return axis === 'y' ? 'height' : 'width';
 }
-const yAxisSides = /*#__PURE__*/new Set(['top', 'bottom']);
 function floating_ui_utils_getSideAxis(placement) {
-  return yAxisSides.has(floating_ui_utils_getSide(placement)) ? 'y' : 'x';
+  const firstChar = placement[0];
+  return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
 }
 function getAlignmentAxis(placement) {
   return floating_ui_utils_getOppositeAxis(floating_ui_utils_getSideAxis(placement));
@@ -457,7 +453,7 @@ function getExpandedPlacements(placement) {
   return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
 }
 function getOppositeAlignmentPlacement(placement) {
-  return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
+  return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
 }
 const lrPlacement = ['left', 'right'];
 const rlPlacement = ['right', 'left'];
@@ -488,7 +484,8 @@ function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
   return list;
 }
 function getOppositePlacement(placement) {
-  return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
+  const side = floating_ui_utils_getSide(placement);
+  return oppositeSideMap[side] + placement.slice(side.length);
 }
 function expandPaddingObject(padding) {
   return {
@@ -653,6 +650,9 @@ async function detectOverflow(state, options) {
   };
 }
 
+// Maximum number of resets that can occur before bailing to avoid infinite reset loops.
+const MAX_RESET_COUNT = 50;
+
 /**
  * Computes the `x` and `y` coordinates that will place the floating element
  * next to a given reference element.
@@ -667,7 +667,10 @@ const computePosition = async (reference, floating, config) => {
     middleware = [],
     platform
   } = config;
-  const validMiddleware = middleware.filter(Boolean);
+  const platformWithDetectOverflow = platform.detectOverflow ? platform : {
+    ...platform,
+    detectOverflow
+  };
   const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
   let rects = await platform.getElementRects({
     reference,
@@ -679,14 +682,17 @@ const computePosition = async (reference, floating, config) => {
     y
   } = computeCoordsFromPlacement(rects, placement, rtl);
   let statefulPlacement = placement;
-  let middlewareData = {};
   let resetCount = 0;
-  for (let i = 0; i < validMiddleware.length; i++) {
-    var _platform$detectOverf;
+  const middlewareData = {};
+  for (let i = 0; i < middleware.length; i++) {
+    const currentMiddleware = middleware[i];
+    if (!currentMiddleware) {
+      continue;
+    }
     const {
       name,
       fn
-    } = validMiddleware[i];
+    } = currentMiddleware;
     const {
       x: nextX,
       y: nextY,
@@ -700,10 +706,7 @@ const computePosition = async (reference, floating, config) => {
       strategy,
       middlewareData,
       rects,
-      platform: {
-        ...platform,
-        detectOverflow: (_platform$detectOverf = platform.detectOverflow) != null ? _platform$detectOverf : detectOverflow
-      },
+      platform: platformWithDetectOverflow,
       elements: {
         reference,
         floating
@@ -711,14 +714,11 @@ const computePosition = async (reference, floating, config) => {
     });
     x = nextX != null ? nextX : x;
     y = nextY != null ? nextY : y;
-    middlewareData = {
-      ...middlewareData,
-      [name]: {
-        ...middlewareData[name],
-        ...data
-      }
+    middlewareData[name] = {
+      ...middlewareData[name],
+      ...data
     };
-    if (reset && resetCount <= 50) {
+    if (reset && resetCount < MAX_RESET_COUNT) {
       resetCount++;
       if (typeof reset === 'object') {
         if (reset.placement) {
@@ -1630,7 +1630,6 @@ function isShadowRoot(value) {
   }
   return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
 }
-const invalidOverflowDisplayValues = /*#__PURE__*/new Set(['inline', 'contents']);
 function isOverflowElement(element) {
   const {
     overflow,
@@ -1638,32 +1637,35 @@ function isOverflowElement(element) {
     overflowY,
     display
   } = floating_ui_utils_dom_getComputedStyle(element);
-  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
+  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== 'inline' && display !== 'contents';
 }
-const tableElements = /*#__PURE__*/new Set(['table', 'td', 'th']);
 function isTableElement(element) {
-  return tableElements.has(getNodeName(element));
+  return /^(table|td|th)$/.test(getNodeName(element));
 }
-const topLayerSelectors = [':popover-open', ':modal'];
 function isTopLayer(element) {
-  return topLayerSelectors.some(selector => {
-    try {
-      return element.matches(selector);
-    } catch (_e) {
-      return false;
+  try {
+    if (element.matches(':popover-open')) {
+      return true;
     }
-  });
+  } catch (_e) {
+    // no-op
+  }
+  try {
+    return element.matches(':modal');
+  } catch (_e) {
+    return false;
+  }
 }
-const transformProperties = ['transform', 'translate', 'scale', 'rotate', 'perspective'];
-const willChangeValues = ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'];
-const containValues = ['paint', 'layout', 'strict', 'content'];
+const willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
+const containRe = /paint|layout|strict|content/;
+const isNotNone = value => !!value && value !== 'none';
+let isWebKitValue;
 function isContainingBlock(elementOrCss) {
-  const webkit = isWebKit();
   const css = isElement(elementOrCss) ? floating_ui_utils_dom_getComputedStyle(elementOrCss) : elementOrCss;
 
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
   // https://drafts.csswg.org/css-transforms-2/#individual-transforms
-  return transformProperties.some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || willChangeValues.some(value => (css.willChange || '').includes(value)) || containValues.some(value => (css.contain || '').includes(value));
+  return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || '') || containRe.test(css.contain || '');
 }
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
@@ -1678,12 +1680,13 @@ function getContainingBlock(element) {
   return null;
 }
 function isWebKit() {
-  if (typeof CSS === 'undefined' || !CSS.supports) return false;
-  return CSS.supports('-webkit-backdrop-filter', 'none');
+  if (isWebKitValue == null) {
+    isWebKitValue = typeof CSS !== 'undefined' && CSS.supports && CSS.supports('-webkit-backdrop-filter', 'none');
+  }
+  return isWebKitValue;
 }
-const lastTraversableNodeNames = /*#__PURE__*/new Set(['html', 'body', '#document']);
 function isLastTraversableNode(node) {
-  return lastTraversableNodeNames.has(getNodeName(node));
+  return /^(html|body|#document)$/.test(getNodeName(node));
 }
 function floating_ui_utils_dom_getComputedStyle(element) {
   return getWindow(element).getComputedStyle(element);
@@ -1739,8 +1742,9 @@ function getOverflowAncestors(node, list, traverseIframes) {
   if (isBody) {
     const frameElement = getFrameElement(win);
     return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
+  } else {
+    return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
   }
-  return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
 }
 function getFrameElement(win) {
   return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
@@ -1925,7 +1929,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
     if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
       scroll = getNodeScroll(offsetParent);
     }
-    if (isHTMLElement(offsetParent)) {
+    if (isOffsetParentAnElement) {
       const offsetRect = getBoundingClientRect(offsetParent);
       scale = getScale(offsetParent);
       offsets.x = offsetRect.x + offsetParent.clientLeft;
@@ -2013,7 +2017,6 @@ function getViewportRect(element, strategy) {
   };
 }
 
-const absoluteOrFixed = /*#__PURE__*/new Set(['absolute', 'fixed']);
 // Returns the inner client rect, subtracting scrollbars if present.
 function getInnerBoundingClientRect(element, strategy) {
   const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
@@ -2078,7 +2081,7 @@ function getClippingElementAncestors(element, cache) {
     if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
       currentContainingBlockComputedStyle = null;
     }
-    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
+    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === 'absolute' || currentContainingBlockComputedStyle.position === 'fixed') || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
     if (shouldDropCurrentNode) {
       // Drop non-containing blocks.
       result = result.filter(ancestor => ancestor !== currentNode);
@@ -2103,20 +2106,23 @@ function getClippingRect(_ref) {
   } = _ref;
   const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
   const clippingAncestors = [...elementClippingAncestors, rootBoundary];
-  const firstClippingAncestor = clippingAncestors[0];
-  const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
-    const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
-    accRect.top = floating_ui_utils_max(rect.top, accRect.top);
-    accRect.right = floating_ui_utils_min(rect.right, accRect.right);
-    accRect.bottom = floating_ui_utils_min(rect.bottom, accRect.bottom);
-    accRect.left = floating_ui_utils_max(rect.left, accRect.left);
-    return accRect;
-  }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
+  const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
+  let top = firstRect.top;
+  let right = firstRect.right;
+  let bottom = firstRect.bottom;
+  let left = firstRect.left;
+  for (let i = 1; i < clippingAncestors.length; i++) {
+    const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
+    top = floating_ui_utils_max(rect.top, top);
+    right = floating_ui_utils_min(rect.right, right);
+    bottom = floating_ui_utils_min(rect.bottom, bottom);
+    left = floating_ui_utils_max(rect.left, left);
+  }
   return {
-    width: clippingRect.right - clippingRect.left,
-    height: clippingRect.bottom - clippingRect.top,
-    x: clippingRect.left,
-    y: clippingRect.top
+    width: right - left,
+    height: bottom - top,
+    x: left,
+    y: top
   };
 }
 
@@ -2367,7 +2373,7 @@ function autoUpdate(reference, floating, update, options) {
     animationFrame = false
   } = options;
   const referenceEl = unwrapElement(reference);
-  const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
+  const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...(floating ? getOverflowAncestors(floating) : [])] : [];
   ancestors.forEach(ancestor => {
     ancestorScroll && ancestor.addEventListener('scroll', update, {
       passive: true
@@ -2380,7 +2386,7 @@ function autoUpdate(reference, floating, update, options) {
   if (elementResize) {
     resizeObserver = new ResizeObserver(_ref => {
       let [firstEntry] = _ref;
-      if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
+      if (firstEntry && firstEntry.target === referenceEl && resizeObserver && floating) {
         // Prevent update loops when using the `size` middleware.
         // https://github.com/floating-ui/floating-ui/issues/1740
         resizeObserver.unobserve(floating);
@@ -2395,7 +2401,9 @@ function autoUpdate(reference, floating, update, options) {
     if (referenceEl && !animationFrame) {
       resizeObserver.observe(referenceEl);
     }
-    resizeObserver.observe(floating);
+    if (floating) {
+      resizeObserver.observe(floating);
+    }
   }
   let frameId;
   let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;

package/lib/tree/constant.d.ts

@@ -1,7 +1,10 @@
 export declare enum EVENTS {
+    NODE_ASYNC_LOAD = "nodeAsyncLoad",
+    NODE_ASYNC_LOAD_ERROR = "nodeAsyncLoadError",
     NODE_CHECKED = "nodeChecked",
     NODE_CLICK = "nodeClick",
     NODE_COLLAPSE = "nodeCollapse",
+    NODE_DATA_CHANGE = "nodeDataChange",
     NODE_DRAG_LEAVE = "nodeDragLeave",
     NODE_DRAG_OVER = "nodeDragOver",
     NODE_DRAG_SORT = "nodeDragSort",
@@ -12,10 +15,13 @@ export declare enum EVENTS {
     NODE_SELECTED = "nodeSelected"
 }
 export declare const TreeEmitEventsType: {
+    nodeAsyncLoad: (..._args: any[]) => boolean;
+    nodeAsyncLoadError: (..._args: any[]) => boolean;
     nodeClick: (..._args: any[]) => boolean;
     nodeCollapse: (..._args: any[]) => boolean;
     nodeExpand: (..._args: any[]) => boolean;
     nodeChecked: (..._args: any[]) => boolean;
+    nodeDataChange: (..._args: any[]) => boolean;
     nodeDragStart: (..._args: any[]) => boolean;
     nodeDragOver: (..._args: any[]) => boolean;
     nodeDragLeave: (..._args: any[]) => boolean;

package/lib/tree/index.d.ts

@@ -38,10 +38,9 @@ declare const BkTree: {
         prefixIcon: import("vue-types").VueTypeDef<any> & {
             default: any;
         };
+        onDataChange: import("vue").PropType<import("./props").TreeDataChangeHandler>;
         async: import("vue-types").VueTypeShape<{
-            callback: (item: any, cb: any) => Promise<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>>;
+            callback: (item: import("./props").TreeNode, cb: (data: import("./props").TreeNode | import("./props").TreeNode[]) => unknown, data?: unknown) => import("./props").TreeNode | import("./props").TreeNode[] | Promise<import("./props").TreeNode | import("./props").TreeNode[]>;
             cache: boolean;
             deepAutoOpen?: string;
             trigger?: string[];
@@ -134,13 +133,21 @@ declare const BkTree: {
         } & {
             default: boolean;
         };
+        cascade: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
         intersectionObserver: import("vue-types").VueTypeDef<boolean | import("./props").IIntersectionObserver> & {
             default: boolean | (() => import("./props").IIntersectionObserver);
         };
     }>> & Readonly<{
+        onNodeAsyncLoad?: (...args: any[]) => any;
+        onNodeAsyncLoadError?: (...args: any[]) => any;
         onNodeChecked?: (...args: any[]) => any;
         onNodeClick?: (...args: any[]) => any;
         onNodeCollapse?: (...args: any[]) => any;
+        onNodeDataChange?: (...args: any[]) => any;
         onNodeDragLeave?: (...args: any[]) => any;
         onNodeDragOver?: (...args: any[]) => any;
         onNodeDragSort?: (...args: any[]) => any;
@@ -150,10 +157,13 @@ declare const BkTree: {
         onNodeExpand?: (...args: any[]) => any;
         onNodeSelected?: (...args: any[]) => any;
     }>, () => JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        nodeAsyncLoad: (..._args: any[]) => boolean;
+        nodeAsyncLoadError: (..._args: any[]) => boolean;
         nodeClick: (..._args: any[]) => boolean;
         nodeCollapse: (..._args: any[]) => boolean;
         nodeExpand: (..._args: any[]) => boolean;
         nodeChecked: (..._args: any[]) => boolean;
+        nodeDataChange: (..._args: any[]) => boolean;
         nodeDragStart: (..._args: any[]) => boolean;
         nodeDragOver: (..._args: any[]) => boolean;
         nodeDragLeave: (..._args: any[]) => boolean;
@@ -192,6 +202,7 @@ declare const BkTree: {
         nodeContentAction: any;
         keepSlotData: boolean;
         checkStrictly: boolean;
+        cascade: boolean;
     }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
         P: {};
         B: {};
@@ -238,10 +249,9 @@ declare const BkTree: {
         prefixIcon: import("vue-types").VueTypeDef<any> & {
             default: any;
         };
+        onDataChange: import("vue").PropType<import("./props").TreeDataChangeHandler>;
         async: import("vue-types").VueTypeShape<{
-            callback: (item: any, cb: any) => Promise<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>>;
+            callback: (item: import("./props").TreeNode, cb: (data: import("./props").TreeNode | import("./props").TreeNode[]) => unknown, data?: unknown) => import("./props").TreeNode | import("./props").TreeNode[] | Promise<import("./props").TreeNode | import("./props").TreeNode[]>;
             cache: boolean;
             deepAutoOpen?: string;
             trigger?: string[];
@@ -334,13 +344,21 @@ declare const BkTree: {
         } & {
             default: boolean;
         };
+        cascade: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
         intersectionObserver: import("vue-types").VueTypeDef<boolean | import("./props").IIntersectionObserver> & {
             default: boolean | (() => import("./props").IIntersectionObserver);
         };
     }>> & Readonly<{
+        onNodeAsyncLoad?: (...args: any[]) => any;
+        onNodeAsyncLoadError?: (...args: any[]) => any;
         onNodeChecked?: (...args: any[]) => any;
         onNodeClick?: (...args: any[]) => any;
         onNodeCollapse?: (...args: any[]) => any;
+        onNodeDataChange?: (...args: any[]) => any;
         onNodeDragLeave?: (...args: any[]) => any;
         onNodeDragOver?: (...args: any[]) => any;
         onNodeDragSort?: (...args: any[]) => any;
@@ -380,6 +398,7 @@ declare const BkTree: {
         nodeContentAction: any;
         keepSlotData: boolean;
         checkStrictly: boolean;
+        cascade: boolean;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
@@ -423,10 +442,9 @@ declare const BkTree: {
     prefixIcon: import("vue-types").VueTypeDef<any> & {
         default: any;
     };
+    onDataChange: import("vue").PropType<import("./props").TreeDataChangeHandler>;
     async: import("vue-types").VueTypeShape<{
-        callback: (item: any, cb: any) => Promise<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-            [key: string]: any;
-        }>>;
+        callback: (item: import("./props").TreeNode, cb: (data: import("./props").TreeNode | import("./props").TreeNode[]) => unknown, data?: unknown) => import("./props").TreeNode | import("./props").TreeNode[] | Promise<import("./props").TreeNode | import("./props").TreeNode[]>;
         cache: boolean;
         deepAutoOpen?: string;
         trigger?: string[];
@@ -519,13 +537,21 @@ declare const BkTree: {
     } & {
         default: boolean;
     };
+    cascade: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
     intersectionObserver: import("vue-types").VueTypeDef<boolean | import("./props").IIntersectionObserver> & {
         default: boolean | (() => import("./props").IIntersectionObserver);
     };
 }>> & Readonly<{
+    onNodeAsyncLoad?: (...args: any[]) => any;
+    onNodeAsyncLoadError?: (...args: any[]) => any;
     onNodeChecked?: (...args: any[]) => any;
     onNodeClick?: (...args: any[]) => any;
     onNodeCollapse?: (...args: any[]) => any;
+    onNodeDataChange?: (...args: any[]) => any;
     onNodeDragLeave?: (...args: any[]) => any;
     onNodeDragOver?: (...args: any[]) => any;
     onNodeDragSort?: (...args: any[]) => any;
@@ -535,10 +561,13 @@ declare const BkTree: {
     onNodeExpand?: (...args: any[]) => any;
     onNodeSelected?: (...args: any[]) => any;
 }>, () => JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    nodeAsyncLoad: (..._args: any[]) => boolean;
+    nodeAsyncLoadError: (..._args: any[]) => boolean;
     nodeClick: (..._args: any[]) => boolean;
     nodeCollapse: (..._args: any[]) => boolean;
     nodeExpand: (..._args: any[]) => boolean;
     nodeChecked: (..._args: any[]) => boolean;
+    nodeDataChange: (..._args: any[]) => boolean;
     nodeDragStart: (..._args: any[]) => boolean;
     nodeDragOver: (..._args: any[]) => boolean;
     nodeDragLeave: (..._args: any[]) => boolean;
@@ -577,5 +606,6 @@ declare const BkTree: {
     nodeContentAction: any;
     keepSlotData: boolean;
     checkStrictly: boolean;
+    cascade: boolean;
 }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[], any[]>;
 export default BkTree;