vue-devui 1.0.0-rc.1 → 1.0.0-rc.4
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/README.md +132 -200
- package/auto-complete/index.es.js +150 -110
- package/auto-complete/index.umd.js +5 -1
- package/auto-complete/style.css +1 -1
- package/avatar/index.es.js +77 -81
- package/avatar/index.umd.js +1 -1
- package/button/index.es.js +23 -15
- package/button/index.umd.js +1 -1
- package/button/style.css +1 -1
- package/card/index.es.js +3 -6
- package/card/index.umd.js +1 -1
- package/checkbox/index.es.js +5 -11
- package/checkbox/index.umd.js +1 -1
- package/comment/index.es.js +4 -6
- package/comment/index.umd.js +1 -1
- package/countdown/index.es.js +3 -6
- package/countdown/index.umd.js +1 -1
- package/editable-select/index.es.js +120 -167
- package/editable-select/index.umd.js +1 -1
- package/grid/index.es.js +30 -36
- package/grid/index.umd.js +1 -1
- package/image-preview/index.es.js +19 -19
- package/image-preview/index.umd.js +1 -1
- package/input/index.es.js +2 -5
- package/input/index.umd.js +1 -1
- package/layout/index.es.js +9 -22
- package/layout/index.umd.js +1 -1
- package/loading/index.es.js +40 -25
- package/loading/index.umd.js +1 -1
- package/modal/index.es.js +55 -47
- package/modal/index.umd.js +1 -1
- package/notification/index.es.js +100 -10
- package/notification/index.umd.js +1 -1
- package/notification/style.css +1 -1
- package/nuxt/components/DropdownPropsKey.js +3 -0
- package/nuxt/components/LoadingOptions.js +3 -0
- package/nuxt/components/autoCompleteProps.js +3 -0
- package/nuxt/components/avatarProps.js +3 -0
- package/nuxt/components/cardProps.js +3 -0
- package/nuxt/components/checkboxGroupInjectionKey.js +3 -0
- package/nuxt/components/checkboxGroupProps.js +3 -0
- package/nuxt/components/checkboxProps.js +3 -0
- package/nuxt/components/colProps.js +3 -0
- package/nuxt/components/colPropsBaseClass.js +3 -0
- package/nuxt/components/colPropsBaseStyle.js +3 -0
- package/nuxt/components/commentProps.js +3 -0
- package/nuxt/components/countdownProps.js +3 -0
- package/nuxt/components/editableSelectProps.js +3 -0
- package/nuxt/components/imagePreviewProps.js +3 -0
- package/nuxt/components/inputProps.js +3 -0
- package/nuxt/components/loadingProps.js +3 -0
- package/nuxt/components/modalProps.js +3 -0
- package/nuxt/components/progressProps.js +3 -0
- package/nuxt/components/rateProps.js +3 -0
- package/nuxt/components/readTipProps.js +3 -0
- package/nuxt/components/resultProps.js +3 -0
- package/nuxt/components/rowProps.js +3 -0
- package/nuxt/components/screenSizes.js +3 -0
- package/nuxt/components/skeletonProps.js +3 -0
- package/nuxt/components/sliderProps.js +3 -0
- package/nuxt/components/splitterProps.js +3 -0
- package/nuxt/components/statisticProps.js +3 -0
- package/nuxt/components/switchProps.js +3 -0
- package/nuxt/components/tagInputProps.js +3 -0
- package/nuxt/components/tagProps.js +3 -0
- package/nuxt/components/textareaProps.js +3 -0
- package/nuxt/components/timeAxisProps.js +3 -0
- package/overlay/index.es.js +5 -5
- package/overlay/index.umd.js +1 -1
- package/package.json +1 -1
- package/pagination/index.es.js +14 -13
- package/pagination/index.umd.js +1 -1
- package/popover/index.es.js +7 -7
- package/popover/index.umd.js +12 -12
- package/progress/index.es.js +34 -36
- package/progress/index.umd.js +3 -3
- package/progress/style.css +1 -1
- package/radio/index.es.js +8 -2
- package/radio/index.umd.js +1 -1
- package/radio/style.css +1 -1
- package/rate/index.es.js +4 -7
- package/rate/index.umd.js +1 -1
- package/read-tip/index.es.js +34 -34
- package/read-tip/index.umd.js +1 -1
- package/read-tip/style.css +1 -1
- package/result/index.es.js +2 -5
- package/result/index.umd.js +1 -1
- package/ripple/index.es.js +43 -42
- package/ripple/index.umd.js +1 -1
- package/search/index.es.js +11 -11
- package/search/index.umd.js +8 -8
- package/skeleton/index.es.js +9 -12
- package/skeleton/index.umd.js +1 -1
- package/slider/index.es.js +59 -62
- package/slider/index.umd.js +1 -1
- package/splitter/index.es.js +176 -136
- package/splitter/index.umd.js +13 -13
- package/statistic/index.es.js +7 -18
- package/statistic/index.umd.js +1 -1
- package/style.css +1 -1
- package/switch/index.es.js +4 -7
- package/switch/index.umd.js +1 -1
- package/switch/style.css +1 -1
- package/tag/index.es.js +13 -17
- package/tag/index.umd.js +1 -1
- package/tag/style.css +1 -1
- package/tag-input/index.es.js +3 -6
- package/tag-input/index.umd.js +1 -1
- package/textarea/index.es.js +2 -5
- package/textarea/index.umd.js +1 -1
- package/timeline/index.es.js +10 -16
- package/timeline/index.umd.js +1 -1
- package/upload/index.es.js +160 -67
- package/upload/index.umd.js +1 -1
- package/upload/style.css +1 -1
- package/vue-devui.es.js +12182 -24718
- package/vue-devui.umd.js +24 -20
- package/accordion/index.d.ts +0 -7
- package/accordion/index.es.js +0 -723
- package/accordion/index.umd.js +0 -1
- package/accordion/package.json +0 -7
- package/accordion/style.css +0 -1
- package/anchor/index.d.ts +0 -7
- package/anchor/index.es.js +0 -263
- package/anchor/index.umd.js +0 -1
- package/anchor/package.json +0 -7
- package/anchor/style.css +0 -1
- package/back-top/index.d.ts +0 -7
- package/back-top/index.es.js +0 -130
- package/back-top/index.umd.js +0 -1
- package/back-top/package.json +0 -7
- package/back-top/style.css +0 -1
- package/breadcrumb/index.d.ts +0 -7
- package/breadcrumb/index.es.js +0 -128
- package/breadcrumb/index.umd.js +0 -1
- package/breadcrumb/package.json +0 -7
- package/breadcrumb/style.css +0 -1
- package/carousel/index.d.ts +0 -7
- package/carousel/index.es.js +0 -314
- package/carousel/index.umd.js +0 -1
- package/carousel/package.json +0 -7
- package/carousel/style.css +0 -1
- package/cascader/index.d.ts +0 -7
- package/cascader/index.es.js +0 -5971
- package/cascader/index.umd.js +0 -27
- package/cascader/package.json +0 -7
- package/cascader/style.css +0 -1
- package/color-picker/index.d.ts +0 -7
- package/color-picker/index.es.js +0 -8196
- package/color-picker/index.umd.js +0 -27
- package/color-picker/package.json +0 -7
- package/color-picker/style.css +0 -1
- package/date-picker/index.d.ts +0 -7
- package/date-picker/index.es.js +0 -1154
- package/date-picker/index.umd.js +0 -1
- package/date-picker/package.json +0 -7
- package/date-picker/style.css +0 -1
- package/dragdrop/index.d.ts +0 -7
- package/dragdrop/index.es.js +0 -157
- package/dragdrop/index.umd.js +0 -1
- package/dragdrop/package.json +0 -7
- package/drawer/index.d.ts +0 -7
- package/drawer/index.es.js +0 -234
- package/drawer/index.umd.js +0 -1
- package/drawer/package.json +0 -7
- package/drawer/style.css +0 -1
- package/dropdown/index.d.ts +0 -7
- package/dropdown/index.es.js +0 -693
- package/dropdown/index.umd.js +0 -1
- package/dropdown/package.json +0 -7
- package/dropdown/style.css +0 -1
- package/form/index.d.ts +0 -7
- package/form/index.es.js +0 -7876
- package/form/index.umd.js +0 -27
- package/form/package.json +0 -7
- package/form/style.css +0 -1
- package/gantt/index.d.ts +0 -7
- package/gantt/index.es.js +0 -523
- package/gantt/index.umd.js +0 -1
- package/gantt/package.json +0 -7
- package/gantt/style.css +0 -1
- package/input-icon/index.d.ts +0 -7
- package/input-icon/index.es.js +0 -332
- package/input-icon/index.umd.js +0 -1
- package/input-icon/package.json +0 -7
- package/input-icon/style.css +0 -1
- package/input-number/index.d.ts +0 -7
- package/input-number/index.es.js +0 -229
- package/input-number/index.umd.js +0 -1
- package/input-number/package.json +0 -7
- package/input-number/style.css +0 -1
- package/list/index.d.ts +0 -7
- package/list/index.es.js +0 -39
- package/list/index.umd.js +0 -1
- package/list/package.json +0 -7
- package/list/style.css +0 -1
- package/nav-sprite/index.d.ts +0 -7
- package/nav-sprite/index.es.js +0 -68
- package/nav-sprite/index.umd.js +0 -1
- package/nav-sprite/package.json +0 -7
- package/nuxt/components/Accordion.js +0 -3
- package/nuxt/components/Anchor.js +0 -3
- package/nuxt/components/BackTop.js +0 -3
- package/nuxt/components/Breadcrumb.js +0 -3
- package/nuxt/components/Carousel.js +0 -3
- package/nuxt/components/CarouselItem.js +0 -3
- package/nuxt/components/Cascader.js +0 -3
- package/nuxt/components/ColorPicker.js +0 -3
- package/nuxt/components/Column.js +0 -3
- package/nuxt/components/DatePicker.js +0 -3
- package/nuxt/components/Drawer.js +0 -3
- package/nuxt/components/DrawerService.js +0 -3
- package/nuxt/components/Dropdown.js +0 -3
- package/nuxt/components/DropdownMenu.js +0 -3
- package/nuxt/components/Form.js +0 -3
- package/nuxt/components/FormControl.js +0 -3
- package/nuxt/components/FormItem.js +0 -3
- package/nuxt/components/FormLabel.js +0 -3
- package/nuxt/components/FormOperation.js +0 -3
- package/nuxt/components/Gantt.js +0 -3
- package/nuxt/components/InputIcon.js +0 -3
- package/nuxt/components/InputNumber.js +0 -3
- package/nuxt/components/List.js +0 -3
- package/nuxt/components/ListItem.js +0 -3
- package/nuxt/components/NavSprite.js +0 -2
- package/nuxt/components/QuadrantDiagram.js +0 -3
- package/nuxt/components/Select.js +0 -3
- package/nuxt/components/StepsGuide.js +0 -3
- package/nuxt/components/StickSlider.js +0 -3
- package/nuxt/components/Sticky.js +0 -2
- package/nuxt/components/Table.js +0 -3
- package/nuxt/components/Tabs.js +0 -3
- package/nuxt/components/TimePicker.js +0 -3
- package/nuxt/components/Tooltip.js +0 -3
- package/nuxt/components/Transfer.js +0 -3
- package/nuxt/components/Tree.js +0 -3
- package/nuxt/components/TreeSelect.js +0 -3
- package/nuxt/components/dropdownMenuProps.js +0 -3
- package/nuxt/components/tooltipProps.js +0 -3
- package/quadrant-diagram/index.d.ts +0 -7
- package/quadrant-diagram/index.es.js +0 -5728
- package/quadrant-diagram/index.umd.js +0 -27
- package/quadrant-diagram/package.json +0 -7
- package/quadrant-diagram/style.css +0 -1
- package/select/index.d.ts +0 -7
- package/select/index.es.js +0 -706
- package/select/index.umd.js +0 -1
- package/select/package.json +0 -7
- package/select/style.css +0 -1
- package/steps-guide/index.d.ts +0 -7
- package/steps-guide/index.es.js +0 -242
- package/steps-guide/index.umd.js +0 -1
- package/steps-guide/package.json +0 -7
- package/steps-guide/style.css +0 -1
- package/sticky/index.d.ts +0 -7
- package/sticky/index.es.js +0 -197
- package/sticky/index.umd.js +0 -1
- package/sticky/package.json +0 -7
- package/table/index.d.ts +0 -7
- package/table/index.es.js +0 -2024
- package/table/index.umd.js +0 -1
- package/table/package.json +0 -7
- package/table/style.css +0 -1
- package/tabs/index.d.ts +0 -7
- package/tabs/index.es.js +0 -194
- package/tabs/index.umd.js +0 -1
- package/tabs/package.json +0 -7
- package/tabs/style.css +0 -1
- package/time-picker/index.d.ts +0 -7
- package/time-picker/index.es.js +0 -1238
- package/time-picker/index.umd.js +0 -1
- package/time-picker/package.json +0 -7
- package/time-picker/style.css +0 -1
- package/tooltip/index.d.ts +0 -7
- package/tooltip/index.es.js +0 -5835
- package/tooltip/index.umd.js +0 -27
- package/tooltip/package.json +0 -7
- package/tooltip/style.css +0 -1
- package/transfer/index.d.ts +0 -7
- package/transfer/index.es.js +0 -7615
- package/transfer/index.umd.js +0 -27
- package/transfer/package.json +0 -7
- package/transfer/style.css +0 -1
- package/tree/index.d.ts +0 -7
- package/tree/index.es.js +0 -6495
- package/tree/index.umd.js +0 -27
- package/tree/package.json +0 -7
- package/tree/style.css +0 -1
- package/tree-select/index.d.ts +0 -7
- package/tree-select/index.es.js +0 -627
- package/tree-select/index.umd.js +0 -1
- package/tree-select/package.json +0 -7
- package/tree-select/style.css +0 -1
package/modal/index.es.js
CHANGED
|
@@ -294,6 +294,7 @@ function adjustArrowPosition(isArrowCenter, point, placement, originRect) {
|
|
|
294
294
|
function useOverlay(props, emit) {
|
|
295
295
|
const overlayRef = ref();
|
|
296
296
|
const arrowRef = ref();
|
|
297
|
+
let originParent = null;
|
|
297
298
|
const updateArrowPosition = (arrowEl, placement, point, overlayEl) => {
|
|
298
299
|
const { x, y } = adjustArrowPosition(props.isArrowCenter, point, placement, overlayEl.getBoundingClientRect());
|
|
299
300
|
const staticSide = {
|
|
@@ -332,21 +333,20 @@ function useOverlay(props, emit) {
|
|
|
332
333
|
props.showArrow && updateArrowPosition(arrowEl, placement, middlewareData.arrow, overlayEl);
|
|
333
334
|
};
|
|
334
335
|
watch(() => props.modelValue, () => {
|
|
335
|
-
const originParent = getScrollParent(props.origin);
|
|
336
336
|
if (props.modelValue && props.origin) {
|
|
337
|
+
originParent = getScrollParent(props.origin);
|
|
337
338
|
nextTick(updatePosition);
|
|
338
|
-
originParent.addEventListener("scroll", updatePosition);
|
|
339
|
+
originParent == null ? void 0 : originParent.addEventListener("scroll", updatePosition);
|
|
339
340
|
originParent !== window && window.addEventListener("scroll", updatePosition);
|
|
340
341
|
window.addEventListener("resize", updatePosition);
|
|
341
342
|
} else {
|
|
342
|
-
originParent.removeEventListener("scroll", updatePosition);
|
|
343
|
+
originParent == null ? void 0 : originParent.removeEventListener("scroll", updatePosition);
|
|
343
344
|
originParent !== window && window.removeEventListener("scroll", updatePosition);
|
|
344
345
|
window.removeEventListener("resize", updatePosition);
|
|
345
346
|
}
|
|
346
347
|
});
|
|
347
348
|
onUnmounted(() => {
|
|
348
|
-
|
|
349
|
-
originParent.removeEventListener("scroll", updatePosition);
|
|
349
|
+
originParent == null ? void 0 : originParent.removeEventListener("scroll", updatePosition);
|
|
350
350
|
originParent !== window && window.removeEventListener("scroll", updatePosition);
|
|
351
351
|
window.removeEventListener("resize", updatePosition);
|
|
352
352
|
});
|
|
@@ -446,36 +446,39 @@ var Modal = defineComponent({
|
|
|
446
446
|
expose({
|
|
447
447
|
handleVisibleChange
|
|
448
448
|
});
|
|
449
|
-
return () =>
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
449
|
+
return () => {
|
|
450
|
+
const fixedOverlayProps2 = {
|
|
451
|
+
visible: modelValue.value,
|
|
452
|
+
"onUpdate:visible": handleVisibleChange,
|
|
453
|
+
"background-class": "devui-modal-mask",
|
|
454
|
+
"background-block": lockScroll.value,
|
|
455
|
+
"backdrop-close": closeOnClickOverlay.value
|
|
456
|
+
};
|
|
457
|
+
return createVNode(FixedOverlay, fixedOverlayProps2, {
|
|
458
|
+
default: () => [createVNode(Transition, {
|
|
459
|
+
"name": "devui-modal-wipe"
|
|
460
|
+
}, {
|
|
461
|
+
default: () => {
|
|
462
|
+
var _a;
|
|
463
|
+
return [createVNode("div", mergeProps({
|
|
464
|
+
"class": "devui-modal"
|
|
465
|
+
}, attrs), [createVNode(Icon, {
|
|
466
|
+
"name": "close",
|
|
467
|
+
"class": "btn-close",
|
|
468
|
+
"size": "var(--devui-font-size-md,12px)",
|
|
469
|
+
"onClick": () => handleVisibleChange(false)
|
|
470
|
+
}, null), slots.header ? slots.header() : title.value && createVNode(Header, null, {
|
|
471
|
+
default: () => [title.value]
|
|
472
|
+
}), createVNode(Body, null, {
|
|
473
|
+
default: () => {
|
|
474
|
+
var _a2;
|
|
475
|
+
return [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)];
|
|
476
|
+
}
|
|
477
|
+
}), (_a = slots.footer) == null ? void 0 : _a.call(slots)])];
|
|
478
|
+
}
|
|
479
|
+
})]
|
|
480
|
+
});
|
|
481
|
+
};
|
|
479
482
|
}
|
|
480
483
|
});
|
|
481
484
|
var Footer = defineComponent({
|
|
@@ -515,31 +518,36 @@ class ModalService extends CommonModalService {
|
|
|
515
518
|
const anchor = document.createElement("div");
|
|
516
519
|
this.anchorContainer.appendChild(anchor);
|
|
517
520
|
const _a = props, { header, content, footer } = _a, resProps = __objRest(_a, ["header", "content", "footer"]);
|
|
518
|
-
const
|
|
519
|
-
|
|
520
|
-
hide();
|
|
521
|
-
}
|
|
522
|
-
};
|
|
523
|
-
const renderOrigin = (props2, onUpdateModelValue = needHideOrNot) => {
|
|
524
|
-
return this.renderModal(anchor, __spreadProps(__spreadValues({}, props2), {
|
|
521
|
+
const renderOrigin = (propsValue, onUpdateModelValue) => {
|
|
522
|
+
return this.renderModal(anchor, __spreadProps(__spreadValues({}, propsValue), {
|
|
525
523
|
modelValue: true,
|
|
526
524
|
"onUpdate:modelValue": onUpdateModelValue
|
|
527
525
|
}), { header, default: content, footer });
|
|
528
526
|
};
|
|
529
527
|
const hide = () => {
|
|
530
|
-
var _a2, _b;
|
|
528
|
+
var _a2, _b, _c;
|
|
529
|
+
const innerNeedHideOrNot = (value) => {
|
|
530
|
+
if (!value) {
|
|
531
|
+
hide();
|
|
532
|
+
}
|
|
533
|
+
};
|
|
531
534
|
renderOrigin(resProps, (value) => {
|
|
532
535
|
if (!value) {
|
|
533
536
|
this.renderModal(anchor, __spreadProps(__spreadValues({}, resProps), { modelValue: false }));
|
|
534
537
|
this.renderNull(anchor);
|
|
535
538
|
} else {
|
|
536
|
-
renderOrigin(resProps);
|
|
539
|
+
renderOrigin(resProps, innerNeedHideOrNot);
|
|
537
540
|
}
|
|
538
541
|
});
|
|
539
|
-
(_b = (_a2 = vm.component.exposed).handleVisibleChange) == null ? void 0 :
|
|
542
|
+
(_c = (_b = (_a2 = vm == null ? void 0 : vm.component) == null ? void 0 : _a2.exposed) == null ? void 0 : _b.handleVisibleChange) == null ? void 0 : _c.call(_b, false);
|
|
543
|
+
};
|
|
544
|
+
const needHideOrNot = (value) => {
|
|
545
|
+
if (!value) {
|
|
546
|
+
hide();
|
|
547
|
+
}
|
|
540
548
|
};
|
|
541
549
|
this.renderModal(anchor, { modelValue: false });
|
|
542
|
-
vm = renderOrigin(resProps);
|
|
550
|
+
vm = renderOrigin(resProps, needHideOrNot);
|
|
543
551
|
return { hide };
|
|
544
552
|
}
|
|
545
553
|
}
|
|
@@ -565,4 +573,4 @@ var index = {
|
|
|
565
573
|
app.provide(ModalService.token, new ModalService(anchorsContainer));
|
|
566
574
|
}
|
|
567
575
|
};
|
|
568
|
-
export { Modal, index as default };
|
|
576
|
+
export { Modal, index as default, modalProps };
|
package/modal/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var
|
|
1
|
+
var J=Object.defineProperty,Q=Object.defineProperties;var W=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,P=Object.prototype.propertyIsEnumerable;var N=(a,e,i)=>e in a?J(a,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):a[e]=i,k=(a,e)=>{for(var i in e||(e={}))M.call(e,i)&&N(a,i,e[i]);if(C)for(var i of C(e))P.call(e,i)&&N(a,i,e[i]);return a},V=(a,e)=>Q(a,W(e));var A=(a,e)=>{var i={};for(var y in a)M.call(a,y)&&e.indexOf(y)<0&&(i[y]=a[y]);if(a!=null&&C)for(var y of C(a))e.indexOf(y)<0&&P.call(a,y)&&(i[y]=a[y]);return i};var j=(a,e,i)=>(N(a,typeof e!="symbol"?e+"":e,i),i);(function(a,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue"),require("@floating-ui/dom")):typeof define=="function"&&define.amd?define(["exports","vue","@floating-ui/dom"],e):(a=typeof globalThis!="undefined"?globalThis:a||self,e(a.index={},a.Vue,a.dom))})(this,function(a,e,i){"use strict";const y={modelValue:{type:Boolean,default:!1},title:{type:String,default:""},lockScroll:{type:Boolean,default:!0},closeOnClickOverlay:{type:Boolean,default:!0},beforeClose:{type:Function}},D={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var L=e.defineComponent({name:"DIcon",props:D,setup(o){const{name:t,size:n,color:d,classPrefix:l}=e.toRefs(o);return()=>/^((https?):)?\/\//.test(t.value)?e.createVNode("img",{src:t.value,alt:t.value.split("/")[t.value.split("/").length-1],style:{width:n.value,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${l.value} ${l.value}-${t.value}`,style:{fontSize:n.value,color:d.value}},null)}}),Z="";function R(o){return typeof o=="function"||Object.prototype.toString.call(o)==="[object Object]"&&!e.isVNode(o)}const T=e.defineComponent({setup(o,t){return()=>{let n;return e.createVNode(e.Teleport,{to:"#d-overlay-anchor"},{default:()=>[e.createVNode(e.Transition,{name:"devui-overlay-fade"},R(n=e.renderSlot(t.slots,"default"))?n:{default:()=>[n]})]})}}}),_=V(k({},{visible:{type:Boolean},backgroundBlock:{type:Boolean,default:!1},backgroundClass:{type:String,default:""},backgroundStyle:{type:[String,Object]},onBackdropClick:{type:Function},backdropClose:{type:Boolean,default:!0},hasBackdrop:{type:Boolean,default:!0}}),{overlayStyle:{type:[String,Object],default:void 0}}),z=["update:visible","backdropClick"];function F(o,t){const n=e.computed(()=>["devui-overlay-background",o.backgroundClass,o.hasBackdrop?"devui-overlay-background__color":"devui-overlay-background__disabled"]),d=e.computed(()=>"devui-overlay"),l=r=>{var c;r.preventDefault(),(c=o.onBackdropClick)==null||c.call(o),o.backdropClose&&t.emit("update:visible",!1)},u=r=>r.cancelBubble=!0;return e.onMounted(()=>{const r=document.body,c=r.style.overflow,s=r.style.position;e.watch([()=>o.visible,()=>o.backgroundBlock],([m,v])=>{if(v){const f=r.getBoundingClientRect().y;m?(r.style.overflowY="scroll",r.style.position=m?"fixed":"",r.style.top=`${f}px`):(r.style.overflowY=c,r.style.position=s,r.style.top="",window.scrollTo(0,-f))}}),e.onUnmounted(()=>{document.body.style.overflow=c})}),{backgroundClass:n,overlayClass:d,handleBackdropClick:l,handleOverlayBubbleCancel:u}}var te="";const $=e.defineComponent({name:"DFixedOverlay",props:_,emits:z,setup(o,t){const{backgroundClass:n,overlayClass:d,handleBackdropClick:l,handleOverlayBubbleCancel:u}=F(o,t);return()=>e.createVNode(T,null,{default:()=>[o.visible&&e.createVNode("div",{class:n.value,style:o.backgroundStyle,onClick:l},[e.createVNode("div",{class:d.value,style:o.overlayStyle,onClick:u},[e.renderSlot(t.slots,"default")])])]})}}),q={modelValue:{type:Boolean,default:!1},origin:{type:Object,require:!0},position:{type:Array,default:["bottom"]},offset:{type:[Number,Object],default:8},align:{type:String,default:null},showArrow:{type:Boolean,default:!1},isArrowCenter:{type:Boolean,default:!0}};function H(o){const t=/(auto|scroll|hidden)/;for(let n=o;n=n.parentElement;n.parentElement!==document.body){const d=window.getComputedStyle(n);if(t.test(d.overflow+d.overflowX+d.overflowY))return n}return window}function I(o,t,n,d){let{x:l,y:u}=t;if(!o){const{width:r,height:c}=d;l&&n.includes("start")&&(l=12),l&&n.includes("end")&&(l=Math.round(r-24)),u&&n.includes("start")&&(u=10),u&&n.includes("end")&&(u=c-14)}return{x:l,y:u}}function U(o,t){const n=e.ref(),d=e.ref();let l=null;const u=(c,s,m,v)=>{const{x:f,y:p}=I(o.isArrowCenter,m,s,v.getBoundingClientRect()),b={top:"bottom",right:"left",bottom:"top",left:"right"}[s.split("-")[0]];Object.assign(c.style,{left:f?`${f}px`:"",top:p?`${p}px`:"",right:"",bottom:"",[b]:"-4px"})},r=async()=>{const c=o.origin,s=e.unref(n.value),m=e.unref(d.value),v=[i.shift(),i.offset(o.offset),i.autoPlacement({alignment:o.align,allowedPlacements:o.position})];o.showArrow&&v.push(i.arrow({element:m}));const{x:f,y:p,placement:b,middlewareData:g}=await i.computePosition(c,s,{strategy:"fixed",middleware:v});t("positionChange",b),Object.assign(s.style,{top:`${p}px`,left:`${f}px`}),o.showArrow&&u(m,b,g.arrow,s)};return e.watch(()=>o.modelValue,()=>{o.modelValue&&o.origin?(l=H(o.origin),e.nextTick(r),l==null||l.addEventListener("scroll",r),l!==window&&window.addEventListener("scroll",r),window.addEventListener("resize",r)):(l==null||l.removeEventListener("scroll",r),l!==window&&window.removeEventListener("scroll",r),window.removeEventListener("resize",r))}),e.onUnmounted(()=>{l==null||l.removeEventListener("scroll",r),l!==window&&window.removeEventListener("scroll",r),window.removeEventListener("resize",r)}),{arrowRef:d,overlayRef:n,updatePosition:r}}var oe="";e.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:q,emits:["update:modelValue","positionChange"],setup(o,{slots:t,attrs:n,emit:d,expose:l}){const{arrowRef:u,overlayRef:r,updatePosition:c}=U(o,d);return l({updatePosition:c}),()=>{var s;return o.modelValue&&e.createVNode("div",e.mergeProps({ref:r,class:"devui-flexible-overlay"},n),[(s=t.default)==null?void 0:s.call(t),o.showArrow&&e.createVNode("div",{ref:u,class:"devui-flexible-overlay-arrow"},null)])}}});const Y=typeof window!="undefined";function K(o,t){function n(){t("update:modelValue",!1)}function d(l){l||(o.beforeClose?o.beforeClose(n):n())}return{handleVisibleChange:d}}var O=e.defineComponent({name:"DModalHeader",setup(o,{slots:t}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-header"},[(n=t.default)==null?void 0:n.call(t)])}}}),x=e.defineComponent({name:"DModalBody",setup(o,{slots:t}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-body"},[(n=t.default)==null?void 0:n.call(t)])}}}),ne="",w=e.defineComponent({name:"DModal",inheritAttrs:!1,props:y,emits:["update:modelValue"],setup(o,{slots:t,attrs:n,emit:d,expose:l}){const{modelValue:u,lockScroll:r,closeOnClickOverlay:c,title:s}=e.toRefs(o),{handleVisibleChange:m}=K(o,d);return l({handleVisibleChange:m}),()=>{const v={visible:u.value,"onUpdate:visible":m,"background-class":"devui-modal-mask","background-block":r.value,"backdrop-close":c.value};return e.createVNode($,v,{default:()=>[e.createVNode(e.Transition,{name:"devui-modal-wipe"},{default:()=>{var f;return[e.createVNode("div",e.mergeProps({class:"devui-modal"},n),[e.createVNode(L,{name:"close",class:"btn-close",size:"var(--devui-font-size-md,12px)",onClick:()=>m(!1)},null),t.header?t.header():s.value&&e.createVNode(O,null,{default:()=>[s.value]}),e.createVNode(x,null,{default:()=>{var p;return[(p=t.default)==null?void 0:p.call(t)]}}),(f=t.footer)==null?void 0:f.call(t)])]}})]})}}}),E=e.defineComponent({name:"DModalFooter",setup(o,{slots:t}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-footer"},[(n=t.default)==null?void 0:n.call(t)])}}});class X{constructor(t){this.anchorContainer=t}renderModal(t,n,d){const l=e.h(this.component(),n,d);return e.render(l,t),l}renderNull(t){setTimeout(()=>{e.render(null,t)},500)}}let h;class B extends X{component(){return w}open(t={}){const n=document.createElement("div");this.anchorContainer.appendChild(n);const v=t,{header:d,content:l,footer:u}=v,r=A(v,["header","content","footer"]),c=(f,p)=>this.renderModal(n,V(k({},f),{modelValue:!0,"onUpdate:modelValue":p}),{header:d,default:l,footer:u}),s=()=>{var p,b,g;const f=S=>{S||s()};c(r,S=>{S?c(r,f):(this.renderModal(n,V(k({},r),{modelValue:!1})),this.renderNull(n))}),(g=(b=(p=h==null?void 0:h.component)==null?void 0:p.exposed)==null?void 0:b.handleVisibleChange)==null||g.call(b,!1)},m=f=>{f||s()};return this.renderModal(n,{modelValue:!1}),h=c(r,m),{hide:s}}}j(B,"token","MODAL_SERVICE_TOKEN");var G={title:"Modal \u5F39\u7A97",category:"\u53CD\u9988",status:"100%",install(o){if(o.component(w.name,w),o.component(O.name,O),o.component(x.name,x),o.component(E.name,E),!Y)return;let t=document.getElementById("d-modal-anchors-container");t||(t=document.createElement("div"),t.setAttribute("id","d-modal-anchors-container"),document.body.appendChild(t)),o.provide(B.token,new B(t))}};a.Modal=w,a.default=G,a.modalProps=y,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});
|
package/notification/index.es.js
CHANGED
|
@@ -100,6 +100,105 @@ var Close = defineComponent({
|
|
|
100
100
|
}, null)]);
|
|
101
101
|
}
|
|
102
102
|
});
|
|
103
|
+
function SuccessIcon() {
|
|
104
|
+
return createVNode("svg", {
|
|
105
|
+
"width": "16px",
|
|
106
|
+
"height": "16px",
|
|
107
|
+
"viewBox": "0 0 16 16",
|
|
108
|
+
"version": "1.1",
|
|
109
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
110
|
+
"xmlns:xlink": "http://www.w3.org/1999/xlink"
|
|
111
|
+
}, [createVNode("defs", null, [createVNode("polygon", {
|
|
112
|
+
"id": "path-s",
|
|
113
|
+
"points": "6.53553391 9.77817459 12.1923882 4.12132034 13.6066017 5.53553391 6.53553391 12.6066017 3 9.07106781 4.41421356 7.65685425 6.53553391 9.77817459"
|
|
114
|
+
}, null)]), createVNode("g", {
|
|
115
|
+
"id": "correct",
|
|
116
|
+
"stroke": "none",
|
|
117
|
+
"stroke-width": "1",
|
|
118
|
+
"fill": "none",
|
|
119
|
+
"fill-rule": "evenodd"
|
|
120
|
+
}, [createVNode("mask", {
|
|
121
|
+
"id": "mask-2",
|
|
122
|
+
"fill": "white"
|
|
123
|
+
}, [createVNode("use", {
|
|
124
|
+
"xlink:href": "#path-s"
|
|
125
|
+
}, null)]), createVNode("use", {
|
|
126
|
+
"id": "Mask",
|
|
127
|
+
"class": "devui-notification-image-success-path",
|
|
128
|
+
"xlink:href": "#path-s"
|
|
129
|
+
}, null)])]);
|
|
130
|
+
}
|
|
131
|
+
function WarningIcon() {
|
|
132
|
+
return createVNode("svg", {
|
|
133
|
+
"width": "16px",
|
|
134
|
+
"height": "16px",
|
|
135
|
+
"viewBox": "0 0 16 16",
|
|
136
|
+
"version": "1.1",
|
|
137
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
138
|
+
"xmlns:xlink": "http://www.w3.org/1999/xlink"
|
|
139
|
+
}, [createVNode("g", {
|
|
140
|
+
"stroke": "none",
|
|
141
|
+
"stroke-width": "1",
|
|
142
|
+
"fill": "none",
|
|
143
|
+
"fill-rule": "evenodd"
|
|
144
|
+
}, [createVNode("path", {
|
|
145
|
+
"class": "devui-icon-warning-outer",
|
|
146
|
+
"d": "M8.96244623,0.57254229 L15.8714442,13.4101975 C16.1549662,13.9370117 15.9538562,14.5918482 15.4222523,14.8728158 C15.2642579,14.9563203 15.0879506,15 14.9088903,15 L1.09089441,15 C0.488410063,15 0,14.5159904 0,13.9189343 C0,13.7414873 0.0440768395,13.5667684 0.128340519,13.4101975 L7.03733844,0.57254229 C7.32086049,0.0457280838 7.98165058,-0.153569987 8.51325441,0.127397589 C8.70423071,0.228333932 8.8605922,0.383286648 8.96244623,0.57254229 Z"
|
|
147
|
+
}, null), createVNode("path", {
|
|
148
|
+
"class": "devui-icon-warning-inner",
|
|
149
|
+
"stroke-width": "0.3",
|
|
150
|
+
"fill-rule": "nonzero",
|
|
151
|
+
"d": "M8.87894737,13 L7.08947368,13 L7.08947368,11.2105263 L8.87894737,11.2105263 L8.87894737,13 Z M8.62102372,9.86842105 L7.32800539,9.86842105 L7,4.5 L8.96842105,4.5 L8.62102372,9.86842105 Z"
|
|
152
|
+
}, null)])]);
|
|
153
|
+
}
|
|
154
|
+
function InfoIcon() {
|
|
155
|
+
return createVNode("svg", {
|
|
156
|
+
"width": "16px",
|
|
157
|
+
"height": "16px",
|
|
158
|
+
"viewBox": "0 0 16 16",
|
|
159
|
+
"version": "1.1",
|
|
160
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
161
|
+
"xmlns:xlink": "http://www.w3.org/1999/xlink"
|
|
162
|
+
}, [createVNode("g", {
|
|
163
|
+
"id": "info",
|
|
164
|
+
"stroke": "none",
|
|
165
|
+
"stroke-width": "1",
|
|
166
|
+
"fill": "none",
|
|
167
|
+
"fill-rule": "evenodd"
|
|
168
|
+
}, [createVNode("path", {
|
|
169
|
+
"class": "devui-notification-image-info-path",
|
|
170
|
+
"d": "M7,13 L7,6 L9,6 L9,13 L7,13 Z M7,5 L7,3 L9,3 L9,5 L7,5 Z",
|
|
171
|
+
"id": "info"
|
|
172
|
+
}, null)])]);
|
|
173
|
+
}
|
|
174
|
+
function ErrorIcon() {
|
|
175
|
+
return createVNode("svg", {
|
|
176
|
+
"width": "16px",
|
|
177
|
+
"height": "16px",
|
|
178
|
+
"viewBox": "0 0 16 16",
|
|
179
|
+
"version": "1.1",
|
|
180
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
181
|
+
"xmlns:xlink": "http://www.w3.org/1999/xlink"
|
|
182
|
+
}, [createVNode("defs", null, [createVNode("polygon", {
|
|
183
|
+
"id": "path-e",
|
|
184
|
+
"points": "8.07106781 6.65685425 10.8994949 3.82842712 12.3137085 5.24264069 9.48528137 8.07106781 12.3137085 10.8994949 10.8994949 12.3137085 8.07106781 9.48528137 5.24264069 12.3137085 3.82842712 10.8994949 6.65685425 8.07106781 3.82842712 5.24264069 5.24264069 3.82842712"
|
|
185
|
+
}, null)]), createVNode("g", {
|
|
186
|
+
"id": "error",
|
|
187
|
+
"stroke": "none",
|
|
188
|
+
"stroke-width": "1",
|
|
189
|
+
"fill": "none",
|
|
190
|
+
"fill-rule": "evenodd"
|
|
191
|
+
}, [createVNode("mask", {
|
|
192
|
+
"id": "mask-2",
|
|
193
|
+
"fill": "white"
|
|
194
|
+
}, [createVNode("use", {
|
|
195
|
+
"xlink:href": "#path-e"
|
|
196
|
+
}, null)]), createVNode("use", {
|
|
197
|
+
"id": "Mask",
|
|
198
|
+
"class": "devui-notification-image-error-path",
|
|
199
|
+
"xlink:href": "#path-e"
|
|
200
|
+
}, null)])]);
|
|
201
|
+
}
|
|
103
202
|
var TypeIcon = defineComponent({
|
|
104
203
|
props: {
|
|
105
204
|
type: {
|
|
@@ -115,18 +214,9 @@ var TypeIcon = defineComponent({
|
|
|
115
214
|
"devui-notification-image": true,
|
|
116
215
|
[`devui-notification-image-${type.value}`]: true
|
|
117
216
|
}));
|
|
118
|
-
const severityIconMap = {
|
|
119
|
-
info: "info-o",
|
|
120
|
-
success: "right-o",
|
|
121
|
-
warning: "warning-o",
|
|
122
|
-
error: "error-o"
|
|
123
|
-
};
|
|
124
217
|
return () => createVNode("span", {
|
|
125
218
|
"class": classes.value
|
|
126
|
-
}, [type.value !== "normal" && createVNode(
|
|
127
|
-
"name": severityIconMap[type.value],
|
|
128
|
-
"size": "16px"
|
|
129
|
-
}, null)]);
|
|
219
|
+
}, [type.value && type.value !== "normal" && (type.value === "success" && createVNode(SuccessIcon, null, null) || type.value === "info" && createVNode(InfoIcon, null, null) || type.value === "warning" && createVNode(WarningIcon, null, null) || type.value === "error" && createVNode(ErrorIcon, null, null))]);
|
|
130
220
|
}
|
|
131
221
|
});
|
|
132
222
|
function useNotification(props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var
|
|
1
|
+
var B=Object.defineProperty,R=Object.defineProperties;var Z=Object.getOwnPropertyDescriptors;var w=Object.getOwnPropertySymbols;var A=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var V=(i,e,l)=>e in i?B(i,e,{enumerable:!0,configurable:!0,writable:!0,value:l}):i[e]=l,m=(i,e)=>{for(var l in e||(e={}))A.call(e,l)&&V(i,l,e[l]);if(w)for(var l of w(e))E.call(e,l)&&V(i,l,e[l]);return i},g=(i,e)=>R(i,Z(e));(function(i,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(i=typeof globalThis!="undefined"?globalThis:i||self,e(i.index={},i.Vue))})(this,function(i,e){"use strict";const l={modelValue:{type:Boolean,default:!1},title:{type:String,default:""},type:{type:String,default:"normal"},duration:{type:Number,default:3e3},onClose:{type:Function}},N={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var x=e.defineComponent({name:"DIcon",props:N,setup(n){const{name:t,size:o,color:a,classPrefix:r}=e.toRefs(n);return()=>/^((https?):)?\/\//.test(t.value)?e.createVNode("img",{src:t.value,alt:t.value.split("/")[t.value.split("/").length-1],style:{width:o.value,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${r.value} ${r.value}-${t.value}`,style:{fontSize:o.value,color:a.value}},null)}}),y=e.defineComponent({emits:["click"],setup(n,{emit:t}){return()=>e.createVNode("div",{class:"devui-notification-icon-close",onClick:o=>t("click",o)},[e.createVNode(x,{name:"close",size:"14px"},null)])}});function k(){return e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("defs",null,[e.createVNode("polygon",{id:"path-s",points:"6.53553391 9.77817459 12.1923882 4.12132034 13.6066017 5.53553391 6.53553391 12.6066017 3 9.07106781 4.41421356 7.65685425 6.53553391 9.77817459"},null)]),e.createVNode("g",{id:"correct",stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("mask",{id:"mask-2",fill:"white"},[e.createVNode("use",{"xlink:href":"#path-s"},null)]),e.createVNode("use",{id:"Mask",class:"devui-notification-image-success-path","xlink:href":"#path-s"},null)])])}function v(){return e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{class:"devui-icon-warning-outer",d:"M8.96244623,0.57254229 L15.8714442,13.4101975 C16.1549662,13.9370117 15.9538562,14.5918482 15.4222523,14.8728158 C15.2642579,14.9563203 15.0879506,15 14.9088903,15 L1.09089441,15 C0.488410063,15 0,14.5159904 0,13.9189343 C0,13.7414873 0.0440768395,13.5667684 0.128340519,13.4101975 L7.03733844,0.57254229 C7.32086049,0.0457280838 7.98165058,-0.153569987 8.51325441,0.127397589 C8.70423071,0.228333932 8.8605922,0.383286648 8.96244623,0.57254229 Z"},null),e.createVNode("path",{class:"devui-icon-warning-inner","stroke-width":"0.3","fill-rule":"nonzero",d:"M8.87894737,13 L7.08947368,13 L7.08947368,11.2105263 L8.87894737,11.2105263 L8.87894737,13 Z M8.62102372,9.86842105 L7.32800539,9.86842105 L7,4.5 L8.96842105,4.5 L8.62102372,9.86842105 Z"},null)])])}function L(){return e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("g",{id:"info",stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{class:"devui-notification-image-info-path",d:"M7,13 L7,6 L9,6 L9,13 L7,13 Z M7,5 L7,3 L9,3 L9,5 L7,5 Z",id:"info"},null)])])}function C(){return e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("defs",null,[e.createVNode("polygon",{id:"path-e",points:"8.07106781 6.65685425 10.8994949 3.82842712 12.3137085 5.24264069 9.48528137 8.07106781 12.3137085 10.8994949 10.8994949 12.3137085 8.07106781 9.48528137 5.24264069 12.3137085 3.82842712 10.8994949 6.65685425 8.07106781 3.82842712 5.24264069 5.24264069 3.82842712"},null)]),e.createVNode("g",{id:"error",stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("mask",{id:"mask-2",fill:"white"},[e.createVNode("use",{"xlink:href":"#path-e"},null)]),e.createVNode("use",{id:"Mask",class:"devui-notification-image-error-path","xlink:href":"#path-e"},null)])])}var S=e.defineComponent({props:{type:{type:String,default:"normal"}},setup(n){const{type:t}=e.toRefs(n),o=e.computed(()=>({"devui-notification-image":!0,[`devui-notification-image-${t.value}`]:!0}));return()=>e.createVNode("span",{class:o.value},[t.value&&t.value!=="normal"&&(t.value==="success"&&e.createVNode(k,null,null)||t.value==="info"&&e.createVNode(L,null,null)||t.value==="warning"&&e.createVNode(v,null,null)||t.value==="error"&&e.createVNode(C,null,null))])}});function T(n){return{classes:e.computed(()=>({"devui-notification-item-container":!0,[`devui-notification-message-${n.type}`]:!0}))}}function M(n,t){let o=null,a;const r=()=>{var s;clearTimeout(o),o=null,(s=n.onClose)==null||s.call(n),t("update:modelValue",!1)},c=()=>{o&&(clearTimeout(o),o=null)},u=()=>{if(!n.modelValue){const s=n.duration-(Date.now()-a);o=setTimeout(r,s)}},f=()=>{t("destroy")};return e.watch(()=>n.modelValue,s=>{s&&(a=Date.now(),n.duration&&(o=setTimeout(r,n.duration)))}),{interrupt:c,removeReset:u,close:r,handleDestroy:f}}var _="",d=e.defineComponent({name:"DNotification",props:l,emits:["update:modelValue","destroy"],setup(n,{emit:t,slots:o}){const{modelValue:a,title:r,type:c}=e.toRefs(n),{classes:u}=T(n),{interrupt:f,removeReset:s,close:j,handleDestroy:z}=M(n,t);return()=>e.createVNode(e.Transition,{name:"notification-fade",onAfterLeave:z},{default:()=>{var h;return[a.value&&e.createVNode("div",{class:"devui-notification"},[e.createVNode("div",{class:u.value,onMouseenter:f,onMouseleave:s},[e.createVNode("div",{class:"devui-notification-item"},[e.createVNode(y,{onClick:j},null),r.value&&e.createVNode(S,{type:c.value},null),e.createVNode("div",{class:"devui-notification-message"},[e.createVNode("span",{class:"devui-notification-title"},[r.value]),e.createVNode("span",{class:"devui-notification-content"},[(h=o.default)==null?void 0:h.call(o)])])])])])]}})}});function b(n){return typeof n=="function"||Object.prototype.toString.call(n)==="[object Object]"&&!e.isVNode(n)}const I={modelValue:!1,duration:3e3,type:"normal"};function D(n,t){const o=document.createElement("div"),a=e.createApp({setup(){return e.onUnmounted(()=>{document.body.removeChild(o)}),()=>e.createVNode(d,e.mergeProps(n,{onDestroy:a.unmount}),b(t)?t:{default:()=>[t]})}});return document.body.appendChild(o),a.mount(o),a}function P(n,t){n.modelValue=!1,t==null||t()}class p{static open(t){const o=t.onClose||null,a=t.content;let r;delete t.content;const c=e.reactive(g(m(m({},I),t),{onClose:()=>{P(c,o)}}));D(c,a),c.modelValue=!0,clearTimeout(r),t.duration&&(r=setTimeout(c.onClose,t.duration))}}var $={title:"Notification \u5168\u5C40\u901A\u77E5",category:"\u53CD\u9988",status:"100%",install(n){n.component(d.name,d),n.config.globalProperties.$notificationService=p}};i.Notification=d,i.NotificationService=p,i.default=$,i.notificationProps=l,Object.defineProperty(i,"__esModule",{value:!0}),i[Symbol.toStringTag]="Module"});
|
package/notification/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.devui-notification{position:fixed;top:50px;right:20px;width:20em;word-break:normal;word-wrap:break-word;z-index:1060}.devui-notification a:link,.devui-notification a:visited{color:var(--devui-link-light, #96adfa)}.devui-notification a:hover,.devui-notification a:active{color:var(--devui-link-light-active, #beccfa)}.devui-notification-item-container{position:relative;margin:0 0 8px;opacity:.95;filter:alpha(opacity=95);box-shadow:var(--devui-shadow-length-feedback-overlay, 0 4px 16px 0) var(--devui-shadow, rgba(0, 0, 0, .2));border-radius:var(--devui-border-radius-feedback, 4px);color:var(--devui-feedback-overlay-text, #dfe1e6);background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-notification-item{position:relative;display:block;padding:12px 16px}.devui-notification-icon-close{position:absolute;top:7px;right:10px;cursor:pointer}.devui-notification-icon-close i.icon{color:var(--devui-light-text, #ffffff)!important}.devui-notification-title{font-size:var(--devui-font-size-card-title, 14px);padding:0 0 calc(.5em - 2px) 0;display:block;font-weight:700}.devui-notification-image{position:absolute;display:inline-block;width:16px;height:16px;border-radius:50%;left:16px;top:14px;padding:0;line-height:1}.devui-notification-image.devui-notification-image-
|
|
1
|
+
.devui-notification{position:fixed;top:50px;right:20px;width:20em;word-break:normal;word-wrap:break-word;z-index:1060}.devui-notification a:link,.devui-notification a:visited{color:var(--devui-link-light, #96adfa)}.devui-notification a:hover,.devui-notification a:active{color:var(--devui-link-light-active, #beccfa)}.devui-notification-item-container{position:relative;margin:0 0 8px;opacity:.95;filter:alpha(opacity=95);box-shadow:var(--devui-shadow-length-feedback-overlay, 0 4px 16px 0) var(--devui-shadow, rgba(0, 0, 0, .2));border-radius:var(--devui-border-radius-feedback, 4px);color:var(--devui-feedback-overlay-text, #dfe1e6);background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-notification-item{position:relative;display:block;padding:12px 16px}.devui-notification-icon-close{position:absolute;top:7px;right:10px;cursor:pointer}.devui-notification-icon-close i.icon{color:var(--devui-light-text, #ffffff)!important}.devui-notification-title{font-size:var(--devui-font-size-card-title, 14px);padding:0 0 calc(.5em - 2px) 0;display:block;font-weight:700}.devui-notification-image{position:absolute;display:inline-block;width:16px;height:16px;border-radius:50%;left:16px;top:14px;padding:0;line-height:1}.devui-notification-image.devui-notification-image-warning path.devui-icon-warning-outer{fill:var(--devui-warning-line, #fa9841)}.devui-notification-image.devui-notification-image-warning path.devui-icon-warning-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-notification-image.devui-notification-image-info{background-color:var(--devui-info, #5e7ce0)}.devui-notification-image.devui-notification-image-error{background-color:var(--devui-danger, #f66f6a)}.devui-notification-image.devui-notification-image-success{background-color:var(--devui-success, #50d4ab)}.devui-notification-image .devui-notification-image-info-path,.devui-notification-image .devui-notification-image-error-path,.devui-notification-image .devui-notification-image-success-path{fill:var(--devui-light-text, #ffffff)}.devui-notification-message{margin-left:20px}.devui-notification-message .devui-notification-content{font-size:var(--devui-font-size, 12px);margin-top:4px}.devui-notification-message-common .devui-notification-message{margin-left:0}.devui-notification-message p{font-size:var(--devui-font-size, 12px);margin-top:4px}.notification-fade-enter-active,.notification-fade-leave-active{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.notification-fade-enter-from,.notification-fade-leave-to{transform:translate(100%)}
|
package/overlay/index.es.js
CHANGED
|
@@ -210,6 +210,7 @@ function adjustArrowPosition(isArrowCenter, point, placement, originRect) {
|
|
|
210
210
|
function useOverlay(props, emit) {
|
|
211
211
|
const overlayRef = ref();
|
|
212
212
|
const arrowRef = ref();
|
|
213
|
+
let originParent = null;
|
|
213
214
|
const updateArrowPosition = (arrowEl, placement, point, overlayEl) => {
|
|
214
215
|
const { x, y } = adjustArrowPosition(props.isArrowCenter, point, placement, overlayEl.getBoundingClientRect());
|
|
215
216
|
const staticSide = {
|
|
@@ -248,21 +249,20 @@ function useOverlay(props, emit) {
|
|
|
248
249
|
props.showArrow && updateArrowPosition(arrowEl, placement, middlewareData.arrow, overlayEl);
|
|
249
250
|
};
|
|
250
251
|
watch(() => props.modelValue, () => {
|
|
251
|
-
const originParent = getScrollParent(props.origin);
|
|
252
252
|
if (props.modelValue && props.origin) {
|
|
253
|
+
originParent = getScrollParent(props.origin);
|
|
253
254
|
nextTick(updatePosition);
|
|
254
|
-
originParent.addEventListener("scroll", updatePosition);
|
|
255
|
+
originParent == null ? void 0 : originParent.addEventListener("scroll", updatePosition);
|
|
255
256
|
originParent !== window && window.addEventListener("scroll", updatePosition);
|
|
256
257
|
window.addEventListener("resize", updatePosition);
|
|
257
258
|
} else {
|
|
258
|
-
originParent.removeEventListener("scroll", updatePosition);
|
|
259
|
+
originParent == null ? void 0 : originParent.removeEventListener("scroll", updatePosition);
|
|
259
260
|
originParent !== window && window.removeEventListener("scroll", updatePosition);
|
|
260
261
|
window.removeEventListener("resize", updatePosition);
|
|
261
262
|
}
|
|
262
263
|
});
|
|
263
264
|
onUnmounted(() => {
|
|
264
|
-
|
|
265
|
-
originParent.removeEventListener("scroll", updatePosition);
|
|
265
|
+
originParent == null ? void 0 : originParent.removeEventListener("scroll", updatePosition);
|
|
266
266
|
originParent !== window && window.removeEventListener("scroll", updatePosition);
|
|
267
267
|
window.removeEventListener("resize", updatePosition);
|
|
268
268
|
});
|