bkui-vue 0.0.1-beta.201 → 0.0.1-beta.203

package/dist/index.esm.js

@@ -11324,10 +11324,17 @@ function hide$1(el) {
     onHide();
   }
 }
+const CachedConst = {};
 const isAvailableId = (query) => {
   const container2 = document.querySelector(query);
   return container2 instanceof HTMLElement;
 };
+const getFullscreenUid = () => {
+  if (!CachedConst.fullscreenReferId) {
+    CachedConst.fullscreenReferId = `id_${uuid_1.v4()}`;
+  }
+  return CachedConst.fullscreenReferId;
+};
 function createPopoverComponent(options) {
   let $PopoverInstance = null;
   let $PopoverInstanceVm = null;
@@ -12865,7 +12872,7 @@ function autoUpdate(reference2, floating, update, options) {
 const computePosition = (reference2, floating, options) => computePosition$1(reference2, floating, __spreadValues({
   platform
 }, options));
-var usePlatform = () => {
+var usePlatform = (fullscreenTarget) => {
   const getElementRects = ({
     reference: reference2,
     floating
@@ -12898,11 +12905,11 @@ var usePlatform = () => {
     };
   };
   const getClippingRect2 = ({}) => {
-    var _a, _b;
+    var _a;
     const {
       width = 0,
       height = 0
-    } = (_b = (_a = document.fullscreenElement) == null ? void 0 : _a.getBoundingClientRect()) != null ? _b : {};
+    } = (_a = fullscreenTarget == null ? void 0 : fullscreenTarget.getBoundingClientRect()) != null ? _a : {};
     return {
       width,
       height,
@@ -12916,8 +12923,14 @@ var usePlatform = () => {
     getClippingRect: getClippingRect2
   };
 };
-var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) => {
+var useFloating = (props2, ctx, {
+  refReference,
+  refContent,
+  refArrow,
+  refRoot
+}) => {
   const localIsShow = ref(false);
+  const fullScreenTarget = ref();
   const isElementFullScreen = () => {
     var _a, _b, _c;
     const elReference = resolveTargetElement((_a = refReference.value) == null ? void 0 : _a.$el);
@@ -12926,6 +12939,15 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
     }
     return (_c = document.fullscreenElement) == null ? void 0 : _c.contains(elReference);
   };
+  const getFullscreenRoot = (selector) => {
+    if (isElementFullScreen()) {
+      if (document.fullscreenElement.shadowRoot) {
+        return document.fullscreenElement.shadowRoot.querySelector(selector);
+      }
+      return document.fullscreenElement.querySelector(selector);
+    }
+    return document.body;
+  };
   const themeList = ["dark", "light"];
   const compTheme = computed(() => {
     var _a, _b;
@@ -12938,8 +12960,8 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
       customThemes
     };
   });
-  const isHideMiddlewareAvailable = () => !isElementFullScreen() && props2.autoVisibility;
-  const isAutoPlacemntAvailable = () => isElementFullScreen() || props2.autoPlacement;
+  const isHideMiddlewareAvailable = () => props2.autoVisibility;
+  const isAutoPlacementAvailable = () => props2.autoPlacement;
   const resolvePopElements = () => {
     var _a, _b, _c, _d;
     const elReference = resolveTargetElement((_a = refReference.value) == null ? void 0 : _a.$el);
@@ -12967,7 +12989,7 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
         element: elArrow
       }));
     }
-    if (isAutoPlacemntAvailable()) {
+    if (isAutoPlacementAvailable()) {
       middleware.push(autoPlacement());
     } else {
       middleware.unshift(inline());
@@ -12981,7 +13003,7 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
         getElementRects,
         getDimensions: getDimensions2,
         getClippingRect: getClippingRect2
-      } = usePlatform();
+      } = usePlatform(fullScreenTarget.value);
       Object.assign(options, {
         platform: __spreadProps(__spreadValues({}, (_a = props3 == null ? void 0 : props3.platform) != null ? _a : {}), {
           getElementRects,
@@ -13166,6 +13188,9 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
     };
     return (_a = triggerEvents[props2.trigger]) != null ? _a : [];
   };
+  const updateFullscreenTarget = (val) => {
+    fullScreenTarget.value = val;
+  };
   watch(localIsShow, (val) => {
     if (val) {
       hanldePopoverShow();
@@ -13183,15 +13208,16 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
     isElementFullScreen,
     resolveTargetElement,
     createPopInstance,
+    updateFullscreenTarget,
+    getFullscreenRoot,
     localIsShow,
     cleanup
   };
 };
 let popContainerId = null;
-let fullscreenReferId = null;
 let parentNodeReferId = null;
 var usePopperId = (props2, prefix = "#") => {
-  const getPrefixId = (isFullscreen = false, root) => {
+  const getPrefixId = (root) => {
     let resolvedBoundary = null;
     const resolveBoundary = (fn2) => {
       if (resolvedBoundary === null) {
@@ -13208,11 +13234,6 @@ var usePopperId = (props2, prefix = "#") => {
         }
       }
     };
-    const resolveFullScreenBoundary = () => {
-      if (isFullscreen) {
-        resolvedBoundary = `[data-fllsrn-id=${fullscreenReferId}]`;
-      }
-    };
     const resolveCommonBoundary = () => {
       if (!/^body$/i.test(props2.boundary) && typeof props2.boundary === "string") {
         if (!isAvailableId(props2.boundary)) {
@@ -13225,7 +13246,6 @@ var usePopperId = (props2, prefix = "#") => {
     };
     resolveBoundary(resolveParentBoundary);
     resolveBoundary(resolveCommonBoundary);
-    resolveBoundary(resolveFullScreenBoundary);
     resolveBoundary(() => {
       resolvedBoundary = typeof props2.boundary === "string" ? props2.boundary : `${prefix}${popContainerId}`;
     });
@@ -13238,33 +13258,20 @@ var usePopperId = (props2, prefix = "#") => {
     popContainer.setAttribute("data-popper-id", popContainerId);
     document.body.append(popContainer);
   }
-  if (fullscreenReferId === null) {
-    fullscreenReferId = `id_${uuid_1.v4()}`;
-  }
   if (parentNodeReferId === null) {
     parentNodeReferId = `id_${uuid_1.v4()}`;
   }
-  const resetFullscreenElementTag = () => {
-    var _a;
-    if (document.fullscreenElement === null) {
-      const query = `[data-fllsrn-id=${fullscreenReferId}]`;
-      ((_a = document.querySelectorAll(query)) != null ? _a : []).forEach((element) => {
-        element.removeAttribute("data-fllsrn-id");
-      });
-    } else {
-      document.fullscreenElement.setAttribute("data-fllsrn-id", fullscreenReferId);
-    }
-  };
   return {
     popContainerId,
     prefixId: getPrefixId(),
-    getPrefixId,
-    resetFullscreenElementTag
+    getPrefixId
   };
 };
-var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot) => {
+var usePopoverInit = (props2, ctx, { refReference, refContent, refArrow, refRoot }) => {
   let storeEvents = null;
   const isFullscreen = ref(false);
+  const fullscreenReferId = getFullscreenUid();
+  const fullScreenTarget = ref();
   const {
     localIsShow,
     showPopover,
@@ -13273,9 +13280,10 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
     resolveTriggerEvents,
     resolvePopElements,
     isElementFullScreen,
-    cleanup,
-    createPopInstance
-  } = useFloating(props2, ctx, refReference, refContent, refArrow, refRoot);
+    updateFullscreenTarget,
+    createPopInstance,
+    getFullscreenRoot
+  } = useFloating(props2, ctx, { refReference, refContent, refArrow, refRoot });
   const showFn = () => {
     showPopover();
   };
@@ -13323,16 +13331,39 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
   };
   const updateBoundary = () => {
     const { elReference, root } = resolvePopElements();
-    boundary.value = getPrefixId(isFullscreen.value, root || elReference);
+    if (isFullscreen.value) {
+      boundary.value = fullScreenTarget == null ? void 0 : fullScreenTarget.value;
+      return;
+    }
+    boundary.value = getPrefixId(root || elReference);
+  };
+  const { getPrefixId } = usePopperId(props2, "#");
+  const setFullscreenTag = () => {
+    var _a;
+    (_a = fullScreenTarget == null ? void 0 : fullScreenTarget.value) == null ? void 0 : _a.setAttribute("data-fllsrn-id", fullscreenReferId);
+  };
+  const clearFullscreenTag = () => {
+    var _a, _b;
+    const query = `[data-fllsrn-id=${fullscreenReferId}]`;
+    ((_b = (_a = fullScreenTarget == null ? void 0 : fullScreenTarget.value) == null ? void 0 : _a.querySelectorAll(query)) != null ? _b : []).forEach((element) => {
+      element == null ? void 0 : element.removeAttribute("data-fllsrn-id");
+    });
   };
-  const { getPrefixId, resetFullscreenElementTag } = usePopperId(props2, "#");
   const boundary = ref();
   const beforeInstanceUnmount = () => {
     removeEventListener2();
   };
-  const handleFullscreenChange = () => {
+  const updateFullscreen = (target) => {
+    fullScreenTarget.value = target;
+    updateFullscreenTarget(target);
     isFullscreen.value = isElementFullScreen();
-    resetFullscreenElementTag();
+    setFullscreenTag();
+  };
+  const handleFullscreenChange = (e) => {
+    if (!document.fullscreenElement) {
+      clearFullscreenTag();
+    }
+    updateFullscreen(e.target);
     updateBoundary();
     updatePopover(null, props2);
   };
@@ -13341,6 +13372,11 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
       return;
     }
     initPopInstance();
+    if (isElementFullScreen()) {
+      const query = `[data-fllsrn-id=${fullscreenReferId}]`;
+      const target = getFullscreenRoot(query);
+      updateFullscreen(target);
+    }
     updateBoundary();
     document.body.addEventListener("fullscreenchange", handleFullscreenChange);
   };
@@ -13365,8 +13401,11 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
     updateBoundary,
     initPopInstance,
     updatePopover,
+    showPopover,
+    hidePopover,
     showFn,
     hideFn,
+    isFullscreen,
     boundary
   };
 };
@@ -13395,13 +13434,7 @@ var Component$q = defineComponent({
     const refContent = ref();
     const refArrow = ref();
     const refRoot = ref();
-    const isFullscreen = ref(false);
     const refReference = computed(() => reference2.value || refDefaultReference.value);
-    const {
-      showPopover,
-      hidePopover,
-      updatePopover
-    } = useFloating(props2, ctx, refReference, refContent, refArrow, refRoot);
     const {
       onMountedFn,
       onUnmountedFn,
@@ -13411,8 +13444,16 @@ var Component$q = defineComponent({
       initPopInstance,
       showFn,
       hideFn,
+      showPopover,
+      hidePopover,
+      updatePopover,
       boundary
-    } = usePopoverInit(props2, ctx, refReference, refContent, refArrow, refRoot);
+    } = usePopoverInit(props2, ctx, {
+      refReference,
+      refContent,
+      refArrow,
+      refRoot
+    });
     if (!props2.always && !props2.disabled) {
       watch(() => props2.isShow, () => {
         props2.isShow ? showPopover() : hidePopover();
@@ -13430,7 +13471,7 @@ var Component$q = defineComponent({
     updateBoundary();
     onMounted(onMountedFn);
     onBeforeUnmount(onUnmountedFn);
-    const transBoundary = computed(() => (isFullscreen.value || !disableTeleport) && typeof boundary.value === "string");
+    const transBoundary = computed(() => !disableTeleport);
     const show2 = () => {
       showFn();
     };
@@ -16127,7 +16168,7 @@ var SORT_OPTION = /* @__PURE__ */ ((SORT_OPTION2) => {
   SORT_OPTION2["NULL"] = "null";
   return SORT_OPTION2;
 })(SORT_OPTION || {});
-const SORT_OPTIONS = ["asc", "desc"];
+const SORT_OPTIONS = ["asc", "desc", "null"];
 var SortScope = /* @__PURE__ */ ((SortScope2) => {
   SortScope2["CURRENT"] = "current";
   SortScope2["ALL"] = "all";
@@ -16155,7 +16196,7 @@ const IColumnType = {
     PropTypes.shape({
       sortFn: PropTypes.func.def(void 0),
       sortScope: PropTypes.commonType(Object.values(SortScope)).def("current"),
-      value: PropTypes.string.def(null)
+      value: PropTypes.string.def(SORT_OPTION.NULL)
     }),
     PropTypes.bool,
     PropTypes.string
@@ -16231,7 +16272,7 @@ const tableProps = {
   })]).def(false),
   asyncData: PropTypes.bool.def(false),
   rowHover: PropTypes.oneOf(ROW_HOVER_OPTIONS).def(ROW_HOVER.HIGHLIGHT),
-  defaultSort: PropTypes.shape({}).def()
+  defaultSort: PropTypes.shape({}).def({})
 };
 var Column = defineComponent({
   name: "TableColumn",
@@ -17278,7 +17319,7 @@ var HeadFilter = defineComponent({
     return () => createVNode(BkPopover2, mergeProps({
       "trigger": "click",
       "isShow": state.isOpen,
-      "placement": "bottom-end",
+      "placement": "bottom-start",
       "arrow": false,
       "offset": 0
     }, {
@@ -17320,7 +17361,7 @@ var HeadSort = defineComponent({
   name: "HeadSort",
   props: {
     column: PropTypes.any.def({}),
-    defaultSort: PropTypes.oneOf(SORT_OPTIONS).def(SORT_OPTION.ASC)
+    defaultSort: PropTypes.oneOf(SORT_OPTIONS).def(SORT_OPTION.NULL)
   },
   emits: ["change"],
   setup(props2, {
@@ -18399,13 +18440,15 @@ const useInit = (props2, targetColumns) => {
   const colgroups = reactive([]);
   const { getColumns } = useColumn(props2, targetColumns);
   const updateColGroups = () => {
-    var _a2;
+    var _a2, _b2;
     const checked = ((_a2 = props2.settings) == null ? void 0 : _a2.checked) || [];
+    const settingFields = ((_b2 = props2.settings) == null ? void 0 : _b2.fields) || [];
+    const isSettingField = (col) => settingFields.some((field) => field.field === resolvePropVal(col, "field", [col]));
     colgroups.splice(0, colgroups.length, ...getColumns().map((col) => __spreadProps(__spreadValues({}, col), {
       calcWidth: null,
       resizeWidth: null,
       listeners: /* @__PURE__ */ new Map(),
-      isHidden: checked.length && !checked.includes(resolvePropVal(col, ["field", "type"], [col]))
+      isHidden: isSettingField(col) && checked.length && !checked.includes(resolvePropVal(col, ["field", "type"], [col]))
     })));
   };
   const { dragOffsetXStyle, dragOffsetX, resetResizeEvents, registerResizeEvent } = useColumnResize(colgroups, true);