bkui-vue 0.0.1-beta.201 → 0.0.1-beta.203
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +34 -34
- package/dist/index.esm.js +98 -55
- package/dist/index.umd.js +33 -33
- package/lib/plugin-popover/index.js +1 -1
- package/lib/popover2/index.js +1 -1
- package/lib/popover2/use-floating.d.ts +8 -1
- package/lib/popover2/use-platform.d.ts +1 -1
- package/lib/popover2/use-popover-init.d.ts +9 -1
- package/lib/popover2/use-popper-id.d.ts +1 -2
- package/lib/popover2/utils.d.ts +1 -0
- package/lib/table/index.js +1 -1
- package/lib/table-column/index.js +1 -1
- package/package.json +3 -3
package/dist/index.esm.js
CHANGED
@@ -11324,10 +11324,17 @@ function hide$1(el) {
|
|
11324
11324
|
onHide();
|
11325
11325
|
}
|
11326
11326
|
}
|
11327
|
+
const CachedConst = {};
|
11327
11328
|
const isAvailableId = (query) => {
|
11328
11329
|
const container2 = document.querySelector(query);
|
11329
11330
|
return container2 instanceof HTMLElement;
|
11330
11331
|
};
|
11332
|
+
const getFullscreenUid = () => {
|
11333
|
+
if (!CachedConst.fullscreenReferId) {
|
11334
|
+
CachedConst.fullscreenReferId = `id_${uuid_1.v4()}`;
|
11335
|
+
}
|
11336
|
+
return CachedConst.fullscreenReferId;
|
11337
|
+
};
|
11331
11338
|
function createPopoverComponent(options) {
|
11332
11339
|
let $PopoverInstance = null;
|
11333
11340
|
let $PopoverInstanceVm = null;
|
@@ -12865,7 +12872,7 @@ function autoUpdate(reference2, floating, update, options) {
|
|
12865
12872
|
const computePosition = (reference2, floating, options) => computePosition$1(reference2, floating, __spreadValues({
|
12866
12873
|
platform
|
12867
12874
|
}, options));
|
12868
|
-
var usePlatform = () => {
|
12875
|
+
var usePlatform = (fullscreenTarget) => {
|
12869
12876
|
const getElementRects = ({
|
12870
12877
|
reference: reference2,
|
12871
12878
|
floating
|
@@ -12898,11 +12905,11 @@ var usePlatform = () => {
|
|
12898
12905
|
};
|
12899
12906
|
};
|
12900
12907
|
const getClippingRect2 = ({}) => {
|
12901
|
-
var _a
|
12908
|
+
var _a;
|
12902
12909
|
const {
|
12903
12910
|
width = 0,
|
12904
12911
|
height = 0
|
12905
|
-
} = (
|
12912
|
+
} = (_a = fullscreenTarget == null ? void 0 : fullscreenTarget.getBoundingClientRect()) != null ? _a : {};
|
12906
12913
|
return {
|
12907
12914
|
width,
|
12908
12915
|
height,
|
@@ -12916,8 +12923,14 @@ var usePlatform = () => {
|
|
12916
12923
|
getClippingRect: getClippingRect2
|
12917
12924
|
};
|
12918
12925
|
};
|
12919
|
-
var useFloating = (props2, ctx,
|
12926
|
+
var useFloating = (props2, ctx, {
|
12927
|
+
refReference,
|
12928
|
+
refContent,
|
12929
|
+
refArrow,
|
12930
|
+
refRoot
|
12931
|
+
}) => {
|
12920
12932
|
const localIsShow = ref(false);
|
12933
|
+
const fullScreenTarget = ref();
|
12921
12934
|
const isElementFullScreen = () => {
|
12922
12935
|
var _a, _b, _c;
|
12923
12936
|
const elReference = resolveTargetElement((_a = refReference.value) == null ? void 0 : _a.$el);
|
@@ -12926,6 +12939,15 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
|
|
12926
12939
|
}
|
12927
12940
|
return (_c = document.fullscreenElement) == null ? void 0 : _c.contains(elReference);
|
12928
12941
|
};
|
12942
|
+
const getFullscreenRoot = (selector) => {
|
12943
|
+
if (isElementFullScreen()) {
|
12944
|
+
if (document.fullscreenElement.shadowRoot) {
|
12945
|
+
return document.fullscreenElement.shadowRoot.querySelector(selector);
|
12946
|
+
}
|
12947
|
+
return document.fullscreenElement.querySelector(selector);
|
12948
|
+
}
|
12949
|
+
return document.body;
|
12950
|
+
};
|
12929
12951
|
const themeList = ["dark", "light"];
|
12930
12952
|
const compTheme = computed(() => {
|
12931
12953
|
var _a, _b;
|
@@ -12938,8 +12960,8 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
|
|
12938
12960
|
customThemes
|
12939
12961
|
};
|
12940
12962
|
});
|
12941
|
-
const isHideMiddlewareAvailable = () =>
|
12942
|
-
const
|
12963
|
+
const isHideMiddlewareAvailable = () => props2.autoVisibility;
|
12964
|
+
const isAutoPlacementAvailable = () => props2.autoPlacement;
|
12943
12965
|
const resolvePopElements = () => {
|
12944
12966
|
var _a, _b, _c, _d;
|
12945
12967
|
const elReference = resolveTargetElement((_a = refReference.value) == null ? void 0 : _a.$el);
|
@@ -12967,7 +12989,7 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
|
|
12967
12989
|
element: elArrow
|
12968
12990
|
}));
|
12969
12991
|
}
|
12970
|
-
if (
|
12992
|
+
if (isAutoPlacementAvailable()) {
|
12971
12993
|
middleware.push(autoPlacement());
|
12972
12994
|
} else {
|
12973
12995
|
middleware.unshift(inline());
|
@@ -12981,7 +13003,7 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
|
|
12981
13003
|
getElementRects,
|
12982
13004
|
getDimensions: getDimensions2,
|
12983
13005
|
getClippingRect: getClippingRect2
|
12984
|
-
} = usePlatform();
|
13006
|
+
} = usePlatform(fullScreenTarget.value);
|
12985
13007
|
Object.assign(options, {
|
12986
13008
|
platform: __spreadProps(__spreadValues({}, (_a = props3 == null ? void 0 : props3.platform) != null ? _a : {}), {
|
12987
13009
|
getElementRects,
|
@@ -13166,6 +13188,9 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
|
|
13166
13188
|
};
|
13167
13189
|
return (_a = triggerEvents[props2.trigger]) != null ? _a : [];
|
13168
13190
|
};
|
13191
|
+
const updateFullscreenTarget = (val) => {
|
13192
|
+
fullScreenTarget.value = val;
|
13193
|
+
};
|
13169
13194
|
watch(localIsShow, (val) => {
|
13170
13195
|
if (val) {
|
13171
13196
|
hanldePopoverShow();
|
@@ -13183,15 +13208,16 @@ var useFloating = (props2, ctx, refReference, refContent, refArrow, refRoot) =>
|
|
13183
13208
|
isElementFullScreen,
|
13184
13209
|
resolveTargetElement,
|
13185
13210
|
createPopInstance,
|
13211
|
+
updateFullscreenTarget,
|
13212
|
+
getFullscreenRoot,
|
13186
13213
|
localIsShow,
|
13187
13214
|
cleanup
|
13188
13215
|
};
|
13189
13216
|
};
|
13190
13217
|
let popContainerId = null;
|
13191
|
-
let fullscreenReferId = null;
|
13192
13218
|
let parentNodeReferId = null;
|
13193
13219
|
var usePopperId = (props2, prefix = "#") => {
|
13194
|
-
const getPrefixId = (
|
13220
|
+
const getPrefixId = (root) => {
|
13195
13221
|
let resolvedBoundary = null;
|
13196
13222
|
const resolveBoundary = (fn2) => {
|
13197
13223
|
if (resolvedBoundary === null) {
|
@@ -13208,11 +13234,6 @@ var usePopperId = (props2, prefix = "#") => {
|
|
13208
13234
|
}
|
13209
13235
|
}
|
13210
13236
|
};
|
13211
|
-
const resolveFullScreenBoundary = () => {
|
13212
|
-
if (isFullscreen) {
|
13213
|
-
resolvedBoundary = `[data-fllsrn-id=${fullscreenReferId}]`;
|
13214
|
-
}
|
13215
|
-
};
|
13216
13237
|
const resolveCommonBoundary = () => {
|
13217
13238
|
if (!/^body$/i.test(props2.boundary) && typeof props2.boundary === "string") {
|
13218
13239
|
if (!isAvailableId(props2.boundary)) {
|
@@ -13225,7 +13246,6 @@ var usePopperId = (props2, prefix = "#") => {
|
|
13225
13246
|
};
|
13226
13247
|
resolveBoundary(resolveParentBoundary);
|
13227
13248
|
resolveBoundary(resolveCommonBoundary);
|
13228
|
-
resolveBoundary(resolveFullScreenBoundary);
|
13229
13249
|
resolveBoundary(() => {
|
13230
13250
|
resolvedBoundary = typeof props2.boundary === "string" ? props2.boundary : `${prefix}${popContainerId}`;
|
13231
13251
|
});
|
@@ -13238,33 +13258,20 @@ var usePopperId = (props2, prefix = "#") => {
|
|
13238
13258
|
popContainer.setAttribute("data-popper-id", popContainerId);
|
13239
13259
|
document.body.append(popContainer);
|
13240
13260
|
}
|
13241
|
-
if (fullscreenReferId === null) {
|
13242
|
-
fullscreenReferId = `id_${uuid_1.v4()}`;
|
13243
|
-
}
|
13244
13261
|
if (parentNodeReferId === null) {
|
13245
13262
|
parentNodeReferId = `id_${uuid_1.v4()}`;
|
13246
13263
|
}
|
13247
|
-
const resetFullscreenElementTag = () => {
|
13248
|
-
var _a;
|
13249
|
-
if (document.fullscreenElement === null) {
|
13250
|
-
const query = `[data-fllsrn-id=${fullscreenReferId}]`;
|
13251
|
-
((_a = document.querySelectorAll(query)) != null ? _a : []).forEach((element) => {
|
13252
|
-
element.removeAttribute("data-fllsrn-id");
|
13253
|
-
});
|
13254
|
-
} else {
|
13255
|
-
document.fullscreenElement.setAttribute("data-fllsrn-id", fullscreenReferId);
|
13256
|
-
}
|
13257
|
-
};
|
13258
13264
|
return {
|
13259
13265
|
popContainerId,
|
13260
13266
|
prefixId: getPrefixId(),
|
13261
|
-
getPrefixId
|
13262
|
-
resetFullscreenElementTag
|
13267
|
+
getPrefixId
|
13263
13268
|
};
|
13264
13269
|
};
|
13265
|
-
var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot) => {
|
13270
|
+
var usePopoverInit = (props2, ctx, { refReference, refContent, refArrow, refRoot }) => {
|
13266
13271
|
let storeEvents = null;
|
13267
13272
|
const isFullscreen = ref(false);
|
13273
|
+
const fullscreenReferId = getFullscreenUid();
|
13274
|
+
const fullScreenTarget = ref();
|
13268
13275
|
const {
|
13269
13276
|
localIsShow,
|
13270
13277
|
showPopover,
|
@@ -13273,9 +13280,10 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
|
|
13273
13280
|
resolveTriggerEvents,
|
13274
13281
|
resolvePopElements,
|
13275
13282
|
isElementFullScreen,
|
13276
|
-
|
13277
|
-
createPopInstance
|
13278
|
-
|
13283
|
+
updateFullscreenTarget,
|
13284
|
+
createPopInstance,
|
13285
|
+
getFullscreenRoot
|
13286
|
+
} = useFloating(props2, ctx, { refReference, refContent, refArrow, refRoot });
|
13279
13287
|
const showFn = () => {
|
13280
13288
|
showPopover();
|
13281
13289
|
};
|
@@ -13323,16 +13331,39 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
|
|
13323
13331
|
};
|
13324
13332
|
const updateBoundary = () => {
|
13325
13333
|
const { elReference, root } = resolvePopElements();
|
13326
|
-
|
13334
|
+
if (isFullscreen.value) {
|
13335
|
+
boundary.value = fullScreenTarget == null ? void 0 : fullScreenTarget.value;
|
13336
|
+
return;
|
13337
|
+
}
|
13338
|
+
boundary.value = getPrefixId(root || elReference);
|
13339
|
+
};
|
13340
|
+
const { getPrefixId } = usePopperId(props2, "#");
|
13341
|
+
const setFullscreenTag = () => {
|
13342
|
+
var _a;
|
13343
|
+
(_a = fullScreenTarget == null ? void 0 : fullScreenTarget.value) == null ? void 0 : _a.setAttribute("data-fllsrn-id", fullscreenReferId);
|
13344
|
+
};
|
13345
|
+
const clearFullscreenTag = () => {
|
13346
|
+
var _a, _b;
|
13347
|
+
const query = `[data-fllsrn-id=${fullscreenReferId}]`;
|
13348
|
+
((_b = (_a = fullScreenTarget == null ? void 0 : fullScreenTarget.value) == null ? void 0 : _a.querySelectorAll(query)) != null ? _b : []).forEach((element) => {
|
13349
|
+
element == null ? void 0 : element.removeAttribute("data-fllsrn-id");
|
13350
|
+
});
|
13327
13351
|
};
|
13328
|
-
const { getPrefixId, resetFullscreenElementTag } = usePopperId(props2, "#");
|
13329
13352
|
const boundary = ref();
|
13330
13353
|
const beforeInstanceUnmount = () => {
|
13331
13354
|
removeEventListener2();
|
13332
13355
|
};
|
13333
|
-
const
|
13356
|
+
const updateFullscreen = (target) => {
|
13357
|
+
fullScreenTarget.value = target;
|
13358
|
+
updateFullscreenTarget(target);
|
13334
13359
|
isFullscreen.value = isElementFullScreen();
|
13335
|
-
|
13360
|
+
setFullscreenTag();
|
13361
|
+
};
|
13362
|
+
const handleFullscreenChange = (e) => {
|
13363
|
+
if (!document.fullscreenElement) {
|
13364
|
+
clearFullscreenTag();
|
13365
|
+
}
|
13366
|
+
updateFullscreen(e.target);
|
13336
13367
|
updateBoundary();
|
13337
13368
|
updatePopover(null, props2);
|
13338
13369
|
};
|
@@ -13341,6 +13372,11 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
|
|
13341
13372
|
return;
|
13342
13373
|
}
|
13343
13374
|
initPopInstance();
|
13375
|
+
if (isElementFullScreen()) {
|
13376
|
+
const query = `[data-fllsrn-id=${fullscreenReferId}]`;
|
13377
|
+
const target = getFullscreenRoot(query);
|
13378
|
+
updateFullscreen(target);
|
13379
|
+
}
|
13344
13380
|
updateBoundary();
|
13345
13381
|
document.body.addEventListener("fullscreenchange", handleFullscreenChange);
|
13346
13382
|
};
|
@@ -13365,8 +13401,11 @@ var usePopoverInit = (props2, ctx, refReference, refContent, refArrow, refRoot)
|
|
13365
13401
|
updateBoundary,
|
13366
13402
|
initPopInstance,
|
13367
13403
|
updatePopover,
|
13404
|
+
showPopover,
|
13405
|
+
hidePopover,
|
13368
13406
|
showFn,
|
13369
13407
|
hideFn,
|
13408
|
+
isFullscreen,
|
13370
13409
|
boundary
|
13371
13410
|
};
|
13372
13411
|
};
|
@@ -13395,13 +13434,7 @@ var Component$q = defineComponent({
|
|
13395
13434
|
const refContent = ref();
|
13396
13435
|
const refArrow = ref();
|
13397
13436
|
const refRoot = ref();
|
13398
|
-
const isFullscreen = ref(false);
|
13399
13437
|
const refReference = computed(() => reference2.value || refDefaultReference.value);
|
13400
|
-
const {
|
13401
|
-
showPopover,
|
13402
|
-
hidePopover,
|
13403
|
-
updatePopover
|
13404
|
-
} = useFloating(props2, ctx, refReference, refContent, refArrow, refRoot);
|
13405
13438
|
const {
|
13406
13439
|
onMountedFn,
|
13407
13440
|
onUnmountedFn,
|
@@ -13411,8 +13444,16 @@ var Component$q = defineComponent({
|
|
13411
13444
|
initPopInstance,
|
13412
13445
|
showFn,
|
13413
13446
|
hideFn,
|
13447
|
+
showPopover,
|
13448
|
+
hidePopover,
|
13449
|
+
updatePopover,
|
13414
13450
|
boundary
|
13415
|
-
} = usePopoverInit(props2, ctx,
|
13451
|
+
} = usePopoverInit(props2, ctx, {
|
13452
|
+
refReference,
|
13453
|
+
refContent,
|
13454
|
+
refArrow,
|
13455
|
+
refRoot
|
13456
|
+
});
|
13416
13457
|
if (!props2.always && !props2.disabled) {
|
13417
13458
|
watch(() => props2.isShow, () => {
|
13418
13459
|
props2.isShow ? showPopover() : hidePopover();
|
@@ -13430,7 +13471,7 @@ var Component$q = defineComponent({
|
|
13430
13471
|
updateBoundary();
|
13431
13472
|
onMounted(onMountedFn);
|
13432
13473
|
onBeforeUnmount(onUnmountedFn);
|
13433
|
-
const transBoundary = computed(() =>
|
13474
|
+
const transBoundary = computed(() => !disableTeleport);
|
13434
13475
|
const show2 = () => {
|
13435
13476
|
showFn();
|
13436
13477
|
};
|
@@ -16127,7 +16168,7 @@ var SORT_OPTION = /* @__PURE__ */ ((SORT_OPTION2) => {
|
|
16127
16168
|
SORT_OPTION2["NULL"] = "null";
|
16128
16169
|
return SORT_OPTION2;
|
16129
16170
|
})(SORT_OPTION || {});
|
16130
|
-
const SORT_OPTIONS = ["asc", "desc"];
|
16171
|
+
const SORT_OPTIONS = ["asc", "desc", "null"];
|
16131
16172
|
var SortScope = /* @__PURE__ */ ((SortScope2) => {
|
16132
16173
|
SortScope2["CURRENT"] = "current";
|
16133
16174
|
SortScope2["ALL"] = "all";
|
@@ -16155,7 +16196,7 @@ const IColumnType = {
|
|
16155
16196
|
PropTypes.shape({
|
16156
16197
|
sortFn: PropTypes.func.def(void 0),
|
16157
16198
|
sortScope: PropTypes.commonType(Object.values(SortScope)).def("current"),
|
16158
|
-
value: PropTypes.string.def(
|
16199
|
+
value: PropTypes.string.def(SORT_OPTION.NULL)
|
16159
16200
|
}),
|
16160
16201
|
PropTypes.bool,
|
16161
16202
|
PropTypes.string
|
@@ -16231,7 +16272,7 @@ const tableProps = {
|
|
16231
16272
|
})]).def(false),
|
16232
16273
|
asyncData: PropTypes.bool.def(false),
|
16233
16274
|
rowHover: PropTypes.oneOf(ROW_HOVER_OPTIONS).def(ROW_HOVER.HIGHLIGHT),
|
16234
|
-
defaultSort: PropTypes.shape({}).def()
|
16275
|
+
defaultSort: PropTypes.shape({}).def({})
|
16235
16276
|
};
|
16236
16277
|
var Column = defineComponent({
|
16237
16278
|
name: "TableColumn",
|
@@ -17278,7 +17319,7 @@ var HeadFilter = defineComponent({
|
|
17278
17319
|
return () => createVNode(BkPopover2, mergeProps({
|
17279
17320
|
"trigger": "click",
|
17280
17321
|
"isShow": state.isOpen,
|
17281
|
-
"placement": "bottom-
|
17322
|
+
"placement": "bottom-start",
|
17282
17323
|
"arrow": false,
|
17283
17324
|
"offset": 0
|
17284
17325
|
}, {
|
@@ -17320,7 +17361,7 @@ var HeadSort = defineComponent({
|
|
17320
17361
|
name: "HeadSort",
|
17321
17362
|
props: {
|
17322
17363
|
column: PropTypes.any.def({}),
|
17323
|
-
defaultSort: PropTypes.oneOf(SORT_OPTIONS).def(SORT_OPTION.
|
17364
|
+
defaultSort: PropTypes.oneOf(SORT_OPTIONS).def(SORT_OPTION.NULL)
|
17324
17365
|
},
|
17325
17366
|
emits: ["change"],
|
17326
17367
|
setup(props2, {
|
@@ -18399,13 +18440,15 @@ const useInit = (props2, targetColumns) => {
|
|
18399
18440
|
const colgroups = reactive([]);
|
18400
18441
|
const { getColumns } = useColumn(props2, targetColumns);
|
18401
18442
|
const updateColGroups = () => {
|
18402
|
-
var _a2;
|
18443
|
+
var _a2, _b2;
|
18403
18444
|
const checked = ((_a2 = props2.settings) == null ? void 0 : _a2.checked) || [];
|
18445
|
+
const settingFields = ((_b2 = props2.settings) == null ? void 0 : _b2.fields) || [];
|
18446
|
+
const isSettingField = (col) => settingFields.some((field) => field.field === resolvePropVal(col, "field", [col]));
|
18404
18447
|
colgroups.splice(0, colgroups.length, ...getColumns().map((col) => __spreadProps(__spreadValues({}, col), {
|
18405
18448
|
calcWidth: null,
|
18406
18449
|
resizeWidth: null,
|
18407
18450
|
listeners: /* @__PURE__ */ new Map(),
|
18408
|
-
isHidden: checked.length && !checked.includes(resolvePropVal(col, ["field", "type"], [col]))
|
18451
|
+
isHidden: isSettingField(col) && checked.length && !checked.includes(resolvePropVal(col, ["field", "type"], [col]))
|
18409
18452
|
})));
|
18410
18453
|
};
|
18411
18454
|
const { dragOffsetXStyle, dragOffsetX, resetResizeEvents, registerResizeEvent } = useColumnResize(colgroups, true);
|